@charset "utf-8";

/********************************************************************
                  PAGE LAYOUT
*********************************************************************/
html, body {
	/*width set in upper right earth section*/
	min-height: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}
body {
	background-color: #173d85; 
		
	/* gradient - used  http://www.colorzilla.com/gradient-editor/ */	
	background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 125px, #377bbb 58%, #173d85 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(125px, #ffffff), color-stop(58%, #377bbb), color-stop(100%, #173d85)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 125px, #377bbb 58%, #173d85 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 0%, #ffffff 125px, #377bbb 58%, #173d85 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #ffffff 0%, #ffffffff0000 125px, #377bbb 58%, #173d85 100%); /* IE10+ */
	background: linear-gradient(top, #ffffff 0%, #ffffff 125px, #377bbb 58%, #173d85 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#173d85', GradientType=0 ); /* IE6-9 *//*only 2 color stops*/
	
	padding-bottom: 2em;
}

.central_column {
	width: 904px;
	padding-left: 0 !important;
	padding-right: 0 !important;	
	margin: 0 auto 0 auto !important;	
}
.inner_padding {
	padding: 15px;	
}

/*---------------------- Header: BEGIN --------------------------*/
#header {
	height: 153px;	
	position: relative;	
}
#banner {
	height: 125px;
	background-color: black;
	background-image: url(/images/header-background.jpg);
	background-repeat: repeat-x;
	position: relative;
	
}
#banner_inner {
	padding: 0;
	height: 100%;
	position: relative;
}
#ssec_logo img {
	border: none;
}
#title, #ssec_logo, #otherSites, #search_container {
	position: absolute;
}
#ssec_logo {
	left: 15px;
	top: 20px;	
}
#title {
	left: 125px;
	top: 23px;
}
#title h1 {
	margin: 10px 0 0 0;
	padding: 0;
	width: 542px;
	height: 27px;
	font-size: 0;
	text-indent: -2000px;		
	color: black; 
	background-image: url(/images/title.png);
	background-repeat: no-repeat;
}
#uw_madison {
	margin-top: 10px;
}
#otherSites {
	bottom: 0px;
	right: 15px;
	margin: 0 0 10px 0;
	padding: 0;
}
#otherSites li {
	display: inline;
	margin: 0;
	padding: 0;
}
/*******************************
IMPROVE
:after not supported in IE7, so dots between links have been added manually in HTML ;(
Put this back in once IE7 support is no longer needed
#otherSites li:after {
	content: "\00a0\2022";
}
#last_link_cuz_ie_sucks:after {
	content: "" !important;
}
*********************************/
#search_container {
	top: 35px;
	right: 15px;
	height: 14px;
}
#searchButton {
	display: inline-block;
	width: 30px; 
	height: 21px;
	border: none;
	cursor: pointer;
	text-indent: -3000px;
	background: url(/images/search-button.png);
}
#searchBox, #searchButton {
	vertical-align: middle;
}
/*--------------- Earth in upper right: BEGIN ----------------*/
html, body {
	min-width: 930px;
}
#earth_image_container {
	width: 138px;
	height: 125px;
	position: absolute;
	bottom: -1px; /* because there is a transparent border */
	right: 0;
	overflow: hidden;
	border: solid 1px transparent; /* Chrome doesn't work without this */
	/* 
	JavaScript will display earth image.  JavaScript
	is used to ensure that the earth image doesn't overlap
	the banner content.  If no JavaScript, then
	page will remain at lower min-width and earth image won't be
	displayed. 
	*/
	display: none; 	
}
#earth_image {
	display: inline-block; 
	width: 138px; 
	height: 125px; 
	background: url(/images/earth.png) no-repeat;
}
/*--------------- Earth in upper right: END ----------------*/
/*---------------------- Header: END --------------------------*/

