/* Global Styles
	aStahl * 3.Aug 2008 for Web Associates
	global.css: all major tags and commonly used classes and layout
	content.css: navigation, search and general form, table and list styles 
	page_specific.css: styles that are only used on specific pages
	text.css: image replaced headers
	ie6.css: ie6 and lower


COLORSCHEME	
background:
	- #3D6F87 (with gradient img background)
	- #ebebeb (inside panels .box) 

text outside of panels (ie. on light grey background):
	- 12px Verdana #666 
	- links are #337096 
	- active/hovered links are #4b795b with underline 
	- visited links are default color #666 with underline 
	- text size changes to 11px in secondary text

	text inside panels (ie. class="box" with dark blue background):
	- 12px Verdana #ccc   
	- linked text is #fff 
	- active/hovered links are #a3bdcb with underline
	- visited links are #ccc with underlines
	- text size changes to 11px in secondary text 
	
	CONTENTS:
		
			- Tags - general and reset styles (h1-6, p, li, a, img, etc...)
			- Global Links and Text (colors and sizes see schema above)
			- Global Classes (.clear, right, required, etc..)
			- Navigation (gnav, main nav, search bar, breadcrumbs)
			- Layout:
					wrapper
					header
					main
					content
					footer */
					
					

/* Tags
-------------------- */
* {	padding: 0;margin: 0;}
h5, h6, p, pre, blockquote, label, ul, ol, dl, fieldset, address { margin:1em 0; }
li, dd { margin-left:5%; }
fieldset {
	border-style: none;
	overflow: hidden;
}
select option { padding:0 2px; }
em { font-style:italic; }
a img, img { border:none; }
body {
	background: #3d6f87 url(../images/bg_body.gif) repeat-x left top;
	text-align: center;
	margin: 0;
	width: 100%;
	height: 100%;
}
p { margin: 0 0 15px 0; }
hr {
	border:none;
	border-top: 1px solid #888;
	margin:0 5px;
	padding:0;
	height: 1px;
}
ul, li {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Global Links and text colors
-------------------------------*/
body {
	color: #ccc;
	font: 12px "Verdana", "Arial", "Helvetica";
}
a, a:visited {
	  color:#fff;
	  text-decoration: none;
	  outline:none;
}
a:hover, a:active {
	  color:#333;
	  text-decoration:underline;
}
#dashboard a { color:#337096; }
#dashboard a:hover, #dashboard a:active { color: #4b795b;}
#dashboard { 
	background: #dadada url(../images/bg_dashboard.png) repeat-x;
	color:#666;
}
/* .box-content and blue-panel are the boxes with the blue background */
#dashboard .box-content ,
#dashboard .blue-panel { color: #ccc; } 
#dashboard .box-content a,
#dashboard .blue-panel a { color: #fff; }
#dashboard .box-content a:hover, 
#dashboard .box-content a:active,
#dashboard .blue-panel a:hover,
#dashboard .blue-panel a:active { color:#a3bdcb; }

h1 {
	font-size: 24px;
	margin:0 0 4px 0;
	color:#4f6c7b;
}
h2 {
	font-size: 22px;
	margin: 10px 0 8px 0;
		color:#fff;
}
h3 {
	font-size:16px;
	color:#4f6c7b;
	margin:0 0 4px 0;
}
.box h3 {
	font-size: 18px;
	margin: 0;
	color:#fff;
}
h4 {
	font-size: 11px;
	margin: 0;
}

/* Global Classes
-------------------- */
/* not using clear any more. view http://www.quirksmode.org/css/clearing.html
	.clear {	height:1px;	font-size:1px;	line-height:1px;	clear:both;} 
.clear {   overflow: hidden;  width: 100%;}*/

div.clear { clear: both; }
.required, .error, .red { color:#f00; }
.right { float:right; }
.left { float:left; }
.center { text-align:center; }
.footnote, .smalltext { font-size:10px; }
.buttons a {text-indent:-9999px;}

/*  Layout 
---------------------------

	Layout IDs (in order of appearance):
		wrapper
		header
		main
		sidebarone
		content
		sidebartwo
		footer
								
	note: added overflow and width to ALL major elements for clearing. may need to edit . 
	see http://www.quirksmode.org/css/clearing.html
-------------------- */
#wrapper {
	width: 950px;
	text-align: left;
	margin: 0 auto;
	padding: 0;
	overflow: hidden;
}
#header {
	height: 128px;
	position: relative;
}
#logo {
	background: url(../images/gabble_logo.gif) no-repeat;
	float: left;
	margin: 6px 0 0 20px;
	text-indent: -9999px;
	height: 73px;
	width: 226px;
}

/* Global Nav
------------------------------ */

