/*  
Theme Name: Ginga, with a slick new suit
Theme URI: http://wordpress.org/
Description: Complete with vest and shiny pocket watch.
Version: 2.0
Author: Jen Germann
Author URI: http://ginga.com.au/
*/

/* -------------------------------------------------------------- 
  
   Reset.css
   * Resets default browser CSS styles.
   
   Original by Erik Meyer:
   * http://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,
small, 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: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}

html, body { border:0; margin:0; padding:0; }
body { background: #d5f1ff url(images/backgrounds/bg_body.gif) repeat-x 0 0; font-family: arial, helvetica, sans-serif; font-size: 100%; color: #626262; line-height: 1.125em; } /* sets font size to browser default, typically 16px; line-height to 18px */

/* ----------------------------------------------------------
				Typography
---------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 { color: #eb551a; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
h2 { font-size: 35px; font-weight: bold; }
h3 { font-size: 1.125em; line-height: 1em; font-weight: bold; }
h4, legend { font-size: 1.125em; font-weight: bold; color: #00acec; margin: 0 0 5px; }
h5 { font-size: 0.875em; font-weight: bold; color: #00acec; }
	.story h5 { font-size: 1.5em; line-height: 1em; font-weight: bold; color: #eb551a; padding-bottom: 5px; }
h6 { font-size: 0.875em; font-weight: bold; color: #363636; }
	.feature_description h6 { font-size: 1.25em; }
label { font-size: 11px; font-weight: bold; color: #363636; }

p, ul, ol 		{ margin:0; padding:0 0 20px; font-size: 0.875em; line-height: 1.625em; }
	.page p { padding-bottom: 30px; }
	.project_info p { padding-bottom: 10px; }
	p.intro { font-size: 1.125em; line-height: 1.5em; color: #525252; }
	#opening p { color: #3c4c57; }
	.complete_features p { font-size: 1.75em; font-weight: bold; text-align: center; }
	p.adr, .the_buzz .entry p, #footer p, .preview p { font-size: 0.75em; }
	.postmetadata p, body#links #content ul { font-size: 0.9375em !important; line-height: 22px; }
		.postmetadata span.postdate { font-weight: bold; font-size: 18px !important; color: #363636; }
	ul#sublinks { text-transform: uppercase; font-weight: bold; list-style:none; }
	#features_block ul { padding: 0 0 0 20px; }
	#quick_links, #sublinks { font-size: 0.6875em; padding: 0 0 9px; }

	#sidebar p { font-size: 0.9375em !important; line-height: 1.75em; }
		#sidebar #stay_connected.sidebar_block p, ul ul, ul li p { font-size: 1em !important; }
	#sidebar ul, #sidebar ol { font-size: 1em !important; line-height: 1.75em; }

blockquote 		{ margin:22px 40px; padding:0; }
blockquote p	{ background: url(images/quote.gif) no-repeat 0 0; padding: 0 0 3px 36px; font-style: italic; }

ul, ol 			{ padding:0 0 20px 40px; }
	.entry ul li, .entry ol li { margin-bottom: 10px; }

small 			{ font-size:0.85em; }
img 			{ border:0; }
acronym, abbr	{ cursor: help; }

strong, em 	{  }
strong { color: #363636; font-weight: bold; }
em { font-style: italic; }

.emphasis { color: #eb551a; }

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -2px;
	font-size: 35px;
	line-height: 1em;
	padding: 0 0 2px;
}

.sIFR-hasFlash h3 {
	visibility: hidden;
	letter-spacing: -.1em;
	font-size: 25px;
	line-height: 1em;
	padding: 0 0 2px;
}
	.sIFR-hasFlash h3.co_mg_header {
		width: 490px;
		float: right;
	}
	
	.sIFR-hasFlash #sidebar h3 {
	font-size: 20px;
	margin-bottom: 3px;
	}

.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -.1em;
	font-size: 18px;
	line-height: 1em;
	padding: 0 0 2px;
}

/* COLORS:
blue: 00acec
green: 61a200
orange: eb551a
grey: 626262 */

/***** Links *****/

body#links #content ul li a:link { border-bottom: 1px dotted #c1cdd4; color: #626262; }
	body#links #content ul li a:visited { font-weight: bold; color: #626262; }
a, a:visited, body#links #content ul li a:hover, body#links #content ul li a:active 	{ color: #00acec; text-decoration:none; }

ul#sublinks a:link, ul#sublinks a:visited { color: #e1e1e1; }

