/*
 * Style sheet for Helen's Web back-page elements
 *
 * (CSS3 level statements used.  Legacy browsers will ignore)
 *
 * $ Id: default.css,v 1.00 04/06/2006 19:03 M L Phillips $
 * <Title>Helen Hollick - Stylesheet</title>
 *
 *   Ver 2.0 		: 12/06/2012 11:58
 *					:   Update many areas. Renamed h3 to h3x, conflict with 
 *					:   internal CSS used by twidget code.
 *					:   Correct operation ascertained on a range of browsers
 *
 *   Ver 3.0 		: 16/04/2016 12:05
 *					:   Added support for YouTube sound
 *					:   via iFrame embed
 *
 *   Ver 4.0		: 08/11/2017 10:07
 *					:   Added code to format the translation sub-tabs
 *					:   Buttons on Gallery forms normalised
 *
 *   Ver 5.0		: 29/02/2020 20:20
 *					:   Mobile variant sections added
 *					:   
 * 					: We begin with a sequence of normalisation, to start from a known position.
 *					:
 *					: The screen-size statements cascade, so they MUST be stored in the correct
 *					: file positions, allowing overwrite replacement of previous values.
 */
 
 
/* 	--------------------------------------------------------------------------------------
   	Normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
   	-------------------------------------------------------------------------------------- */


html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
}
body {
    margin: 0;
}
main {
    display: block;
}
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}
hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}
pre {
    font-family: monospace, monospace;
    font-size: 1em;
}
a {
    background-color: transparent;
}
abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted;
}
b, strong {
    font-weight: bolder;
}
code, kbd, samp {
    font-family: monospace, monospace;
    font-size: 1em;
}
small {
    font-size: 80%;
}
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sub {
    bottom: -0.25em;
}
sup {
    top: -0.5em;
}
img {
    border-style: none;
}
button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
}
button, input {
    overflow: visible;
}
button, select {
    text-transform: none;
}
button, [type="button"], [type="reset"], [type="submit"] {
    -webkit-appearance: button;
}
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}
fieldset {
    padding: 0.35em 0.75em 0.625em;
}
legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal;
}
progress {
    vertical-align: baseline;
}
textarea {
    overflow: auto;
}
[type="checkbox"], [type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
    height: auto;
}
[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}
::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}
details {
    display: block;
}
summary {
    display: list-item;
}
template {
    display: none;
}
[hidden] {
    display: none;
}

/* ---------------------- Normalisation completed ------------------------------ */



body {
	margin					: 0;
	width					: 100%;
    padding					: 0;
    font-family				: Arial,Helvetica,"Times New Roman",sans-serif,Times,Serif,Georgia;
    font-size				: 16px;
    line-height				: 1.4;
    text-align				: center;
    background				: url('../Pictures/background2020.jpg') no-repeat center center fixed;
	background-size			: cover;
}


/* 	--------------------------------------------------------------------------------------
   	Use DESKTOP content
   	-------------------------------------------------------------------------------------- */ 

/*
@media only screen and (orientation: portrait) and (min-width: 620px), only screen and (orientation: landscape) and (min-height: 620px)
*/

@media only screen and (min-width: 620px) 
{
 .container {  	width		: 960px;
      			margin		: 20px auto 0 auto;				
				overflow	: hidden; }								
				
 .desktop 	{   display		: block;  }
 .mobile 	{   display		: none;   }
 
 #hideout 	{ 	display		: block; 
 				visibility	: visible;}
}




.grid_r1_c1 { grid-row: 1; grid-column: 1; }
.grid_r1_c2 { grid-row: 1; grid-column: 2; }
.grid_r1_c3 { grid-row: 1; grid-column: 3; }
.grid_r1_c4 { grid-row: 1; grid-column: 4; }
.grid_r1_c5 { grid-row: 1; grid-column: 5; }
.grid_r1_c6 { grid-row: 1; grid-column: 6; }

.grid_r1_cx { grid-column: 2 / span 2 }
.grid_r1_cy { grid-column: 2 ; width:14em;}

.grid_r2_c1 { grid-row: 2; grid-column: 1; }
.grid_r2_c2 { grid-row: 2; grid-column: 2; }
.grid_r2_c3 { grid-row: 2; grid-column: 3; }
.grid_r2_c4 { grid-row: 2; grid-column: 4; }
.grid_r2_c5 { grid-row: 2; grid-column: 5; }
.grid_r2_c6 { grid-row: 2; grid-column: 6; }

.grid_r3_c1 { grid-row: 3; grid-column: 1; }
.grid_r3_c2 { grid-row: 3; grid-column: 2; }
.grid_r3_c3 { grid-row: 3; grid-column: 3; }
.grid_r3_c4 { grid-row: 3; grid-column: 4; }
.grid_r3_c5 { grid-row: 3; grid-column: 5; }
.grid_r3_c6 { grid-row: 3; grid-column: 6; }

.grid_r4_c1 { grid-row: 4; grid-column: 1; }
.grid_r4_c2 { grid-row: 4; grid-column: 2; }
.grid_r4_c3 { grid-row: 4; grid-column: 3; }
.grid_r4_c4 { grid-row: 4; grid-column: 4; }
.grid_r4_c5 { grid-row: 4; grid-column: 5; }
.grid_r4_c6 { grid-row: 4; grid-column: 6; }

.noHover {
    pointer-events: none;
	}

.interval_message {
	width:800px; 
	margin-top:40px;
	}
.nook_L {
	float:left; 
	width:100px; 
	height:100px;
	}
.nook_R{
	float:right; 
	width:100px; 
	height:100px;
	}
.advisory {
	height:100px; 
	margin-top:20px; 
	text-align:center;
	}

.video_frame {
	width			: 612px; 
	height			: 370px; 
	border			: 0;
	}

.bookshelf_container {
	position:relative;
	width: 100%; 
	height: 300px; 
	background-color:#A5A594; 
	border: solid 1px #555;
  	box-shadow: 4px 4px 5px  rgba(0,0,0,0.6);
  	-moz-box-shadow: 4px 4px 5px  rgba(0,0,0,0.6);
  	-webkit-box-shadow: 4px 4px 5px  rgba(0,0,0,0.6);
  	-o-box-shadow: 4px 4px 5px  rgba(0,0,0,0.6);
  	border-radius:15px;
	overflow:hidden;
	}

.bookshelf_container::before {
  content : '';
  position:absolute;
  background-image:url('../Pictures/Book_Callout_2021.gif');
  background-repeat:no-repeat; 
  height:150px; 
  width:160px; 
  top:0;
  left:0;
  }

.bookshelf_container::after {
  content : '';
  position:absolute;
  background-image:url('../Pictures/Book_Callout_2021.gif');
  background-repeat:no-repeat; 
  background-position:right bottom;
  background-clip: content-box;
  height:150px; 
  width:120px; 
  bottom:0;
  right:0;
}

#padding_edges {
    padding:10px 10px 10px 10px
}

#centraliser{
    padding:0 24px;
    text-align:justify
}
#Gallery{
    font-family:"Times New Roman",Times,Serif,Georgia;
    font-size:36px;
    font-weight:700;
    color:black;
    text-align:center
}
A:link{
    color:blue
}
A:visited{
    color:#000
}
A:hover{
    color:red
}
div.centered, .text_center {
    text-align:center
}
div.oversize, .text_big {
    font-size:120%
}
div.dexter, .text_right {
    text-align:right
}
div.small, .text_small {
    font-size:80%
}
EM.BlueText{
    color:blue;
    font-family:Arial,Helvetica,sans-serif
}

div.normal, 
.text_left,
h3x.normal{
    text-align:left
	}

.middled,
.text_center,
.centered,
div.centered {
    text-align:center;
}

.justified {
    text-align: justify;
	}

.home{
    text-align:right;
    color:blue;
    font-style:italic;
    font-weight:700
}
.small{
    text-align:right;
    font-style:italic;
    font-size:60%
}
.linkleft{
    text-align:left;
    color:blue;
    font-style:italic;
    font-weight:700
}
.linkcenter{
    text-align:center;
    color:blue;
    font-style:italic;
    font-weight:700
}
.linkright{
    text-align:right;
    color:blue;
    font-style:italic;
    font-weight:700
}
span.larger{
    color:#33f;
    font-size:larger
}
span.oversize{
    font-size:120%
}
span.small{
    font-family:Arial,Verdana,Helvetica,sans-serif;
    font-size:smaller
}
.strongblack{
    COLOR:#7c6240;
    font-weight:700;
    position:relative;
    top:-16px
}
table.default{
    WIDTH:95%;
    HEIGHT:10px
}
table.review{
    width:100%;
    border:0;
    height:10px
}
#divider{
    BORDER-RIGHT:#eda 0 solid;
    BORDER-LEFT:#eda 0 solid;
    BORDER-TOP:#eda 2px solid;
    BORDER-BOTTOM:#eda 2px solid;
    PADDING-RIGHT:2em;
    PADDING-LEFT:2em;
    PADDING-BOTTOM:.1em;
    PADDING-TOP:.1em;
    COLOR:#7c6240;
    FONT-WEIGHT:bold;
    TEXT-ALIGN:center;
    BACKGROUND:#f4ecd9;
    BACKGROUND:white;
    FLOAT:left;
    MARGIN:0 0 1em;
    WIDTH:100%;
    LINE-HEIGHT:1;
    LIST-STYLE-TYPE:none
}
#message{
    BORDER-RIGHT:#eda 0 solid;
    BORDER-LEFT:#eda 0 solid;
    BORDER-TOP:#eda 2px solid;
    BORDER-BOTTOM:#eda 2px solid;
    PADDING-RIGHT:2em;
    PADDING-LEFT:0em;
    PADDING-BOTTOM:.5em;
    PADDING-TOP:.5em;
    COLOR:#7c6240;
    font-family:Arial,Helvetica,Serif;
    FONT-WEIGHT:bold;
    TEXT-ALIGN:center;
    BACKGROUND:transparent;
    MARGIN:0 0;
    WIDTH:auto;
    LINE-HEIGHT:1;
    LIST-STYLE-TYPE:none;
    overflow:hidden
}
.notify {
    Border: 2px solid #EDA;
	Border-right:0;
	Border-left: 0;
    Padding: 8px;
    Color:#7c6240;
    Font-family: arial,Helvetica,Serif;
    Font-weight: bold;
    Text-align: center;
    Background: transparent;
    Margin:0 0;
    Width:auto;
    Line-height:1;
    List-style-type: none;
    Overflow: hidden
}

#nav {
    BORDER-RIGHT:#eda 0 solid;
    BORDER-LEFT:#eda 0 solid;
    BORDER-TOP:#eda 2px solid;
    BORDER-BOTTOM:#eda 2px solid;
    PADDING-RIGHT:0;
    PADDING-LEFT:0;
    PADDING-BOTTOM:0;
    PADDING-TOP:0;
    BACKGROUND:transparent;
    FLOAT:left;
    MARGIN:0 0 1em;
    WIDTH:100%;
    LINE-HEIGHT:1;
    LIST-STYLE-TYPE:none;
    font-family:Arial,Helvetica,sans-serif;
    Font-size:14px;
    FONT-WEIGHT:bold
}
#nav A{
    PADDING-TOP:.25em;
    PADDING-BOTTOM:.25em;
    PADDING-RIGHT:2em;
    PADDING-LEFT:1em;
    COLOR:#7c6240;
    DISPLAY:block;
    FONT-WEIGHT:bold;
    TEXT-ALIGN:center;
    TEXT-DECORATION:none;
    line-height:1
}
#nav UL{
    BORDER-RIGHT:#eda 0 solid;
    PADDING-RIGHT:0;
    BORDER-TOP:#eda 1px solid;
    PADDING-LEFT:0;
    FONT-WEIGHT:bold;
    BACKGROUND:white;
    FLOAT:left;
    PADDING-BOTTOM:0;
    MARGIN:0 0 1em;
    BORDER-LEFT:#eda 0 solid;
    WIDTH:36em;
    LINE-HEIGHT:1;
    PADDING-TOP:0;
    BORDER-BOTTOM:#eda 1px solid;
    LIST-STYLE-TYPE:none
}
div.message_nav{
    BORDER-RIGHT:#eda 0 solid;
    BORDER-LEFT:#eda 0 solid;
    BORDER-TOP:#eda 2px solid;
    BORDER-BOTTOM:#eda 2px solid;
    padding:0 0 0 0;
    BACKGROUND:transparent;
    FLOAT:left;
    MARGIN:0 0 1em;
    WIDTH:100%;
    LINE-HEIGHT:1;
    LIST-STYLE-TYPE:none;
    font-family:Arial,Helvetica,sans-serif;
    font-size:14px;
    font-weight:700
}
div.message_nav A{
    padding:.25em 1em .25em 1em;
    color:#7c6240;
    display:block;
    font-weight:700;
    text-align:center;
    text-decoration:none;
    line-height:1
}
div.message_nav A:hover{
    BACKGROUND:#eda
}
div.message_nav_L{
    float:left;
    padding:2px;
    margin:2px;
    padding-left:5px
}
div.message_nav_M{
    float:left;
    padding:2px;
    margin:2px
}
div.message_nav_R{
    float:right;
    padding:2px;
    margin-right:10px;
    margin-top:2px
}

#backpage-content, 
#backpage-content-mobile {
    text-align			: justify;
    position			: relative;
    width				: 100%;
    height				: 100%;
    min-height			: 500px;
    top					: 0;
	background-color	: #fbfae6;
	background-image	: url('../Pictures/Parchmnt.jpg');
}

.art-main{
    position:relative;
    width:100%;
    left:0;
    top:0;
    height:auto;
    padding-top: 0;	/* For Mobile variant */
    margin-top:0;
}

#Reedbed_1{
    position			: fixed;
    width				: 120px;
    height				: 130px;
    right				: -32px;
    bottom				: 0vh;
    z-index				: 100;
    cursor				: pointer;
    background-image	: url('../Pictures/grass.png');
}

