/* CSS Document */

/*

Organized by:

Global Typography
General Layout

Navigation
Header
Content
Footer

Forms and Tables
Misc.

*/



/* Global Typography
-------------------------------------------------------------- */

body { 
	color: #666; 
	font-family: Arial, Helvetica, sans-serif;
	}

a, a:visited { color: #666; text-decoration: none; }
a:hover { color: #BBB; text-decoration: none; }

h6 {
	color: #BBB;
	font-size: 0.92em;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: 1px;
	}



/* General Layout
-------------------------------------------------------------- */

body { 
	margin: 0;
	background-color: #000; 
	}

body#home, #wallpaper, #wallpaper table, #wallpaper td {
	width: 100%;
	height: 100%;
	overflow: hidden;
	}
	
.container {
	position: relative;
	width: 1080px;
	margin: 0 auto;
	}
	
#header, #content, #footer { width: 100%; }

#header .container { height: 320px; }

body#home #header {
	position: absolute;
	top: 0;
	left: 0;
	height: 70px;
	z-index: 10;
	background-color: #000;
	}
body#home #header .container { height: 70px; }

#content .container, #footer .container {
	width: 990px;
	padding: 45px;
	}
	
body#home #content {
	position: relative;
	top: 70px;
	margin: 0 auto;
	z-index: 5;
	}
body#home #content .container {
	width: 1010px;
	height: 620px; 
	padding: 30px 35px 45px;
	}
	
body#home #footer {
	position: absolute;
	bottom: 0;
	height: 80px;
	z-index: 10;
	background-color: #000;
	}
body#home #footer .container { padding: 45px 45px 20px; }



/* Navigation
-------------------------------------------------------------- */

#navbar {
	position: absolute;
	right: 45px;
	margin: 0;
	padding: 0;
	list-style: none;
	}
#navbar li {
	float: left; 
	margin-left: 10px;
	}
#navbar a {
	display: block;
	float: left;
	width: 125px;
	height: 70px;
	text-indent: -999em;
	overflow: hidden;
	}
#navbar li:hover a, #navbar li.selected a {
	height: 320px !important;
	background-position: top right !important;
	}
body#home #navbar li:hover a, body#home #navbar li.selected a, body#short-nav #navbar li#real-estate:hover a, body#short-nav #navbar li#real-estate a { height: 70px !important; }
	
#navbar li#contact, #navbar li#contact a { background: url(../img/nav_contact.png) no-repeat top left; }
#navbar li#editorial, #navbar li#editorial a { background: url(../img/nav_editorial.png) no-repeat top left; }
#navbar li#portfolio, #navbar li#portfolio a { background: url(../img/nav_portfolio.png) no-repeat top left; }
#navbar li#profile, #navbar li#profile a { background: url(../img/nav_profile.png) no-repeat top left; }
#navbar li#real-estate, #navbar li#real-estate a { background: url(../img/nav_real_estate.png) no-repeat top left; }
	
/* Sub Nav */
	
#navbar ul {
	position: absolute;
	left: -999em;
	top: 70px;
	margin: 0;
	padding: 0;
	list-style: none;
	}
#navbar li:hover ul, #navbar li.selected ul { left: auto; }
#navbar ul li {
	float: none; 
	margin: 0;
	}
#navbar ul a {
	float: none;
	height: 40px;
	}
#navbar li:hover ul a, #navbar li.selected ul a {
	height: 40px !important; 
	background-position: top left !important;
	}
#navbar li:hover ul a:hover, #navbar li ul li.selected a { background-position: top right !important; }

#navbar li#adele-cygelman, #navbar li#adele-cygelman a { background: url(../img/nav_adele_cygelman.png) no-repeat top left; }
#navbar li#events, #navbar li#events a { background: url(../img/nav_events.png) no-repeat top left; }
#navbar li#marketing, #navbar li#marketing a { background: url(../img/nav_marketing.png) no-repeat top left; }
#navbar li#publicity, #navbar li#publicity a { background: url(../img/nav_publicity.png) no-repeat top left; }
#navbar li#susan-pekich, #navbar li#susan-pekich a { background: url(../img/nav_susan_pekich.png) no-repeat top left; }
#navbar li#the-firm, #navbar li#the-firm a { background: url(../img/nav_the_firm.png) no-repeat top left; }



/* Header
-------------------------------------------------------------- */

#header h1 {
	float: left;
	width:200px;
	height: 70px;
	margin: 0;
	padding: 0;
	background: url(../img/logo.gif) no-repeat top left;
	text-indent: -999em;
	overflow: hidden;
	}
#header h1 a {
	display: block;
	height: 70px;
	background: url(../img/logo.gif) no-repeat top left;
	}
#header h1 a:hover { background-position: top right; }
	
#header .dining { background: url(../img/bg_dining_head.jpg) no-repeat top left; }
#header .fire { background: url(../img/bg_fire_head.jpg) no-repeat top left; }
#header .glass { background: url(../img/bg_glass_head.jpg) no-repeat top left; }
#header .glow { background: url(../img/bg_glow_head.jpg) no-repeat top left; }
#header .italian { background: url(../img/bg_italian_head.jpg) no-repeat top left; }
#header .modern { background: url(../img/bg_modern_head.jpg) no-repeat top left; }
	


/* Content
-------------------------------------------------------------- */

