@import url('reset.css');

/* 
	Main CSS doc for Gemma Michaelson Parade theme | Copyright 2009
	Created By Lift. (http://www.liftinteractive.com)
*/

/*
	Font-sizes. Browser default is 16px. Set body to 75%, which is equal to 12px and, therefore, 1em is 12px.
		9px		: 0.75em
		10px	: 0.8333em
		11px	: 0.9167em
		12px	: 1.0em
		13px	: 1.0833em
		14px	: 1.1667em
		15px	: 1.25em
		16px	: 1.3333em
		17px	: 1.4167em
		18px	: 1.5em
		19px	: 1.5833em
		20px	: 1.6667em
		21px	: 1.75em
		22px	: 1.8333em
		23px	: 1.9167em
		24px	: 2.0em
		25px	: 2.0833em
		26px	: 2.1667em
		27px	: 2.25em
		28px	: 2.3333em
		29px	: 2.4167em
		30px	: 2.5em
		31px	: 2.5833em
		32px	: 2.6667em
*/

/*
	Palette
	#9a9a9a		dark gray
	
*/

/*
**	=global
************************/

/* default */
body					{ background:#fff; color:#919191; font:75%/1 arial,helvetica,sans-serif; }
a						{ color:#666; text-decoration:none; }
a:hover					{ color:#333; }
a img, img				{ border:0; }
p,ul,ol					{ margin-bottom:1em; }
p,li					{ line-height:1.4; }
h1,h2,h3,h4,h5,h6		{ font-family:georgia,'times new roman',serif; font-weight:normal; font-style:italic; margin-bottom:0.5em; }
strong, b				{ font-weight:bold; }
em, i					{ font-style:italic; }
hr						{ border:0 dotted #ccc; border-top-width:1px; height:0; clear:both; }

/* grid */
.wrap					{ margin:0 auto; width:1050px; }
.wrap:after				{ clear:both; content:'.'; display:block; visibility:hidden; height:0; }
.wrap					{ display:inline-block; }  /* for IE/Mac */
.wrap					{ display:block; }



/*
**	=furniture
************************/
#furniture				{ background:#9a9a9a; position:absolute; top:0; left:0;  width:100%; z-index:9999; }
.gallery #furniture		{ top:-85px; }
#furniture .wrap		{ position:relative; height:85px; }


/*
**	=branding
************************/
#branding				{ float:left; font:bold italic 2.5em/80px georgia,'times new roman',serif; margin:0; }
#branding a				{ color:#fff; }
#branding a span		{ font-size:0.6667em; font-weight:normal; }


/*
**	=nav
************************/
#nav					{ float:right; margin:0; }
#nav li					{ display:inline; line-height:80px; }
#nav a					{ color:#fff; font-size:1.1667em; margin-left:12px; }
#nav a:hover			{ color:#666; }
#nav a.current			{ color:#333; }

#sub-nav				{ position:absolute; top:85px; right:0; }
#toggle-menu,
#toggle-thumbs,
#toggle-slideshow,
#gallery-nav,
#gallery-title			{ background:#C2C2C2; background:rgba(161,161,161,0.8); color:#fff; float:right; height:27px; padding:0 1em; margin-left:1px; }
#toggle-menu			{ color:#fff; float:right; font-size:1.25em; font-weight:bold; letter-spacing:-0.025em; line-height:27px; }
#toggle-slideshow span	{ background:url('../img/btn-slideshow.gif') no-repeat 0 0; cursor:pointer; display:block; height:13px; width:11px; margin-top:7px; text-indent:-9999px; }
#toggle-slideshow.playing span	{ background-position:0 -13px; }
#toggle-slideshow,
#toggle-thumbs			{ display:none; float:right; }
#toggle-thumbs img		{ margin:8px 0; }
#gallery-title img		{ margin:5px 0; }
.gallery #toggle-slideshow,
.gallery #toggle-thumbs	{ display:block; }
#gallery-nav			{ float:right; padding-left:0; margin:0; }
#gallery-nav li			{ display:inline; margin-left:1em; }
#gallery-nav a			{ color:#fff; line-height:27px; }
#gallery-nav a:hover	{ color:#666; }
#gallery-nav a.current	{ color:#333; }



/*
**	=gallery
************************/
#gallery-wrap			{ position:absolute; left:50%; top:50%; margin:-350px 0 0 -525px; height:700px; width:1050px; }
#gallery img 			{ margin:0; padding:0; }

.image-wrap				{ position:absolute; top:50%; left:50%; overflow:visible; }
.caption				{ color:#a1a1a1; float:right; font-size:0.8333em; padding:1em 0 0; margin:0; }

#next,#prev				{ background:url('notfound.jpg'); display:block; position:absolute; width:50%; height:100%; left:0; top:0; z-index:999; }
#next					{ left:50%; }
#next:hover				{ background:url('../img/bg-next.png') no-repeat center center; }
#prev:hover				{ background:url('../img/bg-prev.png') no-repeat center center; }

#thumbs-underlay		{ background:url('notfound.jpg'); /*display:none;*/ height:700px; width:1050px; padding:0; position:absolute; top:0; left:0; z-index:999; }
#thumbs-bg				{ background:url('../img/bg-screendoor.gif') no-repeat 0 0; /*background:#000;*/ width:1050px; height:502px; position:absolute; top:50%; left:0; margin-top:-251px; }
#thumbs-mask			{ height:363px; width:870px; overflow:hidden; position:relative; margin:70px 90px; }
#thumbs					{ position:absolute; top:0; width:870px; }
#thumbs li				{ background:#fff; background:rgba(255,255,255,0.7); float:left; margin:0 10px 10px 0; width:114px; height:114px; }
#thumbs li a			{ border:7px solid #fff; display:block; float:left; width:100px; height:100px; }
#thumbs li a:hover		{ border-color:#C2C2C2; }
#thumbs li a.activeSlide{ border-color:#9a9a9a; }

#more-thumbs,
#less-thumbs			{ background:url('../img/bg-arrow.gif') no-repeat 0 0; color:#fff; cursor:pointer; display:block; position:absolute; left:500px; top:30px; height:18px; width:35px; text-indent:-9999px; }
#more-thumbs			{ background-position:0 -18px; top:auto; bottom:30px; }
#more-thumbs.hide,
#less-thumbs.hide		{ display:none; }


/*
**	=content
************************/
.content				{ margin-top:150px; width:600px; }
.content p,
.content li				{ font-size:1.1667em; }
.content a				{ border-bottom:1px dotted #666; color:#333; padding-bottom:2px; }
.content a:hover		{ border-color:#000; color:#000; }

.content h2,
.home .content h1		{  font-size:2.25em; }

.content h3				{ font-size:2em; }
.content h4				{ font-size:1.75em; }
.content h5				{ font-size:1.5em; }
.content h6				{ font-size:1.25em; }

.content ul,
.content ol				{ list-style-position:inside; }
.content li				{ list-style-type:disc; position:static; left:auto; top:auto; height:auto; }
.content ol li			{ list-style-type:decimal; }



/*
**	=site-info
************************/
#sticky					{ font-size:0.8333em; }
.gallery #sticky		{ float:left; margin:1em 0; width:500px; }



/*
**	=font-variations
************************/
body.serif				{ font:75%/1 georgia,'times new roman',serif; }
.serif h1,.serif h2,
.serif h3,.serif h4,
.serif h5,.serif h6,
.serif #branding		{ font-family:arial,helvetica,sans-serif; }


/*
**	=color-variations
************************/
body.dark						{ background:#000; }
.dark #furniture				{ background:#333; }
.dark #nav a,
.dark #gallery-nav a			{ color:#fff; }
.dark #nav a:hover,
.dark #gallery-nav a:hover		{ color:#ccc; }
.dark #nav a.current,
.dark #gallery-nav a.current	{ color:#aaa; }

.dark #toggle-menu,
.dark #toggle-thumbs,
.dark #toggle-slideshow,
.dark #gallery-nav,
.dark #gallery-title			{ background:#333; background:rgba(51,51,51,0.8); }
.dark #gallery img				{ border:1px solid #555; }
.dark #thumbs-underlay			{ left:1px; } /* to account from img border */

.dark a:hover					{ color:#ccc; }
.dark .content a				{ border-color:#aaa; color:#ccc; }
.dark .content a:hover			{ border-color:#fff; color:#fff; }


/* =yellow */
.yellow #branding a span,
.yellow #nav a.current,
.yellow #gallery-nav a.current	{ color:#ff0; }
.dark.yellow .content a			{ border-color:#FEFF7F; color:#FEFF7F; }
.dark.yellow .content a:hover	{ border-color:#ff0; color:#ff0; }



/* =pink */
.pink #branding a span,
.pink #nav a.current,
.pink #gallery-nav a.current	{ color:#FF0066; }
.pink .content a				{ border-color:#FF8FBE; color:#FF8FBE; }
.pink .content a:hover			{ border-color:#FF0066; color:#FF0066; }