@charset "utf-8";
/* SOBS.org CSS Document */
/* Standardized Layout and Page Styles for a SOBS feature */
/* Uses a 760 pixel-width center column and includes a standard SOBS footer which sticks to the bottom of the Web browser window and overlays feature content.  */
/* Copyright The Site of Big Shoulders Inc. */


/* Feature Name: A Useless Window by Carrie Olivia Adams */
/* SOBS Department: Poetry */
/* Producer for this feature: Carolyn Alterio/Justin Kerr */
/* Date: 3/24/2008*/
/* Notes:  Dana Peters provided illustration. */


/* Zeroing CSS START */
/* Notes: This is used to "zero-out" common HTML elements so as to support better cross-browser rendering. */
	
	* {
		margin:0;
		padding:0;
		}
		
	h1,h2,h3,h4,h5,h6,p,blockquote,form,label,ul,ol,dl,fieldset,address {
		margin: 0.5em 0; 
		}
		
	li,dd {
		margin-left:1em;
		}
		
	fieldset {
		padding:.5em;
		}
		
	body {
		font-size:76%;
		line-height:1.3;
		}

/* Zeroing CSS END */


/* Core Page Layout Elements START */
/* Notes: These CSS elements are used to define and enable the main regions of the page, including the static width, center-floating content column and the standard SOBS footer. */
/* CSS style elements specific to this layout use a "sobs_" prefix to distinguish their names and to prevent conflicts with commonly used names.  */

	html, body {
		margin:0;
		padding:0;
		height:100%; /* Note: Needed for footer */
		}

	html>body #sobs_wrap {
		height:100%; /* Note: Needed for footer */
		} 
		
	#sobs_wrap {
		margin:0 auto;
		}

	html>body #sobs_content-wrap {
		height:100%;  /* Note: Needed for footer */
		width:760px;
		margin-left:auto;
		margin-right:auto;
		} 

	html>body #sobs_content {
		padding:12px 0px 54px 0px; /* Creates a 12 pixel space around the main page content; the 42 pixels at the bottom leaves room for the footer */
		} 

	#sobs_footer-wrap {
		width:100%;
		height:30px;
		text-align:center;
		background-image:url(../../../SOBS_featurefooterbackground.png);
		background-repeat:repeat-x;
		}
		
	html>body #sobs_footer-wrap {
		position:fixed;
		bottom:0;
		text-align:center;
		z-index:10; /* Forces footer to lay on top of other content */
		}
		
	#sobs_footer {
		padding-top:10px;
		}
	
	#sobs_footer img {
		border:none;
		margin:0 24px;
		}

/* Core Page Layout Elements END */


/* Page Content Layout Elements START */
/* Note: These CSS classes are available for layout use within the body content area */
/* Feel free to change or tweak at will in order to get a different placement or effect */
/* Note that overflow:auto is required in order to prevent a horizontal scroll bar in IE7 (bug) */

	.floatright {  /* A CSS class that can be applied to any element (for example, an image) to get it to float to the right with a 12-pixel margin on left and bottom */
		float:right;
		margin-left:12px;
		margin-bottom:12px;
		overflow:auto;
		
		}

	.floatleft {  /* A CSS class that can be applied to any element (for example, an image) to get it to float to the left with a 12-pixel margin on right and bottom */
		float:left;
		margin-right:12px;
		margin-bottom:12px;
		overflow:auto;
		}

	.boxfloatright {  /* Can be used as a class on a <div> to contain a graphic and a cut line in one unit. */
		float:right;
		margin-left:12px;
		margin-bottom:12px;
		text-align:left;
		padding-bottom:12px;
		overflow:auto;
		}

	.boxfloatleft {  /* Can be used as a class on a <div> to contain a graphic and a cut line in one unit. */
		float:left;
		margin-right:12px;
		margin-bottom:12px;
		text-align:left;
		padding-bottom:12px;
		overflow:auto;
		}
		
	.sidebarright {  /* A right-floating side bar column; change its values to get different effects */
		float:right;
		width:200px;
		margin-left:12px;
		margin-bottom:12px;
		padding:8px;
		text-align:left;
		border-color:#000000;
		border-style:solid;
		border-width:1px;
		background-color:#CCCCCC;
		color:#000000;
		overflow:auto;
		}
	
	.sidebarleft {  /* A left-floating side bar column; change its values to get different effects */
		float:left;
		width:200px;
		margin-right:12px;
		margin-bottom:12px;
		padding:8px;
		text-align:left;
		border-color:#000000;
		border-style:solid;
		border-width:1px;
		background-color:#CCCCCC;
		color:#000000;
		overflow:auto;
		}
	
	.clearboth {  /* This is a CSS class that can be placed on any HTML element in order to prevent it from wrapping around a floated element. */
		clear:both;
		}