#extraDiv1{
    position:absolute;
    width:92px;
    height:410px;
    left:800px;
    top:-70px;
    z-index:400
}
#extraDiv2{
    position:absolute;
    width:189px;
    height:205px;
    left:1px;
    top:0;
    z-index:2
}
#extraDiv3{
    position:absolute;
    width:173px;
    height:112px;
    bottom:30px;
    right:-60px;
    z-index:4
}
.cover_art_small{
    position:absolute;
    top:-1em;
    left:0;
    height:147px;
    width:99px;
    overflow:hidden;
    margin-top:1em;
    border-top-width:3px;
    border-right-width:3px;
    border-bottom-width:3px;
    border-left-width:3px;
    border-top-style:none;
    border-right-style:none;
    border-bottom-style:none;
    border-left-style:none;
    border-top-color:#630;
    border-right-color:#630;
    border-bottom-color:#630;
    border-left-color:#630
}
.cover_art_tiny{
    top:1px;
    left:0;
    height:147px;
    width:99px
}
.cleared{
    float:none;
    clear:both;
    margin:0;
    padding:0;
    border:none;
    font-size:1px
}
.clearedspace{
    float:none;
    clear:both;
    margin:0;
    padding:0;
    border:none;
    font-size:1px;
    height:20px
}
#container{
    position:relative;
    margin:auto;
    text-align:left;
    background:#fbfae6 url('../Pictures/container_bg2.jpg') center top repeat-y;
    width:100%;
    z-index:100;
    height:100%;
    top:0;
    min-height:10px
}
#preamble{
    BORDER-RIGHT:#8c9777 3px solid;
    BORDER-TOP:#8c9777 3px solid;
    BORDER-LEFT:#8c9777 3px solid;
    BORDER-BOTTOM:#8c9777 3px solid;
    PADDING-RIGHT:20px;
    PADDING-BOTTOM:10px;
    PADDING-LEFT:20px;
    PADDING-TOP:0;
    BACKGROUND:#fbfae6;
    MARGIN:0 20px 0 200px
}
#preamble h3x{
    BACKGROUND:url('../Pictures/h3_preamble.gif') no-repeat left top;
    MARGIN-BOTTOM:10px;
    BORDER-BOTTOM:#7d8965 1px solid;
    HEIGHT:32px
}
#preamble h3x SPAN{
    DISPLAY:none
}
#sidebar{
    PADDING-RIGHT:20px;
    PADDING-BOTTOM:10px;
    PADDING-LEFT:20px;
    PADDING-TOP:0;
    MARGIN:60px 30px 0 -190px;
    position:relative;
    width:110px;
    left:210px;
    top:-120px;
    z-index:2000;
    font-style:italic;
    color:#000;
    font-size:9px;
    height:auto
}
#quickSummary{
    PADDING-RIGHT:20px;
    PADDING-BOTTOM:10px;
    PADDING-LEFT:20px;
    PADDING-TOP:40px;
    BACKGROUND:#fbfae6;
    MARGIN:0 20px 0 200px;
    text-align:center;
    height:auto
}
#explanation{
    MARGIN-LEFT:0;
    height:20em
}
#explanation h3x{
    BACKGROUND:url('../Pictures/Blank_Header.gif') no-repeat left top;
    MARGIN-BOTTOM:10px;
    BORDER-BOTTOM:#7d8965 1px solid;
    HEIGHT:32px
}
#supportingText{
    MARGIN-LEFT:200px;
    PADDING-RIGHT:0;
    PADDING-LEFT:0;
    PADDING-BOTTOM:35px;
    PADDING-TOP:0;
    margin-right:20px
}
#supportingText h3x SPAN{
    DISPLAY:none
}
form{
    padding:0!important;
    margin:0!important
}
table.position{
    position:relative;
    width:100%;
    table-layout:fixed
}

.art-Sheet 
	{
    position				: relative;
    margin					: 19px auto;
    width					: 890px;
    min-width				: 49px;
    min-height				: 49px;
	background-color		: #2B424A;
	border-radius			: 15px;
	border					: 1px solid #568495;
	overflow				: hidden;
    z-index					: 0;
	}


.art-Sheet-body{
    position:relative;
    z-index:1;
    height:auto;
    padding:0;
    margin-top:0;
}

.art-Sheet-tr,.art-Sheet-tl,.art-Sheet-br,.art-Sheet-bl,.art-Sheet-tc,.art-Sheet-bc,.art-Sheet-cr,.art-Sheet-cl{
    position:absolute;
    z-index:-1
}
.art-Sheet-tr,.art-Sheet-tl,.art-Sheet-br,.art-Sheet-bl{
    width:64px;
    height:64px;
	/*
	//
	//  image used : Sheet-s.png
	//
	*/
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABlVBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAmMz8AAAAAAAAAAAAAAAAAAAAAAAAxTlgAAAAAAAAAAAAAAAAAAAAAAAAAAAAXHiYAAAA6V2UAAAAjOD8AAAAAAABCZ3McLTIqP0opPkgmOUM0UVsjND0vSVJIbn08XWkuSlE4WGM3VmA0UlwzUFpJcYE4VWFFa3k8W2ZCZ3ZAYnFKc4FCZXJDZXNGbHpFbXtQeotOeYlIb39QfIxKc4FTfo9LdYRRfo1RfI9QeotRfYxSfo1RfoxRgI5Sf41Rfo1UgZBUgZFSfY1UgZJVf5FTf5BVg5NTgZFTgpNUgY9UgZJTgpBWgpJVgZFTgJNTgZJTgpJTgpNTg5NTgZFUgpJVgZFVgpJUgpRUg5NUg5RVgZJVgZNVgpNTg5JWg5JWhJVUg5RTgpFTg5JUg5JUg5NUhJNVgZRWhJRUgZJVg5NVhJRWg5RTgZNWgpMrQkotRE0tRk5WhJXWbPt/AAAAg3RSTlMAAQIDBAUGBwgJCgsMDQ4PEBESExQUFRYXGBkaGhscHR4fICEhIiMkJCUmKi0wMTU1OjtDREhISk1PU1ZYXGNqbm9xf4CJi4yPlpmcnaClqbTCxcbIy83P09TW2t/h4+Pl5+nq6+vt7e7v8PDx8fHy8vLz8/P09/f39/f4+fr7+/v8/CFamZkAAAI6SURBVHgB7ddZW9NKHMfxgZk0SZNJ2oSThIS2OY2IGfcF3BfcF3FRQAEVdxAVwX0RQdH/6zZPqKVo0zbDDRf93M/3+WVupkUbEcZESEIwRg11EClLqaYn0SjNSkInStApKXvPjNyeggRTY2Nnj3QZuirhusfFnqH5l9DE7OK1XVZeFf9dgeXzz5egFS+ubLJy2b9HkJ7RL9CipTs7HEMha89vnViA1j0a8ExVqN3fMwGpPN3jmQpevT95dAHSubfNM5TqTYoXP0FKC9f97rz0Z8DmeUht7kDJUjGKSUNLkN5w4BnSyoD/3gKHj7tLNo0nCIdmgcOHU4GrZ+IvuAxchvsKphyd71BGgMtDFl1jFMD0LnD5zMoOjQPvfy3zABZ0a1FA0GGZN+Dq6wv0tgPtQDvQDrQDGzDw7ec6Aw+Ay2I1MAZcpisvE9GuApdblbcR0xPvgMP3C5XXuVPZ8hU4zB1kvqWiiGzcAA6TrK9oyiiSye2bg9Tmj7PAy2VQBFP7Js+A0HcoRivfsP0+pPSkPxpgyCiGqTXwDFKZGWRhyaYErZDy7rFUhZnT0Qe48YAYVkxv/+MU+wcZKxdqf+8Ttauwc3wWWvJ6sp+F5aJFBbQqQy3PPzr55gc082r6JGPh/wVLE1GtjGq6paD/3PgiNDJ+6XB0vLfkmlREaxHFsD0/CFkzYeAXbEMR6vzvo1Gi6JeD3mRB2S96jklljOogMs2ZtuM24thmXpMJSoDFrEr1RqiaFUkHqvoNQhYbMRZaN2YAAAAASUVORK5CYII=);

}
.art-Sheet-tl{
    top:0;
    left:0;
    clip:rect(auto,32px,32px,auto)
}
.art-Sheet-tr{
    top:0;
    right:0;
    clip:rect(auto,auto,32px,32px)
}
.art-Sheet-bl{
    bottom:0;
    left:0;
    clip:rect(32px,32px,auto,auto)
}
.art-Sheet-br{
    bottom:0;
    right:0;
    clip:rect(32px,auto,auto,32px)
}
.art-Sheet-tc,.art-Sheet-bc{
    left:32px;
    right:32px;
    height:64px;
	/*
	//
	//  image used : Sheet-h.png
	//
	*/	
    background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAABABAMAAACq+zlIAAAAGFBMVEUAAAAAAAAAAAAAAAAAAAAAAAArQkpWhJVafTIpAAAABnRSTlMABQ8ZIiaYbcOVAAAALklEQVQ4y2NhwAVYcMsIkiETSoY9ozLUlnk/GgajMoNcRnA0DAaBzD0yyhAyZAB6SQYjqb5u1AAAAABJRU5ErkJggg==);
}
.art-Sheet-tc{
    top:0;
    clip:rect(auto,auto,32px,auto)
}
.art-Sheet-bc{
    bottom:0;
    clip:rect(32px,auto,auto,auto)
}
.art-Sheet-cr,.art-Sheet-cl{
    top:32px;
    bottom:32px;
    width:64px;
	/*
	//
	//  image used : Sheet-v.png
	//
	*/		
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAyCAMAAADbXS0mAAAAGFBMVEUAAAAAAAAAAAAAAAAAAAAAAAArQkpWhJVafTIpAAAABnRSTlMABQ8ZIiaYbcOVAAAALklEQVRIx+3MsQ0AIAwDsGbg/48JPyB1sw9wZpLT+ZHbNgKBQCAQCAQCgUCwFTwHAPqXUrKgugAAAABJRU5ErkJggg==);
}
.art-Sheet-cr{
    right:0;
    clip:rect(auto,auto,auto,32px)
}
.art-Sheet-cl{
    left:0;
    clip:rect(auto,32px,auto,auto)
}
.art-Sheet-cc{
    position:absolute;
    z-index:-1;
    top:32px;
    left:32px;
    right:32px;
    bottom:32px;
    background-color:#2B424A
}
.art-menu a,.art-menu a:link,.art-menu a:visited,.art-menu a:hover{
    text-align:left;
    text-decoration:none;
    outline:none;
    letter-spacing:normal;
    word-spacing:normal
}
.art-menu,.art-menu ul{
    margin:0;
    padding:0;
    border:0;
    list-style-type:none;
    display:block
}
.art-menu li{
    margin:0;
    padding:0;
    border:0;
    display:block;
    float:left;
    position:relative;
    z-index:5;
    background:none
}
.art-menu li:hover{
    z-index:10000;
    white-space:normal
}
.art-menu li li{
    float:none
}
.art-menu ul{
    visibility:hidden;
    position:absolute;
    z-index:10;
    left:0;
    top:0;
    background:none
}
.art-menu li:hover>ul{
    visibility:visible;
    top:100%
}
.art-menu li li:hover>ul{
    top:0;
    left:100%
}
.art-menu:after,
.art-menu ul:after{
    content:".";
    height:0;
    display:block;
    visibility:hidden;
    overflow:hidden;
    clear:both
}
.art-menu,.art-menu ul{
    min-height:0
}
.art-menu ul{
    background-image:url('../Pictures/spacer.gif');
    padding:10px 30px 30px 30px;
    margin:-10px 0 0 -30px
}
.art-menu ul ul{
    padding:30px 30px 30px 10px;
    margin:-30px 0 0 -10px
}
.art-menu{
    padding:0 15px 0 15px
}
.art-nav{
    position:relative;
    height:30px;
    z-index:100
}
/* .art-nav .l,.art-nav .r{
    position:absolute;
    z-index:-1;
    top:0;
    height:30px;
    background-image:url('../Pictures/nav.png')
} */
.art-nav .l{
    left:0;
    right:15px
}
.art-nav .r{
    right		: 0;
    width		: 890px;
    clip		: rect(auto, auto, auto, 180px);
}
.art-menu ul li{
    clear:both
}
.art-menu a{
    position:relative;
    display:block;
    overflow:hidden;
    height:30px;
    cursor:pointer;
    text-decoration:none;
    margin-right:0;
    margin-left:0
}
.art-menu a .r,.art-menu a .l{
    position:absolute;
    display:block;
    top:0;
    z-index:-1;
    height:90px;
    background-image:url('../Pictures/MenuElement.png')
}
.art-menu a .l{
    left:0;
    right:0
}
.art-menu a .r{
    width:50em;
    right:0;
    clip:rect(auto,auto,auto,400px);
    height:auto
}
/* .art-menu a .t{
    font-style:normal;
    font-weight:400;
    color:#C5D0D8;
    padding:0 17px;
    margin:0 0;
    line-height:30px;
    text-align:center
}*/
.art-menu a:hover .l,.art-menu a:hover .r{
    top:-30px
}
.art-menu li:hover>a .l,.art-menu li:hover>a .r{
    top:-30px
}
.art-menu li:hover a .l,.art-menu li:hover a .r{
    top:-30px
}
.art-menu a:hover .t{
    color:#ECF2F4
}
.art-menu li:hover a .t{
    color:#ECF2F4
}
.art-menu li:hover>a .t{
    color:#ECF2F4
}
.art-menu a.active .l,.art-menu a.active .r{
    top:-60px
}
.art-menu a.active .t{
    color:#CBE4EC
}
.art-menu a.gateway{
    cursor:default
}
.search::before{
    content: url('../Pictures/search_box_icon_s.png')
}

.art-menu ul a{
    display:block;
    text-align:center;
    white-space:nowrap;
    height:32px;
    width:14em;
    overflow:hidden;
    line-height:32px;
    margin-right:auto;
    background-image:url('../Pictures/subitem-bg.png');
    background-position:left top;
    background-repeat:repeat-x;
    border-width:1px;
    border-style:solid;
    border-color:#6AB2C8
}
.art-nav ul.art-menu ul span,
.art-nav ul.art-menu ul span span{
    display:inline;
    float:none;
    margin:inherit;
    padding:inherit;
    background-image:none;
    text-align:inherit;
    text-decoration:inherit
}
.art-menu ul a,
.art-menu ul a:link,
.art-menu ul a:visited,
.art-menu ul a:hover,
.art-menu ul a:active,
.art-nav ul.art-menu ul span,
.art-nav ul.art-menu ul span span{
    text-align:left;
    text-indent:12px;
    text-decoration:none;
    line-height:32px;
    color:#2D3A43;
    font-size:13px;
    font-style:normal;
    font-weight:400
	}

.art-menu ul ul a{
    margin-left:auto
	}
.art-menu ul li a:hover,
.art-menu ul li:hover>a {
    color	:black;
    border-color:#439CB6;
    background-position:0 -32px
	}
	
.art-nav .art-menu ul li a:hover span,
.art-nav .art-menu ul li a:hover span span,
.art-nav .art-menu ul li:hover>a span,
.art-nav .art-menu ul li:hover>a span span {
    color	: black;
	}
