/* souldesigngroup.com v6 stylesheet  ::  created 14 december 2009  ::  updated 2 february 2010  ::  created by www.souldesigngroup.com  ::  copyright soren stoen */

* {
	margin:0px;
	padding:0px;
	outline:none;
}

html {height:100%;}

body {
	width:100%;
	height:100%;
	background:url(img/bg-sdg-reflection.jpg) no-repeat top left;
	font-family:'Century Gothic', 'Apple Gothic', sans-serif;
	font-size:11px;
	line-height:1.3em;
	letter-spacing:1.4px;
    color:#777;
	margin:0;
	border:none;
}

p {margin-bottom:10px; text-align:justify;}

h1 {
	font-size:36px;
	line-height:36px;
}

h2 {
	font-size:24px;
	line-height:24px;
}

h3 {
	font-size:16px;
	line-height:16px;
}

h4 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	line-height:14px;
}

a:link {text-decoration:none; color:#888;}
a:visited {text-decoration:none; color:#888;}
a:hover {text-decoration:none; color:#F3C;}
a:active {text-decoration:none; border:none; color:#888;}

.clear {clear:both;}
.clear-right {clear:right;}
.clear-left {clear:left;}

img {border:none;}

.bg-img-right {float:right; text-indent:-9999px;}
.bg-img-left {float:left; text-indent:-9999px;}

/*************** rotating content */
.jsclass body .randomordercontent{display:none;}


/********************************************************* BASIC LAYOUT */
#page {
	width:960px;
	margin:50px auto;
	padding:0 10px;
}

#page-full {
	width:90%;
	margin:50px auto;
}


/********************************************************* HEADER */
#header {
	width:100%;
	height:21px;
	border-bottom:1px solid #999;
}

#logo {
	width:226px;
	height:21px;
	background:url(img/souldesigngroup-logo.png) no-repeat center;
	_background:url(img/souldesigngroup-logo.gif) no-repeat center;
	float:left;
}

#info {
	width:158px;
	height:21px;
	float:right;
}

#phone {
	width:96px;
	height:10px;
	background:url(img/phone.png) no-repeat center; 
	_background:url(img/phone.gif) no-repeat center;
	margin-top:-1px;
}

#email {
	width:158px;
	height:10px;
	background:url(img/email.png) no-repeat center; 
	_background:url(img/email.gif) no-repeat center;
	margin-top:1px;
}  
	
/********************************************************* INTRO */
#intro {
	width:100%;
	margin:25px 0;
	font-size:10px;
	line-height:18px;
	text-align:justify;
}

#intro span {
	background-color:#EFEFEF;
	padding:0 3px;
}

/********************************************************* INDEX GALLERIES */
#galleries {
	width:103%;
	font-size:10px;
}

#tabs {
	width:960px;
	height:79px;
	position:absolute;
	margin:0 auto;
	z-index:5;
}

#web-tab {
	width:89px;
	height:79px;
	position:absolute;
	margin:0 0 0 15px;
	z-index:10;
	background:url(img/web/web-tab.png) no-repeat top center;
	background:url(img/web/web-tab.gif) no-repeat top center;
}

#comps-tab {
	width:89px;
	height:79px;
	position:absolute;
	margin:0 0 0 260px;
	z-index:10;
	background:url(img/comps/comps-tab.png) no-repeat top center;
	_background:url(img/comps/comps-tab.gif) no-repeat top center;
}

#graphics-tab {
	width:89px;
	height:79px;
	position:absolute;
	margin:0 0 0 505px;
	z-index:10;
	background:url(img/graphics/graphics-tab.png) no-repeat top center;
	_background:url(img/graphics/graphics-tab.gif) no-repeat top center;
}

#identity-tab {
	width:89px;
	height:79px;
	position:absolute;
	margin:0 0 0 750px;
	z-index:10;
	background:url(img/identity/identity-tab.png) no-repeat top center;
	_background:url(img/identity/identity-tab.gif) no-repeat top center;
}

.gallery {
	width:225px;
	height:265px;
	margin:0 20px 0 0;
	position:relative;
	overflow:hidden;
	float:left;
}

.gallery .category {
	width:20000em;
	margin-top:37px;
	position:absolute;
	clear:both;
}

