* {
margin: 0;
padding: 0;
border: 0;
}

body {
text-align: center; /* ie5 center */
font: 97%/1.7 georgia, serif;
min-width: 800px;
background: #fff url(images/petals.jpg) no-repeat 100% 102%;
color: #666;
}

h1, h2, h3 {
color: #a00;
font-family: "times new roman", serif;
font-style: italic;
}

p	{
margin: 15px 0;
padding: 0 40px 0 30px;
}

dl {margin: 15px 50px 15px 70px; font-size: 95%;}
dt {margin: 8px 20px 2px 0px;}
dd {margin: 0 0 10px 17px;}

blockquote {margin: 10px 50px 10px 80px; padding: 15px; border-left: 1px solid #f2f2f2; zoom:1;}
blockquote p {margin: 10px 0; padding: 0;}

a {
color: #080;
text-decoration: none;
border-width: 1px 0;
border-style: solid;
border-color: #fff #fff #ccc;
position: relative; /* this for Opera as links under right logo weren't clickable */
z-index: 50;
}

a:hover {
color: #060;
border-color: #ccc #fff #060;
background: #eee;
}

a.aimg {
border: 0;
background: #fff url(images/shadow.gif) no-repeat 100% 100%; 
display: block;
position: relative;
z-index: 100;
margin: 5px;
padding: 5px;
}

a.aimg img, a.logimg img {
background-color: #fff;
border: 1px solid #a9a9a9;
display: block;
margin: -8px 0px 0px -8px;
padding: 4px;
position: relative;
} 


a.logimg {
border: 0;
background: #fff url(images/shadow.gif) no-repeat 100% 100%; 
display: block;
position: relative;
z-index: 100;
padding: 5px;
margin: 5px 0 10px 50px;
display: inline;
float: left;
}

#showarticle a.logimg {
margin: 5px 0 10px 80px;
}

pre	{
margin: 0 60px 0 60px;
background: #fafafa;
color: #000;
border: 1px solid #070;
padding: 20px;
font-family: "Courier New", monospace;
font-size: 90%;
}

code	{
font-weight: bold; 
color: #070; 
background: transparent;
font-family: "Courier New", monospace;
/* specifying a font-family removes NN's font-size inheritance problem */
}

abbr, acronym	{
border-bottom: 1px dotted #ccc;
cursor: help;
}

iframe {border: 0; padding: 0;}

.center	{text-align: center;}
.left	 	{text-align: left;}
.right	{text-align: right;}
.justify	{text-align: justify;}
.amend      {text-decoration: line-through;}
.fr         {float: right; display: inline;}
.fl         {float: left; display: inline;}

span.noframe {position: absolute; left: -9999px;}

/********************* wrapper for centering and added design layer ****************/


#wrapper {
 position: relative;
 width: 800px; 
 margin: 0 auto; /* compliant center */
 text-align:left; /* override ie 5 center */
 background: transparent url(images/faded1.jpg) repeat-y -420px 0;
}

/************************** masthead top logo and links *****************************/

#masthead	{
 position: relative; /* absolute positioning did something weird in IE so this way worked better */
 margin-bottom: -385px; 
 z-index: 1;
 top: 0;
 left: 0;
 width: 798px;
 height: 385px;
 background: transparent url(images/css-canopy1.gif) no-repeat 80px 10px; 
}

#masthead p {
position: absolute;
z-index: 50;
top: 40px;
right: 0;
width: 320px;
height: 325px; 
margin:0; 
padding: 0;
background: transparent url(images/lady-rose.jpg) no-repeat 0px 0px;
}

#widemain #masthead p, #demopage #masthead p {
width: 180px;
background: transparent url(images/lady-rose-bw.jpg) no-repeat 0px 0px;
}

#masthead p span {display: none;}

#masthead p a  {
display: block;
height: 325px;
width: 320px;
margin: 0;
border: 0;
background: transparent;
}

#masthead p a img {
display: block;
margin: 0;
width: 320px;
height: 325px;
}