.art-Header{
    margin:0 auto;
    position:relative;
    z-index:0;
    width:890px;
    height:250px
}
.art-Header-content{
    margin:0 auto;
    position:relative;
    z-index:0;
    width:890px;
    height:184px;
    overflow:hidden;
    background-color:#2B424A
}
.art-Header-image{
    position:absolute;
    top:-2px;
    width:890px;
    height:180px;
    background-repeat:no-repeat;
    background-position:right center;
    overflow:hidden;
    background-color:#2B424A
}
.art-Header-content-title{
    position:absolute;
    top:1px;
    left:0;
    z-index:inherit;
    font-size:56px;
    color:#88C1D3;
    width:871px;
    height:178px;
    vertical-align:middle;
    background-color:Transparent
}
.art-Header-content-title-H2U{
    position:absolute;
    top:1px;
    left:0;
    z-index:inherit;
    font-size:56px;
    color:#88C1D3;
    width:871px;
    height:178px;
    vertical-align:middle;
    background-color:Transparent
}
.art-Header-Archive{
    position:absolute;
    top:100px;
    left:280px;
    width:250px;
    height:100px;
    background-repeat:no-repeat
}
#art-Header-buttons, #art-Header-buttons-mobile {
    position:absolute;
    bottom:9px;
    left:130px
}
.art-Logo{
    display:block;
    position:absolute;
    left:10px;
    top:92px;
    width:870px
}
h1.art-Logo-name{
    display:block;
    text-align:center
}
h1.art-Logo-name,h1.art-Logo-name a,h1.art-Logo-name a:link,h1.art-Logo-name a:visited,h1.art-Logo-name a:hover{
    font-size:37px;
    font-style:normal;
    font-weight:700;
    text-decoration:none;
    padding:0;
    margin:0;
    color:#132C34!important
}
.art-Logo-text{
    display:block;
    text-align:center
}
.art-Logo-text,.art-Logo-text a{
    font-size:21px;
    font-style:normal;
    font-weight:400;
    padding:0;
    margin:0;
    color:#132C34!important
}
.art-contentLayout{
    position:relative;
    margin-bottom:4px;
    width:890px
}
.art-Block{
    position:relative;
    z-index:0;
    margin:0 auto;
    min-width:1px;
    min-height:1px
}
.art-Block-body{
    position:relative;
    z-index:1;
    padding:0
}
.art-Block{
    margin:7px
}
.art-BlockHeader{
    position:relative;
    z-index:0;
    height:30px;
    padding:0 8px;
    margin-bottom:4px
}
.art-BlockHeader .t{
    height:30px;
    color:#000;
    font-size:13px;
    font-style:normal;
    font-weight:700;
    white-space:nowrap;
    padding:0 6px;
    line-height:30px
}
.art-BlockHeader .l,.art-BlockHeader .r{
    display:block;
    position:absolute;
    z-index:-1;
    height:30px;
    background-image:url('../Pictures/BlockHeader.png')
}
.art-BlockHeader .l{
    left:0;
    right:7px
}
.art-BlockHeader .r{
    width:890px;
    right:0;
    clip:rect(auto,auto,auto,883px)
}
.art-header-tag-icon{
    display:inline-block;
    background-position:left top;
    background-image:url('../Pictures/BlockHeaderIcon.png');
    padding:0 0 0 15px;
    background-repeat:no-repeat;
    min-height:14px;
    margin:0 0 0 5px
}
.art-BlockContent{
    position:relative;
    z-index:0;
    margin:0 auto;
    min-width:15px;
    min-height:15px
}
.art-BlockContent-body{
    position:relative;
    z-index:1;
    padding:8px
}
.art-BlockContent-tr,.art-BlockContent-tl,.art-BlockContent-br,.art-BlockContent-bl,.art-BlockContent-tc,.art-BlockContent-bc,.art-BlockContent-cr,.art-BlockContent-cl{
    position:absolute;
    z-index:-1
}
.art-BlockContent-tr,.art-BlockContent-tl,.art-BlockContent-br,.art-BlockContent-bl{
    width:14px;
    height:14px;
    background-image:url('../Pictures/BlockContent-s.png')
}
.art-BlockContent-tl{
    top:0;
    left:0;
    clip:rect(auto,7px,7px,auto)
}
.art-BlockContent-tr{
    top:0;
    right:0;
    clip:rect(auto,auto,7px,7px)
}
.art-BlockContent-bl{
    bottom:0;
    left:0;
    clip:rect(7px,7px,auto,auto)
}
.art-BlockContent-br{
    bottom:0;
    right:0;
    clip:rect(7px,auto,auto,7px)
}
.art-BlockContent-tc,.art-BlockContent-bc{
    left:7px;
    right:7px;
    height:14px;
    background-image:url('../Pictures/BlockContent-h.png')
}
.art-BlockContent-tc{
    top:0;
    clip:rect(auto,auto,7px,auto)
}
.art-BlockContent-bc{
    bottom:0;
    clip:rect(7px,auto,auto,auto)
}
.art-BlockContent-cr,.art-BlockContent-cl{
    top:7px;
    bottom:7px;
    width:14px;
    background-image:url('../Pictures/BlockContent-v.png')
}
.art-BlockContent-cr{
    right:0;
    clip:rect(auto,auto,auto,7px)
}
.art-BlockContent-cl{
    left:0;
    clip:rect(auto,7px,auto,auto)
}
.art-BlockContent-cc{
    position:absolute;
    z-index:-1;
    top:7px;
    left:7px;
    right:7px;
    bottom:7px;
    background-color:#324E57
}
.art-BlockContent-body{
    color:#A1BEC9;
    font-size:13px;
    font-style:normal;
    font-weight:400
}
.art-BlockContent-body a:link{
    color:#93C7D7;
    text-decoration:underline
}
.art-BlockContent-body a:visited,.art-BlockContent-body a.visited{
    color:#E2EBEE;
    text-decoration:underline
}
.art-BlockContent-body a:hover,.art-BlockContent-body a.hover{
    color:#B8DAE5;
    text-decoration:none
}
.art-BlockContent-body ul{
    list-style-type:none;
    color:#A7B8C3;
    margin:0;
    padding:0
}
.art-BlockContent-body li{
    font-size:13px;
    text-decoration:none
}
.art-Post{
    position:relative;
    z-index:0;
    margin:0 auto;
    min-width:1px;
    min-height:1px
}
.art-Post-body{
    position:relative;
    z-index:1;
    padding:15px
}
.art-Post{
    margin:7px
}
a img{
    border:0
}
img{
    border:0
}
img.b{
    display:block
}
img.b46860{
    width:40em;
    height:37em;
    text-align:center;
    top:-4em;
    max-width:635px;
    max-height:594px
}
.art-article img,img.art-article{
    margin:1em
}
.art-metadata-icons img{
    border:none;
    vertical-align:middle;
    margin:2px
}
.art-article table,table.art-article{
    border-collapse:collapse;
    margin:1px;
    width:auto
}
.art-article table,table.art-article .art-article tr,.art-article th,.art-article td{
    background-color:Transparent
}
.art-article th,.art-article td{
    padding:2px;
    border:solid 1px #416471;
    vertical-align:top;
    text-align:left
}
.art-article th{
    text-align:center;
    vertical-align:middle;
    padding:7px
}
.art-PostHeaderIcon-wrapper{
    text-decoration:none;
    margin:.2em 0;
    padding:0;
    font-weight:400;
    font-style:normal;
    letter-spacing:normal;
    word-spacing:normal;
    font-variant:normal;
    text-decoration:none;
    font-variant:normal;
    text-transform:none;
    text-align:left;
    text-indent:0;
    line-height:inherit;
    font-size:24px;
    font-style:normal;
    font-weight:700;
    text-align:left;
    color:#C0DEE8
}
.art-PostHeaderIcon-wrapper,.art-PostHeaderIcon-wrapper a,.art-PostHeaderIcon-wrapper a:link,.art-PostHeaderIcon-wrapper a:visited,.art-PostHeaderIcon-wrapper a:hover{
    font-size:24px;
    font-style:normal;
    font-weight:700;
    text-align:left;
    color:#C0DEE8
}
.art-PostHeaderIcon-wrapper img{
    border:none;
    vertical-align:middle;
    margin:0
}
.art-PostHeader a:link{
    text-decoration:none;
    text-align:left;
    color:#B1D7E2
}
.art-PostHeader a:visited,.art-PostHeader a.visited{
    text-decoration:none;
    text-align:left;
    color:#E8EFF2
}
.art-PostHeader a:hover,.art-PostHeader a.hovered{
    text-decoration:none;
    text-align:left;
    color:#D2E8EE
}
.art-PostContent{
    font-size:13px;
    font-style:normal;
    font-weight:400;
    text-align:justify;
    color:#94B5C2
}
a{
    text-decoration:underline;
    color:#33F
}
a:link{
    text-decoration:underline;
    color:blue
}
a:visited,a.visited{
    text-decoration:underline;
    color:#090
}
a:hover,a.hover{
    text-decoration:none;
    color:red
}
h1,h2,h4,h5,h6,h1 a,h2 a,h4 a,h5 a,h6 a h1 a:hover,h2 a:hover,h4 a:hover,h5 a:hover,h6 a:hover h1 a:visited,h2 a:visited,h4 a:visited,h5 a:visited,h6 a:visited{
    font-weight:400;
    font-style:normal;
    text-decoration:none
}
h1,h1 a,h1 a:link,h1 a:visited,h1 a:hover{
    font-size:40px;
    font-style:normal;
    font-weight:700;
    text-align:left;
    color:#88C1D3;
    padding-left:40px
}
h2,h2 a,h2 a:link,h2 a:visited,h2 a:hover{
    font-size:24px;
    font-style:normal;
    font-weight:700;
    text-align:left;
    color:#ADD5E1
}
h4,h4 a,h4 a:link,h4 a:visited,h4 a:hover{
    font-size:18px;
    font-style:normal;
    font-weight:700;
    text-align:left;
    color:#B8CED6
}
h5,h5 a,h5 a:link,h5 a:visited,h5 a:hover{
    font-size:15px;
    font-style:normal;
    font-weight:700;
    text-align:left;
    color:#B8CED6
}
h6,h6 a,h6 a:link,h6 a:visited,h6 a:hover{
    font-size:15px;
    font-style:normal;
    font-weight:700;
    text-align:left;
    color:#B8CED6
}
ol,ul{
    color:#333;
    margin:1em 0 1em 2em;
    padding:0;
    font-size:13px
}
li ol,li ul{
    margin:.5em 0 .5em 2em;
    padding:0
}
li{
    margin:.2em 0;
    padding:0
}
ul{
    list-style-type:none
}
ol{
    list-style-position:inside
}
.art-Post li{
    padding:0 0 0 16px;

    line-height:1.2em
}
.art-Post ol li,.art-Post ul ol li{
    background:none;
    padding-left:0
}
.art-Post ul li,.art-Post ol ul li{
    background-image:url('../Pictures/PostBullets.png');
    background-repeat:no-repeat;
    padding-left:16px
}
blockquote p{
    color:#060D0F;
    font-style:italic;
    font-weight:400;
    text-align:left
}
blockquote{
    border:solid 1px #9BBAC5;
    margin:10px 10px 10px 50px;
    padding:5px 5px 5px 41px;
    background-color:#93C7D7;
    background-image:url('../Pictures/PostQuote.png');
    background-position:left top;
    background-repeat:no-repeat
}
.art-button-wrapper .art-button{
    display:inline-block;
    width:auto;
    outline:none;
    border:none;
    background:none;
    line-height:33px;
    margin:0!important;
    padding:0!important;
    overflow:visible;
    cursor:default;
    text-decoration:none!important;
    z-index:0
}
.art-button-wrapper{
    display:inline-block;
    position:relative;
    height:33px;
    overflow:hidden;
    white-space:nowrap;
    width:auto;
    z-index:0
}
.art-button-wrapper .art-button{
    display:block;
    height:33px;
    font-size:13px;
    font-style:normal;
    font-weight:400;
    white-space:nowrap;
    text-align:left;
    padding:0 16px!important;
    line-height:33px;
    text-decoration:none!important;
    color:#000000!important
}
input,select{
    font-size:13px;
    font-style:normal;
    font-weight:400
}
.art-button-wrapper.hover .art-button,.art-button:hover{
    color:#E9F3F7!important;
    text-decoration:none!important
}
.art-button-wrapper.active .art-button{
    color:#EFF4F6!important
}
.art-button-wrapper .l,.art-button-wrapper .r{
    display:block;
    position:absolute;
    z-index:-1;
    height:99px;
    background-image:url('../Pictures/Button.png')
}
.art-button-wrapper .l{
    left:0;
    right:17px
}
.art-button-wrapper .r{
    width:423px;
    right:0;
    clip:rect(auto,auto,auto,406px)
}
.art-button-wrapper.hover .l,.art-button-wrapper.hover .r{
    top:-33px
}
.art-button-wrapper.active .l,.art-button-wrapper.active .r{
    top:-66px
}
.art-Lower{
    position:relative;
    z-index:0;
    overflow:hidden;
    width:890px;
    margin:0 auto 0 auto;
    background-image:url('../Pictures/Footer2.jpg');
    height:140px;
    left:0
}
.art-Footer{
    position:relative;
    z-index:0;
    overflow:hidden;
    width:890px;
    margin:5px auto 0 auto
}
.art-Footer .art-Footer-inner{
    position:relative;
    z-index:0;
    padding:15px;
    text-align:center
}

