/* Main CSS file for LindaMcGinnis.com
 * Original HTML5 version:  12-Jul-2013
 * Copyright 2013 by Linda McGinnis and Frank Kibbisj, Jr. */

/* color palette; */
/*	Container Background		F8E6D2	Light yellow
 * 	Body Text					40501E	Very Dark green
 * 	Header Title				9D601A	Dark Brown
 *	Container/Footer border		506326	Dark green
 *  Ouvre border				800080	Web Safe Purple
 *  Series border				D593D5	Light Purple
 *  Small paragraph text		506326	Dark green
 *	H1 headers					929E2B	Medium green
 * 	H2 headers					DC9848	Medium Orange
 *	sourceNotes					505050	Dark gray
 *	Footer text					ABABAB	Medium Gray
 *	Links & Visited Links		D28328	Burnt Orange
 
 * 	H3 headers					7070D9	Medium-Light Blue
 * 	H5 headers					6D4D15	Dark Brown
 *	H4 headers					DC9848	Medium Orange
 *	H4 Title					9D601A	Medium Brown
 * 	H6 headers					800080	Websafe Purple
 * 	Title div text				FFFF00	Websafe Yellow
 *	Title (Page)				9D601A	Medium Brown
 *		was 6666FF	Websafe med blue
 *	Visited text				ABABAB	Medium Gray
 *	Nav text					FFFF00	Websafe Yellow
 *	Nav Hover text				FFFF00	Websafe Yellow
 *	Nav button hover background	ADC2D5	Pale Blue
 * 	Nav button link text		ABABAB	Medium Gray
 * 	Nav button left border		6666FF	Websafe med blue
 *	Nav button right border		000099	Websafe dark blue
 * 	Nav background				3333CC	Websafe Blue(was EBEBEB	Very Light Gray)
 *	Color on Linda's shirt		2362A4	Blue
		(old home page photo)
 */

html {
	height:100%;
}

body {
	font-family: Verdana, Arial, sans-serif;
	font-size: 0.9em;
	color: #40501E;	/* Very dark green for body text */
	width: auto;
	height: auto%;
	min-height: 100%;
	min-width: 1080px;
	margin:0px;
	padding:0px;
	background: #F8E6D2; 		/* very pale brown for body background */
	/* border: 1px solid red;	/* for css debugging */
	overflow: auto; /*-- "hidden" will remove the scrollbar on the page! */
}

/* HTML 5 element definitions */
/* Tell the browser to render HTML 5 elements as block */
header, footer, section, figure, aside, nav, article {  
    display: block;  
}

/* id (#) list */
#header {
	float: left;
	/* padding: 23px; */
	/* max-width: 90%; */
	min-height: 100%;
	padding: 12px 7px 11px 20px;
	/* border: 1px solid red;	/* red border for css debugging */
}

#footer {
	clear: both;
	float: left;
	width: 75%;
	font: 0.8em verdana;
	line-height: 1.5em;
	font-style: italic;
	color: #ABABAB;		/* Medium Gray */
	margin-top: 20px;
	margin-bottom: 10px;
	padding-left: 30px;
	background: 
	/* border: 1px solid #000033;	/* very dark blue for css debugging */
}

#container {
	clear: both;
	/* max-width: 90%; */
    width:75%;
	min-width: 1000px;
	height: 100%;
	min-height: 100%;
	/* min-width: 1070px; */
	border: 1px solid #506326;	/* dark green border for outer container */
	margin-top:7px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom: 7px;
	padding:7px 0 0 0;
	display:block;
	overflow:hidden;
	background: #fff;
    background-repeat:repeat;
	background: -moz-linear-gradient(top,  rgba(199,216,195,1) 3%, rgba(199,216,195,0.73) 47%, rgba(248,250,248,0.45) 91%, rgba(255,255,255,0.45) 97%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,rgba(199,216,195,1)), color-stop(47%,rgba(199,216,195,0.73)), color-stop(91%,rgba(248,250,248,0.45)), color-stop(97%,rgba(255,255,255,0.45))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(199,216,195,1) 3%,rgba(199,216,195,0.73) 47%,rgba(248,250,248,0.45) 91%,rgba(255,255,255,0.45) 97%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(199,216,195,1) 3%,rgba(199,216,195,0.73) 47%,rgba(248,250,248,0.45) 91%,rgba(255,255,255,0.45) 97%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(199,216,195,1) 3%,rgba(199,216,195,0.73) 47%,rgba(248,250,248,0.45) 91%,rgba(255,255,255,0.45) 97%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(199,216,195,1) 3%,rgba(199,216,195,0.73) 47%,rgba(248,250,248,0.45) 91%,rgba(255,255,255,0.45) 97%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c7d8c3', endColorstr='#73ffffff',GradientType=0 ); /* IE6-9 */
}