.post h3 a, p.view_all_work a, a:hover, a:active, h5 a:hover, ul#quick_links a:hover { color: #61a200; }

p.view_all_work a:hover { border-bottom: 1px solid #7bd4f5; }
ul#sublinks a:hover, ul#sublinks a:active { color: #bbb; }

.complete_features p a { color: #eb551a; }

#footer a, #footer a:visited { border-bottom: 1px dotted #5c5c5c; color: #626262; }
#footer a:hover { border-bottom-style: solid; color: #61a200; }

/* Buttons */
p.submit_btn {
	width: 135px !important;
	height: 30px;
	background: url(images/buttons/btn_left.gif) no-repeat 0 0;
	padding: 0 !important;
	margin: 0 0 18px;
}
a.btn, input.btn { 
	width: 135px !important;
	height: 30px;
	background: url(images/buttons/btn_right.gif) no-repeat 100% 0; margin: 0 0 0 15px; padding: 0 15px 3px 0; border: 0; display: block; color: #61a200; text-transform: uppercase; font-size: 12px !important; font-weight: bold; text-align: center; cursor: pointer;
}
a.btn:hover, input.btn:hover { color: #eb551a; }


/***** Forms *****/
form 			{ margin:0; padding:0; }
input, select, textarea { margin: 0; padding: 3px 2px; border: 1px dotted #95a8b2; font-family: arial, helvetica, sans-serif; font-size: 12px; color: #363636; }
textarea 		{ font-size: 14px !important; line-height:1.375em; }

/* Email subscription */
body#subscribe #content form { font-size: 0.875em; }
input.textbox { width:320px; background: #fff; margin-bottom: 17px; padding:3px; border: 1px solid #ddd; }
label.subscribe { margin-right: 10px; }
body#subscribe #content form p.submit_btn { margin-top: 17px; font-size: 1em; }


/***** Tables *****/
/* tables still need 'cellspacing="0"' in the markup */
table {
	border:0; margin:0 0 18px 0; padding:0;
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}

/***** Global Classes *****/

hr 				{ width: 100%; background-color: #d5f1ff; margin: 0 0 30px !important; border: 0; border-top: 1px solid #d5f1ff; clear: both; color: #d5f1ff; }
	hr.sep { border-top: 1px dotted #000; }
	#people_stories hr.sep { border-color: #000 !important; }
	#commentform-container hr.sep { border-color: #95a8b2; }

.clearer		{ clear:both; }

.float-left, .alignleft 	{ float:left; }
.float-right, .alignright 	{ float:right; }
	.alignleft { margin: 0 15px 10px 0; }
	.alignright { margin: 0 0 10px 15px; }
	
	body#about p.float-right { margin-left: 30px; }
	body#about p.float-left { margin-right: 30px; }

.text-left 		{ text-align:left; }
.text-right 	{ text-align:right; }
.text-center 	{ text-align:center; }
.text-justify 	{ text-align:justify; }

.bold 			{ font-weight:bold; }
.italic 		{ font-style:italic; }
.underline 		{ border-bottom:1px solid; }
.highlight 		{ background:#ffc; }

.img-left 		{ float:left;margin:4px 10px 4px 0; }
.img-right 		{ float:right;margin:4px 0 4px 10px; }

.nomargin		{ margin:0; }
.nopadding 		{ padding:0; }
.noborder		{ border: 0; }
.noindent 		{ margin-left:0;padding-left:0; }
.nobullet 		{ list-style:none;list-style-image:none; }
.nodisplay, .hide, .ui-tabs-hide	{ display: none; }

/* ----------------------------------------------------------
					Main Elements
---------------------------------------------------------- */
/* Global */
#main_body { width: 1004px; margin: 0 auto; clear: both; position: relative; z-index: 99; }

#content { width: 1004px; }
body#blog #content,
body#contact #content,
body#links #content,
body#services #content,
body#features #content,
body#fourOfour #content { width: 682px; float: left; }

body#contact .page .entry,
body#links .page .entry,
body#services .page .entry,
body#features .page .entry { width: 660px; margin-right: 20px; float: left; }

/* Header
------------------------------------------------------------------*/
#header { width: 1000px; height: 149px; margin: 0 auto 40px; padding: 6px 0 0 0; }

h1 { margin: 7px 0 0; float: left; }
h1#logo a { width: 205px; height: 70px; }
h3.description { display: none; }

.headerwrap { height: 84px; float: right; position: relative; }

#quick_links { width: 140px; margin: 0; padding: 0; list-style:none; position: absolute; top: 0; right: 0; }
#quick_links li { height: 12px; margin: 0 9px 0 0; padding: 0 8px 0 0; border-right: 1px solid #a0a1a1; float: left; }
#quick_links li.quick_contact { margin: 0; padding: 0; border: 0; }
#quick_links li a { margin-top: -3px; display: block; }

#sublinks { width: 353px; height: 16px; background: url(images/backgrounds/bg_sublinks.gif) no-repeat 0 0; margin: 0 0 5px 0; padding: 4px 0 0 45px; position: absolute; bottom: 0; right: 0; }
#sublinks li { margin: 0 25px 0 0; }
#sublinks li, #sublinks li a { float: left; }

#nav { height: 60px; padding: 0; clear: both; list-style:none; }
#nav li { margin: 0 20px 0 0; padding: 0; float: left; }
#nav li.navcontact { margin: 0; }
#nav li a { width: 150px; height: 60px; background: url(images/backgrounds/bg_nav.gif) no-repeat 0 0; float: left; display: block; text-indent: -9999px; }
	#nav li.navhome a { background-position: 0 0; }
	#nav li.navwork a { background-position: -170px 0; }
	#nav li.navservices a { background-position: -340px 0; }
	#nav li.navabout a { background-position: -510px 0; }
	#nav li.navblog a { background-position: -680px 0; }
	#nav li.navcontact a { background-position: -850px 0; }
	
	#nav li.navhome a:hover, #nav li.navhome a.current { background-position: 0 -60px; }
	#nav li.navwork a:hover, #nav li.navwork a.current { background-position: -170px -60px; }
	#nav li.navservices a:hover, #nav li.navpeople a.current { background-position: -340px -60px; }
	#nav li.navabout a:hover, #nav li.navabout a.current { background-position: -510px -60px; }
	#nav li.navblog a:hover, #nav li.navblog a.current { background-position: -680px -60px; }
	#nav li.navcontact a:hover, #nav li.navcontact a.current { background-position: -850px -60px; }
	
/* Main content
------------------------------------------------------------------*/
#opening { width: 1004px; height: 383px; background: url(images/backgrounds/bg_opening.gif) no-repeat 0 0; margin: 0 0 25px; padding: 31px 20px 0 17px; }

.opening_buttons { width: 515px; height: 30px; margin: 294px 0 0; float: left; }
.opening_buttons p { width: 205px; height: 30px; padding: 0; float: left; }
.opening_buttons p a { width: 205px; height: 30px; display: block; text-indent: -9999px; }
	p.btn_our_work { margin-left: 34px; margin-right: 16px; }
	p.btn_our_work a { background: url(images/buttons/buttons_white.gif) no-repeat 0 0; }
		p.btn_our_work a:hover { background-position: 0 -30px; }
	p.btn_our_services a { background: url(images/buttons/buttons_white.gif) no-repeat -205px 0; }
		p.btn_our_services a:hover { background-position: -205px -30px; }

#flashcontent_videos { width: 392px; float: left; }

#contact_block { width: 1004px; height: 56px; background: url(images/backgrounds/bg_contact.gif) no-repeat 0 0; margin: 0 0 35px; padding: 38px 0 0; }
	#contact_block h5, #contact_block p { padding: 0; float: left; }
		#contact_block h5 { width: 220px; text-align: center; text-indent: -9999px; }
		#contact_block p { width: 160px; margin-right: 10px; text-align: center; text-indent: -9999px; }
			#contact_block p.contact_phone {  }
			#contact_block p.contact_skype { width: 150px; margin-right: 20px; }
			#contact_block p.contact_email { width: 150px; margin-right: 30px; }
				#contact_block p.contact_email a { width: 150px; display: block; }
			#contact_block p.download_vcard { width: 240px; margin: 0; }
			#contact_block p.download_vcard a { width: 240px; display: block; }

#features_list { width: 1004px; margin: 0 0 30px; }
ul.feature_items { width: 1004px; padding: 0 0 15px; list-style: none; }
li.feature { width: 490px; margin-bottom: 5px; float: left; }
	li.feature_wp, li.feature_analytics, li.feature_maps { margin-right: 20px; }

p.feature_icon, .feature_description { float: left; }
	p.feature_icon { width: 70px; height: 70px; margin-right: 10px; padding: 0; display: block; }
	.feature_description { width: 400px; }

.complete_features { width: 1004px; padding: 12px 0 0; border-top: 5px solid #eb551a; clear: both; }

/***** People *****/
#people_stories { width: 800px; height: 404px; background: url(images/backgrounds/bg_people_stories.gif) no-repeat 0 0; margin: 0 0 20px; padding: 40px 102px 20px; }
.story { width: 600px; height: 290px; margin-right: 50px; float: left; }
.preview { width: 150px; height: 290px; float: left; text-align: center; }
	.preview img { width: 144px; height: 204px; background-color: #fff; margin-bottom: 5px; border: 3px solid #ddd; }

ul#people_thumbs { padding: 0; list-style: none; }
ul#people_thumbs li { width: 53px; height: 73px; margin-right: 71px; float: left; }
	ul#people_thumbs li#shannon_thumb { margin: 0; }
	
ul#people_thumbs li img { width: 47px; height: 67px; background-color: #fff; border: 3px solid #ddd; }

/***** Work *****/
.project_info { width: 322px; margin: 0 20px 0 0; float: left; }

p.project_image { width: 650px; height:260px; margin: 0 0 20px; padding: 0; float: left; border: 5px solid #626262; }
p.project_image img { width: 650px; height: 260px; }

/* Page toolbar */
p.page_toolbar 	{ width: 1004px; height: 25px; margin: 0 0 30px; padding: 0; border-bottom: 1px dotted #c1cdd4; text-align: center; }
.page_prev, .page_next, .page_numbers {  }
.page_numbers	{ margin: 0; padding: 0; }
.page_numbers a	{ margin: 0 6px; padding: 0; }

.page_prev 		{ margin-right: 4px; }
.page_next 		{ margin-left: 4px; }
.page_prev a, .page_next a { margin: 0; padding: 0; }
.page_prev a 	{ padding-right: 14px; border-right: 1px solid #d7d7d7; }
.page_next a 	{ padding-left: 14px; border-left: 1px solid #d7d7d7; }

.page_numbers a.current_page, .page_numbers a:hover { color: #eb551a; }

/***** posts *****/
.post { width: 660px; margin: 0 0 35px; }

.post .entry { width: 490px; margin-right: 20px; float: left; }
.postmetadata { width: 150px; float: left; }

#sidebar .entry, #opening .entry { padding: 0; }

/* Comments - Comment List */
#comments							{ float: left; }
#comments-list 						{ width: 660px; margin: 0 0 17px; padding: 0 0 1px; }
h5#comments, h5#respond				{ padding: 0; }

.comments 							{ clear: both; }
.comment  							{ background-color: #e7f7ff; margin: 0; padding: 12px 0 0 0; clear: both; }
.comment p							{ padding: 0 0 14px; }
.comment img 						{ border: 0; padding: 0; }
.comment.alt 						{ background-color: transparent; }
.author_comment 					{ color: #252525; }
.commentcontent 					{ width: 480px; margin: 0 20px 0 0; padding: 0 0 0 10px; clear: both; float: left; }
	.commentcontent p.commentNumber, .commentcontent .commentText { float: left; }
		.commentcontent p.commentNumber { width: 25px; font-family: Garamond, Georgia, Times, serif; font-size: 28px; font-style: italic; font-weight: bold; line-height: 1em; color: #61a200; }
		.commentcontent .commentText { width: 455px; float: left; }
.authorinfo 						{ width: 150px; margin: 0; padding: 0; float: left; }
.authorinfo img 					{ float: left; }
.authorinfo p 						{ width: 150px; float: right; }
.comment_author						{ font-weight: bold; }

/* Comments - Leave a Reply */
#commentform-container 				{ width: 660px; margin: 0 0 17px; float: left; clear: both; }
#commentform-container label {  }
#commentform-container form input	{ width: 252px; }
	#commentform-container form input.btn { width: 140px; font-size: 1em; }
#commentform-container form textarea { width: 482px; height: 140px; margin: 0; }
.form_basics, .your_comment_details { width: 660px; margin: 0; padding: 0; }
.form_basics 						{ margin-top: 9px; } .your_comment_details { margin-top: 10px; }
.form_basic_info, .your_comment 	{ width: 490px; margin: 0 20px 12px 0; padding: 0; clear: both; float: left; }
.authorinfo, .about_comments, .comment_details { width: 150px; margin: 0; padding: 0; float: left; }


/***** Links *****/
body#links #content ul { padding: 0 0 20px !important; list-style: none; }
body#links ul.float-left, body#links ul.float-right { width: 300px; }
body#links #content ul li ul li { margin-bottom: 4px; }

body#links h4 { padding-bottom: 2px; }

/* Sidebar
------------------------------------------------------------------*/
#sidebar { width: 322px; float: right; }
#sidebar .sidebar_block { width: 322px; margin: 0 0 27px; clear: both; }
.block_content { width: 276px; background: url(images/backgrounds/bg_sidebar_block.gif) repeat-y 0 0; padding: 10px 23px; }
.block_top { width: 322px; height: 10px; background: url(images/backgrounds/bg_sidebar_block_ends.gif) no-repeat 0 0; }
.block_bottom { width: 322px; height: 10px; background: url(images/backgrounds/bg_sidebar_block_ends.gif) no-repeat 0 bottom; }

#side_blog, #side_archives { float: left; }
#sidebar #side_blog ul, #sidebar #side_archives ul { padding: 0; list-style: none; }

/***** contact us *****/
p.download_vcard { padding: 0; font-weight: bold; }

/***** stay connected *****/
#stay_connected.sidebar_block { width: 276px; height: 98px; background: url(images/backgrounds/bg_rss.gif) no-repeat 0 0; padding: 15px 23px 0; }

/***** free appraisal *****/
p.btn_appraisal_form { width: 255px; height: 30px; margin: 0 30px 0 10px; padding: 0; }
p.btn_appraisal_form a { width: 255px; height: 30px; background: url(images/buttons/buttons_white.gif) no-repeat -410px 0; display: block; text-indent: -9999px; }
	p.btn_appraisal_form a:hover { background-position: -410px -30px; }


/* Extra
------------------------------------------------------------------*/
#extra { width: 1004px; margin: 50px 0 0; padding: 0 0 30px; clear: both; }
.extra_block { width: 300px; margin: 0; padding: 12px 10px 0; border-top: 1px dotted #000; float: left; }
	.extra_block1, .extra_block2 { margin: 0 20px 0 0; }
.extra_block ul { padding: 0 0 0 15px; line-height: 17px; }
	.extra_block1 ul { padding: 0; list-style: none; }
.extra_block ul li { margin: 0 0 6px; }

.extra_block3 a { font-weight: bold; }

/* Footer
------------------------------------------------------------------*/
#footer { width: 100%; height: 90px; background-color: #fff; border-top: 5px solid #a6e2f8; }
.footerwrap { width: 1000px; margin: 10px auto 0; }
.footerwrap p { text-align: center; padding: 0 0 6px; }



/* lightbox
------------------------------------------------------------------*/
#lightbox					{ width: 100%; position: absolute; left: 0; z-index: 100; text-align: center; line-height: 0; }
#lightbox a, #lightbox a img, #lightbox img { border: 0; padding: 0; }

#outerImageContainer		{width: 250px; height: 250px; background-color: #fff; margin: 0 auto; border: 4px solid #d7d7d7; border-bottom: 0; position: relative; }
#imageContainer				{ padding: 10px; }
#imageContainer img			{ border: 1px solid #d7d7d7; }

#loading					{ width: 100%; height: 25%; position: absolute; top: 40%; left: 0%; text-align: center; line-height: 0; }
#hoverNav					{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 10; }
#imageContainer>#hoverNav	{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink		{ width: 49%; height: 100%; background: transparent url(images/lightbox/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block; }
#prevLink 					{ background: url(images/lightbox/prevlabel.gif) left 15% no-repeat; left: 0; float: left;}
#nextLink 					{ background: url(images/lightbox/nextlabel.gif) right 15% no-repeat; right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover {  }
#nextLink:hover, #nextLink:visited:hover {  }

#imageDataContainer			{ width: 100%; background-color: #fff; margin: 0 auto; border: 4px solid #d7d7d7; border-top: 0; font: 10px Verdana, Helvetica, sans-serif; line-height: 1.4em; overflow: auto; }

#imageData					{	padding:0 10px; color: #666; }
#imageData #imageDetails	{ width: 70%; float: left; text-align: left; }	
#imageData #caption			{ font-weight: bold;	}
#imageData #numberDisplay	{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose	{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay					{ width: 100%; height: 500px; position: absolute; top: 0; left: 0; z-index: 90; }

/* LIGHTBOX ENDS */

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