.art-Footer .art-Footer-background{
    position:absolute;
    z-index:-1;
    background-repeat:no-repeat;
    background-image:url('../Pictures/Footer.png');
    width:890px;
    height:150px;
    bottom:0;
    left:0
}
#dividing_line{
    position:relative;
    top:5px;
    width:100%;
    height:10px;
    z-index:10000;
    background-color:#2B424A;
    color:#2B424A
}
.art-rss-tag-icon{
    position:relative;
    display:block;
    float:left;
    background-image:url('../Pictures/RSS_32.png');
    background-position:right center;
    background-repeat:no-repeat;
    margin:0 5px 0 0;
    height:32px;
    width:32px
}
.art-amazon-us-tag-icon{
    position:relative;
    display:block;
    float:left;
    background-image:url('../Pictures/buy-from-tan-us.gif');
    background-position:right center;
    background-repeat:no-repeat;
    margin:0 5px 0 0;
    height:32px;
    width:100px
}
.art-amazon-uk-tag-icon{
    position:relative;
    display:block;
    float:left;
    background-image:url('../Pictures/buy-from-tan-uk.gif');
    background-position:right center;
    background-repeat:no-repeat;
    margin:0 5px 0 0;
    height:32px;
    width:100px
}
.art-amazon-tag-icon{
    position:relative;
    display:block;
    float:left;
    background-image:url('../Pictures/buy-from-tan.gif');
    background-position:right center;
    background-repeat:no-repeat;
    margin:0 5px 0 0;
    height:32px;
    width:100px
}
.icon-bar-pad{
    position:relative;
    display:block;
    float:left;
    width:120px
}
.art-twitter-tag-icon{
    position:relative;
    display:block;
    float:left;
    background-image:url('../Pictures/twitter_32.png');
    background-position:right center;
    background-repeat:no-repeat;
    margin:0 5px 0 0;
    height:32px;
    width:32px
}
.art-blogger-tag-icon{
    position:relative;
    display:block;
    float:left;
    background-image:url('../Pictures/blogger_32.png');
    background-position:right center;
    background-repeat:no-repeat;
    margin:0 5px 0 0;
    height:32px;
    width:32px
}
.art-facebook-tag-icon{
    position:relative;
    display:block;
    float:left;
    background-image:url('../Pictures/facebook_32.png');
    background-position:right center;
    background-repeat:no-repeat;
    margin:0 5px 0 0;
    height:32px;
    width:32px
}
.art-vine-left{
    position:relative;
    float:left;
    top:-35px;
    width:69px;
    height:249px;
    background-image:url('../Pictures/vine_L.png')
}

.art-vine-right{
    position:relative;
    float:right;
    top:-35px;
    width:69px;
    height:249px;
    background-image:url('../Pictures/vine_R.png')
}

.art-Footer .art-Footer-text p{
    margin:0
}
.art-Footer .art-Footer-text{
    display:inline-block;
    color:#0E1315;
    font-size:12px
}
.art-Footer .art-Footer-text a:link{
    text-decoration:none;
    color:#131D20;
    text-decoration:underline
}
.art-Footer .art-Footer-text a:visited{
    text-decoration:none;
    color:#253941;
    text-decoration:underline
}
.art-Footer .art-Footer-text a:hover{
    text-decoration:none;
    color:#0E2025;
    text-decoration:none
}
.art-page-footer,.art-page-footer a,.art-page-footer a:link,.art-page-footer a:visited,.art-page-footer a:hover{
    font-family:Arial,Helvetica,sans-serif;
    font-size:10px;
    letter-spacing:normal;
    word-spacing:normal;
    font-style:normal;
    font-weight:400;
    text-decoration:underline;
    color:#6AB2C8
}
.art-page-footer{
    margin:1em;
    text-align:center;
    text-decoration:none;
    color:#445764
}
.edit_hover_class {
    width:66px;
    height:22px
}
.edit_hover_class a{
    opacity:.2
}
.edit_hover_class:hover a{
    opacity:1
}
.hover_L {
	position	: absolute; 
	top			: 4px; 
	right		: 12px;
}
.hover_R {
	position	: absolute; 
	top			: 4px; 
	right		: 92px; 
}

.iframe_art{
    border-style:double;
    padding:8px;
    width:340px;
    background-color:#DCDCED
}
.iframe_plain{
    border:1px solid #4C3C1B;
    padding:5px;
    width:340px;
    background-color:#EFEECB;
    background-color:#7c6240
}
.iframe_ridge{
    border-top-width:4px;
    border-bottom-width:4px;
    border-top-style:double;
    border-bottom-style:double;
    border-color:#E1A60A;
    padding:8px 0;
    width:340px
}
.iframe_xsnazzy h1{
    margin:0;
    font-size:1em;
    padding:0 5px 5px 5px;
    border-bottom:2px solid #444
}
.iframe_xsnazzy p{
    margin:0;
    padding:5px 10px;
    font-size:10px
	}
.iframe_xsnazzy{
    background			: transparent;
    width				: 342px;
	height				: 415px;
	background-color	: #7c6240;
	border-radius		: 15px;
	}
	
.cinematic {
	position			: relative; 
	height				: 410px;
	width				: 100%;
	margin				: 30px 0;
	}
	
.cinematic::before {
    content				: '';
    position			: absolute;
    width				: 70px;
    height				: 250px;
    background-image	: url('../Pictures/vine_R.png');
	}
	
.cinematic::after {
    content				: '';
    position			: absolute;
	top					: 0;
	right				: 0;
    width				: 70px;
    height				: 250px;
    background-image	: url('../Pictures/vine_L.png');
	}
	
.cinematic .iframe_xsnazzy {
  	position			: relative;
	width				: 613px; 
	height				: 424px;
	margin				: 0 auto;
	}

.xtop,.xbottom{
    display:block;
    background:transparent;
    font-size:1px
}
.xb1,.xb2,.xb3,.xb4{
    display:block;
    overflow:hidden
}
.xb1,.xb2,.xb3{
    height:1px
}
.xb2,.xb3,.xb4{
    background:#7c6240;
    border-left:1px solid #444;
    border-right:1px solid #444
}
.xb1{
    margin:0 5px;
    background:#444
}
.xb2{
    margin:0 3px;
    border-width:0 2px
}
.xb3{
    margin:0 2px
}
.xb4{
    height:2px;
    margin:0 1px
}
.xboxcontent{
	position:relative;
    display:block;
    height:399px;
	padding: 10px 0px 10px 0px;
}

* html .xboxcontent{
    height:1px
}
.color_a{
    background:#7c6240;
    color:#fff
}
.art-contentLayout .art-content{
    position:relative;
    margin:0;
    padding:0;
    border:0;
    float:left;
    overflow:hidden;
    width:535px
}
.art-contentLayout .art-content-sidebar1{
    position:relative;
    margin:0;
    padding:0;
    border:0;
    float:left;
    overflow:hidden;
    width:712px
}
.art-contentLayout .art-content-sidebar2{
    position:relative;
    margin:0;
    padding:0;
    border:0;
    float:left;
    overflow:hidden;
    width:712px
}
.art-contentLayout .art-content-wide{
    position:relative;
    margin:0;
    padding:0;
    border:0;
    float:left;
    overflow:hidden;
    width:889px
}
.art-contentLayout .art-sidebar1{
    position:relative;
    margin:0;
    padding:0;
    border:0;
    float:left;
    overflow:hidden;
    width:177px
}
.art-contentLayout .art-sidebar2{
    position:relative;
    margin:0;
    padding:0;
    border:0;
    float:left;
    overflow:hidden;
    width:177px
}
.shadow_block,.content_block{
    position:relative;
    bottom:2px;
    right:2px
}
.content_block{
    background-color:#fff;
    color:#000;
    border:1px solid #000;
    padding:.5em 2ex
}
.blur_block{
    background:transparent url('../Pictures/shadow1.png');
    color:inherit;
    margin-left:4px;
    margin-top:4px
}
.shadow_block{
    background:transparent url('../Pictures/shadow2.png');
    color:inherit
}

#preamble_books {
    border				: #8c9777 3px solid;
    border-radius		: 15px;
    padding				: 0px 20px 10px 20px;
    margin				: 20px 20px 40px 300px;
    background-color	: whitesmoke;}
#preamble_books h3x {
    background			: url('../Pictures/leaves.gif') no-repeat left top;
    height				: 32px;
    margin-bottom		: 15px;
    border-bottom		: #7d8965 1px solid;
	padding				: 5px 0px 5px 60px;
    text-align			: left;
    font-family			: Arial,"Times New Roman",Times,serif;}
#preamble_books h3x span {
    display				: none;}
	
.big_image{
    width:800px;
    height:450px;
    margin:0;
    padding:0;
    background-color:#FFF;
    overflow:hidden
}

#books_logo_align{
    position:absolute;
    top:-40px;
    height:87px;
    width:128px;
    background-image:url('../Pictures/books2.png');
    left:-1px;
    margin-left:4px
}
#quill_logo_align{
    background-image:url('../Pictures/QuillScroll.png');
    height:148px;
    left:0;
    margin-left:26px;
    position:absolute;
    top:-107px;
    width:114px
}
#compass_logo_align{
    position:absolute;
    top:-100px;
    height:172px;
    width:175px;
    background-image:url('../Pictures/compass2.png')
}
#telescope_logo_align {
    position			: absolute;
    top					: -108px;
    left				: 18px;
    height				: 145px;
    width				: 157px;
    background-image	: url('../Pictures/Telescope.png');
	filter				: drop-shadow(2px 6px 4px black);	
}

.xr_mvp_2 #telescope_logo_align {
    top					: -60px;
    left				: 10px;
    height				: 72px;
    width				: 78px;
	background-size		: cover; 
}
#pirate_ship_align{
    position:relative;
    top:-40px;
    left:-10px;
    height:236px;
    width:150px;
    background-image:url('../Pictures/ship1.png')
}
#harold_sword_align{
    position:relative;
    top:-15px;
    left:40px;
    height:200px;
    width:48px;
    background-image:url('../Pictures/sword_image_s.gif')
}
#ship_logo_align{
    position:absolute;
    top:-80px;
    left:0;
    height:150px;
    width:150px;
    background-image:url('../Pictures/ship4.png')
}
#ship_logo_align_2012{
    position:absolute;
    top:-76px;
    left:2px;
    height:150px;
    width:150px;
    background-image:url('../Pictures/ship2.png')
}
#ship_logo_align_2013{
    position:absolute;
    top:-80px;
    left:0;
    height:150px;
    width:150px;
    background-image:url('../Pictures/ship7.png')
}
#crown_logo_align{
    position:absolute;
    top:-63px;
    left:0;
    height:126px;
    width:200px;
    background-repeat:no-repeat;
    background-image:url('../Pictures/crown_gold.png')
}
#leaves_separator_align{
    padding-top:20px;
    padding-bottom:20px;
    height:10px;
    width:200px;
    background-image:url('../Pictures/leaves.png')
}
#callout_align{
    height:430px;
    width:260px;
    float:left;
    clear:left;
    border:none;
    margin-top:20px;
    margin-left:20px;
    margin-bottom:20px;
    margin-right:20px
}
#cover_align{
    height:400px;
    width:260px;
    background-image:url('../Pictures/Book_Callout.gif')
}
#cover_margins{
    position:absolute;
    margin-top:30px;
    margin-left:23px;
    height:322px;
    width:210px;
    border-style:outset;
    background-repeat:no-repeat;
    background-size:100% 100%
}
.art-menu li:hover ul ul,.art-menu li:hover ul ul ul{
    visibility:hidden
}
.art-menu li:hover ul,.art-menu li li:hover ul,.art-menu li li li:hover ul{
    visibility:visible
}
.art-menu li ul{
    position:absolute;
    width:10em;
    visibility:hidden
}
.art-menu a,.art-menu a:link,.art-menu a:visited,.art-menu a:hover{
    text-align:left;
    text-decoration:none;
    outline:none;
    letter-spacing:normal;
    word-spacing:normal;
    display:block
}
.art-menu li li:hover>ul{
    top:0;
    left:100%
}
.art-menu li>ul{
    display:none
}
.art-menu li:hover>ul{
    display:block;
    visibility:visible;
    top:100%
}
.art-menu li ul ul{
    margin:-30px 0 0 44px
}

.mininav	{
    border-top		: #eda 1px solid;
    border-bottom	: #eda 1px solid;
    padding-right	: 0;
    padding-left	: 0;
    color			: #7c6240;
    line-height		: 0;
    font-size		: smaller;
	margin-bottom	: 30px;	
    background		: transparent;
	}

.mininav table {
  	width			: 100%;
	}

.mininav table tr:last-child td:last-child {
  	width				: 100%;
  	}


.mininav table td img {
  height			: 25px; 
  float				: right; 
  }

.mininav td.foliage {
 	width				: 25px;
	height				: 25px;
	background-image	: url('../Pictures/leaves.gif');
	background-position	: right;
	background-repeat	: no-repeat;
	} 

.mininav.thin td {
    color			: #009;
    cursor			: auto;
    padding-right	: 0px;
	}

.mininav.thin td a {
    display			: block;
	margin-left		: 0;
	padding			: 10px 8px 10px 8px;
	color			: #7c6240;
	text-decoration	: none;
	}


td a.fullcell{
    display:block;
    margin-left:4px;
    padding:10px;
    width:auto;
    COLOR:#7c6240;
    text-decoration:none
}
td a.fullcell:hover{
    text-decoration:none;
    background:#eda
}
td a.thincell{
    display:block;
    margin-left:0;
    padding: 10px 2px 10px 2px;
    color:#7c6240;
    text-decoration:none
}

td a.thincell:hover,
.mininav.thin td a:hover {
    text-decoration:none;
    background:#eda
	}

td a.menucell{
    display:block;
    margin-left:0;
    padding-bottom:0;
    padding-top:0;
    padding-left:4px;
    padding-right:24px;
    color:#000;
    font-family:Arial,Helvetica,sans-serif;
    font-size:smaller;
    text-decoration:none
}
td a.menucell:hover{
    text-decoration:none;
    background:#006;
    color:white
}
.colc{
    color:#009;
    cursor:auto;
    padding-right:0px
}
hr{
    background:url('../Pictures/hr-helen.png') no-repeat top right;
    height:32px;
    border:0
}
hr.swash{
    background:url('../Pictures/hr-helen-swash.png') no-repeat top right;
    height:32px;
    border:0
}

.secondus{
    background:white;
    background-color:#F4F4F4
}

.cover_image {
    width:140px;
    height:160px;
    float:right;
}

.cover_image img {
    background		: none repeat scroll 0 0 white;
    border			: 1px solid #CCC;
    padding			: 4px;
	width			: 99px; 
	height			: 147px;
    float			: right;	
	}

.photo img{
    background:none repeat scroll 0 0 gray;
    border:1px solid #CCC;
    padding:4px
}

.book_title_number{
    Color:white;
	text-align:center;
    font-size:smaller;
}

.book_title{
    Color:black;
    font-weight:700;
	text-align:center;
}

.book_cover {
	text-align:center;
	}

.book_cover img {
	width				: 99px;
	height				: 148px; 
   	background			: none repeat scroll 0 0 gray;
    border				: 1px solid #CCC;
    padding				: 4px;
	}

.superscript{
    font-size:xx-small;
    font-style:italic;
    color:#7c6240;
    vertical-align:super
}
.footnote{
    margin-top:-8px;
    color:#7C6240;
    font-size:smaller;
    font-style:italic;
    padding-left:18px;
    text-indent:-23px
}
.early{
    padding-left	: 23px;
    text-indent		: -18px
}

/* Last updated section */
.lastupdated {
    position		: absolute;
    top				: 4px;
    left			: 16px;
    width			: 150px;
    height			: 22px;
    background-color: white;
    border-color	: whitesmoke;
    border-style	: outset;
    border-width	: thin;
    font-size		: smaller;
    font-weight		: bold;
    margin-left		: 20px;
    opacity			: 0.2;
}