#widemain #masthead p a, #demopage #masthead p a,
#widemain #masthead p a img, #demopage #masthead p a img {
width: 180px;
background: transparent url(images/lady-rose-bw-red.jpg) no-repeat 0px 326px;
}

#widemain #masthead p a:hover, #demopage #masthead p a:hover,
#widemain #masthead p a:hover img, #demopage #masthead p a:hover img  {
width: 180px;
background: #fff url(images/lady-rose-bw-red.jpg) no-repeat 0px 0px;
}

/****************************** content wrapper can be different widths **********************/
#content {
 font-size: 0.8em;
 float: left;
 display: inline;
 width: 470px; /* for index pages */
 margin: 90px 0 0 0;
 border-right: 1px solid #ddd;
}

#widemain #content {
width: 580px;
}

#demopage #content {
width: 765px;
background: transparent;
}

#content h1 {
text-align: right;
padding: 0 30px 0 40px;
font-size: 1.8em;
font-style: normal;
background: transparent url(images/h2bgr.gif) no-repeat 100% 50%;
border: 0;
margin: 20px -20px 0 6px;
position: relative;
z-index: 500;
}

#content h1 span {
background: url(images/h2bgl.gif) no-repeat 0px 50%;
padding-left: 30px;
}

#content h2, #content h3 {
font-size: 1.2em;
margin: 20px 0 0 6px;
font-variant: small-caps;
font-style: normal;
border-bottom: 1px solid #f1f1f1;
background: url(images/h2bgl.gif) no-repeat 10px 50%;
padding-left: 40px;
position: relative;
z-index: 500;
}

#demopage #content h1, #demopage #content h2 {
margin-right: 160px;
}

#content p {margin: 10px 0px 10px 20px;}

#content ul {
padding: 0; 
margin: 10px 40px 10px 70px;
line-height: 1.8;
list-style: square;
}

#content ul ul {
margin: 5px 40px 5px 20px;
list-style: disc;
}

/**************************** sidebar different widths depending on content div **********/
#sidebar {
padding: 390px 0 0 0;
margin: 0 0 0 470px; 
font-size: 0.8em;
font-family: helvetica, verdana, arial, sans-serif;
}

#widemain #sidebar {
padding: 360px 0 10px 0;
margin: 0 0 0 580px; 
}

#demopage #sidebar {
margin: 0 0 0 770px; 
/* visibility: hidden; */
display:  none;
padding: 360px 0 10px 0;
}

#sidebar h3 {
margin-bottom: 0;
font-size: 1.6em;
}

#sidebar ul {
padding: 0; 
margin: 10px 20px;
line-height: 1.7;
list-style: square;
}

#latestcomments p {
font-size: 90%;
}

		
#linkmenu, #latestcomments {
padding: 1px;
border-left: 1px solid #ddd;
padding-left: 30px;
}

#widemain #linkmenu, #widemain #latestcomments {padding-left: 10px; }

#linkmenu ul {list-style: none; margin-top: 0; font-family: georgia, serif;}
#linkmenu ul li span {display: none;}
#linkmenu ul li {width: 90%;}

#linkmenu a {
background: #fff url(images/bullets.gif) no-repeat;
padding-left: 30px;
height: 24px;
display: block;
border-width: 1px 0 1px 1px;
border-style: solid;
border-color: #fff #fff #ccc #ddd;
}

#linkmenu a:hover {}

#index #linkmenu a {background-position: 210px 50%;}
#widemain #linkmenu a {background-position: 130px 50%;}


.ff {margin: 10px auto;}

.ff a img {
background-color: #fff;
border: 1px solid #a9a9a9;
display: block;
margin: -8px 0px 0px -8px;
padding: 4px;
position: relative;
} 

.ff a {
border: 0;
background: #fff url(images/shadow.gif) no-repeat 100% 100%; 
display: block;
width: 127px;
position: relative;
z-index: 100;
padding: 5px;
margin: 5px auto 10px auto;
}

.sb a {
width: 122px;
}

