body{
background-color:#000000;
background-image: url(spyrowebimg/xzy_spyropage_bg_02_l.gif), url(spyrowebimg/xzy_spyropage_bg_02_r.gif);
background-repeat: repeat-y, repeat-y;
background-position: top left, top right;
margin:0;
padding:0;
height:100%;
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
color:#ffffff;
cursor:url(spyrographics/xzyolotl_spyro_cursor_sparx_a.png) 0 0, auto;
}

body::-webkit-scrollbar {
	width:8px;
}

body::-webkit-scrollbar-track {
	background:#000000;
}

body::-webkit-scrollbar-thumb {
	background:#505050;
}

body::-webkit-scrollbar-thumb:hover {
	background:#7c7c7c;
}

img {
max-width:100%;
height:auto;
}

h1 {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
letter-spacing:5px;
font-size:22px;
color:#b0753b;
text-shadow: 1px 1px 0px #663300;
}
h2 {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
letter-spacing:3px;
font-size:14px;
color:#b0753b;
text-shadow: 1px 1px 0px #663300;
}
h3 {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
letter-spacing:2px;
font-size:20px;
color:#b0753b;
text-shadow: 1px 1px 0px #663300;
}
h4 {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
letter-spacing:2px;
line-height: 100%;
font-size:26px;
color:#b0753b;
text-shadow: 1px 1px 0px #663300;
}

.title {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
letter-spacing:2px;
font-size:22px;
color:#b0753b;
text-shadow: 1px 1px 0px #663300;
}

p {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
letter-spacing:2px;
line-height: 140%;
font-size:15px;
color:#000000;
}

a {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
letter-spacing:2px;
font-size:15px;
}
a:link {color:#b0753b;
text-shadow: 1px 1px 0px #663300;}    
a:visited {color:#b0753b;
text-shadow: 1px 1px 0px #663300;}  
a:hover {color:#b0753b;
text-shadow: 1px 1px 0px #663300;
cursor:url(spyrographics/xzyolotl_spyro_cursor_sparx_b.png) 0 0, pointer;}  
a:active {color:#b0753b;
text-shadow: 1px 1px 0px #663300;} 
a:link {text-decoration:none;
text-shadow: 1px 1px 0px #663300;}
a:visited {text-decoration:none;
text-shadow: 1px 1px 0px #663300;}
a:hover {text-decoration:underline;
text-shadow: 1px 1px 0px #663300;}
a:active {text-decoration:none;
text-shadow: 1px 1px 0px #663300;}

.navtext {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
text-align:left;
letter-spacing:3px;
font-size:16px;
color:#b0753b;
text-shadow: 1px 1px 0px #663300;
}

.navsub {
font-family: Georgia, "Liberation Serif", "Times New Roman", "Nimbus Roman", FreeSerif, "DejaVu Serif", "Courier New", Courier, FreeMono, monofur, Director, "Nimbus Mono PS", "Noto Sans Mono", monospace;
text-align:left;
letter-spacing:3px;
font-size:12px;
color:#b0753b;
text-shadow: 1px 1px 0px #663300;
}


#main{
    width:800px; 
	min-height:800px;
    margin:0 auto;
	z-index:-1;
	text-align:left;
}

#mainbg{
	background-color:#000000;
	background-image: url(spyrowebimg/xzy_spyropage_bg_book_left.gif), url(spyrowebimg/xzy_spyropage_bg_book_right.gif), url(spyrowebimg/xzy_spyropage_bg_book_center.gif);
	background-repeat: repeat-y, repeat-y, repeat;
	background-position: top left, top right, top right;
    width:900px; 
	min-height:800px;
    margin:0 auto;
	z-index:-1;
	text-align:left;
}

#header{
width:800px;
height:auto;
position:absolute;
top:0px;
margin:0 auto;
margin-bottom:10px;
text-align:center;
}

#side{
	width: 245px;
	height:600px;
	margin-bottom:-600px;
	z-index:9;
	padding: 4px 4px;
	position:relative;
	top:130px;
	left:5px;
	text-align:center;
}

#side2{
	width: 245px;
	height:600px;
	margin-bottom:-600px;
	z-index:9;
	padding: 4px 4px;
	position:relative;
	top:60px;
	left:5px;
	text-align:center;
}

#sidebutton{
	width: 225px;
	height:auto;
	margin:0 auto;
	margin-top:-15px;
	margin-bottom:-15px;
	text-align:center;
}

#content1{
	width: 512px;
	min-height:700px;
	padding: 10px 10px;
	position:relative;
	top:110px;
	left:260px;
	text-align:center;
}

#content2{
	width: 512px;
	min-height:700px;
	padding: 10px 10px;
	position:relative;
	top:40px;
	left:260px;
	text-align:center;
}

#warn{
	width: 512px;
	height:auto;
	padding-top:5px;
	padding-bottom:5px;
	margin:0 auto;
	margin-bottom:-10px;
	text-align:center;
}
#warn2{
	width: 475px;
	height:auto;
	padding-top:5px;
	padding-bottom:5px;
	margin:0 auto;
	margin-bottom:-10px;
	text-align:center;
}

#screenwarn{
text-align:center;
width: 512px;
height: auto;
margin:0 auto;
text-align:center;
-webkit-filter: blur(25px);
filter: blur(25px);
}
#screenwarn:hover{
animation-name: warnblur;
-webkit-animation-name: warnblur;
animation-duration: 3s;
-webkit-animation-duration: 3s;
animation-timing-function: ease;
-webkit-animation-timing-function: ease;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
}

@keyframes warnblur {
	0% {-webkit-filter: blur(25px);filter: blur(25px);}
	100% {-webkit-filter: blur(0px);filter: blur(0px);}
}

#imagewarn{
text-align:center;
width: 512px;
height: auto;
margin:0 auto;
text-align:left;
-webkit-filter: blur(25px);
filter: blur(25px);
}
#imagewarn:hover{
animation-name: warnblur;
-webkit-animation-name: warnblur;
animation-duration: 3s;
-webkit-animation-duration: 3s;
animation-timing-function: ease;
-webkit-animation-timing-function: ease;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
}

#entry{
	width: 512px;
	height:auto;
	margin:0 auto;
	margin-bottom:-20px;
	text-align:left;
}
#entrytitle{
	width: 512px;
	height:auto;
	margin:0 auto;
	margin-top:-10px;
	margin-bottom:-10px;
	text-align:left;
}

#footer{
	width: 650px;
	height: auto;
	text-align:center;
	margin: 0 auto;
	padding:2px;
}

#footertxt{
	width: 100%;
	height: auto;
	text-align:center;
	position:relative;
	bottom:0px;
	padding:2px;
}

#gnorc{
background-image: url(spyroimages/spyro1/spyro_1_foes_peacekeepers_01b.gif);
background-repeat: no-repeat;
background-position: top center;
width:64px;
height:64px;
position:relative;
left:0px;
}
#gnorc:hover{
background-image: url(spyroimages/spyro1/spyro_1_foes_peacekeepers_01.gif);
background-repeat: no-repeat;
background-position: top center;
width:64px;
height:64px;
position:relative;
left:0px;
}

ul{
list-style-type:none;
margin:0;
padding:0;
}
li{
display:inline;
font-weight:bold;
color:#ededed;
background-color:#000000;
border: 2px solid #620000;
text-align:center;
margin-left: 2px;
margin-right: 2px;
padding:5px;
text-decoration:none;
box-shadow: 5px 8px 10px #000000;
}
li:hover {
	color:#58d300;
	position:relative;
	left:1px;
	top:1px;
	box-shadow: 0px 0px 15px #620000;
}