.lastupdated span {
  	display			: inline-block;
	padding-left	: 50px;
	padding-top		: 3px;
  	vertical-align	: middle;
    line-height		: normal;
}

.lastupdated:after {
    content			: "Updated:";
    position		: absolute;
    left			: 0;
    width			: 50px;
    height			: 19px;
    background-color: #B2CDE0;
    overflow		: hidden;
    padding			: 3px 0 0 4px;
    text-align		: left;
}

.lastupdated:hover{
    opacity			: 1;
}

.h2u {
  font-size			: smaller;
}

#padding_edges.padding_revu {
	padding			: 40px 10px 10px 10px;
}	

#padding_edges.padding_bookshelf {
	position		: relative;
	width			: calc(100% - 20px);
}	

#padding_edges.padding_404 {
	padding			: 20px 10px;
	height			: 400px;
	text-align		: center;
	vertical-align	: middle;
}	


.button_shadow{
    width:35px;
    height:22px;
    border-radius:4px;
    box-shadow:2px 2px 5px black;
    float:left;
    margin-right:5px
}
.button_shadow:hover{
    position:relative;
    top:2px;
    left:2px;
    box-shadow:none
}
.button_shadow img,.amazon_shadow img{
    border:none
}
.bs_left{
    background-image:url('../Pictures/Arrow_left.png')
}

.bs_right{
    background-image:url('../Pictures/Arrow_right.png')
}
.bs_up {

    background-image: url('../Pictures/Arrow_up.png')
}	

.ocean_grid {
  position:relative;
  display:grid;
  grid-template-rows: 20px 20px 160px 22px;
  grid-row-gap: 10px;
  grid-auto-flow: column;
  margin-top:3%;
  grid-column-gap: 80px;
  justify-content: center;
  }


.book_purchase {
	width					: 122px;
	height					: 18px;
	border-radius			: 4px;
    box-shadow				: 3px 3px 5px black;
	margin					: auto;
}

.book_purchase img {
	width:124px;
	height:20px;
	}

.book_purchase:hover{
    position:relative;
    top:2px;
    left:2px;
    box-shadow:none;
}

table.sortable th{
    color:#7c6240;
    background-color:#eda;
    font-weight:700;
    padding:0 0 0 1px;
    text-align:left;
    border:1px solid #D8D8D8;
    height:20px;
    vertical-align:bottom;
    font-size:1em;
    cursor:pointer
}
table.sortable td{
    border-bottom:1px solid #D8D8D8;
    text-align:left;
    margin:0
}
.art-nav .l,.art-nav .r{
    position:absolute;
    z-index:-1;
    top:0;
    height:30px;
    background-image:url('../Pictures/nav_2015.png')
}
.art-menu a .r,.art-menu a .l{
    position:absolute;
    display:block;
    top:0;
    z-index:-1;
    height:90px;
    background-image:url('../Pictures/MenuItem_2015.png')
}
.art-menu a .t{
    font-style:normal;
    font-weight:400;
    color:#f6cf96;
    padding:0 17px;
    margin:0 0;
    line-height:30px;
    text-align:center
}
.art-menu a:hover .t{
    color:#291204
}
.art-menu li:hover a .t{
    color:#291204
}
.art-menu li:hover>a .t{
    color:#291204
}
.art-menu a.active .t{
    color:#291204
}
.art-nav .art-menu-separator {
	display: block;
	width: 1px;
	height: 30px;
	background-color: white;
    pointer-events: none;
}
.art-menu ul a{
    display:block;
    text-align:center;
    white-space:nowrap;
    height:32px;
    width:14em;
    overflow:hidden;
    line-height:32px;
    margin-right:auto;
    background-image:url('../Pictures/subitem_2015-bg.png');
    background-position:left top;
    background-repeat:repeat-x;
    border-width:1px;
    border-style:solid;
    border-color:#f6cf96
}
.art-menu ul a,
.art-menu ul a:link,
.art-menu ul a:visited,
.art-menu ul a:hover,
.art-menu ul a:active,
.art-nav ul.art-menu ul span,
.art-nav ul.art-menu ul span span{
    text-align:left;
    text-indent:12px;
    text-decoration:none;
    line-height:32px;
    color:#f6cf96;
    font-size:13px;
    font-style:normal;
    font-weight:400
}
.art-menu ul li a:hover{
    color:#000;
    border-color:#291204;
    background-position:0 -32px
}
.art-menu ul li:hover>a{
    color:#000;
    border-color:#291204;
    background-position:0 -32px
}
.art-nav .art-menu ul li a:hover span,.art-nav .art-menu ul li a:hover span span{
    color:#000
}
.art-nav .art-menu ul li:hover>a span,.art-nav .art-menu ul li:hover>a span span{
    color:#000
}
#yt_container{
    overflow:hidden
}
#yt_mask,#yt_controls{
    position:absolute;
    width:100%;
    height:100%;
    top:2px;
    left:0;
    font-size:14px;
    font-weight:700;
    color:#7c6240
}
#yt_mask:before{
    content:url('../Pictures/audio_icon.png');
    position:absolute;
    top:5px;
    left:20px
}
#yt_mask:after{
    content:"Point here for audio controls";
    position:absolute;
    top:5px;
    left:50px
}
#yt_frame{
    float:left
}
#yt_mask{
    width:300px;
    height:24px
}
#yt_outer{
    position:relative;
    width:296px;
    height:22px;
    top:2px;
    overflow:hidden
}
#yt_inner{
    position:absolute;
    top:-470px;
    left:-6px
}
.yt_overlay{
    position:absolute;
    width:100%;
    height:100%;
    display:none
}
ul.yt_embed{
    list-style:none;
    width:100%;
    margin:0;
    padding:0
}
ul.yt_embed li{
    position:relative;
    display:inline-block;
    width:312px;
    height:20px;
    top:-4px;
    left:20px;
    margin:0;
    padding:0
}
li:hover .yt_overlay{
    display:block
}
.YouTube{
    position:relative;
    top:1em;
    left:0em;
    width:54px;
    height:27px;
    background-image:url('../Pictures/YouTube.gif');
    background-repeat:no-repeat;
    background-size:cover;
    float:right
}
ul.tabs{
    padding:6px 0;
    font-size:0;
    margin:0;
    list-style-type:none;
    text-align:right
}
ul.tabs li{
    display:inline;
    margin:0;
    margin-right:6px
}
ul.tabs li a{
    font:normal 14px Arial;
    text-decoration:none;
    position:relative;
    padding:6px 14px;
    border:1px solid #B7B7B7;
    color:#000;
    background:white;
    border-radius:3px 3px 0 0;
    outline:none
}
ul.tabs li a:visited{
    color:#000
}
ul.tabs li a:hover{
    background:#eda
}
ul.tabs li.selected a,ul.tabs li.selected a:hover{
    position:relative;
    top:0;
    background:#eda;
    border-bottom-color:#eda
}
ul.tabs li.selected a:hover{
    text-decoration:none;
    background:#eda
}
div.tabcontents{
    border-top:1px solid #B7B7B7;
    padding-top:30px
}
.subtitle{
    brder			: #eda 0 Solid;
    padding			: 0.5em 2em 0.5em 0em;
    font-family		: Arial, Helvetica, Verdana, sans-serif;
    font-weight		: bold;
    text-align		: left;
    background		: transparent;
    margin			: 0 0 20px 0;
    width			: auto;
    line-height		: 1;
    list-style-type : none;
    overflow		: hidden;
    color			: black;}
	
.saxon, .seawitch, .banner, .mystery {
    height:380px; }
	
.saxon {
    background-image:url('../Pictures/sword_image_s.gif');
    background-repeat:no-repeat;
    background-position:12px 220px
}
.seawitch{
    background-image:url('../Pictures/ship-2011-rev.gif');
    background-repeat:no-repeat;
	background-size: 100px;
    background-position:bottom left;
}
.banner{
    background-image:url('../Pictures/Dragon_Small_2013_s.png');
    background-repeat:no-repeat;
    background-position:bottom left
}
.mystery{
    background-image:url('../Pictures/JanChristopher.png');
    background-repeat:no-repeat;
    background-size: 100px;
    background-position:bottom left;
}
.flags{
    position:absolute;
    width:128px;
    height:24px;
	top:204px;
    text-align:center
}
.flag_main{
    position:relative;
    left:122px;
    bottom:30px
}
.flag_item{
    height:11px;
    width:16px;
    margin-right:2px;
    border:0;
    background-repeat:no-repeat;
    background-position:center;
    display:inline-block
}
.AU{
    background-image:url('../Pictures/Flag_AU.gif')
}
.CA{
    background-image:url('../Pictures/Flag_CA.gif')
}
.IT{
    background-image:url('../Pictures/Flag_IT.gif')
}
.TR{
    background-image:url('../Pictures/Flag_TR.gif')
}
.UK{
    background-image:url('../Pictures/Flag_UK.gif')
}
.US{
    background-image:url('../Pictures/Flag_US.gif')
}
.small_cover{
    position:absolute;
    top:220px;
    left:700px
}
.small_cover img{
    height:188px;
    width:120px
}
.cover_ebook{
    position:absolute;
    left:650px;
    top:260px;
    height:176px;
    width:198px;
    background-size:cover
}
a.fill-div{
    display:block;
    height:100%;
    width:100%;
    text-decoration:none
}
a.fill-toc-y{
    display:inline-block;
    text-decoration:none;
    width:30px;
    height:16px
}
a.fill-toc-m{
    display:inline-block;
    text-decoration:none;
    width:24px;
    height:16px
}
a.fill-toc-d{
    display:inline-block;
    text-decoration:none;
    width:8px;
    height:16px
}

.noselect,
a.fill-div,
a.fill-toc-d,
a.fill-toc-m,
a.fill-toc-y,
#p-m-select,
#p-y-select,
span.select_null,
.dhtmlxslider_dhx_skyblue .dhxsl_runner,
.dhtmlxslider_dhx_skyblue .dhxsl_container,
.microNext a, 
.microPrev a, 
.microDivide a,
.microNext.Null, 
.microPrev.Null, 
.nav label
{
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none
}