/************   index page menu control ***********************************/
#index.m13 a#m13, 
#index.m09 a#m09, #index.m10 a#m10, #index.m11 a#m11, #index.m12 a#m12, 
#index.m05 a#m05, #index.m06 a#m06, #index.m07 a#m07, #index.m08 a#m08,
#index.m01 a#m01, #index.m02 a#m02, #index.m03 a#m03, #index.m04 a#m04,
#index #linkmenu a:hover  {
					background-position: -114px 50%;
					padding-left: 20px;
					background-color: #eee;
					border-color: #eee #fff #060 #ddd;
				  	}

/************* widemain pages menu control ***********************************/

#widemain.m50 a#m50, #widemain.m13 a#m13,
#widemain.m09 a#m09, #widemain.m10 a#m10, #widemain.m11 a#m11, #widemain.m12 a#m12,
#widemain.m05 a#m05, #widemain.m06 a#m06, #widemain.m07 a#m07, #widemain.m08 a#m08, 
#widemain.m01 a#m01, #widemain.m02 a#m02, #widemain.m03 a#m03, #widemain.m04 a#m04,
#widemain #linkmenu a:hover {
					background-position: -194px 50%;
					padding-left: 20px;
					background-color: #eee;
					border-color: #eee #fff #060 #ddd;
}


/******************** footer details ******************************************/

#index #footer {padding-top: 200px;}
#widemain #footer {padding-top: 220px;}
#demopage #footer {padding-top: 240px;}

#footer {
clear: both;
width: 100%;
background: transparent;
font-size: 0.7em;
}

#footer p {margin: 5px 0 5px 40px; padding: 0;}

.gooads {
margin: 1px 30px;
/* clear: both; */
}

.gooads-inline {
margin: 1px 0 1px 80px;
}

.gban {
height: 60px;
margin: 1px 30px 1px 110px;
}

/************************** home page and archived post styles **************************************/
/* post date */
#content p.bdate {
font-size: 0.9em;
color: #aaa;
background: transparent;
font-style: italic;
text-align: right;
margin: 0 5px 0 0;
padding: 2px 0;
}

/* muse links */
#content p.blink {
font-size: 0.9em;
font-style: italic;
text-align: right;
padding-bottom: 10px;
border-bottom: 1px solid #f1f1f1;
clear: left;
}

#content p.blink a, #archives dl dd a {text-decoration: none;}

#content p.blink a.plink, #archives dl dd a.plink {
font-size: 1.2em;
font-weight: bold;
font-style: normal;
}

/*****  archives page lists  **********/
#archives dl {}
#archives dl dt {font-weight: bold; margin-bottom: 6px;}
#archives dl dd.archlink {text-align: right; font-size: 95%;}
#archives p.foot {
border-top: 1px dotted #ccc; 
border-bottom: 1px dotted #ccc; 
text-align: center; 
background: #f1f1f1;
margin: 0 0 0 30px;
}

/****************    screenshots    ************************/
.sshotl {margin: 0px 20px 10px 40px; display: inline; float: left; position: relative;}
.sshotr {margin: 0px 0px 10px 20px; display: inline; float: right; position: relative;}

/****************    articles and comments pages and forms    **************************/
#showarticle {margin :0; padding: 0;}

#showarticle p.bend {
text-align: right;
padding-bottom: 10px;
border-bottom: 1px solid #f1f1f1;
margin: 0;
clear: both;
}

p iframe {
margin: 0 0 0 30px;  padding: 5px; border: 1px solid #ccc;
}

#showarticle p iframe {margin: 0 0 0 80px;}

.commentblock {
margin: 10px 30px 20px 50px; padding: 0 20px;
background: #fff url(images/shadow.gif) no-repeat 100% 100%;
}

.commentblock p {margin: 15px 0; padding: 0;}

html>body .commentblock p {width: auto;}

.commentblock .comno {
width: 32px; height: 30px;
line-height: 23px;
text-align: center;
float: left;
display: inline;
background: #fff url(images/shadow.gif) no-repeat 100% 100%;
color: #8a8;
font-weight: bold;
font-size: 130%;
margin: 0px 8px 5px 0px; padding: 0;
border-width: 1px; border-style: solid; border-color: #ccc #060 #060 #ccc;
}

