/*
JZ CSS file organization
-----------------
[1] General - All general items, browser specific hacks
[2] Header - All things specific to the header
[3] Menu - All things specific to the menu
[4] Main Content - All things specific to the main content
[5] Page Specific - Things which are specific to a particular page
[7] Footer - Things which are page and section specific


*/

/*---------[1]General---------*/
/* Joe Edit - ul, li, ol were taken out so lists indent */
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, 
dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td 
{outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;padding:0;}

body {background-position:0% 0%;width:100%;font:11px/20px "Lucida Grande", Tahoma, sans-serif;color:#000000;margin:0 auto;padding:0;}

a:link{color:#000000;}, a:visited {color:#1e9be4;text-decoration:none;}
a:hover {color:#1e9be4;text-decoration:underline;}
a:active {color:#1e9be4;text-decoration:none;}

:focus {outline:0;}

h1 {font:normal 2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;margin:0;padding:0 0 10px 0;}
h2 {font-size:24px;color:#676767;margin:0;padding:5px 0 0 0;}
h3 {font-size:16px;color:#676767;margin:0;padding:5px 0 0 0;}
h4 {font-size:18px;color:#777777;letter-spacing:-1px;margin:0;padding:5px 0 0 0;}
h5 {font-size:14px;color:#777777;margin:0;padding:5px 0 0 0;}

p {margin:0;color:#000000;}

/*Joe Edit - table - border-collapse:collapse; IE fix */
table {margin:0 0;}    
table thead thtable tfoot th, table tfoot td {padding:0 15px;}
table tbody th, table tbody td {padding:0 0px;}
table thead th {background:url('../img/bg.jpg') repeat-x;color:#fff;}
table tbody tr.alt {background-color:#eee;}
table tfoot tr th, table tfoot tr td {background-color:#ddd;}

form {margin:30px 0 0;padding:0;}
form fieldset {position:relative;margin:0;padding:10px 30px;}
form fieldset legend {display:inline;white-space:normal;}     
form fieldset br {clear:both;}
form fieldset label {clear:left;display:block;float:left;width:150px; vertical-align:middle;margin:1.5em 10px 0 0;} 
form fieldset input, form fieldset select,form fieldset textarea {vertical-align:middle;width:65%;margin-top:1em;padding:6px 8px;}
form fieldset select {width:68%;}    
form fieldset input[type="radio"],form fieldset input[type="checkbox"] {width:auto;margin-left:0;margin-top:1.5em;padding:0;}
form fieldset .small {width:20%;}
form fieldset select.small {width:23%;}
form fieldset .med {width:40%;}
form fieldset select.med {width:43%;}
form fieldset button {overflow:visible;vertical-align:middle;width:auto;margin:1em 15px 1em 160px;padding:5px 7px;} 
form fieldset fieldset {margin:1em 0 0.5em 160px;padding:0;}
form fieldset fieldset legend span {position:absolute !important;left:-160px;width:150px;}    
form fieldset fieldset input[type="radio"],form fieldset fieldset input[type="checkbox"] {margin-top:0;}
form fieldset fieldset label {clear:none;float:none;display:inline;margin-right:0;}   

pre, code, blockquote {display:block;clear:both;margin:25px 0;padding:15px;}

blockquote { background:#fff;padding-top:0;padding-bottom:20px;} 
blockquote > div {padding:1px;}
blockquote p {margin-bottom:0;}

.left {float:left !important;}
.right {float:right !important;}
.clear {clear:both;}

.hide {display:none;}

strong {font-weight:bold;}

img.ImageLeft {float:left; margin-right:5px; margin-bottom:5px; margin-top:5px; border:1px solid black;}
img.ImageRight {float:right; margin-left:5px; margin-bottom:5px; margin-top:5px;; border:1px solid black;}
img.ImageCenter {display:block; margin-left:auto; margin-right:auto; border:1px solid black;}

#container {background-color:#fff;width:900px;min-height:100%;height:auto !important;height:100%;text-align:left;margin:115px auto -120px auto;}

/*---------[2]Header---------*/

#top {width:900px;height:128px;background: url('../images/bg-top.png') no-repeat left;!background: url('../images/bg-top.gif') no-repeat top left;}
#top h1 {background:transparent url('../images/logo.png') no-repeat top left;!background:transparent url('../images/logo.gif') no-repeat top left;float:left;text-indent:-9999px;width:150px; height:40px;margin:70px 0 0 25px;}

#SearchBox{float:right;color:#fff;font-weight:bold;font-family:inherit;font-size:11px;margin-top:63px;margin-right:15px;}

#menuwrapper {padding-top:98px;}

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

#spotlight {background: url('../images/bg-spotlight.jpg') no-repeat top right;width:900px;position:relative;}
#spotlight img.preview {float:right;}

.spotlight-item {float:left;position:relative;display:inline;width:820px;margin:15px 50px 0;overflow:hidden;}
.spotlight-item h2 {color:#2a2a2a;font:48px Arial, Helvetica, Verdana, sans-serif;font-weight:bold;margin:0 0 15px 0;}
.spotlight-item p {color:#444;font:11px/18px Arial, Helvetica, Verdana, sans-serif;padding:0 0 0 2px;}
.spotlight-item .description {width:260px;margin:40px 0 0 10px;}
.spotlight-item img {position:absolute;top:0; right:0;}



#item {width:820px;}


.launch {background:url('../images/launch.png') top left no-repeat;display:block;width:95px;height:25px;text-indent:-9999px;cursor:pointer;margin:10px 0 0 -1px;}

.pause {background:url('../images/pause.png') top left no-repeat;display:block;width:97px;height:25px;text-indent:-9999px;position:absolute;bottom:2px; right:20px;cursor:pointer;}

/*---------[3]Menus---------*/

#nav {padding:0; margin:0;list-style:none;}

#nav li.top {display:block; float:left; }
#nav li a.top_link {display:block; float:left; color:#ccc; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 0px; cursor:pointer;background:none;}
#nav li a.top_link span {float:left; display:block; padding:0 10px 0 10px;  background:none right top no-repeat;}
#nav li a.top_link span.down {float:left; display:block; padding:0 10px 0 10px; background:none no-repeat right top;}

#nav li:hover a.top_link {color:#fff; background:#2c435b none no-repeat;}
#nav li:hover a.top_link span {background:none no-repeat right top;}
#nav li:hover a.top_link span.down {background:none no-repeat right top;}


#nav li:hover {position:relative; z-index:200;}

#nav li:hover ul.sub {left:-1px; top:20px; background:#fff; padding:0; white-space:nowrap; width:125px; height:auto; z-index:300; border-left:2px inset black; border-bottom:2px inset black;}
#nav li:hover ul.sub li {display:block; height:20px; position:relative; float:left; width:125px; font-weight:normal;  border-top:1px solid #dddddd; }
#nav li:hover ul.sub li a {display:block; font-size:11px; line-height:20px; text-indent:5px; color:#000; text-decoration:none;}
#nav li ul.sub li a.fly {background:#bbd37e   no-repeat;}
#nav li:hover ul.sub li a:hover {background:#2c435b; color:#fff; border-color:#fff;}
#nav li:hover ul.sub li a.fly:hover {background:#2c435b  no-repeat; color:#fff;}


#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:115px; top:-4px; background:#fff; padding:0; white-space:nowrap; width:125px; z-index:400; height:auto; border-left:2px inset black; border-bottom:2px inset black;}

#nav ul, 
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#nav li:hover li:hover a.fly,
#nav li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover li:hover a.fly
{background:#2c435b 80px 6px no-repeat; color:#fff; border-color:#fff;} 

#nav li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li:hover li a.fly
{background:#bbd37e  80px 6px no-repeat; color:#000; border-color:#bbd37e;} 


#navOptions {list-style-type:none; position:relative; margin: -6px 0 0; padding:0; width:900px; height:137px;z-index:99;}
#navOptions li {position:absolute; margin:0; padding:0;z-index:201;}
#navOptions a {position:absolute; top:0; background: url('../images/menu-large.jpg') no-repeat; height:137px; text-indent:-9999px; overflow:hidden;}
	
#apply a {left:0; width:303px; background-position:0 0;}
#why a {left:303px; width:323px; background-position:-303px 0;}
#support a {left:626px; width:274px; background-position:-626px 0;}
	
#apply a:hover {background-position:0 -137px;}
#why a:hover {background-position:-303px -137px;}
#support a:hover {background-position:-626px -137px;}


/*---------[4]Main Content---------*/

.container_12,.container_16{width:960px;margin-left:auto;margin-right:auto;}

.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16{display:inline;float:left;margin-left:10px;margin-right:10px;}

.container_12 .grid_3,.container_16 .grid_4{width:220px;border-right:1px solid #ccc;padding-right:10px;}
.container_12 .grid_6,.container_16 .grid_8{width:460px;}
.container_12 .grid_9,.container_16 .grid_12{width:600px;}
.container_12 .grid_12,.container_16 .grid_16{width:940px;}

.alpha {margin-left:0;}
.box {padding:10px;}

#topcontainer {width:900px;min-height:50px;height:auto !important;height:50px;text-align:left;margin:0 auto -120px auto;}

#mainContent {background:url('../images/bg-maincontent.jpg') no-repeat top left;!background:none;min-height:400px;border-left:medium solid #d8d8d8;border-right:medium solid #d8d8d8; margin:1px 0 0 0;}

#mainContent2 {min-height:400px; border-left:medium solid #d8d8d8;border-right:medium solid #d8d8d8;}

#topMain {overflow:hidden; margin:0 0 20px 0;padding:30px 0 0 18px;!padding:20px 0 0 18px;}


#content {width:960px;margin-left:-10px;padding:0 10px 20px;}
#content > div {width:880px;padding:0 0px 0px;}   
#content #main {float:left;width:550px;}
#content #content_right {float:left;width:675px;margin-right:25px;}
#content .col {float:left;width:240px;margin-top:30px;margin-bottom:30px;}
#content .hr-bottom + .col, #content .hr-bottom + .col + .col {margin-top:0;}
#content .col > h2 {padding-top:0;}
#content #sub {float:left;width:200px;margin:10px 10px 10px 40px;}
#content #category {float:left;width:135px;margin:0;}
#content #latest-work li {position:relative;}
#content #latest-work p {float:none;margin-left:0;margin-top:15px;}
#content #latest-work .details {position:absolute;top:17px;left:17px;width:177px;height:140px;padding:0 15px;}
#content #latest-work li:hover .details {display:block;}
#content #latest-work .details p {line-height:1.5em;font-size:0.9em;}
.js #content #latest-work li:hover .details {display:none;}


#breadcrumb {margin:0 -40px 10px;padding:0 40px;} 
#home #breadcrumb {height:15px;line-height:0;margin-bottom:0;}

#subpage {background: #fff url('../images/bg-new.jpg') no-repeat top center ;margin:0;}
#subpage2 {background: #fff url('../images/bg-new.jpg') no-repeat top center ;margin:0;}
#subpage3 {background: #fff url('../images/bg-new.jpg') no-repeat top center ;margin:0;}
#subpage4 {background: #fff url('../images/bg-new.jpg') no-repeat top center ;margin:0;}
#subpage5 {background: #fff url('../images/bg-new.jpg') no-repeat top center ;margin:0;}
#subpage6 {background: #fff url('../images/bg-new.jpg') no-repeat top center ;margin:0;}
#subpage7 {background: #fff url('../images/bg-new.jpg') no-repeat top center ;margin:0;}



.quote-author {background:#fff url('../images/quote-arrow.png') no-repeat 40px top;margin:20px -15px -20px;padding-top:35px;}

.icon-design {background:url('../img/icon/paint.png') no-repeat left top;}    
.icon-dev {background:url('../img/icon/settings.png') no-repeat left top;}  

.clear:after, .images:after, .hr-bottom:after, #content > div:after, #header > div:after,.hr-top {clear:both;margin-top:30px;padding-top:30px !important;}

.hr-top {border-top:1px solid #eee;}
.hr-bottom {border-bottom:1px solid #eee;margin-bottom:30px;padding-bottom:30px;}
.hr-bottom + h2, .hr-bottom + h3, .hr-bottom + h4, .hr-bottom + h5, .hr-bottom + h6 {padding-top:10px !important;}
.hr-right {border-right:1px solid #eee;margin-right:30px;padding-right:30px;}
.hr-left {border-left:1px solid #eee;margin-left:30px;padding-left:30px;}


.links {list-style-type:none;margin-left:0; padding:0;}
.links li {border-bottom:1px solid #ddd;}
.links li.on a {background-color:#eee;color:#333;text-decoration:none;}
.links li a {display:block;padding:5px 10px;}


.links2 {list-style-type:none;margin-left:0;padding:0;}
.links2 li {background:url('../images/btn_side_bg.jpg');background-repeat:no-repeat;}
.links2 li.on a { background-color:#eee;color:#333;text-decoration:none;}
.links2 a {font-weight:bold;text-align:center;}
.links2 a:hover {background-color:#ddd;text-decoration:underline}
.links2 li a {display:block;padding:5px 10px;}

/*---------[5]Page Specific---------*/

#flasher {!height:265px;}

#who {width:525px;float:left;display:inline;border-right:1.5px solid #d2d2d2;margin-right:10px;padding:0;}
#who img {background-color:#eee;float:left;border:1px solid #ccc;margin:0 25px 5px 0;padding:7px;}
#who h3 {background:transparent url('../images/bg-h3.jpg') bottom left repeat-x;color:#393939;font:18px/24px "Lucida Grande", Tahoma, Verdana, sans-serif;font-weight:bold;text-transform:uppercase;width:435px;margin:0 0 20px 0;padding:0 0 15px 5px; }
#who p {margin:0 0 20px 0;}
#who p.more {text-align:right;}
#who p.more a {text-decoration:underline;}


#services {width:300px;float:left;display:inline;padding:0; margin-left:10px;}
#services li {width:260px;display:block;height:47px;padding:10px 0 5px 70px;}
#services li h5 {color:#111;font:12px "Lucida Grande", Tahoma, Verdana, sans-serif;font-weight:bold;}
#services li h5 a {color:#111;}
#services li p {font:11px "Lucida Grande", Tahoma, Verdana, sans-serif;color:#000000;padding:0;}
#services li#first {border-bottom:1px solid #e4e4e4;background:#f6f6f6 url('../images/first.png') top left no-repeat;!background:#f6f6f6;}
#services li#first:hover {text-decoration:none;background:#fff url('../images/first.png') top left no-repeat;!background:#f6f6f6;}
#services li#second {border-top:1px solid #fff;border-bottom:1px solid #e4e4e4;background:#f6f6f6 url('../images/second.png') top left no-repeat;!background:#f6f6f6;}
#services li#second:hover {text-decoration:none;;background:#fff url('../images/second.png') top left no-repeat;!background:#f6f6f6;}
#services li#third {border-top:1px solid #fff;background:#f6f6f6 url('../images/third.png') top left no-repeat;!background:#f6f6f6;}
#services li#third:hover {text-decoration:none;;background:#fff url('../images/third.png') top left no-repeat;!background:#f6f6f6;}


#bottomMain {clear:left;position:static;border-top:1.5px solid #d2d2d2;overflow:hidden; background-color:#fdffd2;height:235px;padding:15px 15px 0;}

#swipe {width:265px;float:left;border-right:1.5px solid #d2d2d2;border-left:1.5px solid #d2d2d2;padding:0 15px 0 15px;}
#swipe h4 {\\background:url(../images/h4-swipe.jpg) top left no-repeat;}

#bulb {width:265px;float:left;padding:0 0 0 15px;}
#bulb h4 {\\background:url(../images/h4-bulb.jpg) top left no-repeat;}

#notes {float:left;width:265px;padding:0 15px 0 0;}
#notes h4, #swipe h4, #bulb h4 {color:#222;font:14px/24px "Lucida Grande", Tahoma, Verdana, sans-serif;font-weight:bold;height:20px;margin:0 0 10px 0;padding:0 0 0 0px;}

#notes h4 {\\background:url(../images/h4-notes.jpg) top left no-repeat;}

#notes li, ol{list-style:none; text-indent:-40px; margin-top:0px;}
#notes ul {list-style:none; text-indent:-40px; margin-top:0px;}


#portfolio {margin:30px 5px 0;overflow:hidden;}

.item {width:425px;float:left;color:#565656;margin:0 10px 40px;}
.item img {background-color:#ececec;border:1px solid #ddd;margin:0 0 15px;padding:6px;}
.item h2 {font:18px "Lucida Grande", Tahoma, Verdana, sans-serif;border-top:1px solid #e4e4e4;border-bottom:1px solid #e4e4e4;margin:0 7px 15px;padding:12px 0 12px 2px;}
.item p {padding:0 10px;}

.section-page {float:left;width:840px;position:relative;margin:10px 0 0 0;padding:20px 20px 0 20px;}
.section-page h2 {font-size:26px;}
.section-page .breadcrumbs { list-style:none; position:relative;color:#adadad;margin:-20px 0 0 0; padding:0 0 20px 0;}
.section-page .breadcrumbs .label { float:left;font-style:italic;}
.section-page .breadcrumbs li {display:inline;}
.section-page .breadcrumbs li.current {color:#c1c1c1;font-weight:bold;font-size:12px;}
.section-page .breadcrumbs li a, .section-page a {text-decoration:none;color:#c65720;}
.section-page .breadcrumbs li a:hover, .section-page a:hover {color:#000;}
.section-page #content-left {width:550px;float:left;}
.section-page #content-left h3, .section-page #sidebar h3 {font-size:20px;}
.section-page #content-left h4 {font-size:16px;}
.section-page #content-left h5 {font-size:14px;}
.section-page #content-left h6 {font-size:12px;}
.section-page #sidebar{ float:right;width:250px;background:url('../images/sidebar_divider.png') repeat-y top left;!background:url('../images/sidebar_divider.gif') repeat-y left;padding-left:28px;}
.section-page #sidebar a {color:#c65720;text-decoration:none;}
.section-page #sidebar a:hover {color:#000;}
.section-page ul, .section-page ol{padding-left:20px;}

/*---------[6]Footer---------*/

#footer, .push {height:120px;padding:0 0 0 0;}
#footer {background:#f0f0f0 url('../images/bg-h3.jpg') top left repeat-x;}
#footer-inner {width:850px;margin:0 auto;overflow:hidden;}
#footer-inner p.validate {float:right;line-height:18px;font-size:10px;font-weight:bold;text-transform:uppercase;}
#footer-inner p.validate a {color:#555;background:url('../images/valid.jpg') top left no-repeat;display:block;float:left;height:20px;margin:0 25px 0 0;padding:0 0 0 20px;}