#content {		/* panel for page text */
	position: relative;
	float: left;
	font-size: 0.95em;
	line-height: 1.72em;
	min-height: 100%;
	/* width: auto; */
	margin-top: 13px;
	padding-left: 20px;
	/* border: 1px solid orange;  /* for css debugging */
}

#contentWide {		/* panel for wide page text */
	clear: both;
	float: left;
	font-size: 0.95em;
	line-height: 1.72em;
	min-height: 100%;
	width: 98%;
	min-width: 800px;
	margin-top: 7px;
	/* background-color: #FFF; */
	border-radius:20px;
	padding: 0 20px 0 20px;
	border: none;
}

#contentCentered {	/* centered content -- used on the Photographs page(s) for the tables of photos */
	clear: both;
	width: auto;
	height:auto;
	min-height: 100%;
	margin-left: 200px;
	margin-right: 200px;
	line-height: 1em;
	text-align: center;
}

#contentLeft {		/* used when there's text on the left and photo on the right in a "content" or "contentWide" div */
	float: left;
	width: 70%;
	height: auto;
	border: none;
}

#sourceNotes {		/* comments at the bottom of the page about the content -- for example, that the book is part of a series, etc. */
	float: left;
	font-size: 0.85em;
	line-height: 1.7em;
	min-height: 100%;
	font-style: italic;
	color: #505050;		/* 505050 Very gray */
	/* width: auto; */
	margin-top: 8px;
	padding-left: 20px;
	border: none;
}

#synopsis {
	float: left;
	width: auto;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 11px;
}

#title {
	/* clear: left; */
	float: left;
	/* overflow: hidden;*/
	width: auto;
	height: auto;
	margin: 4px 0 0 0;
	padding: 0;
	font: italic bold 4em georgia;
    letter-spacing: 1px;
	color: #9D601A;		/* Medium Brown, was #6666FF; websafe med blue */
	/* border: 1px solid purple;	*/
}
	
#page-title {					/* page title text */
    clear: both;
	float: left;
	overflow: hidden; 	/* Fixes "Float" problems... see http://www.quirksmode.org/css/clearing.html */
	width: auto;
	height: auto;			
	font: italic bold 2em georgia;
    /* letter-spacing: 1px; &/
	padding-left: 7px;
	padding-right: 7px;
	/* background-color: #000; */
	color: yellow;
 }

#pageImg {
	float: right;
	border: 2px solid brown;
	background: none;
}

#spacer {		/* blank div between book divs (yeah, it's cheezy, but it works) */
	clear: both;
	float: left;
	width: 100%;
	height: 27px;
	min-height: 100%;
	/* border: 1px dashed gray; */
}

#spacerClrLft {		/* blank div which holds a transparent gif.  Used to clear the left side and provide space (yeah, it's cheezy, but it works) */
	clear: left;
	float: left;
	width: auto;
	height: auto;
	/* border: 1px dashed gray; */
}

#blog {		/* container for embedded blog */
	width: auto;
	height: auto;
	min-height: 100%;
	border: 0;
}

#blogframe {
	clear:both;
}

/* article {
	float: left;
	width: auto;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 11px;
} */

/* generic HTML tag definitions (p, h1...h6) */
p {		/* generic paragraph definition */
	clear: left; */
	float: left; */
	padding: 0 7px 0 2px;
	margin-right: 10px;
}

h1 {
	/* clear: both; */
	float: left;
	font: 3em bold georgia;
	margin-top: 0px;
	margin-bottom: 5px;
	padding: 0;
	color: #929E2B;		/* Medium Green, was 6A90B9 med blue gray */	
	font-weight: bold;
	border: none;
	}

h2 {
	clear: both;
	float: left;
	font: 2.5em bold Helvetica;
	color: #DC9848;		/* Medium Orange, was ABABAB; Gray */
	font-weight: bold;
	margin: 0;
	padding: 0;
	border: none;
}
	
h3 {
	clear: both;
	float: left;
	font: 2em bold Helvetica;
	color: #7070D9;  /* was blue; */
	font-weight: bold;
	margin-left: 6px;
	padding: 0;
}