#content .dining { background: url(../img/bg_dining_foot.jpg) no-repeat top left; }
#content .fire { background: url(../img/bg_fire_foot.jpg) no-repeat top left; }
#content .glass { background: url(../img/bg_glass_foot.jpg) no-repeat top left; }
#content .glow { background: url(../img/bg_glow_foot.jpg) no-repeat top left; }
#content .italian { background: url(../img/bg_italian_foot.jpg) no-repeat top left; }
#content .modern { background: url(../img/bg_modern_foot.jpg) no-repeat top left; }

#content p, #content ul, #content ol { font-size: 0.92em; }
#content ul ul, #content ol ol { font-size: 100%; }
	
h2.title {
	height: 18px;
	text-indent: -999em;
	overflow: hidden;
	}
h2.adele-cygelman { background: url(../img/title_adele_cygelman.gif) no-repeat top left; }
h2.contact-us { background: url(../img/title_contact_us.gif) no-repeat top left; }
h2.editorial { background: url(../img/title_editorial.gif) no-repeat top left; }
h2.events { background: url(../img/title_events.gif) no-repeat top left; }
h2.marketing { background: url(../img/title_marketing.gif) no-repeat top left; }
h2.publicity { background: url(../img/title_publicity.gif) no-repeat top left; }
h2.real-estate { background: url(../img/title_real_estate.gif) no-repeat top left; }
h2.susan-pekich { background: url(../img/title_susan_pekich.gif) no-repeat top left; }
h2.the-firm { background: url(../img/title_the_firm.gif) no-repeat top left; }

#main {
	float: left;
	width: 670px;
	}
#main h6 { font-weight: bold; }
#main img.expansive {
	margin-right: -320px; 
	margin-left: 30px;
	}
	
#sidebar {
	float: right;
	width: 180px;
	padding: 25px;
	background-color: #000;
	}
#sidebar ul {
	margin: 5px 0 15px;
	padding: 0;
	list-style: none;
	}
	
.thumbnail {
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
	padding: 7px;
	background-color: #333;
	border: 1px solid #666;
	}
	
a.twitter, a.facebook, a.linked-in, a.rss {
	display: block;
	padding-left: 25px;
	height: 16px;
	margin-bottom: 10px;
	background: url(../img/icon_twitter.gif) no-repeat top left;
	font-size: 0.92em;
	}
a.facebook { background: url(../img/icon_facebook.gif) no-repeat top left; }
a.linked-in { background: url(../img/icon_linked_in.gif) no-repeat top left; }
a.rss { background: url(../img/icon_rss.gif) no-repeat top left; }

a.twitter:hover, a.facebook:hover, a.linked-in:hover, a.rss:hover { background-position: bottom left; }

.splash-header {
	position: relative;
	clear: both;
	margin-bottom: 10px;
	padding: 10px;
	background: url(../img/bg_title_home.png) repeat top left;
	}
.splash-header span {
	display: block;
	height: 16px;
	margin: 0;
	text-indent: -999em;
	overflow: hidden;
	}
	
#splash-brand-development { width: 271px; }
#splash-events { width: 96px; }
#splash-marketing { width: 146px; }
#splash-publicity { width: 129px; }

#splash-brand-development span { background: url(../img/title_home_brand_development.png) no-repeat top left; }
#splash-events span { background: url(../img/title_home_events.png) no-repeat top left; }
#splash-marketing span { background: url(../img/title_home_marketing.png) no-repeat top left; }
#splash-publicity span { background: url(../img/title_home_publicity.png) no-repeat top left; }

#wallpaper div {
	position: absolute;
	width: 200%;
	height: 200%;
	top: -50%;
	left: -50%;
	}
#wallpaper td {
	vertical-align: middle;
	text-align: center;
	}
#wallpaper img {
	min-height: 50%;
	min-width: 50%;
	margin: 0 auto;
	}
	
.sub-page {
	padding: 20px;
	background-color: #222; 
	}
.sub-page .copy {
	width: 800px;
	padding: 20px 0 0;
	}
.sub-page object, .sub-page iframe {
	display: block;
	margin: 0 auto; 
	}
	
.blog-post {
	width: 600px;
	margin-bottom: 20px;
	padding: 20px 0;
	}
.blog-post h6 { margin-bottom: 10px; }

.blog-pagination .right { margin-right: 70px; }
.blog-pagination div big {
	font-size: 1.5em;
	vertical-align: -1px; 
	}



/* Footer
-------------------------------------------------------------- */

#footer a, #footer a:hover { color: #777; }

#footer p {
	color: #444;
	font-size: 0.92em;
	}



/* Forms and Tables
-------------------------------------------------------------- */

form { width: 380px; }

label, input, textarea, select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.92em;
	font-weight: normal;
	}
	
label {
	display: block;
	padding: 3px 0;
	text-align: left;
	}

input, textarea {
	width: 150px;
	padding: 5px 10px;
	background-color: #444;
	border: none;
	color: #999;
	}
input#submit {
	display: block;
	width: auto;
	padding: 5px 10px;
	color: #000;
	font-weight: bold;
	}
input#submit:hover {
	cursor: pointer;
	color: #999;
	}

textarea {
	width: 330px; 
	height: 80px;
	overflow: auto;
	}
	
form div {
	float: left;
	margin: 0 10px 10px 0; 
	}

form div.inline {
	float: none;
	margin: 0;
	}
form div.inline input {
	float: left;
	width: 20px;
	margin-right: 10px;
	}
form div.inline input#cell3, form div.inline input#phone3 {
	width: 30px; 
	margin-right: 20px;
	}



/* Misc.
-------------------------------------------------------------- */

.left { float: left; }
.right { float: right; }

.center { text-align: center; }
