/* 	Name.......... homeShell
	Version....... 201007.v01
	Last update... July 6, 2010
	By............ Juan   */  

/*Bellevue College Shell style (not in content space), Bellevue College*/
/* Document broken out into: 1) basic shell and 2) theme */

/*******************************/
/****** BEGIN BASIC SHELL ******/

/* Top Area (shell)*/
#wrap {		width: 766px; margin: 0 auto;}
#top { height: 152px } 	/*note IE6 & 7 hacks*/ 
#skiptotcontent { 	height: 26px;	float: left;}
#skiptotcontent a {	display: block; padding: 7px 0 4px 0; width: 10em;}
#nav h2{ position: absolute; left: -9999px; top:-9999px;}
#logo {		margin-left:  28px;  padding-top: 16px; float: left; width: 350px;}
#actionitems { float: left; width: 215px; margin-right: 8px; margin-top: 24px;}
#takeclass 	{ text-align: right}
#moreinfo 	{ text-align: right; margin-right: 35px; font-size: .8em; font-weight:bold; }
#moreinfo a{ color: #003D79}

#actionbar { 	height: 	26px;}
#actionbar li { float: 		right;
				margin-top: 5px; 
				margin-left:6px;   
				padding-left:7px; }
#actionbar li.first{ 	margin-top: 3px; margin-left: 6px}
#actionbar label { 		position: absolute; left: -9999px;}
#search #txtQuery {  	width: 134px;	padding-left: 5px;}
#search input#searchbutton {	padding-left: 1px;	padding-bottom: 2px;	vertical-align: middle;}


/* Second Row (shell)*/
#secondrow { clear: both; height: 198px;}

#rolebased {
	font-size: .80em;
	width: 165px;
	height: 197px;
	float: left;
	background: #EAEAEA url(../images/home/rolebg.gif) repeat-y;
	border-bottom: 1px solid #003D79;
	/*note, because of Netscape 6, I need to declare a top border, so I did and shifted the margin up*/ 
}
#rolebased h2 {
	color: #003D79;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight: normal;
	margin-top: 14px;
	margin-left: 16px;
}
#rolebased ul { margin: 0; padding: 0;}
#rolebased li { 
	display: inline;
}
#rolebased li a{
	display: block;
	color: #003D79;
	padding: 7px 0 4px 10px;
	background: url(../images/home/rolearrow.gif) no-repeat 0px 10px;
	margin-left:16px;
}
#rolebased li a:hover, #rolebased li a:focus {
	color: #00C;

}

#marketing {
	width: 601px;
	float: left;
	position: relative;
	background-color: #fdfdfd
	}
#marketing h2 { position: absolute; left: -9999px; left:-9999px}
#marketing ul { 
		font-size: .7em;
		position: absolute; top: 0; right: 0; overflow: hidden; 
		background-color: white;
		filter: alpha(opacity=80); /* here you can set the opacity of box with text */
		-moz-opacity: 0.8; /* here you can set the opacity of box with text */
		-khtml-opacity: 0.8; /* here you can set the opacity of box with text */
		opacity: 0.8; /* here you can set the opacity of box with text */}
#marketing li { display: inline;}
#marketing li a {
	color: #666;
	display: block; float: left; 
	padding: 3px 8px; 
	font-weight: bold;
	text-decoration: none;
	border: 1px solid #ccc; border-left-width:0;}
#marketing li a.selected { background-color: #003D79; color: white;}
#marketing li a:hover, #marketing li a:focus{background-color: #003D79; color: white;}
#marketing li.first a { border-left-width: 1px; }
#marketing li.next a { padding-right: 20px }
	
#marketing img {display: block; float: left; }

#marketing .markettext { 
	position: absolute;
	width: 561px;
	bottom: 0;
	left: 0;
	color: white;
	background-color: black;
	filter: alpha(opacity=75); /* here you can set the opacity of box with text */
   -moz-opacity: 0.75; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.75; /* here you can set the opacity of box with text */
   opacity: 0.75; /* here you can set the opacity of box with text */
   padding: 5px 20px 6px 20px;
   line-height: 120%;
   font-size: .9em;
}
#marketing .markettext a { color: white; padding-left: 10px;}
.markettext.hover { cursor: pointer;}