h4 {
	clear: left;
	float:left;
	font: 1.5em bold Helvetica;
	color: #DC9848;		/* Medium Orange */
	font-weight: bold;
	margin: 0;
	padding: 8px 0 0 0;
}

h4.Title {				/* used on the page title */
	font: 1.5em bold Helvetica;
	color: #9D601A;		/* 9D601A Medium brown */
	font-weight: bold;
	width: 450px;
	text-align: center;
	margin: 0px 0px 6px 65px;
	padding: 0;
}


h5 {
	clear: both;
	font: 1em bold Helvetica;
	color: #6D4D15;		/* Dark brown */
	font-weight: bold;
	margin: 0;
	padding: 0;
	/* border: 1px dashed pink; */
}

h6 {
	font: 0.8em verdana;
	font-style: italic;
	color: #800080;		/* websafe purple */
	margin: 0;
	padding: 0;
}



/* class (.) list */
.featureClass {
	clear: left;
	float: left;
	width: 90%;
	height: 150px;
	display: table-cell;
	vertical-align: middle;
}

p.midVertical {
	padding-left: 100px;
}

.hr {	/* style class for hr */
	clear: both;
	width: 50%;
	height: 2px;
	color: #FFF;
	background: #FFF;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
}

.oeuvre {		/* collected works section */
	float: left;
	width: 98%;
	height: auto;
	margin: 0;
	padding: 0;
	/* margin-left: 5%; */
	border: 1px solid purple;	/* border for css debugging */
}

img.left {		/* left-justified image */
	clear: left;
	float: left;
	display: inline-block;
	margin: 0px 8px 0px 65px;
	padding: 0;
}

img.center {		/* centered image */
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: auto 0;	
}

img.floatLeft {
	float: left;
	display: inline-block;
	width: auto;
	margin: 8px 8px 2px 75px;
	border: 2px solid black;
	}

audio {
	clear: left;
	float: left;
	margin: 8px;
}

.bookImg {		/* div for controlling the placement of the book cover art on the oeuvre page */
	clear: left;
	float: left;
	width: auto;
	max-width: 200px;
	margin: 6px 6px 3px 6px;
	height: auto;
	/* border: 1px dashed yellow; */
}

.bookImge2 {
	clear: left;
	float: left;
	width: auto;
	min-width: 50px;
	max-width: 100%;
	padding-right: 7px;
}

.book {			/* book overview (within oeuvre) */
	clear: both;
	float: left;
	width: 100%;
	height: auto;
	/* border: 1px solid red; */
}

.series {		/* container for a series of books (Aug 2014) */
	border: 3px solid #D593D5;
}

.rightText {		/* text on the right-hand side of the screen */
	float: left;
	width: 76%;
	height: auto;
	/* border: 1px dashed green; */
}

.backCover {		/* div for the back cover text on the oeuvre page */
	float: left;
	width: 100%;
	/* min-width: 300px; */	
	height: auto;
	padding-left: 17px;
	/* border: 1px dashed blue; */
}

p.desc {		/* div for descriptive text, as on the individual book pages */
	float: left;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
}

p.small {
	font-family: Verdana, Arial, sans-serif;
	font-size: 0.89em;
	line-height: 1.5em;
	/* font-weight: bold; */
	padding-left: 30px;
	color: #506326;		/* Very dark green */
}


/* Links */
a, a:visited	{
	color: #D28328;	/* Burnt Orange */
	font-size: 1em;
	font-style: italic;
}

a.embedded {
	color: #FFF;
	margin: 0;
	padding: 0;
}

a.inline {
	color: #506326;
	font-weight: bold;
}

a:hover {
	color: #ffffff;
	background: #ADC2D5;  /* ADC2D5 pale blue */
	font-weight: bold;
	font-style: italic;
}

a.right {
	float: right;
	text-align: right;
	margin-right: 75px;
	margin-top: 34px;
}

a.highlight {
	background-color: #CCFFFF;  /* CCFFFF websafe light cyan */
	padding-left: 3px;
	padding-right: 3px;
}

a.highlightRight {
	float: right;
	text-align: right;
	margin-right: 75px;
	margin-top: 34px;
	padding-left: 3px;
	padding-right: 3px;
	background-color: #EBE4D4;  /* EBE4D4 Light beige */
	border: 2px solid #CFB47F;  /* CFB47F Dark beige */
}