x
/* - - - - - - - - - - - - - - - - - - - - -

Title :    JMARK
URL :      http://jmark.com

Created :  06.02.2009
Modified : 07.22.2010

- - - - - - - - - - - - - - - - - - - - - */

/* - - - - - - - - - - - - - - - - - - - - -    G L O B A L - R E S E T    - - - - - - - - - - - - - - - - - - - - - */

/*
	v1.0 | 20080212 
	http://meyerweb.com/eric/tools/css/reset/
*/
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,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

del { text-decoration: line-through; }
ins { text-decoration: none; background: #ffc; }

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

/* remember to define focus styles! */
:focus { outline: 1px dashed #888; }

/* - - - - - - - - - - - - - - - - - - - - -    H T M L - E L E M E N T S	    - - - - - - - - - - - - - - - - - - - - - */

body {
	font: 62.5% Tahoma, Helvetica, Arial, Verdana, sans-serif;
	background: #fff url(../img/jmark_body_bg.jpg) repeat-x center bottom;
	color: #767676;
}

html>body { font-size: 10px; }

/* Anchor Links */
a:link { color: #00f; text-decoration: none; }
a:visited { color: #00f; text-decoration: none; }
a:hover {  color: #00f; text-decoration: underline; }
a:active {  color: #00f; text-decoration: underline; }


/* Text Elements */
p { font-size: 1.2em; margin: 0 0 1.75em; line-height: 1.6em; }
ul, ol, dl, blockquote, pre { font-size: 1em; margin: 0 0 1.75em; line-height: 1.4em; }
#main-content ul, ol, dl, blockquote, pre { font-size: 1.2em; margin: 0 0 1.75em 1.25em; line-height: 1.4em; }
blockquote { padding: 0 1.25em; }
small, cite { font-size: 0.9em; }
strong, b, dt, th { font-weight: bold; }
address, cite, em, i, caption, dfn, var { font-style: italic; }

ul, ol { margin: 0 0 2em 1em; }
ul li, ol li { margin-left: 1em; line-height: 1.6em; }

ul { list-style-type: square; }
ul ul { list-style-type: disc; }
ul ul ul { list-style-type: circle; }
ul ul ul ul { list-style-type: square; }

ol { list-style-type: upper-roman; }
ol ol { list-style-type: upper-alpha; }
ol ol ol { list-style-type: lower-roman; }
ol ol ol ol { list-style-type: lower-alpha; }

dl { margin-bottom: 2em; }
dt { font-weight: bold; }
dd { margin-bottom: 1em; padding-left: 1.5em; }

del { text-decoration: line-through; }
address, abbr, acronym { font-style: normal; }
acronym, abbr { border-bottom: 1px dotted #333; cursor: help; }
acronym { text-transform: uppercase; }
pre, kbd, code, samp, tt, var { font-family: "Courier New", Courier, monospace monospace; }

sub { font-size: .9em; line-height: 1em; vertical-align: sub; }
sup { font-size: .9em; line-height: 1em; vertical-align: super; }

/* Tables */
table {	margin: 0 0 1.5em; }
caption { text-align: left; }
th, td { padding: .25em .5em; }
tbody td, tbody th { border: 1px solid #999; }
tfoot { font-style: italic; }


/* - - - - - - - - - - - - - - - - - - - - -    G L O B A L - S T Y L E S    - - - - - - - - - - - - - - - - - - - - - */
	
/*
	slightly enhanced, universal clearfix hack
	http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack/
*/
.clearfix, #content:after {
	clear: both;
	display: block;
	visibility: hidden;
	font-size: 0;
	content: " ";
	height: 0;
}

.clearfix, #content { display: inline-block; }

/* start commented backslash hack \*/
* html .clearfix, * html #content { height: 1%; }
.clearfix, #content { display: block; }
/* close commented backslash hack */

ul.nav, ul.nav li { margin: 0; list-style: none; }

h3 { 
	font: bold 1.2em "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif; 
	padding: 0.5em 1em; 
}


/* - - - - - - - - - - - - - - - - - - - - -    M A I N - L A Y O U T    - - - - - - - - - - - - - - - - - - - - - */
	
#wrapper {
	margin: 0 auto;
	width: 977px;
	text-align: left;
}

#header {
	position: relative;
	height: 194px;
	margin: 7px 0;
	background-color: #000;
	color: #fff;	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

#header h1 a {
	position: absolute;
	top: 24px;
	left: 28px;
	width: 340px;
	height: 160px;
	text-indent: -9999em;
	overflow: hidden;
	background: url(../img/jmark_logo.jpg) no-repeat 0 0;
}

#header p {
	position: absolute;
	top: 120px;
	right: 18px;
	width: 347px;
	height: 34px;
	text-indent: -9999em;
	overflow: hidden;
	background: url(../img/jmark_tagline.gif) no-repeat 0 0;
}

#home #header p {
	position: absolute;
	top: 30px;
	right: 18px;
	width: 407px;
	height: 144px;
	text-indent: -9999em;
	overflow: hidden;
	background: url(../img/jmark_tagline_home.gif) no-repeat 0 0;
}

/* GLOBAL NAVIGATION */
#menu {
	width: 977px;
	height: 45px;
}

ul.global { 
	position: relative;
	float: left;
	width: 854px;
}

ul.global li { float: left;
	position: relative; }

ul.global li ul {
	z-index: 100;
	display: none;
	position: absolute;
	top: 38px;
	left: -10px;
	border-top: 1px solid #333;
	border-right: 1px solid #333;
	border-left: 1px solid #333;
}

ul.global li ul li {
	float: none;
	border-bottom: 1px solid #333;
}

ul.global li a { 
	display: inline-block;
	display: block;
	text-indent: -9999em;
	overflow: hidden;
	height: 38px;
	background-image: url(../img/nav_sprite.jpg);
	background-repeat: no-repeat;
}

ul.global li ul li a {
	font-size: 1.2em;
	text-indent: 0;
	background-image: none;
	background-color: #fff;
	color: #333;
	text-decoration: none;
	padding: 3px;
	height: auto;
}

ul.global li ul li a:hover { 
	background-color: #000;
	color: #fff;	
}

ul.global li:hover ul {
	display: block;
}

ul.global li#gn-products a { width: 122px; background-position: 0 0; }
ul.global li#gn-people a { width: 122px; background-position: -122px 0; }
ul.global li#gn-history a { width: 122px; background-position: -244px 0; }
ul.global li#gn-about a { width: 122px; background-position: -366px 0; }
ul.global li#gn-news a { width: 122px; background-position: -488px 0; }
ul.global li#gn-contact a { width: 122px; background-position: -610px 0; }
ul.global li#gn-jobs a { width: 122px; background-position: -732px 0; }

/* SEARCH FORM */
#search-form {
	float: right;
	width: 123px;
	height: 38px;
	background: url(../img/nav_sprite.jpg) no-repeat right top;
}

#search-form label {
	position: relative;
	display: block;
	width: 123px;
	height: 38px;
	text-indent: -9999em;
	overflow: hidden;
}