.category .item {
	width:225px;
	float:left;
	cursor:pointer;
	margin:0 20px 0 0;
}

.gallery-img-container {width:100%; height:168px; background:#F5F5F5; margin-bottom:3px;}

.item img {width:100%; margin-bottom:3px;}

.item-description {
	font-family:'OCR A Std', 'OCR', 'Verdana', sans-serif;
	border-top:1px solid #EFEFEF;
}

.item-description p {font-family:'OCR A Std', 'OCR', 'Verdana', sans-serif; letter-spacing:.5px; clear:both;}

.item-description span a{color:#F3F; font-size:10px; font-weight:bold; font-variant:small-caps;} /* insert display none to hide "more" button on web gallery items */

.item-name {
	float:left;
	font-size:14px;
	letter-spacing:-1px;
}

.item-lightbox-button {
	width:12px;
	height:12px;
	background:url(img/enlarge-button.png) no-repeat center;
	_background:url(img/enlarge-button.gif) no-repeat center;
	margin:2px -1px 0 0;
}

/*************** WEB FOLDER */
.folder-web-item {
	width:470px;
	float:left;
	margin:0 20px 50px 0;
}

.folder-web-item-full {
	width:470px;
	float:left;
	cursor:pointer;
	margin:0px 20px 20px 0;
}

.folder-web-item img {width:100%; margin-bottom:3px;}

.folder-web-img-container {width:100%; height:200px; background:#fff; margin-bottom:3px; overflow:hidden;}

.folder-web-item-full img {width:100%; margin-bottom:3px;}

.folder-web-item-full .item-lightbox-button {display:none}

#web-multi-item {
	width:100%;
	margin:-24px 0 0 0;
	background:#F9F9F9;
	_background:none;
	font-size:9px;
	text-align:right;
	cursor:pointer;
}

.web-link {
	width:100%;
	margin:0 0 -15px 0;
	font-size:9px;
	font-style:italic;
	font-weight:bold;
	text-align:right;
}


/*************** COMPS FOLDER */
.folder-comps-item {
	width:307px;
	float:left;
	margin:0 20px 50px 0;
}

.folder-comps-item img {width:100%; margin-bottom:3px;}

#available-comps { 
	width:307px;
	margin-left:653px;
	position:absolute;
	top:110px;
	background:#F9F9F9;
	display:none;
} /* remove display:none to show highlight explanation for available comps */

#available-highlight {
	width:25px;
	height:25px;
	margin:3px 5px 0 0;
	background-color:#65CCFF;
	float:left;
}

#available-text {
	margin-top:-3px;
	text-align:justify;
}


/*************** GRAPHICS FOLDER */
.folder-graphics-item {
	width:225px;
	float:left;
	margin:0 20px 50px 0;
}

.folder-graphics-item img {width:100%; margin-bottom:3px;}

.graphics-img-container {width:100%; height:168px; background:#fff; margin-bottom:3px;}

/*************** IDENTITY FOLDER */
.folder-identity-item {
	width:225px;
	float:left;
	margin:0 20px 50px 0;
}

.folder-identity-item img {width:100%; margin-bottom:3px;}

.identity-img-container {width:100%; height:168px; background:#fff; margin-bottom:3px;}


/********************************************************* MORE CONTENT */
#more-content {
	width:100%;
}

/*************** multi space */
#multi-space {
	width:470px;
	margin:-20px 20px 0 0;
	float:left;
}

#multi-space-content {
	width:100%;
	clear:both;
}

#multi-space-content ul {
	list-style:none;
	margin:20px 0 0 20px;
}

#multi-space-content li {margin-bottom:5px;}

/***** what */
#what-new-media {
	width:100%;
	margin:20px 0;
}

#what-print-design {
	width:100%;
	margin:20px 0;
	display:none;
}

#what-strategy {
	width:100%;
	margin:20px 0;
	display:none;
}

#header-what {
	width:107px;
	height:14px;
	margin-bottom:20px;
	background:url(img/header-what.png) no-repeat top center;
	_background:url(img/header-what.jpg) no-repeat top center;
}

#what-subnav {
	width:100%;
	color:#F3F;
	clear:both;
}

#what-subnav a {color:#F3F; cursor:pointer;}

.what-subnav-item {margin-right:30px; float:left;}

