@charset "UTF-8";
/* CSS Document */

/* ===== magazine_v3_sass.scss // Woo, SASS! ===== */
//*:mode=css: */


//* -----------------[ DEBUG ]----------------- */
@mixin border-debug($color: red) { border: 1px solid $color; }
//* -----------------[ DEBUG ]----------------- */


//* ------------------[BASE SETTINGS]----------------- */
//* -----[ VARIABLES ]---- */
$rm_css_path: "http://www.udel.edu/researchmagazine/css/";
$header-size-scale: 0.3;
$header-size-base: 2.5em;

$blue-grey: #30393d;
$grey-92: #eaeaea;
$grey-84: #d6d6d6;
$grey-55: #8c8c8c;

$margins-standard: 15px 0;

$width-center_column: 950px;
$width-page_and_nav_holder: $width-center_column - 20px;
$width-page_content: $width-page_and_nav_holder - 300px;
$width-article_holder: 615px;

//* -----[ MIXINS ]---- */
@mixin font-serif { font-family: "times new roman", serif; }
@mixin font-sans-serif { font-family: "arial", "helvetica", sans-serif }
@mixin whitespace-none { margin: 0; padding: 0; }

//* -----[ FUNCTIONS ]---- */
@function heading-size($n) {
	@return $header-size-base - ($header-size-scale * ($n - 1));
}


/* ------------------[ RESET STYLES ]----------------- */
* {
	margin: 0px;
	padding: 0px;
	border: 0px;
}

@for $i from 1 through 6 {
	h#{$i} { font-size: heading-size($i); }
}
h1, h2, h3, h4, h5, h6 { line-height: 1em; margin: $margins-standard; }

ul, ol { margin: $margins-standard; padding: 0 0 0 35px; }

p { margin: $margins-standard; }

hr { border-top: 3px double #414141; margin: 5px 0; }

table {
	background-color: #f2f2f2;
	border: 1px solid #CCC;
	color: #333;
	margin: $margins-standard;
	
	caption {
		font-weight: bold;
		padding-bottom: 5px;
	}
	
	thead {
		background-color: #C8C8C8;
		color: #4B4B4B;
	}
	
	tfoot {
		background-color: #DEDEDE;
		color: #4E4E4E;
		
		td { font-style: italic; border: none; }
	}
	
	td, th {
		color: #333;
		padding: 7px 17px;
		text-align: center;
	}
	
	th {
		font-size: heading-size(5);
		font-style: normal;
		line-height: 1.3em;
		text-align: left;
		text-shadow: #fff 1px 1px 1px;
	}
	
	td {
		border-bottom: 1px solid #fff;
		line-height: 1.2em;
	}
}

.clear { clear: both; }
.right { float: right; }
.left { float: left; }


/* ------------------[ BASE STYLES ]----------------- */
body {
	@include font-sans-serif;
	
	background-color: #fff;
	color: #414141;
	font-size: 12px;
	line-height: 18px;
	min-width: 1000px;
	
	img#background {
		height: 225px;
		position: absolute;
		width: 100%;
		z-index: 50;
	}
}

a:link, a:visited {
	outline: none;
	
	&:link, &:visited {
		text-decoration: none;
		color:#0066FF;
	}
	
	&:hover { color: #3B3B3B; }
}


/* ------------------[ MAIN LAYOUT ]----------------- */
/* center_column  (:: nav) :: edge_shadow :: page_and_nav_holder :: page_and_sidebar_holder :: page_content */
#center_column {
	clear: both;
	width: $width-center_column;
	margin: 0 auto 10px auto;
	overflow: hidden;
	z-index: 100;
	position: relative;
	
	/* -----[ page header ]---- */
	#header {
		margin: 0;
		padding: 10px 0 20px;
		
		a { overflow: hidden; img { display: block; } }
		
		p.ISSN {
			color: #fff;
			font-size: 13px;
			font-weight: normal;
			letter-spacing: 1px;
			line-height: 18px;
			margin: 0;
			padding: 10px 0 0 0;
		}
		
		.subscribetoday {
			right: 20px;
			position: absolute;
			top: 32px;
			width: 184px;
		}
	}
	
	/* -----[ edge shadow ]---- */
	#edge_shadow {
		background-image: url($rm_css_path + "../images/shadow-bk9.png");
		background-repeat: repeat-y;
		
		#page_and_nav_holder {
			margin: 0 auto;
			width: $width-page_and_nav_holder;
			background:$grey-92;
			
			#page_and_sidebar_holder, #grey_foot {
				width: $width-page_and_nav_holder;
				padding-bottom: 20px;
			}
			
			/* -----[ page and sidebar holder ]---- */
			#page_and_sidebar_holder {
				float: right;
				background-color: $grey-92;
				padding-bottom: 20px;
				
				/* -----[ page content ]---- */
				#page_content {
					float: left;
					margin-top: 20px;
					padding: 0 0 0 20px;
					width: $width-page_content;
				}
			}
			
			#grey_foot { background-color: #414141; clear: right; }
		}
	}
}