/*-------------------- Navigation bars: BEGIN ---------------*/
.navbar {
	background-color: #fff7ec;	
	height: 28px;
	margin: 0;
	padding: 0;
	position: relative;		
	overflow: hidden;		
	line-height: 28px;	
}
.navbar .inner_padding {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.navbar_inner ul {
	list-style-type: none;
	padding-top: 0;
	padding-bottom: 0;
	margin: 0;	
}
.navbar li {
	float: left;
	display: inline;
}

/*-------- Top nav bar justification: BEGIN ---------------*/
/* 
See http://stackoverflow.com/questions/6246934/proper-spacing-for-multiple-word-links-in-justify-aligned-horizontal-nav-bar 
*/
/*******************************************
DOESN'T WORK IN WEBKIT (CHROME AND SAFARI) AS OF 2012-OCT-16 - RIGHT PADDING IS ZERO WHEN IT SHOULDN'T BE
#top_nav .navbar_inner {
	text-align: justify;	
}
#top_nav .navbar_inner * {
	display: inline;
}
#top_nav .navbar_inner a {
	display: inline-block !important;
}
#top_nav .navbar_inner:after {
    content: "";
    display: inline-block;
    width: 100%;    
}
*******************************************/
/*-------- Top nav bar justification: END ---------------*/

#top_nav ul li {
	margin-right: 3.1em;
}
#bottom_nav ul li {
	margin-right: 4.5em;
}

#top_nav {
    box-shadow: 0px 3px 6px 2px rgba(60, 60, 60, 0.5);	
    -moz-box-shadow: 0px 3px 6px 2px rgba(60, 60, 60, 0.5);
    -webkit-box-shadow: 0px 3px 6px 2px rgba(60, 60, 60, 0.5);	
	z-index: 10;
}
#bottom_nav {
    box-shadow: 0px -6px 10px -4px rgba(60, 60, 60, 0.5);	
    -moz-box-shadow: 0px -6px 10px -4px rgba(60, 60, 60, 0.5);
    -webkit-box-shadow: 0px -6px 10px -4px rgba(60, 60, 60, 0.5);
}
/*-------------------- Navigation bars: END ---------------*/

/*---------------- Content: BEGIN ----------------------*/
#content_container {
	display: table;
	padding: 0;
	border-spacing: 0;	
	background-color: #fafafa;
    box-shadow: 2px 2px 3px 3px rgba(80, 80, 80, 0.4);
    -moz-box-shadow: 2px 2px 3px 3px rgba(80, 80, 80, 0.4);
    -webkit-box-shadow: 2px 2px 3px 3px rgba(80, 80, 80, 0.4);
	/*margin-bottom: 1em !important;*/
}
#content {
	min-height: 450px;
}
/*---------------- Content: END ----------------------*/

/*---------------------- Footer: BEGIN ----------------*/
#footer {
	height: 100px; 
	background-color: black;
	margin-top: 1em;
	padding-bottom: 15px !important;
}
#address, #uw_madison_logo {
	float: left;
}
#uw_madison_logo {	
	margin-right: 1em;
} 
#address {
	padding-top: 6px;
}
#footer_links, #social_icons {
	float: right;
}
#rss_link {
	/*margin-left: 12px;*/
}
#footer_links {
	margin-right: 2em;
}
#footer img {
	border: none;
}
/*---------------------- Footer: END ----------------*/

/********************************************************************
                  FONTS
*********************************************************************/
body, #content h2, #content h3 {
	font-family: 'PT Sans', Arial, Verdana, Geneva, sans-serif; /* IMPROVE - determine what fonts are best to fall back on */	
}
body {
	font-size: 14px;
}
/*------------ Force font size: BEGIN ----------------*/
/*
force font size in these areas but allow middle content font size to be controlled by user preferences
*/
#header { 
	font-size: 14px;
}
#footer {
	font-size: 12px;
}
/*------------ Force font size: END ----------------*/
#header a {
	text-decoration: none;
	font-weight: bold;	
}
#uw_madison a, #uw_madison a:visited {
	letter-spacing: 0.02em;
	color: #c7561e !important;
	background-image: url(/images/semi-trans-black-31.png);
}
#otherSites {
	color: #c7561e;
}
#otherSites a, #otherSites a:visited {
	color: white !important;
}
#searchBox {
	font-size: 12px;	
}
.navbar li a {
	font-size: 16px !important;	
	color: #377bbb !important;
	text-decoration: none;	
}
#footer {
	color: white;
}
#footer a {
	color: #377bbb;
	text-decoration: none;
	font-weight: bold;
}
a {
	color: #377bbb;
}
a:visited {
	color: #173d85 !important;
}
#otherSites a:hover, .navbar a:hover, a:hover {
	color: #c7561e !important;
}

.raquo {
	font-size: 1.2em !important; 
	font-weight: bold;
}

#content {
	color: #444;
	font-family: Arial, Verdana, Geneva, sans-serif;  /*IMPROVE - review choice of fonts*/	
}
#content h2 {
	font-size: 1.75em;
}
#content > h2:first-child {
	margin-top: 0 !important;
}
#content h3 {
	font-size: 1.15em;
	font-weight: bold;
}
#content h2, #content h3, #content strong {
	color: #333;
}
#content h3 {
	margin-bottom: 0.5em;
}
#content h3 + p {
	margin-top: 0;
	padding-top: 0;
}