.what-subnav-item-on {
	margin-right:30px;
	padding:0 2px 5px 1px;
	background:url(img/multi-space-subnav-on.gif) no-repeat center bottom;
	float:left;
}

#folder-header-what {
	width:100%;
	height:14px;
	margin:0 0 20px 0;
	background:url(img/header-what.png) no-repeat top left;
	_background:url(img/header-what.gif) no-repeat top left;
}

/***** who */
#who {
	width:100%;
	margin:20px 0;
	display:none;
}

#header-who {
	width:83px;
	height:14px;
	margin-bottom:20px;
	background:url(img/header-who.png) no-repeat top center;
	_background:url(img/header-who.jpg) no-repeat top center;
}

#who img {
	margin:0 0 10px -1px;
}

#who li {letter-spacing:.2px;}

#folder-header-who {
	width:100%;
	height:14px;
	margin:0 0 20px 0;
	background:url(img/header-who.png) no-repeat top left;
	_background:url(img/header-who.gif) no-repeat top left;
}

/***** process */
#process {
	width:100%;
	margin:18px 0;
	display:none;
}

#header-process {
	width:184px;
	height:14px;
	margin-bottom:20px;
	background:url(img/header-process.png) no-repeat top center;
	_background:url(img/header-process.jpg) no-repeat top center;
}

#process #multi-space-content p {margin-bottom:5px;}

#process #multi-space-content img {float:left; margin:0 10px -3px 0;}

#folder-header-process {
	width:100%;
	height:14px;
	margin:0 0 20px 0;
	background:url(img/header-process.png) no-repeat top left;
	_background:url(img/header-process.gif) no-repeat top left;
}

/***** faq */
#faq {
	width:100%;
	margin:18px 0;
	letter-spacing:1px;
	line-height:1.1em;
	display:none;
}

#header-faq {
	width:74px;
	height:14px;
	margin-bottom:20px;
	background:url(img/header-faq.png) no-repeat top center;
	_background:url(img/header-faq.jpg) no-repeat top center;
}

.faq-item { }

#faq-1 {cursor:pointer;}

#faq-2 {display:none; cursor:pointer;}

#faq p a {margin-top:-10px; color:#F3F; font-size:10px; font-weight:bold; font-variant:small-caps; float:right;}

.faq-item em {letter-spacing:1.5px; background-color:#F3F3F3;}

#folder-header-faq {
	width:100%;
	height:14px;
	margin:0 0 20px 0;
	background:url(img/header-faq.png) no-repeat top left;
	_background:url(img/header-faq.gif) no-repeat top left;
}

/***** contact */
#contact {
	width:100%;
	margin:18px 0;
	display:none;
}

#header-contact {
	width:193px;
	height:14px;
	margin-bottom:20px;
	background:url(img/header-contact.png) no-repeat top center;
	_background:url(img/header-contact.jpg) no-repeat top center;
}

.contact-field {
	width:110px;
	margin:5px 20px 0 0;
	padding:1px 3px;
	background:#EDEDED;
	border:none;
	color:#F3F;
}

.contact-field-mssg {
	width:328px;
	_width:320px;
	height:55px;
	margin:5px 0 0 0;
	padding:1px 3px;
	background:#EDEDED;
	border:none;
	color:#F3F;
	white-space:normal;	
}

.contact-field-submit {
	width:60px;
	margin:5px 0 0 0;
	padding:0 3px;
	background:#F3F;
	text-align:center;
	color:#FFF;
	border:none;
	color:#F3F;
	cursor:pointer;
}

#webiverse img{display:inline; clear:both; margin:25px 35px 0 0; _margin:-30px 35px 0 0;}

#folder-header-contact {
	width:100%;
	height:14px;
	margin:0 0 20px 0;
	background:url(img/header-contact.png) no-repeat top left;
	_background:url(img/header-contact.gif) no-repeat top left;
}

/***** nav */
#multi-space-nav {
	width:100%;
	height:15px;
	margin:40px 0 20px 0;
	padding:5px 0 1px 0;
	border-bottom:1px solid #EFEFEF;
	font-size:12px;
	clear:both;
}

.ms-nav-item {padding:1px 30px; cursor:pointer;}

