html {
	background-image: url('../images/bkg-main-drkr.png');
	background-repeat: repeat-x;
	height: 100%;
	}

body {
	margin: 0 auto;
	width: 940px;
	height: 100%;
	color: #005696;
	font-family: verdana;
	line-height: 1.6em;
	}

a, div { outline: none; }
*:focus { outline:none; }

/*---------------------------------------------------------------------------------------
	Structural
  ---------------------------------------------------------------------------------------*/
#wrapper {
	height: 100%;
	}
  
#header {
	width: 940px;
	height: 259px;
	background-image: url('../images/hdr-sos-type.gif');
	background-repeat: no-repeat;
	}
	
#logo {
	float: right;
	width: 311px;
	height: 429px;
	margin-top: -230px;
	background-image: url('../images/hdr-sos-magnet.png');
	background-repeat: no-repeat;
	}


h2#buy-this-magnet a {
	float: right;
	margin-right: -134px;
	margin-top: 87px;
	display: block;
	width: 162px;
	height: 150px;
	background-image: url('../images/buy-this-magnet-stack.png');
	background-repeat: no-repeat;
	background-position: 0 0;
}
	
h2#buy-this-magnet a:hover { background-position: 0 -150px; }

	
#col1 {
	float: left;
	width: 467px;
	padding: 15px 35px 50px 60px;
	height: 100%;
	border-right: 1px solid #a7d2ef;
	}
	
#col2 {
	float: left;
	margin-left: 23px;
	margin-top: 20px;
	width: 300px;
	height: 700px;
	padding: 30px 12px 30px 12px;
	border-top: 1px solid #d5eaf7;
	}
	
#footer {

	}
	
ul#nav {
	width: 400px;
	}
	
ul#nav li {
	display: inline;
	list-style-type: none;
	padding-right: 25px;
	}
	
ul#nav li a { color: #1A3673; }
ul#nav li a:hover { color: #50A5E0; }
  
  
/*---------------------------------------------------------------------------------------
	Sidebar images and links
  ---------------------------------------------------------------------------------------*/
a.buy-this-lapel-pin {
	display: block;
	width: 306px;
	height: 152px;
	background-image: url('../images/buy-this-lapel-pin-stack.gif');
	background-repeat: no-repeat;
	background-position: 0 0;
	}
	
a:hover.buy-this-lapel-pin	{ background-position: 0 -153px; }

.deans-circle {
	margin: 0;
	padding: 0;
	width: 233px;
	height: 132px;
	background-image: url('../images/asu-clas-logo.png');
	background-repeat: no-repeat;
	}
	
	
/*---------------------------------------------------------------------------------------
	Type
  ---------------------------------------------------------------------------------------*/
 h1 { font-size: 1.8em; }
  
  
/*---------------------------------------------------------------------------------------
	Clear the Floats
  ---------------------------------------------------------------------------------------*/
.clear:after {
	content: ".";
	height: 0;
	visibility: hidden;
	display: block;
	clear: both;
}

/*---------------------------------------------------------------------------------------
	CSS Horizontal Rule
  ---------------------------------------------------------------------------------------*/
hr {
	margin: 1.6em 0 0 0;
	padding: 0 0 .9em 0;
	border: none 0; 
	height: 1px; 
	border-top: 1px solid #d5eaf7;
	}
	
#col2 hr {
	margin: 35px -12px 20px -12px;
	}
	
	
/*---------------------------------------------------------------------------------------
	Table (cafe press)	
  ---------------------------------------------------------------------------------------*/
#col1 table {
	border-collapse: collapse;
	border: none;
}

#col1 td { border: none; }

#col1 td img { border: 1px dotted #ccc; }


/*---------------------------------------------------------------------------------------
	Hidey Spans - for hiding image-replaced markup
  ---------------------------------------------------------------------------------------*/
#buy-this-magnet span, 
.buy-this-lapel-pin span,
#logo span,
.deans-circle span { 
	display: block; 
	text-indent: -5000px; 
}

/*---------------------------------------------------------------------------------------
	Misc. Positional Stuff
  ---------------------------------------------------------------------------------------*/
img.center {
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 5px;
	margin: 0 0 5px 15px;
	}

img.alignleft {
	padding: 5px;
	margin: 0 15px 5px 0;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left;
	}
	
.center { text-align: center; }
