/* @override http://truestaging.wil-linssen.com/styles/regular.css */

/* 
Definition:	Screen CSS for True Staging
Author:			Wil Linssen [http://wil-linssen.com/]
Revision:		00.00.00

----------------------------------
Table of contents
----------------------------------
	1.BODY
	2.GLOBALS ELEMENTS
	3.HEADINGS
	4.LINKS
	5.IMAGES & VIDEOS
	6.LAYOUT
	7.LIGHTBOX
	8.NAVIGATION
	9.SITEINFO/FOOTER
	10.SCROLLBARS
	
	INDIVIDUAL PAGES
	--------------------------------
		11.HOME
		12.SERVICES
		13.GET IN TOUCH
		14.HIGHLIGHTS
		15.NEWS
		16.ABOUT US / TEAM

----------------------------------
COLOURS
----------------------------------
  Brown:    #908474
  Green:    #b3ac00

*/

@import url(/styles/reset.css); /* RESET CSS */


/* @group 1.BODY
-------------------------------------------------------------------------------------------------------------------- */
body { font: 13px Gill Sans, Helvetica, Arial, sans-serif; }
body.light { background-color: #fff; }
body.dark{ background-color: #908474; }
body.lightbox { padding: 30px; }
body#team_member { background-color: #fff; color: #908474; padding: 30px 30px 30px 260px; position: relative; }
body#highlight { padding: 30px; color: #fff; position: relative; }
/* @end */


/* @group 2.GLOBAL ELEMENTS
-------------------------------------------------------------------------------------------------------------------- */
p { margin-bottom: 10px; }
/* @end */


/* @group 3.HEADINGS
-------------------------------------------------------------------------------------------------------------------- */
h1 a { text-indent: -9999px; overflow: hidden; background: 0 0 no-repeat; width: 256px; height: 82px; display: block; float: right; }
body#home h1 a { width: 686px; height: 221px; float: none; clear: both; margin: 115px auto 0 auto; background-image: url(/images/true_staging-logo-home.png); }
body.light h1 a { background-image: url(/images/true_staging-logo.png); }
body.dark h1 a { background-image: url(/images/true_staging-logo-brown.png); }

h2 { position: absolute; top: 0; left: 0; display: block; width: 30px; height: 366px; background: no-repeat 100% 30px #b3ac00; text-indent: -9999px; overflow: hidden; }
body#about-us h2 { background-image: url(/images/h2-about_us.png); }
body#get-in-touch h2 { background-image: url(/images/h2-get_in_touch.png); }
body#services h2 { background-image: url(/images/h2-services.png); }
body#highlights h2 { background-image: url(/images/h2-highlights.png); }
body#clients h2 { background-image: url(/images/h2-clients.png); }

body.lightbox h2 { background: none; position: static; width: auto; height: auto; float: none; }
body#team_member h2 { color: #b3ac00; font-size: 14px; margin: 0 0 20px 0; text-indent: 0; font-weight: bold; }

div.news_item h2 { background: none; color: #fff; font-weight: bold; text-indent: 0; width: auto; height: auto; position: static; font-size: 16px; }
/* @end */


/* @group 4.LINKS
-------------------------------------------------------------------------------------------------------------------- */
div#content a,
div.content a { color: #b3ac00; }

body.light div#footer a { color: #fff; }
body.dark div#footer a { color: #908474; }
body.light div#footer a:hover,
body.dark div#footer a:hover { color: #b3ac00; }
/* @end */


/* @group 5.IMAGES & VIDEO
-------------------------------------------------------------------------------------------------------------------- */

/* @end */


/* @group 6.LAYOUT
-------------------------------------------------------------------------------------------------------------------- */
div#wrapper { width: 964px; padding: 30px; margin: 40px auto 0 auto; position: relative; }
body.light div#wrapper { background-color: #fff; -moz-box-shadow: 3px 5px 15px #888888; -webkit-box-shadow: 3px 5px 15px #888888; box-shadow: 3px 5px 15px #888888; }

div.ie-shadow { display: block; position: absolute; top: 0; left: 0; margin-top: 40px; width: 1024px; height: 1024px;  z-index: -1; background: #000; filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='15', MakeShadow='true', ShadowOpacity='0.40'); }

body.dark div#wrapper { background-color: #908474; -moz-box-shadow: 3px 5px 15px #3d3d3d; -webkit-box-shadow: 3px 5px 15px #3d3d3d; box-shadow: 3px 5px 15px #3d3d3d; }
body#home div#wrapper{ width: 726px; overflow: hidden; }

div#inner_wrapper { width: 1024px; height: 549px; display: block; margin: 0 -30px; background: #908474 no-repeat 0 0; color: #fff; position: relative; }
body#about-us div#inner_wrapper,
body#privacy-policy div#inner_wrapper { background-image: url(/images/inner_wrapper_bg-about_us.jpg); }
body#get-in-touch div#inner_wrapper { background-image: url(/images/inner_wrapper_bg-get_in_touch.jpg); }
body#services div#inner_wrapper { background-image: url(/images/inner_wrapper_bg-services.jpg); }
body#highlights div#inner_wrapper { background-image: url(/images/inner_wrapper_bg-highlights.jpg); }
body#clients div#inner_wrapper { background-image: url(/images/inner_wrapper_bg-clients.jpg); }

div#shavings { position: absolute; top: 285px; left: 0; z-index: 30; width: 1024px; height: 88px; display: block; background: no-repeat 0 0; }
body.light div#shavings { background-image: url(/images/inner_wrapper-shavings-white.png); }
body.dark div#shavings { background-image: url(/images/inner_wrapper-shavings-brown.png); }

div#content { width: 282px; height: 271px; padding: 25px 30px 70px 60px; overflow-y: scroll; line-height: 21px; }
body#get-in-touch div#content { width: 242px; }
body#services div#content { width: 162px; }
body#highlights div#content { width: 746px; padding-right: 0; }
body#clients div#content { width: 529px; }
/* @end */


/* @group 7.LIGHTBOX
-------------------------------------------------------------------------------------------------------------------- */
body#lightbox { }
/* @end */


/* @group 8.NAVIGATION
-------------------------------------------------------------------------------------------------------------------- */
ul#nav_main { margin: 48px 0 13px 0; }
ul#nav_main li { display: inline; }
ul#nav_main li a { padding-right: 10px; margin-right: 10px; border-right: 1px solid; text-transform: uppercase; font-size: 12px;  }
body.light ul#nav_main li a { color: #908474; border-color: #908474; }
body.dark ul#nav_main li a { color: #fff; border-color: #fff; }
body.light ul#nav_main li a:hover,
body.light ul#nav_main li a.current,
body.dark ul#nav_main li a:hover,
body.dark ul#nav_main li a.current  { color: #b3ac00; }
ul#nav_main li a.last { border: none; }
ul#nav_main li a.twitter img { margin-bottom: -3px; }

body#home ul#nav_main { margin: -336px 0 336px 0; }

ul#nav_sub { display: block; margin: 30px 0 0 30px; }
ul#nav_sub li { display: inline; }
ul#nav_sub li a { display: block; float: left; text-transform: uppercase; margin-right: 30px; padding: 5px 0 0 0; }
body.dark ul#nav_sub li a { color: #fff; }
body.light ul#nav_sub li a { color: #908474; }
body.dark ul#nav_sub li a:hover,
body.light ul#nav_sub li a:hover { color: #b3ac00; }
ul#nav_sub li a.rss { padding-right: 23px; background: url(/images/rss.png) no-repeat 100% 0; }
body.dark ul#nav_sub li a.rss { background-position: 100% -67px; }
body.light ul#nav_sub li a.rss { background-position: 100% -34px; }
body.dark ul#nav_sub li a.rss:hover,
body.light ul#nav_sub li a.rss:hover { background-position: 100% 0; }
/* @end */


/* @group 9.FOOTER
-------------------------------------------------------------------------------------------------------------------- */
div#plane { width: 1024px; height: 39px; margin: 0 -30px 0 -30px; }
div#footer { display: block; margin: 0 -30px -30px -30px; overflow: hidden; padding: 5px 30px; }
body.light div#footer { background-color: #908474; }
body.dark div#footer { background-color: #fff; }

div#footer p { margin: 0; text-transform: uppercase; font-size: 11px; color: #908474; }
div#footer p.left { float: left; clear: left; }
div#footer p.right { float: right; clear: right; }

body#home div#footer { display: none; }
/* @end */


/* @group 10.SCROLLBARS
-------------------------------------------------------------------------------------------------------------------- */
.jScrollPaneContainer { position: relative; overflow: hidden; }
.jScrollPaneTrack { position: absolute; cursor: pointer; right: 0; top: 0; height: 100%; background: #d9d9d9; margin-top: 20px; z-index: 30; }
.jScrollPaneDrag { position: absolute; background: #aaa; cursor: pointer; overflow: hidden; }
.jScrollPaneDragTop { position: absolute; top: 0; left: 0; overflow: hidden; }
.jScrollPaneDragBottom { position: absolute; bottom: 0; left: 0; overflow: hidden; }
/* @end */


/* @group 11.HOME
-------------------------------------------------------------------------------------------------------------------- */
body#home p.rss a { display: block; float: right; text-transform: uppercase; color: #b3ac00; background: url(/images/rss.png) no-repeat 100% 0; padding: 8px 27px 0; margin: 0 200px 115px 0;}

body#home p.tagline { clear: both; text-align: center; color: #908474; }

body#home div#plane { margin: 30px 0 -30px -268px;}
/* @end */


/* @group 12.SERVICES
-------------------------------------------------------------------------------------------------------------------- */
body#services div.service { position: absolute; top: 0px; width: 10px; height: 306px; padding: 30px; overflow: hidden; background: no-repeat 0 0; }
body#services div.service h3 a { width: 50px; height: 366px; display: block; text-indent: -9999px; overflow: hidden; position: absolute; top: 0; left: 0; }

body#services div#ddsa { left: 252px; background-image: url(/images/service_bg-ddsa.jpg); z-index: 5; }
body#services div#rental { left: 302px; background-image: url(/images/service_bg-rental.jpg); z-index: 6; }
body#services div#ppm { left: 352px; background-image: url(/images/service_bg-ppm.jpg); z-index: 7; }
body#services div#build_install { left: 402px; background-image: url(/images/service_bg-build_install.jpg); z-index: 8; }

body#services div.service div.content { position: absolute; top: 30px;  width: 200px; color: #908474; }
body#services div#ddsa div.content { left: 442px; }
body#services div#rental div.content { left: 392px; }
body#services div#ppm div.content { left: 342px; }
body#services div#build_install div.content { left: 292px; }
/* @end */


/* @group 13. GET IN TOUCH
-------------------------------------------------------------------------------------------------------------------- */
div.vcard p { margin-bottom: 0; }
div.vcard p.fn { text-transform: uppercase; }
div.vcard div.adr { margin-bottom: 10px; }
div#google_map { width: 470px; height: 425px; margin-bottom: 10px;  }
body#map { color: #fff; }
/* @end */


/* @group 14.HIGHLIGHTS
-------------------------------------------------------------------------------------------------------------------- */
div.highlight { float: left; margin: 0 10px 0; }
div.highlight p { margin-bottom: 0; }
div.highlight img { width: 215px; height: 100px; }
div.highlight div.lightbox { display: none; }

body#highlight h3,
body#highlight a.launch {  display: none; }
body#highlight div.lightbox { display: block; }

body#highlight ul.images li { margin-bottom: 10px; clear: both; overflow: hidden; }
body#highlight ul.images img { width: 215px; height: auto; float: right; margin-left: 30px; }
body#highlight div.highlight { margin: 0; padding: 0; width: 100%; }
/* @end */


/* @group 15.NEWS
-------------------------------------------------------------------------------------------------------------------- */
div.news_item { color: #fff; border-bottom: 1px solid #b9afa3; margin-bottom: 14px; }
div.news_item p.date { font-size: 13px; }
/* @end */


/* @group 16.ABOUT US / TEAM
-------------------------------------------------------------------------------------------------------------------- */
body#team_member img#photo { width: 200px; padding: 5px; border: 1px solid #ccc; position: absolute; top: 20px; left: 20px;  }
/* @end */