.ms-nav-item-on {margin-top:-5px; padding:1px 30px; border-top:5px solid #F3F;}

#sub-nav-what {width:29px; height:12px; background:url(img/sub-nav-what.png) bottom no-repeat; _background:url(img/sub-nav-what.gif) top no-repeat;}

#sub-nav-who {width:25px; height:12px; background:url(img/sub-nav-who.png) bottom no-repeat; _background:url(img/sub-nav-who.gif) top no-repeat;}

#sub-nav-process {width:43px; height:12px; background:url(img/sub-nav-process.png) bottom no-repeat; _background:url(img/sub-nav-process.gif) top no-repeat;}

#sub-nav-faq {width:21px; height:12px; background:url(img/sub-nav-faq.png) bottom no-repeat; _background:url(img/sub-nav-faq.gif) top no-repeat;}

#sub-nav-contact {width:47px; height:12px; background:url(img/sub-nav-contact.png) bottom no-repeat; _background:url(img/sub-nav-contact.gif) top no-repeat;}



/*************** twitter */
#twitter {
	width:225px;
	margin:0 20px 0 0;
	float:left;
	font-size:10px;
}

#header-twitter {
	width:168px;
	height:14px;
	margin-bottom:20px;
	background:url(img/header-twitter.png) no-repeat top center;
	_background:url(img/header-twitter.gif) no-repeat top center;
}

#tweets {
	text-align:justify;
	line-height:1.1em;
	list-style:none;
	clear:both;	
}

#tweets li {margin-top:10px; border-bottom:1px solid #F5F5F5;}

.avatar {float:left; width:29px;}

.avatar img {width:30px;}

.status {
	width:187px;
	margin:-1px 0 0 5px;
	float:left;
}

.time {
	width:100%;
	margin-top:0px;
	font-family:Verdana, sans-serif;
	font-size:8px;
	text-align:right;
	color:#F3F;
	clear:both;
}

#twitter-follow {
	width:100%;
	margin:5px 0 0 0;
	color:#F3F;
	font-size:10px;
	font-weight:bold;
	font-variant:small-caps;
	text-align:center;
}

/*************** news */
#news {
	width:225px;
	float:left;
	font-size:10px;
	text-align:justify;
	line-height:1.2em;
}

#header-news {
	width:104px;
	height:14px;
	margin-bottom:19px;
	background:url(img/header-news.png) no-repeat top center;
	_background:url(img/header-news.gif) no-repeat top center;
}

.news-item {
	margin:0 0 25px 1px;
	clear:both;	
}

.news-item img {border:1px solid #EFEFEF; margin:0 0 2px -1px; float:left;}

#news p a {color:#F3F; font-size:10px; font-weight:bold; font-variant:small-caps; float:right; display:none;} /* remove display none to show "more" button for news items */

.news-date {margin:-10px 0 0 0; padding:0 0 3px 0; background:#F9F9F9; font-size:17px; letter-spacing:-3px; line-height:.7em; text-align:right; z-index:-1;}

.news-info {margin-top:2px; clear:both;}

/********************************************************* SDG-FOOTER */
#sdg-footer {
	width:100%;
	height:19px;
	margin:0 auto 25px auto;
	padding:3px 0;
	border-top:1px solid #999;
	border-bottom:1px solid #999;
	clear:both;
}

#sdg-logo {
	width:45px;
	height:19px;
	background:url(img/sdg-logo.png) no-repeat top center;
	_background:url(img/sdg-logo.gif) no-repeat top center;
}

#quick-message {
	width:470px;
	float:right;
}

#quick-message form input {
	float:left;
}

.QM {
	width:106px;
	_width:100px;
	margin:2px 10px 0 0;
	padding:1px 3px;
	background:#EDEDED;
	border:none;
	color:#F3F;
	float:left;
}

.QM-mssg {
	width:175px;
	margin:2px 10px 0 0;
	padding:1px 3px;
	background:#EDEDED;
	border:none;
	color:#F3F;
	float:left;
}

.QM-submit {
	width:35px;
	margin:2px 0 0 0;
	padding:0 3px 2px 3px;
	background:#F3F;
	text-align:center;
	font-size:9px;
	color:#FFF;
	border:none;
	color:#F3F;
	float:right;
	cursor:pointer;
}


/********************************************************* OUTSIDERS */
#outsiders {
	width:100%;
	margin:0 auto;
}