.validator{
    height:24px;
    width:66px
}
a.blind-link,a.blind-link:hover{
    text-decoration:none
}
.h2u_subtitle{
    position:absolute;
    color:#42210D;
    font-family:Dominica,MatrixBold,Helvetica,Verdana,Arial,sans-serif;
    font-size:37px;
    height:50px;
    left:140px;
    text-shadow:.04em .04em .07em grey;
    top:94px;
    vertical-align:middle;
    width:600px
}
#makeitmove{
    position:absolute;
    height:84px;
    width:98px;
    top:16px;
    left:220px;
    z-index:29999;
    cursor:move
}
#command,#bar{
    background-color:transparent
}
#command{
    position:absolute;
    width:99px;
    height:92px;
    background-image:url('../Pictures/Open-Book.png');
    overflow:hidden;
    z-index:30000
}
#command #reset{
    position:absolute;
    width:37px;
    height:54px;
    left:1px;
    top:1px;
    cursor:pointer
}
#movemask{
    position:absolute;
    top:4px;
    left:7px;
    width:80px;
    height:58px;
    cursor:default
}
#bar{
    position:absolute;
    cursor:default;
    height:40px;
    width:26px;
    top:13px;
    left:53px
}
#bar .button{
    position:absolute;
    height:5px;
    width:5px;
    background:none repeat scroll 0 0 #222;
    cursor:pointer
}
#bar .loaded{
    background:none repeat scroll 0 0 #666
}
#bar .viewed{
    background:none repeat scroll 0 0 #7AA33F
}
#bar .selected{
    background:none repeat scroll 0 0 red
}
#urlInfo{
    position:absolute;
    background:url('../Pictures/r.gif') no-repeat scroll 0 4px transparent;
    cursor:pointer;
    padding-left:12px;
    visibility:hidden;
    z-index:30000
}
.h2u_header_bar{
    height:20px;
    margin-bottom:5px;
    border-bottom:double;
    font-size:smaller;
    font-weight:700;
    background-image:url('../Pictures/Banner-H2U-Zone.jpg');
    background-position:bottom left;
    color:#FFF;
    text-shadow:black .05em .07em .05em
}
.subtitle{
    Border-Right:#Eda 0 Solid;
    Border-Left:#Eda 0 Solid;
    Border-Top:#Eda 2px Solid;
    Border-Bottom:#Eda 2px Solid;
    Padding-Right:2em;
    Padding-Left:0em;
    Padding-Bottom:.5em;
    Padding-Top:.5em;
    Font-Family:Arial,Helvetica,Serif;
    Font-Weight:Bold;
    Text-Align:Left;
    Background:Transparent;
    Margin:0 0 20px 0;
    Width:Auto;
    Line-Height:1;
    List-Style-Type:None;
    Overflow:Hidden;
    Color:Black
}
.bookrack{
    width:100%;
    height:200px;
    padding-top:30px
}
.book{
    display:inline-block;
    box-shadow:5px 5px 20px #333;
    margin:10px
}
.book img{
    vertical-align:middle;
    width:100px;
    height:165px
}
.isolate img{
    vertical-align:middle;
    width:140px;
    height:165px
}
.csstransforms3d .books{
    -moz-perspective:100px;
    -moz-transform-style:preserve-3d;
    -webkit-transform-style:preserve-3d
}
.csstransforms3d .book{
    position:relative;
    -moz-perspective:100px;
    -moz-transform:rotateY(-3deg);
    -webkit-transform:perspective(100) rotateY(-3deg);
    outline:1px solid transparent;
    box-shadow:none;
    margin:0
}
.csstransforms3d .book img{
    position:relative;
    max-width:100%
}
.csstransforms3d .book:before,.csstransforms3d .book:after{
    position:absolute;
    top:2%;
    height:96%;
    content:' ';
    z-index:-1
}
.csstransforms3d .book:before{
    width:100%;
    left:7.5%;
    background-color:#5a2d18;
    box-shadow:5px 5px 20px #333
}
.csstransforms3d .book:after{
    width:5%;
    left:100%;
    background-color:#EFEFEF;
    box-shadow:inset 0 0 5px #aaa;
    -moz-transform:rotateY(20deg);
    -webkit-transform:perspective(100) rotateY(20deg)
}
.separator{
    float:none;
    width:100%;
    height:50px
}
.strongwhite{
    padding-bottom:50px;
    position:relative;
    left:30px;
    width:80%;
    border:1px solid #008080;
    padding:10px 50px;
    background:white;
    -moz-box-shadow:10px 10px 5px #888;
    -webkit-box-shadow:10px 10px 5px #888;
    box-shadow:10px 10px 5px #888
}
.strongblue{
    padding-bottom:50px;
    position:relative;
    left:30px;
    width:80%;
    border:1px solid #008080;
    padding:20px 30px 20px 30px;
    background:#dbe5f1;
    -moz-box-shadow:10px 10px 5px #888;
    -webkit-box-shadow:10px 10px 5px #888;
    box-shadow:10px 10px 5px #888
}
.notepad{
    font-family:'Handlee',cursive;
    padding:10px 40px;
    margin:30px auto;
    box-shadow:0 0 5px rgba(0,0,0,.2),inset 0 0 50px rgba(0,0,0,.1);
    background:#fcf59b;
    background:-webkit-gradient(linear,left top,left bottom,from(#81cbbc),color-stop(2%,#fcf59b));
    background:-moz-repeating-linear-gradient(0deg,#fcf59b,#fcf59b 38px,#81cbbc 40px);
    background:repeating-linear-gradient(0deg,#fcf59b,#fcf59b 38px,#81cbbc 40px);
    -webkit-background-size:100% 40px;
    -moz-box-shadow:10px 10px 5px #888;
    -webkit-box-shadow:10px 10px 5px #888;
    box-shadow:10px 10px 5px #888
}
div.para{
    font-weight:700;
    font-style:italic;
    padding-bottom:10px
}
div.para:before{
    content: url('../Pictures/leaves_s.gif');
    content: "~ ";
    margin-right: 5px
}
div.para:after{
    content: url('../Pictures/leaves_s.gif');
    content:" ~"
}
div.heda{
    font-weight:700;
    font-style:italic;
    padding-bottom:20px;
    text-align:justify
}
div.heda:before{
    content:url('../Pictures/QuillScroll.png');
    margin-right:-20px;
    position:relative;
    top:14px
}
div.heda:after{
    content:'';
    display:inline-block;
    width:100%;
    height:0;
    font-size:0;
    line-height:0
}
div.heda span{
    display:inline-block;
    vertical-align:baseline
}
.vignette{
    -webkit-box-shadow:inset 0 0 50px #000,inset 0 0 50px #000,inset 0 0 50px #000;
    -moz-box-shadow:inset 0 0 50px #000,inset 0 0 50px #000,inset 0 0 50px #000;
    box-shadow:inset 0 0 50px #000,inset 0 0 50px #000,inset 0 0 50px #000;
    width:700px;
    height:190px;
    background-position:center;
    background-repeat:no-repeat;
    display:table-cell;
    vertical-align:bottom;
    font-style:italic;
    Border-radius:15px
}
.vignette_base{
    position:absolute;
    margin:auto;
    top:-1px;
    left:-1px;
    width:652px;
    height:502px;
    -webkit-box-shadow:inset 0 0 50px #848065,inset 0 0 50px #848065,inset 0 0 30px #848065;
    -moz-box-shadow:inset 0 0 50px #848065,inset 0 0 50px #848065,inset 0 0 30px #848065;
    box-shadow:inset 0 0 50px #848065,inset 0 0 50px #848065,inset 0 0 30px #848065;
    border-radius:15px
}
.pause{
    position:absolute;
    box-sizing:border-box;
    width:6px;
    height:8px;
    top:0;
    left:4px
}
.stop{
    position:absolute;
    box-sizing:border-box;
    width:0;
    height:0;
    top:0;
    left:3px
}
.iconbutton{
    position:relative;
    top:2px;
    left:-2px;
    width:16px;
    height:16px;
    border-radius:4px;
    float:right;
    font-size:smaller;
    text-indent:-1px
}
.iconbutton:hover{
    text-shadow:none;
    top:3px;
    left:-1px;
    cursor:pointer
}
#pause-button{
    display:none
}
#sliderObj{
    position:absolute;
    top:0;
    left:0;
    width:80px;
    height:21px;
    background-image:url('../Pictures/Arrow_base_M.png');
    background-repeat:repeat-x
}
#sliderLeft{
    position:relative;
    float:right;
    width:20px;
    height:21px;
    background-image:url('../Pictures/Arrow_base_L.png');
    cursor:default
}
#sliderRight{
    position:relative;
    float:right;
    width:20px;
    height:21px;
    background-image:url('../Pictures/Arrow_base_R.png');
    cursor:default
}
.slider{
    position:absolute;
    top:-32px;
    left:650px;
    width:120px;
    color:#e6e4bd;
    text-shadow:black .05em .07em .05em;
    margin-top:0;
    border-radius:4px;
    box-shadow:2px 2px 6px #000
}
.dhtmlxslider_dhx_skyblue{
    z-index:0
}
.dhtmlxslider_dhx_skyblue .dhxsl_hidden{
    display:none
}
.dhtmlxslider_dhx_skyblue .dhxsl_container{
    position:relative;
    float:left;
    clear:left;
    margin:0;
    padding:1px;
    -webkit-tap-highlight-color:rgba(0,0,0,0)
}
.dhtmlxslider_dhx_skyblue .dhxsl_container.dhxsl_cont_hr{
    margin-top:8px
}
.dhtmlxslider_dhx_skyblue .dhxsl_runner{
    position:absolute;
    width:4px;
    height:11px;
    margin:0;
    padding:0;
    overflow:hidden;
    border:1px solid #7A9C98;
    background-color:#e6e4bd;
    border-radius:2px;
    -webkit-touch-callout:none;
    -ms-touch-action:none;
    z-index:1;
    cursor:pointer
}
.dhtmlxslider_dhx_skyblue .dhxsl_runner.dhxsl_runner_actv{
    background-color:#e2efff;
    background:linear-gradient(#e2efff,#d3e7ff);
    background:-webkit-linear-gradient(#e2efff,#d3e7ff);
    z-index:2
}
.dhtmlxslider_dhx_skyblue .dhxsl_track{
    margin:0;
    padding:0;
    overflow:hidden;
    border:1px solid #7A9C98;
    position:relative;
    border-radius:2px;
    background-color:#e6e4bd;
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -ms-touch-action:none
}
.dhtmlxslider_dhx_skyblue .dhxsl_cont_hr .dhxsl_track{
    width:100%;
    height:1px
}
.dhtmlxslider_dhx_skyblue .dhxsl_cont_hr .dhxsl_track div.dhxsl_track_bg{
    top:0;
    height:100%
}
.buttonbar{
    display:inline-block
}

sect{
    display:inline-block;
    vertical-align:baseline
}
.buttons li{
    float:left;
    list-style:none;
    text-align:center;
    background-color:transparent;
    margin-right:5px;
    width:auto;
    line-height:16px;
    font-style:normal;
    font-weight:400
}
.buttons li a{
    margin-bottom:-6px;
    text-decoration:none;
    display:block;
    color:#7c6240;
    padding:0 5px 0 5px
}
.buttons li a:hover{
    text-decoration:none;
    background-color:#eda
}
.buttonbar{
    display:inline-block
}
.selected{
    background-color:#eda
}
.inner{
    width:50%;
    margin:0 auto
}
.btn{
    width:100px;
    height:25px;
    background:red;
    color:white;
    text-align:center;
    line-height:25px
}
div.here{
    margin:10px auto;
    width:120px;
    border:1px solid #333;
    border:none;
    position:relative
}
div.here:after{
    content:"";
    position:absolute;
    z-index:-1;
    top:0;
    bottom:0;
    left:50%;
    border-left:2px dashed #7c6240
}
ul#glist{
    list-style:none;
    width:10px;
    background-color:transparent;
    display:table-row
}
ul#glist>li{
    font-family:Arial,Helvetica,sans-serif;
    font-size:small;
    width:30px;
    height:20px;
    border-bottom:2px solid #7c6240;
    margin-bottom:1000px;
    margin-left:64px;
    padding:0 4px 3px 0;
    color:#7c6240;
    text-align:right;
    line-height:24px;
    background-color:transparent
}
#yt_separator{
    margin-top:200px;
    margin-bottom:300px
}
.widthfill{
    width:100%;
    color:#7c6240
}
#yt_contextualise{
    height:450px;
    width:900px;
    background-image:url('../Pictures/yt_landscape_min.jpg');
    background-image:url('../Pictures/yt_landscape.jpg');
    vertical-align:middle;
    margin-left:50%;
    margin-right:50%
}
#yt_label{
    position:relative;
    color:#e6e4bd;
    text-align:center;
    top:-30px
}
.toc_360{
    width:40px
}
.H2U_Feature,.Slide_Frame{
    width:650px;
    height:500px
}
.H2U_Feature{
    position:relative;
    top:15px;
    margin:0 auto;
    border:groove;
    border-radius:15px;
    overflow:hidden;
    background-color:white
}
.H2U_Feature .Slide_Frame{
    position:absolute
}
#backplane{
    position:relative;
    top:0px;
    left:16px;
    height:356px;
    width:838px;
    -webkit-box-shadow:inset 0 0 50px #848065, inset 0 0 30px #848065;
    -moz-box-shadow:inset 0 0 50px #848065 ,inset 0 0 30px #848065;
    box-shadow:inset 0 0 50px #848065, inset 0 0 30px #848065;
    border-radius:15px;
}
#sightline{
    position:relative;
    margin:10px 10px 10px 10px;
	top: 10px;
    width:818px;
    height:336px;
    border-radius:10px;
    background-color:black;
    overflow:hidden;
}
#far_icon_base{
    position:absolute;
    width:40px;
    height:24px;
    top:20px;
    left:30px;
    border:#8c9777 1px solid;
    border-radius:4px;
    background-color:white;
    z-index:4
}
#far_icon{
    position:absolute;
    width:23px;
    height:18px;
    top:3px;
    left:8px;
    background:url('../Pictures/IconSet.png') -132px -6px
}
#H2U_updates{
    position:absolute;
    width:380px;
    height:36px;
    top:94px;
    left:54px;
    line-height:36px;
    text-align:center;
    border:#8c9777 1px solid;
    border-radius:8px;
    background-color:white;
    z-index:4
}
#H2U_Subscriber{
    position:absolute;
    top:190px;
    left:90px;
    height:70px;
    width:700px;
    margin:0 auto;
    padding:16px 0 8px 0;
    text-align:center;
    border:#8c9777 3px inset;
    border-style:solid;
    border-radius:15px;
    background-color:white;
    z-index:4
}

.OutOfPrint {
 position			: absolute; 
 top				: 260px;
 left				: 440px; 
 width				: 25%; 
 background-color	: #FF9900; 
 border				: 1px solid; 
 box-shadow			: 4px 4px 4px rgba(0, 0, 0, 0.6); 
 padding			: 4px 6px 6px 6px; 
 text-align			: center;
 z-index			: 2000; 
}

.OutOfPrint::before {
 font-weight		: bold;
 content			: "~ Temporarily out of print ~\a";
}

.OutOfPrint::after {
 font-weight		: normal;
 content			: "The series is being republished and this book will be available again soon...";
}



/* ----------------------------------------------------------------------------------------------------------
   Added to support mobile variant content 
   ----------------------------------------------------------------------------------------------------------  */

.turkish_cover {
  width				: 28%;
  float				: left;
  z-index			: 2;			
}


.tabledata .td1 {
  width				: 80px;
  }

.tabledata .td2 {
  width				: 12px;
  }



.mininav table tr:last-child td:last-child {
  width				: 100%;
  }


.mininav table td img {
  height			: 25px; 
  float				: right; 
  }

.mininav td.foliage {
 	width				: 25px;
	height				: 25px;
	background-image	: url('../Pictures/leaves.gif');
	background-position	: right;
	background-repeat	: no-repeat;
	} 

#centraliser h3, #mobileVariant h3 {
  text-align		: center;
  }

.button_bar_mobile {
  position			: absolute; 
  height			: 22px; 
  width				: 200px;
}
.top {
  top				: 4px;
  left				: 350px;
}
.base {
  top				: 12px; 
  left				: 16px; 
}

.button_shadow_spacer{
  width				: 20px;
  height			: 22px;
  float				: left;
  margin-right		: 5px
}

/* Updated to streamline the mobile version internal menu structures */
.textblock {
	margin				: 20px 0 20px 0;
	padding-top			: 40px;
}

.textblock_initial {
    margin-top			: 0; 
	padding-top			: 0;
}

.textblock_translated {
    margin-top			: 30px; 
	padding-top			: 0;
}

.microNav 
	{
    border-top: #eda 1px solid;
    border-bottom: #eda 1px solid;
    font-size: 16px;
    padding: 4px;
    margin-bottom: 32px;
    background-color: whitesmoke;
    border-top: 2px dotted #291204;
    border-bottom: 2px dotted #291204;
    position: relative;
    left: -16px;
    width: calc(100% + 20px);
	}					  


a:link .microNext, a:visited .microNext, a:link .microPrev, a:visited .microPrev  
{  color			: black; }

.Null
{  color			: grey; }

.microNext, .microPrev, .microDivide
{
  width				: 50px; 
  height			: 30px;
  float				: right;
  font-size			: 13px; 
  text-align		: right;
  text-decoration	: none;
  display			: block;
}

.microNext a, .microPrev a, .microDivide a
{
  text-decoration	: none;
  color				: black;
			}

.microNext 	{  text-align:right;}
.microDivide{  text-align:center; width:6px;}
.microPrev  {  text-align:left;}

.microDivide::before
{  content			: "|" }


.contributors table {
  	width 				: 100%;
}


.separator {
	height				: 50px; 
	margin				: 30px 0 10px 0; 
}

.maple {
	background			: url('../Pictures/leaves.gif') no-repeat center;
}

.mini_flag {
  width					: 16px; 
  height				: 11px; 
  margin-bottom			: 4px;
}

.tab_flag {
  width					: 16px; 
  height				: 11px;
  margin-left			: 10px; 
}


/* 
  SadWolf Germany styles 
*/
.sw-font-size-2 { font-size: 12px; }
.sw-font-size-5 { font-size: 20px; }
.sw-font-size-6 { font-size: 28px; }
.sw-0-0-centre  { text-indent: 0  ; margin-top: 0;   text-align:center;}
.sw-0-4-centre  { text-indent: 0  ; margin-top: 2pt; text-align:center;}

#tabselector {
	margin				: 0 auto;
}

#tabselector_mobile {
	margin-top			: 40px;
	width				: 95%;
}


.editions {
  font-size			: small;
  font-weight		: 400;
  vertical-align	: super;
}


.Tag_Line {
    position: relative;
    background-color: whitesmoke;
    width: 98%;
    margin: 0 auto;
    margin-bottom: 0px;
    top: -30px;
    margin-bottom: 30px;
    font-size: 13px;
    text-align: center;
    border-top: 2px solid #291204;
    border-bottom: 2px solid #291204;
}



