/* -------------------------------------
/*  html, body
/* -------------------------------------*/

html {
	background-color:		#3B7193;
	color:					#666;
	text-align:				center; 
	font-style:normal; 
	font-variant:normal; 
	font-weight:normal; 
	font-size: 0.75em; 
	font-family: Arial, Helvetica, sans-serif;	
	overflow-y: scroll; 
}


html, body {
	margin:					0;
	padding:				0;
}

body {
	text-align:				left;
	line-height:			1em;
}


/* -------------------------------------
/*  Baseline values for browser consistency
/* -------------------------------------*/

p, div, h1, h2, h3, h4, ul, li, form, input, select, option {
	margin:					0;
	padding:				0;
}

img {
	margin:					0;
	padding:				0;
	border:					0px none;
}

ul {
	list-style:				none;
}

a {
	outline:				0;
}


/* -------------------------------------
/*  default links
/* -------------------------------------*/

a:link, a:visited {
	color:					#0e7fc7;
	text-decoration:		none;
}

a:hover {
	text-decoration:		underline;
}

.clear {
	clear:					both;
	height:					0px;
	font-size: 0px;
	line-height: 0px;
}

/*-------------------------------------------------------------------------
     Wrapper - ensures that the website sits in the middle of the screen
-------------------------------------------------------------------------- */
#wrapper 
{
	width: 925px;   /** BCMS - width of the main window **/
	height:100%; 
	margin:auto; 
	vertical-align:top; 
}


/*-------------------------------------
 	Header
---------------------------------------*/

#header {
	clear:					both;
	background-color:		#3B7193;
}

#login {
	float:					right;
	text-align: 			right;
	height:					74px;
	padding-top: 			30px;
	padding-right:			10px;
	color:					#334550;
	font-size:				18px;
	line-height:			24px;
}

#login img {
	vertical-align:			sub;
	padding-right:			3px;
}

#login .greeting {
	color:					#fffffe;
}

#login a:link, #login a:visited {
	color:					#fffffe;
}


/*-------------------------------------
 	SiteNav
---------------------------------------*/

#siteNav {
	background:				#0c1216;
}

#siteNav ul {
	margin-left:			15px;
	padding-top:			4px;
	z-index:				1;
}

#siteNav li {
	float:					left;
	position:				relative;
	top:					0;
	left:					0;
	font-size:				12px;
	text-align:				center;
}

#siteNav a {
	text-decoration:		none;
	display:				block;
}

#siteNav li a {
	padding:				8px 12px 8px 12px;
	font-size: 				1.2em;
	color: 					#fffffe;
}

#siteNav li a:hover {
	color:					#57b3e2;
}

#siteNav li.current a { 
	background-color: 		#ffffff; 
	color: 					#0c1216; 
	border-bottom: 			1px solid #fff; 
	margin-bottom:			-1px;
}

#siteNav li.current a:hover {
	color:					#0c1217;
}

#siteNav ul:after {
    content:				"."; 
    display:				block; 
    height:					0; 
    clear:					both; 
    visibility:				hidden;	
}


/*-------------------------------------
 	WrapperWit
---------------------------------------*/

#wrapperwit { background-color:	#ffffff; border-top: 1px solid #fffffe; }

/*-------------------------------------
 	Content
---------------------------------------*/

#content {
	width: 					900px;
	background-color:		#ffffff; 
	color:					#222;
	padding-top:			30px;
	padding-left: 			12px; 
	padding-right: 			12px; 
	padding-bottom:			6px;
}

#container-1 {
	background: #57b3e1;  
	width: 901px;
	padding-top: 20px;
	margin: 0;
	height:260px;
}

#container-1 p { color: #fffffe;	line-height: 18px;	padding-bottom: 10px; }
	

/*------------------
xxxx
-------------------------*/

.informationSet {
	border-top:1px solid #ccc;
	clear:both;
	color:					#8ba9bc;
	color:					#000;
	color:					#24495e;
	margin:				    0;
	font-size:				11px;
	line-height:			18px;
	text-align:				center;
}

.informationSet a:link, .informationSet a:visited {
	color:					#24495e;
	font-weight: bold;
}

.user_types {
	padding: 25px 0 25px 13px;
	width: 550px;
	float: left;
}

.user_types p {
	padding: 5px 0;
	line-height: 14px;
	letter-spacing:	0px;
}

.featured_user{
	float: right;
	width: 300px;
	padding: 25px 10px 25px 0;

}

.featured_user .screenshot{
	padding: 3px;
	background-color: #ffffff;
	border: 1px solid #ccc;
	margin-bottom: 7px;
	color: #394852; 
}

.featured_user p{
	padding-bottom: 6px;
	padding-left: 7px;
	padding-right: 7px;
	letter-spacing:	0px;
	line-height: 14px;
}

.featured_user p.title {
	font-weight: bold;
	line-height: 16px; 
}

.featured_user p.title em{
	font: italic 12px georgia, 'times new roman', serif;
}

.featured_user blockquote {
	padding: 0;
	margin: 0;
	font: normal 12px/16px georgia, 'times new roman', serif;
	color: #394852; 
}

.featured_user ul {
	line-height: 16px;
}

.featured_user li {
	line-height: 16px;
}

.text-column {
	padding: 0 0 15px 13px;
	width: 450px;
	float: left;
	font-size: 1.2em;
	line-height: 15px;

}

.text-column h2 { padding-bottom: 20px; }

.image-column{
	float: right;
	width: 400px;
	padding: 25px 10px 25px 0;

}

.portfolio {
	clear: both;
	width: 885px;
	padding: 13px 0 0 13px;
	float: left;
	background-color: #ddd;
}

.portfolio img { 
	padding-right: 17px;
	padding-bottom: 10px;
}

.portfolio2 {
	clear: both;
	width: 885px;
	padding: 13px 0 0 13px;
	float: left;
	background-color: #ddd;
	text-align: center;
}

.portfolio2 img { 
	padding-right: 16px;
	padding-bottom: 10px;
}

.text-full-width {
	padding: 0 0 15px 13px;
	width: 885px;
	float: left;
	font-size: 1.2em;
	line-height: 15px;

}

/* Tabs - important styles to ensure accessibility in print */

@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}
@media print {
    .anchors {
        display: none;
    }
}

/* Tabs - not important for accessibility, just for the look of it... */