@charset "utf-8";
/**
* CSS reset file By R.Telford - Carrotmedia Ltd.
* Date: 22-Apr-2008
*/ 

html,s
body
{
	height: 100%;
}

/* This allows 'em' to be used for font-size: 1.2em = 12px and 12pt */
body
{
	font-size: 62.5%;
	background-image: url(images/main_bg.png);
	background-repeat: repeat-x;
		
}

/**
* Following lines borrowed and modified from Eric Meyer: meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
{
	margin: 0px;
	padding: 0px;
	border: 0px;
	font-weight: inherit;
	font-style: inherit;
	font-family: inherit;
	vertical-align: baseline;
}

/* Tables still need 'cellspacing="0"' in the markup. */
table 
{ 
	border-collapse: separate; 
	border-spacing: 0px; 
}

caption, th, td
{
	text-align: left;
	font-weight: normal;
}

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after
{
	content: "";
}

blockquote, q
{
	quotes: "" "";
}

strong
{
	font-weight: bold;
}

.clear
{
	display: block;
	clear: both;
	height: 1px;
}

.form-row
{
	display: block;
	margin: 0px;
	padding: 0px;
	overflow: auto;
	height: auto;
}

.form-label
{
	display: block;
	float: left;
	margin: 0px;
	padding: 0px;
}

.form-field
{
	display: block;
	float: right;
	margin: 0px;
	padding: 0px;
	text-align: left;
}

.form-field-label
{
	font-size: 0.9em;
}

.form-field-column
{
	display: block;
	float: left;
	width: 49%;
}

.form-errors
{
	color: red;
	list-style: none;
}

.show
{
	display: inline;
}

div.show
{
	display: block;
}

.hide
{
	display: none;
}

.centered
{
	text-align: center;
}

.float-left
{
	float: left;
}

.float-right
{
	float: right;
}

/** HEADER NAV STARTS HERE **/

#header-nav 
{
width: 100%;
height: 35px;
background-color: #fff;
}

#header-nav-container 
{
	width: 950px;
	margin: auto;
	height: 35px;
	}

#header-nav-container ul
{
	margin: auto;
	font-family: "Helvetica Neau Bold", Arial, sans-serif;
	font-size: 12px;
	color: #184a7c;
	padding: 10px;
	}

	
#header-nav-container ul li 
{
	display: inline;
	list-style: none;
	margin: 0px;
	padding: 6px;
	}

#header-nav-container ul li a 
{
	color: #184a7c;
	text-decoration: none;
	padding: 6px;
	margin: 0px;
}	

#header-nav-container ul li a:hover 
{
	color: #fff;
	text-decoration: none;
	background-color: #184a7c;
	padding: 10px 6px;
	margin: 0px;
}	

#header-nav-container ul li a.selected 
{
	color: #fff;
	background-color: #184a7c;
	padding: 0px;
	margin: 0px;
}

#top-grad 
{
height: 24px;
width: 100%;
background-image: url(images/top_grad.png);
background-repeat: repeat-x;
clear: both;
}

#ssjheader {
height: 146px;
width: 960px;
margin: auto;
clear: both;
}

#mainimg 
{
	height: auto;
	width: 960px;
	margin: auto;
	clear: both;
	margin-top: 10px;
}

#breadcrumbs 
{
	width: auto;
	float: left;
	height: auto;
	margin: 10px 0px 10px 0px;
	clear: both;
	padding: 5px;
	
}

#breadcrumbs p
{
	font-size: 12px;
	font-family: Helvetica, Arial, sans-serif;
	color: #000;
	font-weight: bold;
}

#breadcrumbs p a 
{
	color: #000;
	text-decoration: none;
	font-weight: normal;
}

#breadcrumbs p a:hover 
{
	color: #fff;
	border-bottom: 1px solid #fff;
}
	

/** END OF TOP HALF STYLING **/

/** START OF CONTENT STYLING FOR HOMEPAGE **/

#wrapper {
width: 960px;
margin: auto;
height: auto;
clear: both;
}

#company-intro 
{
width: 410px;
height: 200px;
border: 5px solid #3b69ab;
float: left;
margin-top: 20px;
margin-bottom: 30px;
background-image: url(images/ssj_home_content_top.png);
background-position: top;
background-repeat: no-repeat;
clear: left;
}

#company-intro h1 {
	font-weight: bold;
	font-family: Helvetica, Arial,sans-serif;
	font-size: 11px;
	padding: 8px;
	color: #fff;
	}
	
#company-intro p {
	font-family: Helvetica, Arial,sans-serif;
	font-size: 11px;
	padding: 8px;
	color: #fff;
	line-height: 1.7em;
	}
	