/********************************************************************
                  MISC FORMATTING
*********************************************************************/
* {
	z-index: 1;
}
.clearFloatAfter:after, #page_breadcrumb:after {
   content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

.external_link {
	padding-right: 18px;
	background: url(/images/icon_external_link.png) no-repeat right center;
}

#global_status {
	background-color: #efefef;
	padding: 10px;
	width: 600px;
	border: solid 1px #ccc;
	margin-bottom: 1em;
}
#global_status strong {
	color: #990000 !important;
}
.pretty_list li {
	margin-bottom: 1em;
}

/*--------------- Breadcrumb Trail 1: BEGIN -----------------*/
/* Use #breadcrumb_trail by default */
/* IMPROVE - combine all breadcrumb trail CSS (which is a scattered mess now) into one id/class */
#page_breadcrumb {
	list-style-type: none;
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	font-size: 14px;
	border-bottom: solid 1px #ccc;
}
#page_breadcrumb li {
	display: inline;
	margin-right: 1em;
}
#page_breadcrumb li a {
	text-decoration: none;
}
#page_breadcrumb li:after {
	content: "\0020\00BB";
}

#page_breadcrumb + h2 {
	margin-top: 5px;
}
/*--------------- Breadcrumb Trail 1: END -----------------*/

/*----------- Breadcrumb Trail 2: BEGIN ---------*/
#breadcrumb_trail {
	list-style-type: none;
	display: block;
	white-space: nowrap;
	float: right;
	margin: 0;
	padding: 0;
	font-size: 14px;
}
#breadcrumb_trail li {
	display: inline;
}
#breadcrumb_trail li a {
	text-decoration: none;
}
#breadcrumb_trail li:before {
	/* if you change this make sure to change it in all_pages.ie.css as well */
	content: "/\0020";
}
#breadcrumb_trail li:last-child:after {
	/* if you change this make sure to change it in all_pages.ie.css as well */
	content: "\0020\00BB";
}
#breadcrumb_trail + h2 {
	margin-top: 5px;
	clear: both;
}
/*----------- Breadcrumb Trail 2: END ---------*/

/*--------- side nav: BEGIN --------------*/
#side_nav {
	width: 200px;
	margin: 0 0 1em 1em;
	background-color: #fff7ec;	
	min-height: 175px;
	float: right;
    box-shadow:         0px 2px 4px 2px rgba(100, 100, 100, 0.3);
    -moz-box-shadow:    0px 2px 4px 2px rgba(100, 100, 100, 0.3);
    -webkit-box-shadow: 0px 2px 4px 2px rgba(100, 100, 100, 0.3);
}
#side_nav h3 {
	background-color: #c7561e;
	color: #fff !important;		
	margin: 0 !important;
	padding: 3px 10px 3px 10px;
	border: solid 1px #aaa;	
	border-top: none;
	border-bottom: none;	
	/* done because there is an optical illusion that makes
	the box that the h3 is in seem slightly less wide than
	the parent side_nav box (probably due to the yellow of the
	side_nav box bleeding into the drop shadow */
	position: relative;	
	left: -1px;
	width: 181px;
}

#side_nav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	color: #444;
	font-size: 12px;
}

#side_nav ul li {
	padding: 5px 10px 5px 10px;
}
#side_nav li a {
	text-decoration: none;
	font-size: 14px;
	display: inline-block;
}
/*--------- side nav: END --------------*/

/*----------- Home Page news channel and WordPress news blog: BEGIN -----------*/
a.spotlight_link .article_title, a.spotlight_link #news_channel_caption_title {
	display: inline-block;
	padding-right: 20px;
} 
a.spotlight_link .article_title {
	background: url(/news/wp-content/themes/ssec/images/icon_external_link.png) center right no-repeat;	
}
a.spotlight_link #news_channel_caption_title {	
	background: url(/news/wp-content/themes/ssec/images/icon_external_link_white.png) center right no-repeat;
}
#article_list #featured_story_label {
	background-color: #ccc;
	padding: 0 10px 0 10px;
	display: inline;
	font-size: 18px;
	height: 24px;
	line-height: 24px;
	float: left;
	background-color:  #377bbb;
	color: white;
}

/*----------- Home Page news channel and WordPress news blog: END -----------*/