#collegealert { 
		color: black;
		text-align: center;
		float: left; 
		width: 597px; 
		height: 194px; 
		background-color: #ccc  ;
		border: 2px solid #333;
	}
	
#collegealert h2 {
	font-size: 1.7em; 
	color: white;
	padding-bottom: 3px;
	background-color: #333;
	margin-top: 0;
}	
#collegealert .wrap { margin:  15px 50px 0 50px;}
#collegealert h3 {
	margin: 0;
	font-size: 1.3em;
	margin-bottom: .8em;}
#collegealert .updated { 
	margin-top: 1em; 
	font-size: 1.1em;}
#collegealert a { 
	font-weight: bold;
	font-size: 1.3em;
	display: block;
	color: white;
	background: url(../images/home/alertmessagebutton.gif) top repeat-x red;
	border: 1px solid #880000;
	width: 8em;
	padding: .3em 0 .5em 0;
	margin: 0 auto;
	}
#collegealert a:focus, #collegealert a:hover { 
	color: #880044;
	background: url(../images/home/alertmessagebutton.gif) bottom repeat-x yellow;
}

/*nextrow*/
#nextrow {  
	 width: 100%;
	 margin-top: 14px;
	 margin-bottom: 40px;
	 clear: both;
	 background: url(../images/home/newseventsline.gif) repeat-y 384px 0px ;
	 
	 }
	 
#adblock {
	width: 167px;
	float: left;
	margin-right: 4px;}
#adblock a {display: block;}
#adblock .first a {margin-bottom: 22px;}
#adblock .last a {margin-bottom: -6px;}


#announcements, #events {  /*Note IE 6 hack*/
	width: 214px;
	float: left;
	font-size: .85em;}
#announcements h2, #events h2 { 
	color: white;
	padding: 3px 0 3px 11px;
	background-color:#003D79;
	margin-bottom: 4px; 
	font-family: Georgia, "Times New Roman", Times, serif
}
#announcements ul, #events ul { margin: 0; padding: 0}
#announcements li, #events li { display: inline;}
#announcements li a, #events li a { 
	color: #003D79;
	display: block; 
	padding: 4px 4px 8px 11px;
	line-height: 125%;
	text-decoration:none;
	margin-right: 1px
	}
#announcements a.more{ 
	font-weight: bold;
	background: url(../images/home/morearrow.gif) no-repeat 7em 40%; }
#events a.more { 
	font-weight: bold; 
	background: url(../images/home/morearrow.gif) no-repeat 9.5em 40%; }
	
#announcements ul a:hover, #announcements ul a:focus, #announcements ul a:active,
#events ul a:hover, #events ul a:focus, #events ul a:active { background-color: #eee} 
#announcements a.more:hover, #events a.more:hover, #announcements a.more:focus, #events a.more:focus {  text-decoration: underline}

#events a#calendar { font-weight: bold;}	
	

#adblock2 { 
	width: 166px;
	float: left;
}
#adblock2 h2 { position: absolute; left: -9999px; top:-9999px;}
#adblock2 p {margin-bottom: 4px; margin-left: 6px; text-align:center;}
#flexible { border: 2px solid #003D79; text-align: center; color: #666; font-size: .8em; padding: .5em 4px; line-height: 130%}
#flexible.hover { cursor: pointer; background-color:#FFC}
#flexible strong { color: #003d79}
#flexible a { text-decoration: none;} 

#adblock2 #give { margin: 15px 0 19px 0;}
#give a{  color: #003D79; font-weight:bold; font-family:Georgia, "Times New Roman", Times, serif}

#adblock2 #alerts { margin-left: -10px; margin-bottom: -22px;}