#company-intro p a {
	border-bottom: 1px solid #fff;
	color: #fff;
	text-decoration: none;
	}



#what-we-do 
{
width: 250px;
height: 200px;
border: 5px solid #3b69ab;
float: left;
margin: 20px 10px 30px 10px;
background-image: url(images/whatwedo.png);
background-position: top;
background-repeat: no-repeat;
}

#what-we-do h2 {
	font-weight: bold;
	font-family: Helvetica, Arial,sans-serif;
	font-size: 11px;
	padding: 8px;
	color: #fff;
	}
	
#what-we-do p {
	font-family: Helvetica, Arial,sans-serif;
	font-size: 11px;
	padding: 8px;
	color: #fff;
}
	
#what-we-do ul {
	font-family: Helvetica, Arial,sans-serif;
	font-size: 11px;
	padding: 6px 0px 2px 25px;
	line-height: 1.4em;
	color: #fff;
	margin: auto;
	}
	
#what-we-do ul li {
	font-family: Helvetica, Arial,sans-serif;
	font-size: 11px;
	padding: 0px;
	color: #fff;
	}
	
#what-we-do ul li a {
	color: #f9f9f9;
	text-decoration: none;
	}
	
#what-we-do ul li a:hover {
	color: #f9f9f9;
	text-decoration: none;
	font-weight: bold;
	}


#news 
{
width: 250px;
height: 200px;
border: 5px solid #3b69ab;
float: right;
margin: 20px 0px 30px 0px;
background-image: url(images/whatwedo.png);
background-position: top;
background-repeat: no-repeat;
}

#news h2 {
	font-weight: bold;
	font-family: Helvetica, Arial,sans-serif;
	font-size: 1.1em;
	padding: 8px;
	color: #fff;
	}
	
#news p {
	font-family: Helvetica, Arial,sans-serif;
	font-size: 11px;
	padding: 3px 8px;
	color: #fff;
	line-height: 1.7em;
	}
	
#news p a {
	border-bottom: 1px solid #fff;
	}
	
/** CONTENT STYLING STARTS HERE **/

#content 
{
	width: 960px;
	margin-top: 10px;
	clear: both;
	height: auto;
	margin-bottom: 30px;
	overflow: auto;
}

#content h1 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 32px;
	font-weight: normal;
	text-align: left;
	color: #fff;
	padding: 10px 0px 20px 5px;
	}
	
#content h2 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 26px;
	text-align: left;
	color: #fff;
	padding: 20px 0px 10px 5px;
	font-weight: normal;
	}
	
#content h3 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	text-align: left;
	color: #fff;
	}
	
#content p {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 14px;
	text-align: left;
	color: #fff;
	padding: 5px 0px 5px 5px;
	line-height: 1.5em;
	}
	
#content p a {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	}
	
#content p a:hover {
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	text-decoration: underline;
	}
	
	.content-img {
		margin: 10px;
		border: 3px solid #fff;
		}
	
	
/** END OF CONTENT SYLING **/

.bottom-links 
{
	width: auto;
	height: auto;
	float: left;
	margin:5px 19.5px;
	clear: right;
}

.bottom-links img {
	border: none;
	}


/** CONTACT US PAGE INFO **/
#contact-box {
	float: right;
	}
	
#map 
{
	width: 300px;
	height: auto;
	float: left;
}

#map h1 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 32px;
	font-weight: normal;
	text-align: left;
	color: #fff;
	padding: 10px 0px 20px 5px;
	}
	
#map h2 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 26px;
	text-align: left;
	color: #fff;
	padding: 20px 0px 10px 5px;
	font-weight: normal;
	}
	
#map h3 {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	text-align: left;
	color: #fff;
	}
	
#map p {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 14px;
	text-align: left;
	color: #fff;
	padding: 5px 0px 5px 5px;
	line-height: 1.5em;
	}
	
#map p a {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	}
	
#map p a:hover {
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	text-decoration: underline;
	}

#footer 
{
width: 960px;
margin: auto;
height: 50px;
border-top: 2px solid #fff;
clear: both;
margin-top: 20px;
}

#footer-left {
	float: left;
	width: 400px;
	height: auto;
	}
	
#footer-left p {
	font-size: 11px;
	color: #fff;
	font-family: Helvetica, Arial, sans-serif;
	text-align: left;
	padding: 5px 0px;
	}
	
#footer-right 
{
	float: right;
	width: 400px;
	height: auto;
}
	
#footer-right p 
{
	font-size: 11px;
	color: #fff;
	font-family: Helvetica, Arial, sans-serif;
	text-align: right;
	padding: 5px 0px;
}
	
#footer-right p a 
{
	color: #fff;
	text-decoration: none;
}

#footer-right p a:hover 
{
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid #fff;
	}