/* --------------------------------------------------------------------------------------
   The bookshelf pages use different mini-nav table layouts. Assign them here...
   -------------------------------------------------------------------------------------- */   


.bookshelf_seawitch .desktop.mininav td,
.bookshelf_saxon .desktop.mininav td,
.bookshelf_banner .desktop.mininav td
 	{ /* Handle all colc calls */
	color			: #7c6240;
 	cursor			: auto;
	padding-right	: 0px;
	}	



.bookshelf_seawitch .desktop.mininav td {
	/* Set a default size then override with specifics */
	width			: 10%;
   	}
.bookshelf_seawitch .desktop.mininav td:nth-child(1) 	{ width: 8%;}	
.bookshelf_seawitch .desktop.mininav td:nth-child(8) 	{ width: 8%;}	
.bookshelf_seawitch .desktop.mininav td:nth-child(9)	{ width: 8%;}
.bookshelf_seawitch .desktop.mininav td:last-child		{ width: auto;}
	



.bookshelf_banner .desktop.mininav td {
   	width			: 12%;
   	}
.bookshelf_banner .desktop.mininav td:nth-child(1) 	{ width: 8%;}	
.bookshelf_banner .desktop.mininav td:nth-child(2) 	{ width: 10%;}	
.bookshelf_banner .desktop.mininav td:nth-child(6) 	{ width: 10%;}	
.bookshelf_banner .desktop.mininav td:nth-child(7)	{ width: 10%;}	
.bookshelf_banner .desktop.mininav td:last-child	{ width: auto;}	

.bookshelf_banner .standard {
	position: relative;
	float:right;
	width:110px;
	height:200px;
	}



.bookshelf_saxon .desktop.mininav td {
   width			: 12%;
   }
.bookshelf_saxon .desktop.mininav td:nth-child(3) 	{ width: 16%;}	
.bookshelf_saxon .desktop.mininav td:nth-child(6) 	{ width: 16%;}	
.bookshelf_saxon .desktop.mininav td:last-child		{ width: auto;}	

.bookshelf_saxon .desktop.mininav.thin td {
   width			: auto;
   }


   
.bookshelf_saxon table.sortable th 					{ text-align: left; }
.bookshelf_saxon table.sortable th:nth-child(1) 	{ width: 370px;}
.bookshelf_saxon table.sortable th:nth-child(2) 	{ width: 190px;}
.bookshelf_saxon table.sortable th:nth-child(3) 	{ width: 170px;}
.bookshelf_saxon table.sortable th:nth-child(4) 	{ width:  70px;}
 
.bookshelf_saxon .notes_image {
  	height			: 400px;
	width			: 223px
	}


.purchase:hover::after {
	content : '';
	position: absolute;
	bottom:100px;
	left:2px;
	width: 100%;
	height:30px;
	background-color: rgb(255, 255, 255, 0.5);
	background-image: url('../Pictures/amazon_logo_s.png');
	background-repeat:no-repeat;
	background-position	: center center;
    pointer-events		: none;

	}
  


/* --------------------------------------------------------------------------------------
   The headers MUST come last in the cascade, so that any adjustments remain in force.
   -------------------------------------------------------------------------------------- */   

.header_404 {
  background-image	: url('../Pictures/Banner-Unknown-Address.jpg'); 
}  

.header_seawitch {
    background-image: 
		url('../Pictures/Banner-SW-Series.jpg'),
		linear-gradient(180deg, rgba(107, 130, 138, 1), rgba(103, 127, 134, 1)),
		linear-gradient(135deg, rgba(78, 92, 105, 1), rgba(30, 49, 63, 1)),
		linear-gradient(135deg, rgba(41, 81, 140, 1), rgba(41, 81, 140, 1));
    background-position: 
		center center;
    background-size: contain, 100% 84%, 100% 87%, cover;
    background-repeat: 
		no-repeat;
}  

.header_banner {
  	background-image	: url('../Pictures/Banner-PB-Trilogy.jpg'),linear-gradient(180deg, rgba(63, 59, 50, 1), rgba(31, 33, 34, 1));
    background-position: center center;
    background-size: contain, cover;
    background-repeat: no-repeat;
  
}  

.header_saxon {
  	background-image	: url('../Pictures/Banner-Saxon-Series.jpg'),linear-gradient(135deg, rgba(49, 26, 70, 1), rgba(99, 78, 121, 1)); 
    background-position: center center;
    background-size: contain, cover;
    background-repeat: no-repeat;
}  

.header_diamond {
  	background-image	: url('../Pictures/Banner-DtD-Volumes.jpg'),linear-gradient(135deg, rgba(181, 151, 87, 1), rgba(203, 210, 171, 1)); 
    background-position: center center, 0 0;
    background-size: contain, 100% 100%;
    background-repeat: no-repeat, repeat;
}  

.header_fact {
  background-image	: url('../Pictures/Banner-Non-Fiction.jpg'); 
}  

.header_mystery {
	background-image	: url('../Pictures/Banner-Mystery.jpg'),linear-gradient(140deg, rgba(1, 0, 0, 1), rgba(13, 5, 2, 1));
	background-position	: center center;
	background-size		: contain;
	background-repeat	: no-repeat;
}


/* 	--------------------------------------------------------------------------------------
	Use MOBILE content
   	-------------------------------------------------------------------------------------- */ 

/*
@media only screen and (orientation: portrait) and (max-width: 619px), only screen and (orientation: landscape) and (max-height: 619px)
*/

