/* _____________________________________________________________________
   
              SS-DN-100622.css ~ "Deux Nocturnes: Feu et Eau"
     XGB Web and Software Design ~ www.xgbdesign.com ~ rev. 2010.06.22
   _____________________________________________________________________
*/

/* All pages: ______________________________________________________________________ */

body {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;	/* Height specified locally */
	color: White;
	background-color: #0F2771;
	margin: 0;
}

div#masthead {
	position: absolute;
	top: 15px;
	left: 50%;
	width: 920px;
	margin-left: -460px;
}

div#masthead img {
	border: 0;
}

div#masthead h1 {
	position: absolute;
	top: 40px;
	left: 107px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 16pt;
	font-weight: normal;
	font-variant: small-caps;
	letter-spacing: 7px;
	color: #DC143C;
	background-color: transparent;
	margin-top: 15px;	
}

div#navpanel {
	position: absolute;
	top: 122px;
	left: 50%;
	width: 920px;	/* Height specified locally */
	margin-left: -460px;
	color: White;
	background-color: #0F2356;
}

div#navpanel span#nav-normal {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 920px;
	line-height: 1.5em;
	text-align: center;
}

div#navpanel span#nav-normal a {
	font-size: 8pt;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-variant: small-caps;
	text-decoration: none;
	color: #587AE9; 
	background-color: inherit; 
}

div#navpanel span#nav-normal a:hover {
	color: #FFF29E; 
	background-color: inherit; 
}

div#navpanel span#nav-normal span {
	color: #DC143C;
	background-color: inherit;
}
			
div#navpanel div#content {
	position: absolute;
	top: 28px;
	left: 28px;
	width: 892px;	/* Height specified locally */
	color: White;
	background-color: #113283;
}

div#content h1 {
	font-size: 15pt;
	font-weight: normal;
	font-variant: small-caps;
	letter-spacing: 2px;
	color: #FFF29E;
	margin-top: 35px;
	text-align: center;
}

div#content h2 {
	font-size: 13pt;
	font-weight: normal;
	font-variant: small-caps;
	letter-spacing: 1px;
	color: #FFF29E;
	margin-top: 35px;
	text-align: center;
}

div#content p {
	font-size: 9pt;
	color: #9FB5FF;
	background-color: inherit;
	text-align: justify;
	line-height: 1.3em;
	margin: 2.0em 30px 0 30px;
}

div#content p span {
	font-size: 11pt;
	font-variant: small-caps;
	color: #FFF29E;
	background-color: inherit;
}

div#content p span.emphatic {
	font-size: 9pt;
	font-weight: bold;
	font-variant: normal;
	font-style: italic;
}

div#content a {
	text-decoration: none;
	font-weight: bold;
	color: #DC143C; 
	background-color: inherit; 
}

div#content a:hover { 
	color: #FFF29E; 
	background-color: inherit; 
}

div#content img.imageL {
	float: left;
	margin: 27px 16px 10px 30px;
	border: 4px solid #1641AC;
}	
		
div#content img.imageR {
	float: right;
	margin: 27px 30px 10px 16px;
	border: 4px solid #1641AC;
}

/* Think of this as a highly abstracted interface
	class for the images descended from it:
*/
div#content img#nav-mapped {
	border: 4px solid #1641AC;
}

div#footer {
	position: absolute;
	left: 50%;	/* Top specified locally */
	width: 920px;
	margin-left: -460px;
	line-height: 2.0em;
	font-size: 7pt;
	font-style: italic;
	text-align: center;
	color: #93A8EC;
	background-color: inherit;
}

div#footer a { 
	text-decoration: none;
	font-weight: bold;
	color: #DC143C; 
	background-color: inherit; 
}


div#footer a:hover { 
	color: #FFF29E; 
	background-color: inherit; 
}


/* Home page: ______________________________________________________________________ */

div#content img#flipper {
	position: absolute;
	top: 10px;
	left: 16px;
	width: 631px;
	height: 390px;
	border: 0;
	/*color: white;*/              /* For testing */
	/*background-color: #0F2356;*/ /* For testing */
} 


/* "About" page: ___________________________________________________________________ */

div#content div#pullquote1,
div#content div#pullquote2,
div#content div#pullquote3,
div#content div#pullquote4,
div#content div#pullquote5 {
	color: White;
	background-color: inherit;
	border: solid #FFF29E;
	border-width: 5px 0 5px 0;
	font-family: Times New Roman, serif;
	font-size: 17pt;
	font-style: italic;
	line-height: 1.0em;
	padding: 0.7em 7px 0.7em 7px;
	text-align: left;
}

div#content div#pullquote1 { 
	float: left; 
	width: 340px; 
	margin: 12px 16px 15px 30px;
}

div#content div#pullquote2 { 
	float: right; 
	width: 350px; 
	margin: 28px 30px 15px 16px;
}

div#content div#pullquote3 { 
	float: left; 
	width: 340px; 
	margin: 28px 16px 15px 30px;
}

div#content div#pullquote4 { 
	float: right; 
	width: 350px; 
	margin: 28px 30px 15px 16px; 
}

div#content div#pullquote5 { 
	float: left; 
	width: 280px; 
	margin: 12px 16px 15px 30px;
}

div#content div#pullquote1 span.verseline { 
	display: block; 
	text-align: left; 
}

div#content div#pullquote1 span.stanza { 
	display: block; 
	margin-bottom: 0.7em; 
}	

div#content div#pullquote1 span.author {
	display: block;
	color: #FFF29E;
	background-color: inherit;
	font-size: 0.7em;
	line-height: 1.0em;
	margin-left: 20px;
}

div#content div#pullquote1 span.author span {
	text-decoration: underline;
}


/* "Portfolio" and "Odds'n'Ends" pages: ____________________________________________ */

div#content a.portfolio-item {
	font-size: 11pt;
	font-style: italic;
}

div#filler-xgb1 {
	width: 595px;
	height: 150px;
	margin: 1.0em 0 0 267px;
	color: white;
	background-color: #0F2771;
}


/* "Contact" page: _________________________________________________________________ */

div#content iframe {
	position: absolute;
	top: 85px;
	left: 20px;
	width: 400px;
	height: 300px;
	border: 2px solid #FFDF50;
}

div#content div#info {
	position: absolute;
	top: 85px;
	left: 445px;
	width: 422px;
	height: 300px;
}

div#content div#info h1 {
	font-variant: normal;
	letter-spacing: 0px;
	margin-top: 1.8em;
	color: #93A8EC;
	background-color: inherit;
}

div#content div#info a#e-mail {
	display: block;
	width: 300px;
	font-size: 15pt;
	font-weight: normal;
	font-variant: normal;
	margin: 0 61px 2.0em 61px;
	text-align: center;
}

div#content div#info a#view {
	font-size: 7pt;
	position: absolute;
	top: 294px;
	left: 0px;
}

div#content div#info p {
	margin: 1.2em 0 0 0;
}