@charset "utf-8";

* {
	margin:0;
	padding:0;
}

html {
	font-size:100%;
}

body {
	background:url(../tpl/img/main-bg.jpg) #ffffff;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:75%;
	text-align:center;
}

a img {
	border:0;
}

hr {
	background:#EEE;
	border:0;
	height:1px;
}

#wrapper {
	background:url(../tpl/img/wrapper-bg.png) repeat-y;
	margin:0 auto;
	padding-bottom:1px;
	width:949px;
}

#wrapper #header {
	height:378px;
	margin:0 auto;
	position:relative;
	text-align:left;
	width:892px;
}
#wrapper #header #topstrip {
	background:url(../tpl/img/top-bg.jpg) no-repeat #fff;
	height:102px;
}
#wrapper #header #topstrip #logobox {
	background:url(../tpl/img/logobox.png) no-repeat;
	height:102px;
	width:302px;
	margin-left:3px;
}
#wrapper #header #topstrip #logobox .logo {
	margin-left:27px;
	margin-top:7px;
}
#wrapper #header #topstrip #image {
	background:url(../tpl/img/top-image.png);
	height:230px;
}
#wrapper #header #topstrip #image #imagetext {
	float:right;
	width:290px;
}
#wrapper #header #topstrip #image #imagetext .text {
	margin-left:5px;
	margin-top:20px;
}
#wrapper #header #topstrip #image #imagetext #casestudies .linkimg {
	margin-left:5px;
}
#wrapper #header #topstrip #navbg {
	background:url(../tpl/img/nav-bg.jpg);
	height:46px;
}
#wrapper #header #nav {
	height:30px;
	left:1px;
	position:absolute;
	top:333px;
	width:891px;
}

#wrapper #header #nav li {
	background:url(../tpl/img/nav-separator.png) no-repeat top right;
	display:inline;
	float:left;
	height:31px;
	padding:15px 13px 0 10px;
}

#wrapper #header #nav li a {
	color:#FFF;
	text-decoration:none;
	text-transform:uppercase;
}

#wrapper #header #nav li a:hover {
	text-decoration:underline;
}

#wrapper #footer {
	background:url(../tpl/img/footerbg.png) no-repeat;
	clear:both;
	height:100px;
	margin:1px auto 0 auto;
	position:relative;
	width:892px;
}

#wrapper #footer p {
	position:absolute;
	right:22px;
	top:69px;
}
#wrapper #footer #footernav {
	padding-left:10px;
	padding-top:10px;
	text-align:left;

}
#wrapper #footer #footernav li {
	display:inline;
	float:left;
	padding-left:10px;
}

#wrapper #footer #footernav a {
	color:#999;
	text-decoration:none;
	text-transform:uppercase;
	font-size:0.8em;
}
#wrapper #footer #footernav a:hover {
	text-decoration:underline;
}
#wrapper #footer #copyright {
	position:absolute;
	right:490px;
	top:69px;
	color:#999;
	width: 381px;
	text-align:left;
	font-size:0.8em;
}


#wrapper #main {
	background:url(../tpl/img/content-bg.jpg) top left repeat-x #ffffff;
	margin:0 auto;
	text-align:left;
	width:892px;
}

#wrapper #main #content {
	background:url(../tpl/img/content-bg.jpg) top left repeat-x #ffffff;
	width:620px;
	float:left;
	padding-top:30px;
	padding-left:15px;
	padding-right:10px;
}
#wrapper #main #content h1 {
	text-transform:uppercase;
	font-weight:normal;
	font-size:1.5em;
	letter-spacing:-0.1em;
	color:#6d6d6d;
}
#wrapper #main #content h2 {
	text-transform:uppercase;
	font-weight:normal;
	font-size:1.0em;
	letter-spacing:-0.1em;
	color:#6d6d6d;
}
#wrapper #main #content .divider {
	margin-top:20px;
	margin-bottom:20px;
	padding-left:30px;
}
#wrapper #main #sidebar {
	float:left;
	background:url(../tpl/img/content-bg.jpg) top left repeat-x #ffffff;
	width:227px;
	padding-top:30px;
	padding-right:10px;
	padding-left:10px;
}
#wrapper #main #sidebar h3 {
	font-weight:normal;
	font-size:1.0em;
	color:#666;
	text-transform:uppercase;
}
#wrapper #main #sidebar h4 {
	font-weight:normal;
	font-size:1.0em;
	color:#999;
}
#wrapper #main #sidebar a {
	font-weight:normal;
	font-size:1.0em;
	color:#999;
}
#wrapper #main #sidebar a:hover {
	font-weight:normal;
	font-size:1.0em;
	color:#030;
}
#wrapper #main #content p {
	line-height:1.8em;
	margin:0.25em 0 0.75em 0;
}



#wrapper #main #content ul {
	line-height:1.8em;
	padding-left:40px;
}


.clear {
clear:both;
}


/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	/*line-height:	1.0;*/
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			16em; /* left offset of submenus need to match (see below) */
	background:#333;
}
.sf-menu ul li {
	width:			100%;
	padding-right:0 !important;
	padding-left:0 !important;
	background:transparent url(../tpl/img/nav-bg.jpg) repeat scroll 0 0 !important;
}

.sf-menu ul li a {
	padding-left:10px !important;	
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			-2px;
	top:			45px; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			15em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			15em; /* match ul width */
	top:			0;
}

.sf-menu {
	float:			left;
}
.sf-menu a {
	/*border-left:	1px solid #fff;
	border-top:		1px solid #CFDEFF;
	padding: 		.75em 1em;
	text-decoration:none;*/
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			1em;
	top:			.2em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../img/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.2em;
	right:			.42em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../img/shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}