#search-form input {
	position: absolute;
	top: 12px;
	left: 26px;
	width: 86px;
	height: 14px;
	border: none;
	background: none;
}


/* CONTENT */
#content {
	position: relative;
	clear: both;
	padding: 0 20px 32px 20px;
	border: 1px solid #A09F9F;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background: #fff;
	min-height: 800px;
}

/* begin variables */

	body#home #main-content { width: 407px; padding: 32px 0 0 294px; }
	body#page.about_us #main-content { width: 507px; padding: 32px 0 0 184px; }
	body#page #main-content { width: 750px; padding: 22px 0 0 175px; }

/* end variables */

#main-content {
	position: relative;
	float: left;
}

#main-content h1 {
	margin: 0 0 1em;
	font-size: 1.4em;
	color: #4560BD;
}

#main-content h2 {
	margin: 0 0 1em;
	font-size: 1.4em;
	color: #4560BD;
}

#main-content h2.redtext {
	margin: 0 0 0em;
	font-size: 1.4em;
	color:#C00;
}

#main-content h3 {
	margin: 0 0 1em 0;
	padding: 0;
	font-size: 1.2em;
	color: #4560BD;
}

#main-content p {margin:0 0 1em 0;}

span.bluetext {
	color: #4560BD;
	}
span.redtext {
	color:#C00;
	}

body#home #main-content img { margin: 0 0 20px; }

.column2 {
	float: left;
	width: 350px;
	padding: 0 20px 0 0;
}

.caption {
	float: left;
	margin-right: 20px
}

.caption img {
	margin: 0;
	padding: 0;
}

.caption cite {
	color: #4560BD;
	display: block;
	font-size: 1.2em;
	font-weight: bold;
	padding: 6px 0;
	border-bottom: 1px solid #4560BD;
}

/* TESTIMONIALS */
#testimonials {
	position: relative;
	float: right;
	width: 210px;
	height: 644px;
	padding: 10px 0 0 0;
	margin: 32px 0 0;
	background: url(../img/jmark_testimonial_bg.jpg) no-repeat center top;
	color: #535353;
}

#testimonials h3 { color: #4560BD; }