#header-inlikewith {
	width:247px;
	height:14px;
	margin:0 0 0 15px;
	background:url(img/header-inlikewith-w.png) no-repeat top center;
	_background:url(img/header-inlikewith-w.gif) no-repeat top center;
	position:absolute;
}

#inlikewith {
	width:470px;
	margin:0 20px 0 0;
	float:left;
}

#inlikewith-img {}

#inlikewith-img img {width:470px;}

#inlikewith-more {
	width:25px;
	height:25px;
	margin:202px 0 0 10px;
	background:url(img/+more.gif) no-repeat top center;
	position:absolute;
	cursor:pointer;
}

a#inlikewith-more:hover {background:url(img/+more-f3f.gif) no-repeat top center;}

#inlikewith-less {
	width:25px;
	height:25px;
	margin:202px 0 0 10px;
	background:url(img/-less-w.gif) no-repeat top center;
	position:absolute;
	display:none;
	cursor:pointer;
}

a#inlikewith-less:hover {background:url(img/-less-f3f.gif) no-repeat top center;}

#inlikewith-more-text {
	width:450px;
	height:105px;
	margin-top:-181px;
	padding:10px;
	letter-spacing:1px;
	line-height:1.1em;
	text-align:justify;
	background:url(img/lightbox-overlay.png) repeat;
	_background:#DEDEDE;
	position:absolute;
	display:none;
}

#inlikewith-link {
	margin-top:10px;
	font-style:italic;
	font-weight:bold;
}

#inlikewith-more-text p a {
	margin:-10px 0 0 0;
	color:#F3F;
	font-weight:bold;
	font-variant:small-caps;
	float:right;
	cursor:pointer;
}

#inlikewith p a {
	margin:0 -2px 0 0;
	color:#F3F;
	font-weight:bold;
	font-variant:small-caps;
	float:right;
	cursor:pointer;
}

#folder-header-inlikewith {
	width:100%;
	height:50px;
	margin:0 0 20px 0;
	background:url(img/header-inlikewith-w.png) no-repeat 15px 0px #DDD;
	_background:url(img/header-inlikewith-w.gif) no-repeat 15px 0px #DDD;
}

.folder-inlikewith-item {
	width:470px;
	margin:0 20px 125px 0;
	float:left;
}

#folder-inlikewith-more-text {
	width:470px;
	height:105px;
	padding:10px 0;
	letter-spacing:1px;
	line-height:1.1em;
	text-align:justify;
	background:url(img/lightbox-overlay.png) repeat;
	_background:none;
	position:absolute;
}

#respect {
	width:470px;
	letter-spacing:-.2px;
	float:left;
	
}

#header-respect {
	width:177px;
	height:14px;
	margin-bottom:15px;
	background:url(img/header-respect.png) no-repeat top center;
	_background:url(img/header-respect.gif) no-repeat top center;
}

.respect-column {
	width:112px;
	margin:0px 5px 0 0;
	float:left;
}

.respect-category {font-size:16px; letter-spacing:-1.5px; line-height:1.2em;}

.respect-items {margin-left:14px; font-weight:12px; font-variant:small-caps;}


/********************************************************* FOLDERS LAYOUT */
#folder-content {
	width:103%;
	margin:50px 0 0 0;
	font-size:10px;
}

#folder-tabs {
	height:79px;
	margin-left:-10px;
	overflow:hidden;
}

#folder-home-tab {
	width:89px;
	height:25px;
	position:absolute;
	margin:0 0 0 0px;
	background:url(img/folder-home-tab.png) no-repeat bottom center;
	background:url(img/folder-home-tab.gif) no-repeat bottom center;
}

#folder-web-tab {
	width:89px;
	height:25px;
	position:absolute;
	margin:0 0 0 90px;
	background:url(img/web/folder-web-tab.png) no-repeat bottom center;
	background:url(img/web/folder-web-tab.gif) no-repeat bottom center;
}

#folder-comps-tab {
	width:89px;
	height:25px;
	position:absolute;
	margin:0 0 0 180px;
	background:url(img/comps/folder-comps-tab.png) no-repeat bottom center;
	background:url(img/comps/folder-comps-tab.gif) no-repeat bottom center;
}