div#globalnav {
	background: url(../images/navigator/bg_gnav_left.gif) no-repeat left top;
	height: 41px;
	float: right;
	margin: 27px 20px 0 0 !important;
	margin-right: 10px;
	padding: 0;
	width: auto;
	_width: 252px; /* Override 100% width on IE6 */
}
div#globalnav ul {
	background: url(../images/navigator/bg_gnav_right.gif) no-repeat right top;
	height: 41px;
	margin: 0;
	overflow: hidden;
	width:auto;
}
div#globalnav ul li {
	float: left;
	margin-right: 4px;
	text-indent: -9999px;
	padding-top:5px;
}
div#globalnav ul li a, span.guest {
	display: block;
	height: 30px;
	background-repeat: no-repeat; 
	text-decoration:none;
}
div#globalnav ul li a:hover { background-position: 0 -30px; }
div#globalnav ul li#welcome {margin: 0 8px;} /* this is the welcome, guest or my profile */
div#globalnav ul li span.guest {background-image: url(../images/navigator/gnav_welcomeGuest.gif);	width: 90px; margin: 0 8px;}
div#globalnav ul li a#help {	background-image: url(../images/navigator/gnav_help.gif);	width: 39px;margin: 0 8px; }
div#globalnav ul li a#login {	background-image: url(../images/navigator/gnav_login.gif);	width: 55px;	}
div#globalnav ul li a#logout {	background-image: url(../images/navigator/gnav_logout.gif);	width: 52px;	}
div#globalnav ul li a#my-profile {background-image: url(../images/navigator/gnav_profile.gif);	width:64px;	}
div#globalnav ul li a#inbox {background-image: url(../images/navigator/gnav_inbox.gif);	width: 85px;	margin: 0 8px; position:relative;}
div#globalnav ul li#gnav-inbox a .inbox-count {
	width: 23px;
	height: 20px;
	display:block;
	position:absolute;
	padding:2px 0 0 0;
	text-indent:0;
	text-align:center;
	background: url(../images/bubbles/green_bubble_mini.png) no-repeat;
	color:#fff;
	font-weight:bold;
	top:6px;
	right:6px;
	
}

/* Search Bar
------------------------- */

div#search-bar {
	background: url(../images/bg_search_bar.gif) right top repeat-x;
	position: absolute;
	bottom: 0;
	left: 0;
	height: 33px;
	width: 951px;
}
div#search-bar form#search { font-size: 12px; }
div#search-bar form#search fieldset {
	position: relative;
	float: right;
	margin: 0;
	padding: 0 0 0 58px;
	overflow: hidden;
	width: 262px;
	height:32px;
	background: url(../images/bg_search_label.gif) 0 1px no-repeat;
}
div#search-bar form#search label { display: none; }
div#search-bar form#search input.text {
	border: solid 1px #3d6072;
	font-size: 10px;
	height: 12px;
	margin: 7px 0 0 0;
	padding: 3px;
	width: 222px;
}
div#search-bar form#search input#search-btn {
	position: relative;
	width: 20px;
	height: 20px;
}

/* Main Nav
------------------------*/

ul#mainnav, ul#mainnav li { list-style: none; }
ul#mainnav {
	position: absolute;
	bottom: 0;
	left: 0;
	margin: 0;
}
ul#mainnav li {
	margin: 0;
	padding: 0;
	float: left;
}
ul#mainnav li a {
	display: block;
	height: 40px;
	text-indent: -9999px;
	background-image: url(../images/navigator/nav_full.gif);
}
ul#mainnav li a#nav-home { width: 76px; }
ul#mainnav li a#nav-groups {
	width: 149px;
	background-position:-76px 0;
}
ul#mainnav li a#nav-videos {
	width: 90px;
	background-position: -225px 0;
}
ul#mainnav li a.selected, ul#mainnav li a#nav-home:hover, body#homepage ul#mainnav li a#nav-home { background-position: 0 -40px; }
ul#mainnav li a#nav-groups:hover, body#community ul#mainnav li a#nav-groups { background-position: -76px -40px; }
ul#mainnav li a#nav-videos:hover, body#videos ul#mainnav li a#nav-videos { background-position: -225px -40px; }

/* Breadcrumbs 
-------------------- */
#breadcrumbs a {	color: #337096;}

/* Main
-------------------- */
#main {
	position: relative;
	overflow: hidden;
}

#main.full {
	background: #c5c5c5 url(../images/bg_dashboard_border.png) repeat-x left top;
	width: 950px;
	margin:0;
	overflow: hidden;
}
/* Content ---------------------- 
note, main box goes above content, as it's full width, not padded.
-------------------- */
#content {
	width: 950px;
	margin: 0;
	overflow: hidden;
}

/* Promo
-------------------- */
div.promo {
	margin-top: 10px;
	overflow: hidden;
}
/* Footer
-------------------- */
#footer {
	color: #949494;
	font-size: 9px;
	margin-top: 25px;
	padding: 0 140px 15px;
	height: 30px;
	width:600px;
	text-align:center;
}
#footer ul#footernav {
	list-style: none;
	margin: 0;
	float:none;
	width:auto;
	text-align:center;
}
#footer ul#footernav li {
	background: none;
	display: inline;
	margin: 0 8px 0 0;
	padding: 0;
}
#footer a {
	color: #6a96ac;
}
#footer a:hover, #footer a:active {
	text-decoration: underline;
	color: #9bc1d4;
}
#footer p.copyright {
	margin: 0;
	/*
	width: 305px;
	float: right;
	*/
	width:auto;
	float:none;
	text-align:center;
}

.error-msg { color: yellow; }


.mootabs_panel {
	display: none;
	clear: both;
}

.mootabs_panel.active {
	display: block;
}

.raised_box
{
	padding-top: 15px;
	padding-left: 15px;
	width: 400px;
	min-height: 130px;
	border-width: 1px;
	border-style: solid;
	border-top-color: #fafafa;
	border-left-color: #fafafa;
	border-right-color: #bababa;
	border-bottom-color: #bababa;
}

.recessed_box
{
	padding-top: 15px;
	padding-left: 15px;
	width: 400px;
	min-height: 130px;
	border-width: 1px;
	border-style: solid;
	border-bottom-color: #fafafa;
	border-right-color: #fafafa;
	border-left-color: #bababa;
	border-top-color: #bababa;
}

.lined_box
{
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 15px;
	width: 400px;
	border-width: 1px;
	border-style: solid;
	border-bottom-color: #bababa;
	border-top-color: #bababa;
	border-left-width: 0px;
	border-right-width: 0px;
}