@media only screen and (max-width: 620px) 
		{
		
		body {
						margin					: 0 auto 40px auto;
						min-width				: 360px;
						font-family				: "Open Sans", Verdana, Arial, Helvetica, sans-serif;
			}				
						
						
		 .container {  	
		 				width					: auto;
						margin					: 0 auto;
						
						overflow				: hidden; 
			}
		
		 .desktop 	{   display					: none;   }
		 .mobile 	{   display					: block;  }
		 
		 #hideout 	{ 	display					: none; 
						visibility				: hidden; }
		
		.mininav {
			font-size			: 16px;
			font-weight			: 700;
		}	
		
		.mininav td {
		  width				: 86px;
		  vertical-align	: middle;  
		  }
		
		.mininav td:not(:last-child) a {
		  width				: 86px;
		  }
		
		.mininav table tr:last-child td:last-child {
		  width				: 100%;
		  }
		
		.mininav table td img {
		  height			: 25px; 
		  float				: right; 
		  }
		
		#centraliser h3, #mobileVariant h3 {
		  text-align		: center;
		  }
		
		.button_bar_mobile {
		  position			: absolute; 
		  height			: 22px; 
		  width				: 200px;
		}
		.top {
		  top				: 4px;
		  left				: 350px;
		}
		.base {
		  top				: 12px; 
		  left				: 16px; 
		}
		
		.nav ul {
			font-size				: 16px;
			}
		
		.button_shadow_spacer{
		  width				: 20px;
		  height			: 22px;
		  float				: left;
		  margin-right		: 5px
		}
		
		.art-menu ul a 				{ width : 14em;}
		.art-menu ul li a 			{ text-indent : 1.0em; font-weight: 400; }
		.art-menu ul li.heading a 	{ text-indent : 0.4em; font-weight: 700; font-style: italic;}
		
		.art-Sheet { 
			position			: relative;
			margin				: 0;
			width 				: calc(100% - 2px);
			background-color	: #2B424A;
			border-radius		: 15px;
			border				: 1px solid #568495;
			overflow			: hidden;
			z-index				: 0;
			}
		
		.art-Sheet-body 				{ margin-top : 0; padding:0;}
		#art-main 					{ padding-top : 0; }
		
		
		.xr_ap 	{
			width					: 480px; 
			height					: auto; 
			top						: 0;
			margin					: 0 auto;
		}
		
		.art-menu a{
			position				: relative;
			display					: block;
			overflow				: hidden;
			height					: 29px;
			cursor					: pointer;
			text-decoration			: none;
			margin-right			: 0;
			margin-left				: 0
		}
		.button_shadow  {
			width					: 35px;
			height					: 22px;
			border-radius			: 4px;
			margin-right			: 5px;
			float					: left;
			box-shadow				: 4px 4px 5px black;
		}
		
		.button_shadow:hover {
			top						: 2px;
			left					: 2px;
			box-shadow				: none;
		}
		
		
		.seafloor {
			position				: absolute; 
			bottom					: 8px; 
			height					: 180px; 
			width					: calc(100% - 20px);
			}
		
		.coral_reef {
			display					: grid; 
			position				: absolute; 
			bottom					: 0;
			grid-template-columns	: 60px auto; 
			grid-template-rows		: 60px;
			grid-column-end			: -1;
			grid-auto-flow			: row dense; 
			grid-gap				: 4px;
			align-items				: center;
			justify-items			: center; 
			width					: calc(100% - 200px);
			}
		
		
		.reef_dweller_1 {
			position				: absolute; 
			bottom					: -4px; 
			height					: 100px; 
			width					: 96px;
			background-image		: url('../Pictures/Dragon_Small_2013_s.png');
			background-size			: 100% 100%;
			}
		
		.reef_dweller_2 {
			position				: absolute; 
			left					: 0;
			bottom					: -4px; 
			height					: 100px; 
			width					: 64px;
			background-image		: url('../Pictures/ship-2011-rev.gif');
			background-size			: 100% 100%;
			}
		
		.reef_dweller_3 {
			position				: absolute; 
			bottom					: -40px;
			left					: 0;
			height					: 200px; 
			width					: 48px;
			background-image		: url('../Pictures/sword_image_s.gif');
			background-size			: 100% 100%;
			}
		
		.reef_dweller_4 {
			position				: absolute; 
			bottom					: -4px; 
			height					: 80px; 
			width					: 100px;
			background-image		: url('../Pictures/JanChristopher.png');
			background-size			: 100% 100%;
			}
		
		.reef_dweller_5 {
			position				: absolute; 
			bottom					: 0;
			left					: -4px; 
			height					: 142px; 
			width					: 112px;
			background-image		: url('../Pictures/QuillScroll.png');
			background-size			: 100% 100%;
			}
		
		
		.rockpool_grid {
			position				: relative;
			display					: grid;
			grid-template-rows		: 10em auto;
			grid-template-columns	: repeat( auto-fill, minmax(14em, 2fr) );  
			grid-row-gap			: 3em;
			margin					: 0 0 2em 1em;
		}
		
		.shellfish {
			position				: relative;
			height					: 157px;
			width 					: 110px;
			margin					: 0 auto;
			box-shadow				: 4px 4px 5px black;
		}
		
		
		.shellfish:hover  {
			right					: -4px; 
			bottom					: -4px; 
			box-shadow				: none;
		}
		
		.shellfish.UK_flag::after  {
		  content : '';
		  position:absolute;
		  top:166px;
		  left: 50px;
		  height : 11px;
		  width: 16px;
		  background-image: url('../Pictures/Flag_UK.gif');
		}
		
		.shellfish.US_flag::after  {
		  content : '';
		  position:absolute;
		  top:166px;
		  left: 50px;
		  height : 11px;
		  width: 16px;
		  background-image: url('../Pictures/Flag_US.gif');
		}
		
		
		
		.thumbnail {
			position				: absolute;
			height					: 157px;
			width 					: 110px;
			right					: 10px;
			bottom					: 8px; 
			box-shadow				: 4px 4px 5px black;
		}
		
		
		.thumbnail:hover  {
			right					: 6px; 
			bottom					: 4px; 
			box-shadow				: none;
		}
		
		.thumbnail_e {
			top						: 24px; 
			left					: calc(100% - 170px);
			/* Safari bug when v-offset and blur sizes are not the same! */ 
			filter					: drop-shadow(2px 4px 4px rgba(0,0,0,0.5));
			-webkit-filter			: drop-shadow(2px 4px 4px rgba(0,0,0,0.5));			
			height					: 10em;
			width					: 11em;
		}	
		
		.thumbnail_e:hover {
			top						: 28px; 
			left					: calc(100% - 166px);
			filter					: none;
		}	
		
		.lang:hover {
			margin-left				: 4px; 
			margin-top				: 4px; 
			box-shadow				: none;
		}
		
		
		
		
		.placeholder {
			position				: relative;
			float					: right; 
			top						: 20px; 
			width					: 110px; 
			height					: 157px; 
			margin					: 20px 0px 40px 20px;
		}	
		
		.lang {
			left					: 0; 
			top						: 0; 
			float					: none;
		}
		
		
		.thumbnail img,
		.shellfish img
			{
			height					: 148px;
			width					: 100px;
			}
		
		
		.mininav table td:last-child {
		  width						: 100%;
		  }
		
		
		td a.fullcell {
			display					: block;
			margin					: 2px 0 0 10px ;
			padding					: 14px 2px 14px 2px;
			height 					: 6px;
			color					: #7c6240;
			text-decoration			: none;
		}
		
		.OutOfPrint {
			position				: absolute;
			left					: 64px;
			top						: 100px;
			width					: 232px;
			background-color		: #FF9900; 
			border					: 1px solid; 
			box-shadow				: 0 0 4px 4px rgba(0, 0, 0, 0.5); 
			padding					: 4px 6px 6px 6px; 
			text-align				: center;
			z-index					: 1; 
		}
		
		
		/* Updated to streamline the mobile version internal menu structures */
		.textblock {
			margin				: 20px 20px 0 20px;
			padding-top			: 40px;
		}
		
		.textblock_initial {
			margin-top			: 0; 
			padding-top			: 0;
		}
		
		.textblock_translated {
			margin-top			: 30px; 
			padding-top			: 0;
		}
		
		.microNav 
			{
			border-top: #eda 1px solid;
			border-bottom: #eda 1px solid;
			font-size: 16px;
			padding: 4px;
			margin-bottom: 32px;
			background-color: whitesmoke;
			border-top: 2px dotted #291204;
			border-bottom: 2px dotted #291204;
			position: relative;
			left: -16px;
			width: calc(100% + 20px);
			}					  
		
		
		a:link .microNext, a:visited .microNext, a:link .microPrev, a:visited .microPrev  
		{  color			: black; }
		
		.Null
		{  color			: grey; }
		
		.microNext, .microPrev, .microDivide
		{
		  width				: 50px; 
		  height			: 30px;
		  float				: right;
		  font-size			: 13px; 
		  text-align		: right;
		  text-decoration	: none;
		  display			: block;
		}
		
		.microNext a, .microPrev a, .microDivide a
		{
		  text-decoration	: none;
		  color				: black;
		}
		
		.microNext 	{  text-align:right;}
		.microDivide{  text-align:center; width:6px;}
		.microPrev  {  text-align:left;}
		
		.microDivide::before
		{  content			: "|" }
		
		
		.contributors table {
			width 				: 100%;
		}
		
		
		
		.contributors td {
			border-bottom		: 1px solid #ddd;
			vertical-align 		: top;
			padding				: 1px 5px 15px 0;
		}
		
		.contributors td:nth-child(1) {
			width				: 40%;
		}
		
		.separator {
			height				: 50px; 
			margin				: 30px 0 10px 0; 
		}
		
		.maple {
			background			: url('../Pictures/leaves.gif') no-repeat center;
		}
		
		.mini_flag {
		  width					: 16px; 
		  height				: 11px; 
		  margin-bottom			: 4px;
		}
		
		.tab_flag {
		  width					: 16px; 
		  height				: 11px;
		  margin-left			: 10px; 
		}
		
		#EmmaEssay .mininav {
		  visibility			: hidden;
		}
		
		
		/* 
		  SadWolf Germany styles 
		*/
		.sw-font-size-2 { font-size: 12px; }
		.sw-font-size-5 { font-size: 20px; }
		.sw-font-size-6 { font-size: 28px; }
		.sw-0-0-centre  { text-indent: 0  ; margin-top: 0;   text-align:center;}
		.sw-0-4-centre  { text-indent: 0  ; margin-top: 2pt; text-align:center;}
		
		#tabselector {
			margin				: 0 auto;
		}
		
		#tabselector_mobile {
			margin-top			: 40px;
			width				: 95%;
		}
		
		
		.art-main {
			position: relative;
			width: 100%;
			left: 0;
			top: 0;
			height: auto;
			padding-top: 0px;
		}
		
		.mobile_information {
		  position			: relative; 
		  top				: 10px;
		  min-height		: 400px; 
		  border			: 3px solid #8c9777;
		  border-radius		: 15px; 
		  padding			: 0 10px 10px 10px; 
		  background-color	: whitesmoke; 
		  margin			: 0 4px 0 4px;
		  overflow			: hidden;
		}
		
		
		.mobile_splash {
		  font-size			: 1.17em; 
		  font-weight		: bold;
		  margin			: 18px 0 20px 0;
		  width				: auto;
		  text-align		: center;
		}
		
		.mobile_title {
		  font-size			: 18px; 
		  font-weight		: 700;
		  margin			: 18px 0 20px 0;
		  width				: auto;
		  text-align		: left;		}
		
		.mobile_mini_cover {
			position		: absolute; 
			height			: 220px; 
			top				: 620px; 
			right			: 130px;}
		
		.mobile_content {
		  z-index				: 0; 
		  width					: 100%; 
		  height				: 92px; 
		  background-size		: cover;
		}
		
		.editions {
		  font-size			: small;
		  font-weight		: 400;
		  vertical-align	: super;
		}
		
		.art-Footer .mobile_footer_background {
		  width				: 460px; 
		  height			: 36px;
		  top				: 0px;
		  left				: 0px;
		}
		
		.art-Footer_mobile {
			height			: 3em;
			width			: calc(100% - 2px);
			text-align		: right;
			padding-top		: 4px;
			padding-right	: 10px;
			top				: 4px;
			left			: 0;
			margin			: 0;
			background-color: #568495;
		}
		
		.art-Footer_mobile:after {
			content			: '\00a9\0020 2021 Helen Hollick';
			font-size		: 14px;
			margin-right	: 0.5em;
			top				: calc(50% - 12px);
			position		: relative;
		}
		
		
		.Tag_Line {
			position: relative;
			background-color: whitesmoke;
			width: 98%;
			margin: 0 auto;
			margin-bottom: 0px;
			top: -30px;
			margin-bottom: 30px;
			font-size: 13px;
			text-align: center;
			border-top: 2px solid #291204;
			border-bottom: 2px solid #291204;
		}
		
		.nav [id^=drop] {
			display					: none;
		}
		
		
		.nav input[type=checkbox] + label::before {
			content					: '';
			position				: absolute;
			transform-origin		: 25% 50%;
			border					: 6px solid transparent;
			border-left-color		: #f6cf96;
			margin					: 10px 0 0 -12px;
			-webkit-transition 		: all .1s ease;  
			-moz-transition			: all .1s ease;  
			-o-transition			: all .1s ease;  
			transition				: all .1s ease; 
		}
		
		
		.nav .art-menu > li.MobileMenuItem:hover > input[type=checkbox] + label::before,
		.nav .art-menu ul input[type=checkbox] + label::before {
			content					: '';
			border-left-color		: #f6cf96;
			}
		
		.nav .art-menu > li.MobileMenuItem:hover > input[type=checkbox] + label::before,
		.nav .art-menu ul li:hover input[type=checkbox] + label::before,
		.question:hover::before {
			content					: '';
			border-left-color		: #291204;
			}
		
		
		.nav input[type=checkbox]:checked + label::before  {
			transform				: rotate(90deg);
			}
		
		
		.nav .art-menu {
			padding					: 1px 15px 1px 15px
			}
		
		
		.nav .art-menu,
		.nav .art-menu ul {
			margin					: 0;
			border					: 0;
			min-height				: 0;
			list-style-type			: none;
			display					: block
		}
		
		.nav .art-menu ul {
			visibility				: hidden;
			position				: unset;
			margin					: 1px;
			z-index					: 10;
			left					: 0;
			top						: 100%;
			background				: none;
			padding					: 0;
		}
		
		.nav .art-menu-separator {
			width					: 2px;
			height					: 29px;
			background-color		: white;
			pointer-events			: none;
		}
		
		.nav .art-menu li li {
			float					: none;
			}
		
		
		.nav .art-menu:after,
		.nav .art-menu ul:after {
			content					: "";
			height					: 0;
			display					: block;
			visibility				: hidden;
			overflow				: hidden;
			clear					: both
		}
		
		
		.nav .art-menu ul a {
			display					: block;
			text-align				: center;
			white-space				: nowrap;
			height					: 32px;
			width					: 15em;
			overflow				: hidden;
			line-height				: 32px;
			margin-right			: auto;
			background-color		: #291204;
			border-width			: 1px;
			border-style			: solid;
			border-left				: 0;
			border-color			: #f6cf96;
			}
		
		.nav .art-menu ul ul a {
			margin-left				: auto
			}
		
		.nav .art-menu ul a,
		.nav .art-menu ul a:link,
		.nav .art-menu ul a:visited,
		.nav .art-menu ul a:active {
			text-align				: left;
			text-indent				: 12px;
			text-decoration			: none;
			line-height				: 32px;
			color					: #f6cf96;
			font-size				: 16px;
			font-style				: normal;
			font-weight				: 400;
			margin					: 0 0 -2px 19px;
			}
		
		.nav .art-menu li > ul {
			display					: none;
			margin-left				: -19px;
			}
		
		
		
		.nav .art-menu a,
		.nav .art-menu a:link,
		.nav .art-menu a:visited  {
			text-align				: left;
			text-decoration			: none;
			outline					: none;
			letter-spacing			: normal;
			word-spacing			: normal;
			display					: block
			}
		
		.nav .art-menu li:hover,
		.nav .art-menu ul li:hover > a,
		.nav .art-menu ul li a:hover,
		.nav .art-menu ul li.MobileMenuDrop:hover,
		.question:hover {
			color					: #291204;
			background-color		: #f6cf96;
			border-color			: #291204;	
			}
		
		.nav .MobileMenuItem  {
			font-size				: 16px;
			font-style				: normal;
			font-weight				: 400;
			color					: #f6cf96;
			padding					: 0 17px;
			margin					: 0;
			line-height				: 30px !important;
			text-align				: center;
			letter-spacing			: normal;
			word-spacing			: normal;
			width					: 34px;
			height					: 29px;
			}
		
		
		.nav label  {
			display					: block;
			cursor					: pointer;
			padding-left			: 18px;
			}
		
		.nav .MobileMenuItem>label  {
			padding-left			: 4px;
			width					: 68px;
			margin-left				: -16px;	
			}
		
		
		.art-menu li {
			margin					: 0;
			padding					: 0;
			border					: 0;
			display					: block;
			float					: left;
			position				: relative;
			z-index					: 5;
			background				: none;
			}
		
		.nav .art-menu li.MobileMenuDrop {
			display					: block;
			text-align				: left;
			white-space				: nowrap;
			height					: auto;
			width					: 15em;
			overflow				: hidden;
			line-height				: 32px;
			margin-right			: auto;
			border-width			: 1px;
			border-style			: solid;
			border-color			: #f6cf96;
			color					: #f6cf96;
/*
			font-style				: italic;
			font-weight				: bold;
*/			
			background-color		: #291204;
			}


		.nav .art-menu li.MobileMenuDrop ul li a.MenuOverview::before {
			content: '';
			position: absolute;
			right: 0px;
			transform-origin: 25% 50%;
			border: 6px solid transparent;
			border-left-color: #f6cf96;
			margin: 10px 0 0 -12px;
			-webkit-transition: all .1s ease;
			-moz-transition: all .1s ease;
			-o-transition: all .1s ease;
			transition: all .1s ease;		
		}

		.nav .art-menu > li.MobileMenuItem:hover > input[type="checkbox"] + label::before, 
		.nav .art-menu ul li:hover input[type="checkbox"] + label::before, 
		.nav .art-menu li.MobileMenuDrop ul li:hover a.MenuOverview::before, 
		.question:hover::before {
			content: '';
			border-left-color: #291204;
		}
		
		.nav [id^=drop]:checked ~ ul,
		.nav [id^=drop]:checked ~ ul li  { 
			display					: block;
			visibility				: visible;
			}
		
		.nav .art-menu li.MobileMenuDrop ul li a.FlagUS::after   { 
			content 				: '';
			height 					: 11px;
			width 					: 16px;
			background-image 		: url('../Pictures/Flag_US.gif');
			position 				: relative;
			float 					: right;
			margin 					: 3px;
			}
		
		.nav .art-menu li.MobileMenuDrop ul li a.FlagUK::after   { 
			content 				: '';
			height 					: 11px;
			width 					: 16px;
			background-image 		: url('../Pictures/Flag_UK.gif');
			position 				: relative;
			float 					: right;
			margin 					: 3px;
			}
		
		.nav .float_right {
			float					: right;
		}	
		
		.dragon_flag {
			position				: absolute; 
			bottom					: -4px; 
			left					: 0px; 
			height					: 100px; 
			width					: 96px;
			}
		
		.brag_mobile {
			width					: 76px; 
			height					: 48px;
			background-image		: url('../Pictures/zzIndieBragLogo_s.png');
			}
		
		.wreath_mobile {
			width					: 48px; 
			height					: 48px; 
			background				: url('../Pictures/laurel-wreath-winner.gif');
			background-size			: 100% 100%; 
			border					: 2px solid #CCCCCC;
			padding					: 4px;
		}
		
		.chill_mobile {
		  width						: 56px; 
		  height					: 56px;
		  background				: url('../Pictures/Chill_Logo.png');
		  background-size			: 100% 100%;
		  }
		
		.chill_BotM_mobile {
		  width						: 100px; 
		  height					: 54px;
		  background				: url('../Pictures/BotM_Oct_2017.jpg');
		  background-size			: 100% 100%;
		  }
		
		
		.eds_choice {
			width					: 75px; 
			height					: 46px;
			background-image		: url('../Pictures/HNS_Eds_Choice.png');
			background-size			: 100% 100%;
		}
		
		
		.HNS_long_list {
			width					: 75px; 
			height					: 46px;
			background-image		: url('../Pictures/HNSIndieLonglisted2015.png');
			background-size			: 100% 100%;
		}
		
		
		/* --------------------------------------------------------------------------------------
		   The headers MUST come last in the cascade, so that any adjustments remain in force.
		   -------------------------------------------------------------------------------------- */   
		
		
		.header_404 {
		  background-image	: url('../Pictures/Banner-Unknown-Address.jpg'); 
		}  
		
		.header_seawitch {
			background-image: url('../Pictures/Banner-SW-Series.jpg'),
				linear-gradient(180deg, rgba(107, 130, 138, 1), rgba(103, 127, 134, 1)),
				linear-gradient(135deg, rgba(78, 92, 105, 1), rgba(30, 49, 63, 1)),
				linear-gradient(135deg, rgba(41, 81, 140, 1), rgba(41, 81, 140, 1));
			background-position: 
				center center;
			background-size: contain, 100% 84%, 100% 87%, cover;
			background-repeat: 
				no-repeat;
		}  
		
		.header_banner {
			background-image	: url('../Pictures/Banner-PB-Trilogy.jpg'),linear-gradient(180deg, rgba(63, 59, 50, 1), rgba(31, 33, 34, 1));
			background-position: center center;
			background-size: contain, cover;
			background-repeat: no-repeat;
		  
		}  
		
		.header_saxon {
			background-image	: url('../Pictures/Banner-Saxon-Series.jpg'),linear-gradient(135deg, rgba(49, 26, 70, 1), rgba(99, 78, 121, 1)); 
			background-position: center center;
			background-size: contain, cover;
			background-repeat: no-repeat;
		}  
		
		.header_diamond {
			background-image	: url('../Pictures/Banner-DtD-Volumes.jpg'),linear-gradient(135deg, rgba(181, 151, 87, 1), rgba(203, 210, 171, 1)); 
			background-position: center center, 0 0;
			background-size: contain, 100% 100%;
			background-repeat: no-repeat, repeat;
		}  
		
		.header_fact {
			background-image	: url('../Pictures/Banner-Non-Fiction.jpg'); 
		}  
		
		.header_mystery {
			background-image	: url('../Pictures/Banner-Mystery.jpg'),linear-gradient(140deg, rgba(1, 0, 0, 1), rgba(13, 5, 2, 1));
			background-position	: center center;
			background-size		: contain;
			background-repeat	: no-repeat;
			}
		
		#centraliser{
			padding				: 0 0 0 0;
			text-align			: justify
			}
		}



/* 	--------------------------------------------------------------------------------------
   	Use Tablet content
   	-------------------------------------------------------------------------------------- */ 

/*
@media only screen and (orientation: portrait) and (max-width: 400px), only screen and (orientation: landscape) and (max-height: 400px)
*/
@media only screen and (max-width: 400px) 
	{ 
		.precis { visibility	: hidden; }	
	}



/* 	--------------------------------------------------------------------------------------
   	Use Mobile phone content
   	-------------------------------------------------------------------------------------- */ 
/*
@media only screen and (orientation: portrait) and (max-width: 360px), only screen and (orientation: landscape) and (max-height: 360px)
*/

@media only screen and (max-width: 360px) 
	{ 
		.handheld { visibility	: hidden; }	
	}