#folder-graphics-tab {
	width:89px;
	height:25px;
	position:absolute;
	margin:0 0 0 270px;
	background:url(img/graphics/folder-graphics-tab.png) no-repeat bottom center;
	background:url(img/graphics/folder-graphics-tab.gif) no-repeat bottom center;
}

#folder-identity-tab {
	width:89px;
	height:25px;
	position:absolute;
	margin:0 0 0 360px;
	background:url(img/identity/folder-identity-tab.png) no-repeat bottom center;
	background:url(img/identity/folder-identity-tab.gif) no-repeat bottom center;
}

#folder-tabs .on {height:35px;}

.folder-item-group { }

.folder-item img {width:100%; margin-bottom:3px;}

.folder-item-description {
	font-family:'OCR A Std', 'OCR', 'Verdana', sans-serif;
	border-top:1px solid #EFEFEF;
}

.folder-item-description p {font-family:'OCR A Std', 'OCR', 'Verdana', sans-serif; letter-spacing:.5px; clear:both;}

.folder-item-description span a{color:#F3F; font-size:10px; font-weight:bold; font-variant:small-caps; cursor:pointer;}

.folder-item-name {
	float:left;
	font-size:14px;
	letter-spacing:-1px;
}

.folder-item-lightbox-button {
	width:12px;
	height:12px;
	background:url(img/enlarge-button.png) no-repeat center;
	_background:url(img/enlarge-button.gif) no-repeat center;
	margin:2px -2px 0 0;
}


/********************************************************* CV */
#cv-container {width:100%; margin:-50px 0 5px 0;}

#cv-container img {border:1px solid #EEE;}

#cv p a {color:#F3F; font-size:10px; font-weight:bold; font-variant:small-caps; float:right; padding:0 0 25px 0; }

#cv #folder-content {width:100%;}



/********************************************************* FOOTER */
#footer {
	width:100%;
	margin:0 0 40px 0;
	text-align:center;
	color:#BBB;
	font-variant:small-caps;
}

#footer-colorwheel{
	width:100%;
	height:15px;
	position:fixed;
	bottom:0px;
	background:url(img/bg-colorwheel.png) repeat-x center;
	_background:url(img/bg-colorwheel.gif) repeat-x center;
	clear:both;
	_display:none;
}

#sitemeter-position {
	float:left;
	text-align:-3000px;
	margin-left:-3000px;
}


/********************************************************* BOO IE6 */
#what-ie6 {
	width:100%;
	height:100%;
	background:url(img/ie6-overlay.gif) repeat;
	position:absolute;
	top:0;
	right:0;
	display:none;
	_display:block;
	z-index:11;
}

#what-ie6-box {
	width:600px;
	margin:15% auto;
	padding:25px;
	border:8px solid #CCC;
	background:#FFF;
}

#what-ie6-box p {font-variant:small-caps;}

#what-ie6-header {
	width:100%;
	margin:0 0 25px 0;
	color:#F3F;
	text-align:center;
	font-size:15px;
	font-variant:small-caps;
	line-height:17px;
}

.what-IE6-browser {
	width:100%;
	padding:12px 0;
	border-bottom:1px solid #EEE;
}

.what-IE6-browser img {float:left; margin:0 15px 0 0}

#what-IE6-close {
	width:75px;
	margin:25px auto 0 auto;
	padding:5px 0;
	background:#F3F;
	text-align:center;
	cursor:pointer;
}

#what-IE6-close a {color:#FFF;}

/********************************************************* LIGHTBOX */
#lightbox{
	background-color:#FFF;
	border:2px solid #EFEFEF;
	padding:10px;
	color:#666;
}

#lightboxDetails{
	font-size:0.9em;
	padding-top:0.4em;
}
	
#lightboxCaption{float:left; margin-left:3px;}
#keyboardMsg{float:right; font-variant:small-caps; color:#FFF; letter-spacing:5px; font-weight:bold; background-color:#F3F; padding:0 0 3px 6px;}
#closeButton{top:5px; right:5px;}

#lightbox img{border:none; clear:both;} 
#overlay img{border:none;}

#overlay{background:url(img/lightbox-overlay.png) center repeat;}

* html #overlay {
	background-color:#FFF;
	background-color:transparent;
	background-image:url(blank.gif);
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="img/lightbox-overlay.png", sizingMethod="scale");
}