.commentblock p.blink {clear: both;}

#showarticle table {margin-left: 2em;}
#showarticle table td {text-align: center;}

/************************     forms    ********************************/
#contactform  {width: 90%; margin: 20px 0 20px 50px; padding: 0; position: relative; z-index: 150;}

fieldset	{
margin: 0 30px 0 50px; padding: 1em 2em;
border-width: 1px; border-style: dotted; border-color: #ccc;
text-align: left;
background: #fbfbfb;
position: relative;
}

* html fieldset {padding-top: 0;}

textarea {font-size: 100%;}
#showarticle label.textarea {height: 215px;}
#contactform label.textarea {height: 315px;}

legend	{
border-width: 1px; border-style: solid; border-color: #ccc; 
padding: 0 0.5em;
background: #fff; color: #000;
font-family: "Courier New", monospace;
line-height: 1.5em;
position: relative;
top: -0.75em;
}

label {
display: block;
padding: 0; margin: 10px 0 0 0;
float: left;
display: inline;
width: 100%;
position: relative;
}

label:hover {background: #f3f3f3;}

label input, label textarea	{
background: #fff url(images/shadow.gif) no-repeat 100% 100%;
font-family: "Courier New", monospace;
width: 70%;
position: absolute;
right: 0;
padding: 0 5px 5px 0;
border-width: 1px 0 0 1px; border-style: solid; border-color: #ddd;
}

#searchform fieldset {
/*
background: #fff url(search/logo.jpg) no-repeat 100% 100%;
padding-bottom: 30px;
*/
}

#searchform label {
width: 70%;
margin: 0 0 0 10px;
}

#searchform label input {height: 23px; position: static; width: 100%; padding: 3px 0;}
#searchform input.submit {position: static; width: 20%; float: none; margin-left: 10px; padding-bottom: 5px;}
#searchform input.submit:hover {
color: #060;
border-color: #ccc #fff #060;
background: #eee;
}

#results dt {
margin: 0 -25px;
padding-left: 20px;
background: #fff url(search/external.gif) no-repeat 0% 50%;
}

#results dt a {padding: 0 10px; display: inline-block;}
#results dt a {display: block;}

#showarticle label input, #showarticle label textarea {width: 60%;}

#showarticle label textarea {height: 200px;}
#contactform label textarea {height: 300px;}

fieldset h3 {font-style: normal; font-variant: small-caps;}
fieldset p { margin: 0; padding: 0;}
fieldset p span {}
fieldset p.error {clear: both; color: #f00; background: transparent; text-align: center;}

input.submit	{
height: 25px;
vertical-align: middle;
background: #fff;
border-width: 1px; border-style: solid; border-color: #ddd #aaa #aaa #ddd;
width: 70%;
float: right; 
display: inline;
margin: 0 3px 0 0;
}

#showarticle input.submit {
margin: 0 0 0 3px;
width: 20%;
}

#showarticle input#rememberme, #showarticle input#forgetme {
display: inline;
margin: 0 8px 0 0; 
width: 12px;
border-width: 0px;
}


/************************ borderrelated demo pages *********************************/

#demospace {
float: right; display: inline;
width: 180px; height: 180px;
background: transparent;
}

div#borderrelated, div.shadow {
margin: 0 30px 10px 50px; padding: 0 5px 5px 0; background: #fff url(images/shadow.gif) no-repeat 100% 100%; 
height: 1%;
}

div#borderrelated div, div.shadow div {
margin: 0; padding: 10px 0;
border-width: 1px 0 0 1px; border-style: solid; border-color: #ccc;
}

div#borderrelated span.new {color: #a00;}

#content p.borderindex {
text-align: center;
line-height: 2em;
border: 1px solid #ddd; 
border-width: 1px 0;
margin: 15px 0px 15px 30px; 
padding: 0;
background: #fafafa;
}

#content p.borderindex span {padding: 0 10px;}