/* Page Content Layout Elements END */


/* Page Content Styles START */
/* Here is where you can adjust the look and feel of the page, including primary font styles, background and foreground colors, etc. */

	body {
		font-family:Verdana, Arial, Helvetica, sans-serif;  /* Change this font-family value to affect all HTML text on the page */
		color:#000000;  /* Change this value to affect the primary foreground color on the page */
		background-color:#FFFFFF;  /* Change this value to affect the primary foreground color on the page */
		background-image:url(../../images/page_background.gif);  /* Change this to your page background image */
		background-repeat:repeat-x; /* Change this to control horizontal and vertical tiling of your background image */
		}

	h1 {  /* The <h1></h1> HTML tag should ideally be used for the main headline or title on the page (unless you are using a graphical image headline) */
		font-size:2.8em; 
		}
	
	h2 {  /* The <h2></h2> HTML tag can be used for things like subheads or subtitles */
		font-size:1.4em;
		font-weight:bold;
		}

	#sobs_content p {  /* This will be applied to all <p></p> tags inside the main page content area; i.e. your primary body copy text */
		font-size:1.1em;
		line-height:1.6em;
		}
	
	.cutline {
		font-size:.8em;
		line-height:1em;
		}
		
	.pullquote {
		font-size:1.6em;
		line-height:2.1em;
		font-style:italic;
		}
	
	.sidebarleft {
		font-size:.8em;
		line-height:1.1em;
		}
		
	.sidebarright {
		font-size:.8em;
		line-height:1.1em;
		}
		
	div.leadingquote {
		font-size:1.2em;
		line-height:1.5em;
		margin-top:24px;
		margin-bottom:24px;
	}
	
	div.poemstanza {
		font-size:1.2em;
		line-height:1.6em;
		margin-bottom:2.5em;
	}

	div.poemstanzaindent {
		font-size:1.2em;
		line-height:1.6em;
		margin-bottom:2.5em;
		margin-left:275px;
	}


/* Page Content Styles END */


/* Hyperlink Styles START */

	a:link {  /* Default Appearance for hyperlinks */
		color:#990000;
		text-decoration:none;
		font-weight:bold;
		}
		
	a:visited {  /* Appearance of visited hyperlinks */
		color:#990000;
		text-decoration:none;
		font-weight:bold;
		}
		
	a:hover {  /* Appearance of hyperlinks when the cursor mouses over them */
		color:#990000;
		text-decoration:underline;
		font-weight:bold;
		}
		
	a:active {  /* Appearance of hyperlinks onClick but prior to onRelease */
		color:#990000;
		text-decoration:none;
		font-weight:bold;
		}

/* Hyperlink Styles END */


/* Feature Navigation Elements START */
/* For navigating between the various pages within the feature */
	
	div#navmenu {
		position:relative;
		width:100%;
		text-align:center;
		margin-top:24px;
		}
		
	div#buttonnext {
		position:absolute;
		right:0;
		top:0;
		text-align:right;
		}
	
	div#buttonprevious {
		position:absolute;
		left:0;
		top:0;
		text-align:left;
		}
	
	div#buttonhome {
		text-align:center;
		margin:auto;
		top:0;
		}
		
	.buttontext {
		font-size:1.5em;
		}

/* Feature Navigation Elements END */