#testimonials p { line-height: 1.4em; }

#testimonials blockquote { background: url(../img/quotes.png) no-repeat right bottom; }

/* IMAGE OF JMARK */
#imageofjmark {
	position: relative;
	float: right;
	width: 210px;
	height: 644px;
	padding: 10px 0 0 0;
	margin: 32px 0 0;
	background: url(../img/jmark_image_bg.jpg) no-repeat center top;
	color: #535353;
}

#imageofjmark h3 { color: #4560BD; }

#imageofjmark p { line-height: 1.2em; font-size:1.1em; }

#imageofjmark blockquote {  }


/* SUB-MENU NAVIGATION */

/* begin variables */

	body#home #sub-content { width: 275px; }
	body#home ul.popular-links li a { height: 33px; padding: 22px 10px 0 58px; }
	body#home ul.business-links li a { width: 253px; }
	
	body#page #sub-content { width: 155px; font-size: 0.9em; }
	body#page ul.popular-links li a { height: 42px; padding: 14px 10px 0 58px; }
	body#page ul.business-links li a { width: 133px;  }

/* end variables */

#sub-content {
	position: absolute;
	top: 12px;
	left: 12px;
	border: 1px solid #A09F9F;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	background: #000;
	color: #fff; 
}

#sub-content h3 { text-transform: uppercase; }

#sub-content p {
	margin: 0;
	padding: 0 12px 8px 12px;
	font-size: 1.2em;
	text-align: center;
}

#sub-content p strong {
	display: block;
	font: bold 1.3em "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif;
}

/* Popular Links */
ul.popular-links li a, 
ul.popular-links li a:visited {
	display: inline-block;
	display: block;
	background-color: #fff;
	background-image: url(../img/jmark_icon_sprite.jpg);
	background-repeat: no-repeat;
	color: #818181;
	font-size: 1.3em;
	text-transform: uppercase;
	border-top: 1px solid #A09F9F;
	border-bottom: 1px solid #D1D1D1;
}

ul.popular-links li#pl-remote a { background-position: 4px 4px; }
ul.popular-links li#pl-support a { background-position: 4px -48px; }
ul.popular-links li#pl-employee a { background-position: 4px -100px; }
ul.popular-links li#pl-office a { background-position: 4px -152px; }

/* Business Links */
ul.business-links {
	float: left;
	margin: 0 0 6px 0;
	background: #d7d7d7;
}

ul.business-links li { float: left; }

ul.business-links li a,
ul.business-links li a:visited {
	float: left;
	display: inline-block;
	display: block;
	padding: 6px 10px;
	color: #5A5959;
	font-size: 1.3em;
	text-transform: uppercase;
	border-top: 1px solid #EBEBEB;
	border-right: 1px solid #A09F9F;
	border-bottom: 1px solid #A09F9F;
	border-left: 1px solid #EBEBEB;
}


/* FOOTER NAVIGATION */
#footer {
	text-align: center;
	width: 977px;
	font-size: 1.2em;
}

#footer-nav {
	margin: 0 auto 4em auto;
	overflow: hidden;
	width: 36em;
}

#footer-nav ul {
	list-style: none;
	margin: 0;
	padding: 1em 0 0;
}

#footer-nav li {
	border-left: 1px solid #6C6C6C;
	float: left;
	line-height: 1em;
	margin: 0 .5em 0 -.5em;
	padding: 0 .5em 0 .5em;
	white-space: nowrap;
} 

#footer-nav li a,
#footer-nav li a:visited {
	color: #6C6C6C;
}



.partnerlogo {
	width:164px
	height:112px;
	float:left;
	margin-right:15px;
	margin-bottom:15px;
	border:2px solid #e8e8e8;
}

.partnerlogo2 {
	width:164px
	height:112px;
	float:right;
	margin-left:15px;
	margin-bottom:15px;
	border:2px solid #e8e8e8;
}

.imgleft {
	float:left;
	margin-right:10px;
	margin-bottom:15px;
}

.imgright {
	float:right;
	margin-left:10px;
	margin-bottom:15px;
}

.grayborder {
	border:3px solid #e8e8e8;
}

.clear {
	clear:both;
	height:1px;
	overflow:hidden;
}

ul#offerings {
	list-style-type:none;
	margin-left:0px;
	width:750px;
}

ul#offerings li {
	width:350px;
	margin-right:20px;
	float:left;
	margin-left:0px;
}

/* Homepage Slideshow */

.slideshow img {
	width: 407px;
	height: 309px;
	border: 1px solid #999;
	-webkit-border-radius: 9px;
	overflow: hidden;
}