/* Footer Area (shell)*/
#foot {  font-size: 13px; line-height: 25px;} 
#footwrap { }
#foot4col { width: 766px; margin: 0 auto; overflow: hidden; }
#foot4col  .col4 { float: left; width: 180px; margin-left: 15px; padding: 14px 0 18px 0}
#foot4col  .first {margin-left: 0;}
#foot h2 { position: absolute; left: -9999px; top: -9999px;}
#foot h3 { margin-bottom: -3px;} 
#foot form { margin-bottom: 2px;}
#foot ul li { 	list-style-type: none;}
#foot li, #foot p { zoom: 1} /*IE hack*/
#footbot { clear: left; width: 766px; margin: 0 auto; padding: 14px 0 18px 0; overflow:hidden;}
#footbot h3 { position: absolute; left: -9999px; top: -9999px }
#footbot p#bellevueaddress span, p#bellevueaddress a { float: left;}
#footbot ul {clear: left;}
#footbot li { float: left; font-size: 12px;} 
#footbot li a { padding-left: 22px;}
#footbot li.first a {padding-left: 0; background: none; }
#footbot li.last { float: none; clear: left; }
#footbot li.last a {padding-left: 0;}
#footbot span { padding-left: 21px;}
#footsearch {    width: 169px; height: 20px; background: url(/images/foot/footsearch.gif);}
#footsearch #footsearchbox {    float: left; padding: 0; margin: 2px 0 0 4px; border: 0; width: 130px; background: none;}
#footsearch #footsearchgo {    float: right; margin: 1px 1px 0 5px;}

/*Global Classes*/
.skip {			display: block; position:absolute; left: -9999px; top: -9999px;}
.skipselected { position:static }
.clearer { 		clear:both;height:0; font-size: 1px;line-height: 0px;}

/*****End Shell  ******/
/**********************/


/***********************/
/**** THEME ************/
body	{	font-size: .95em; background: url(../images/topbg.png) 0px 26px repeat-x white;}
#bigwrap { background: url(../images/topglow.png) 50% 26px no-repeat;}
#wrap 	{	background: url(../images/topline.jpg) 0 26px repeat-x white;}
	
	
#top { background: url(../images/home/TRline.gif) right bottom no-repeat;}
#skiptotcontent { 			font-size: .8em; }
#skiptotcontent a 		{	color: #999;}
#skiptotcontent a:hover {	color: #00C}
#skiptotcontent a:focus {	color: #00C; outline: 1px dotted #ddd}

#logo a:focus	{ 	outline: 1px dotted #ccc}

#actionbar li 		{	background: url(../images/actionbardivider.gif) no-repeat left bottom; }
#actionbar li.first	{	background: none;}
#actionbar li.last 	{	background: none;}
#actionbar a 		{ 	color: #003D79; }
#actionbar a:hover	{	color: #00C;}
#actionbar a:focus	{	color: #00C; outline: 1px dotted #bbb;}

#search #txtQuery 		{ 	border: 1px solid #6C8FB1;	background:#EAEFF4; }
#search #txtQuery:focus { 	background-color: #FFC}
#search #searchbutton:focus {outline: 1px dotted #bbb;}


/*footer area (theme) */
#footwrap { 	background: url(/images/foot/foot.gif) #EDEEEF} 
#footwrap2 { border-top: 1px solid #5d84AA; border-bottom: 1px solid #B9cada; }
#foot label {font-weight: bold; color: #003D79;}
#foot h3 { color: #3D668F;} 
#foot4col a {color: #4C759E; }
#footbot li a {color: #666666; background: url(../images/foot/legalpipe.gif) 11px 4px no-repeat; }
#footbot li.last a {background: none; color: #A0A0A0; }
#footbot span { background: url(/images/foot/addressbullet.gif) no-repeat 8px 10px; color: #003D79 }
#footbot #bellevueaddress a { color: #003D79; font-weight:bold; text-decoration: none;}

body #foot a:hover, body #foot a:focus { color: #00C}

/**** END THEME ********/
/***********************/