/* -------------------[ SIDEBAR ]-------------------- */
#sidebar-wrapper {
	width: 253px;
	float: left;
	margin: 20px 0 0 20px;
	
	h1,h2,h3,h4 { font-weight: normal; }
	
	a.pdf_link {
		text-align: center;
		
		img.cover, p { display: block; margin: 0px auto; padding: 0; }
		p { margin-bottom: 20px;}
	}
	
	#sidebar {
		float: left;
		padding-left: 13px;
		padding-right: 13px;
		width: 227px;
		background-color: #FFF;
		border: 1px solid #D6D6D6;
		padding-bottom: 20px;
		padding-top: 10px;
		
		.sidebar-box {
			padding-top: 5px;
			margin-bottom: 0px;
			
			h2 {
				border-bottom: 1px solid #D6D6D6;
				color: #002663;
				font-size: 1.4em;
				font-weight: bold;
				margin: 5px 0 0 0;
				padding: 4px 0;
				text-transform: none;
			}
			
			h2.toc_header { letter-spacing:1px; }
			
			hr { margin-bottom: 15px; }
		}
		
		a.subscribe {
			background-color: #ccc;
			color: #444;
			display: block;
			line-height: 20px;
			font-size: 18px;
			font-weight: bold;
			margin-bottom: 20px;
			padding: 3px 0 4px;
			text-align: center;
			text-decoration: none;
			
			&:hover {
				background-color: #999;
				color: #fff;
			}
		}
		
		ul#toc_improved {
			@include whitespace-none;
			
			list-style: none;
			text-decoration: none;
			
			li {
				position:relative;
				width: 100%;
				padding: 0;
				padding: 3px;
				
				a {
					background-image: none;
					color: $grey-55;
					display: block;
					padding: 0;
					width: 100%;
					
					&:link, &:visited, &:active { color:  #0066FF; background-color: #fff; }
					&:hover { color:  #000; background-color: $grey-92; }
					
					/* The following class may be deprecated */
					&.head {
						display: block;
						font-size: 1em;
						line-height: 1em;
						margin: 20px 0 0 0;
						text-decoration: none;
					}
				}
				
				ul.toc_section {
					line-height: 1.1em;
					list-style: none;
					margin: 0 0 .4em 0;
					padding-left: 10px;
				}
				
				ul.toc_sub_section {
					list-style-type: circle;
					padding-left: 20px;
					margin: .4em 0 1em 0;
					
					li { margin-bottom: .2em; }
				}
				
				ul.toc_section li, ul.toc_sub_section li { margin-bottom: 10px; padding: 0; }
				
				h3.toc_section_title {
					@inlcude font-sans-serif;
					
					border-bottom: 1px dotted #afafaf;
					color: #000;
					font-size: 1.2em;
					line-height: 1.2em;
					margin: 20px 0 10px 0;
					padding: 0 0 3px 0;
					
					.mobilearrow { float:left; margin-right: 8px; }
				}
			}
		} // ul#improved
	} // #sidebar
} // #sidebar-wrapper


/* ------------------[ ARTICLE BASE STYLES ]----------------- */
@import "_magazine_v3_article_base.scss";


/* ------------------[ DEBUG: Style Demo ]----------------- */
@import "_style_demo.scss";