/*
Theme Name: TS Graphics
Theme URI: http://tsgraphics.com
Description: Theme used by TS Graphics.
Author: Six-Seventy Designs, http://www.sixseventydesigns.com
Version: 1.0
Tags:
*/

/* colors

*/

/* GLOBAL VALUES ***************************************************************/

/* layout */
body {font-family: 'Museo 500', Arial, sans-serif; color: #000;}
div#wrapper {margin: 0 auto; width: 960px;}
.clear {clear: both;}
em {font-style: italic;}

/* typography */
@font-face {font-family: 'Museo 300'; src: url('../fonts/Museo300-Regular.otf');}
@font-face {font-family: 'Museo 500'; src: url('../fonts/Museo700-Regular.otf');}
@font-face {font-family: 'Museo 700'; src: url('../fonts/Museo700-Regular.otf');}

/* links */
a {text-decoration: none; color: #9db646;}

/* primary nav */
div#primary-nav {}

/* primary content */
div#content {position: relative;}

/* breadcrumbs */
div#breadcrumbs {margin-top: 5px; font-size: 0.70em; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
#breadcrumbs li {float: left; margin-right: 10px;}
#breadcrumbs li.current {color: #b45931;}
#breadcrumbs span.arrow {padding-left: 8px; color: #9db646;}

/* footer */
div#footer {position: relative;}
#footer ul {margin: 0 auto; width: 400px;}
#footer ul li {float: left; margin-right: 25px;}
#footer ul li.last {margin-right: 0;}
#footer ul li a {display: block; height: 36px; text-indent: -9999px; background: url(../img/b-uni-nav.gif) no-repeat 0 0;}
#footer ul li#uni-home a {width: 62px;}
#footer ul li#uni-home a:hover {background-position: 0 -36px;}
#footer ul li#uni-branding a {width: 87px; background-position: -100px 0;}
#footer ul li#uni-branding a:hover {background-position: -100px -36px;}
#footer ul li#uni-print a {width: 61px; background-position: -224px 0;}
#footer ul li#uni-print a:hover {background-position: -224px -36px;}
#footer ul li#uni-contact a {width: 96px; background-position: -323px 0;}
#footer ul li#uni-contact a:hover {background-position: -323px -36px;}


/* HOME PAGE ***************************************************************/
body#home {background: url(../img/b-body-landing-tile.jpg) repeat-x top center;}
#home #container {position: relative; height: 657px; background: url(../img/b-body-home.jpg) no-repeat top center;}
#home h1 {text-indent: -9999px;}
#home ul#nav {position: absolute; top: 0; right: 0; font-size: 0.75em; font-family: 'Museo 700', sans-serif;}
#home ul#nav li a {display: block; color: #573220; text-indent: -9999px;}
#home ul#nav li#branding {position: absolute; top: 408px; right: 242px;}
#home ul#nav li#branding a {width: 94px; height: 37px; overflow: hidden; background: url(../img/b-nav-branding.gif) no-repeat 0 -40px;}
#home ul#nav li#branding a:hover {background-position: 0 0;}
#home ul#nav li#print {position: absolute; top: 456px; right: 289px;}
#home ul#nav li#print a {width: 68px; height: 37px; overflow: hidden; background: url(../img/b-nav-print.gif) no-repeat 0 -41px;}
#home ul#nav li#print a:hover {background-position: 0 -1px;}
#home ul#nav li#contact {position: absolute; top: 489px; right: 309px;}
#home ul#nav li#contact a {width: 85px; height: 40px; overflow: hidden; background: url(../img/b-nav-contact.gif) no-repeat 0 -43px;}
#home ul#nav li#contact a:hover {background-position: 0 0;}


/* BRANDING PAGE ***************************************************************/
body#branding {background: url(../img/b-body-landing-tile.jpg) repeat-x top center;}
#branding #container {position: relative; height: 657px; background: url(../img/b-body-branding.jpg) no-repeat top center;}
#branding h1 {text-indent: -9999px;}
#branding ul#nav {position: absolute; top: 0; right: 0; font-size: 0.75em; font-family: 'Museo 700', sans-serif;}
#branding ul#nav li a {display: block; color: #573220; text-indent: -9999px;}
#branding ul#nav li#brochures {position: absolute; top: 315px; right: 267px;}
#branding ul#nav li#brochures a {width: 131px; height: 62px; overflow: hidden; background: url(../img/b-nav-brouchures.jpg) no-repeat 0 0;}
#branding ul#nav li#brochures a:hover {background-position: 0 -62px;}
#branding ul#nav li#cards {position: absolute; top: 395px; right: 292px;}
#branding ul#nav li#cards a {width: 131px; height: 62px; overflow: hidden; background: url(../img/b-nav-cards.jpg) no-repeat 0 0;}
#branding ul#nav li#cards a:hover {background-position: 0 -63px;}
#branding ul#nav li#logos {position: absolute; top: 449px; right: 355px;}
#branding ul#nav li#logos a {width: 131px; height: 62px; overflow: hidden; background: url(../img/b-nav-logos.jpg) no-repeat 0 0;}
#branding ul#nav li#logos a:hover {background-position: 0 -63px;}
#branding ul#nav li#identity{position: absolute; top: 478px; right: 431px;}
#branding ul#nav li#identity a {width: 131px; height: 72px; overflow: hidden; background: url(../img/b-nav-identity.jpg) no-repeat 0 0;}
#branding ul#nav li#identity a:hover {background-position: 0 -72px;}


/* PRINT PAGE ***************************************************************/
body#print {background: url(../img/b-body-landing-tile.jpg) repeat-x top center;}
#print #container {position: relative; height: 657px; background: url(../img/b-print.jpg) no-repeat top center;}
#print h1 {text-indent: -9999px;}
#print ul#nav {position: absolute; top: 0; right: 0; font-size: 0.75em; font-family: 'Museo 700', sans-serif;}
#print ul#nav li a {display: block; color: #573220; text-indent: -9999px;}
#print ul#nav li#pub {position: absolute; top: 299px; right: 205px;}
#print ul#nav li#pub a {width: 150px; height: 60px; overflow: hidden; background: url(../img/b-nav-pub.jpg) no-repeat 0 0;}
#print ul#nav li#pub a:hover {background-position: 0 -60px;}
#print ul#nav li#inv {position: absolute; top: 370px; right: 215px;}
#print ul#nav li#inv a {width: 150px; height: 60px; overflow: hidden; background: url(../img/b-nav-inv.jpg) no-repeat 0 0;}
#print ul#nav li#inv a:hover {background-position: 0 -60px;}
#print ul#nav li#music {position: absolute; top: 430px; right: 298px;}
#print ul#nav li#music a {width: 150px; height: 50px; overflow: hidden; background: url(../img/b-nav-music-illus.jpg) no-repeat 0 0;}
#print ul#nav li#music a:hover {background-position: 0 -110px;}
#print ul#nav li#illus{position: absolute; top: 478px; right: 298px;}
#print ul#nav li#illus a {width: 150px; height: 50px; overflow: hidden; background: url(../img/b-nav-music-illus.jpg) no-repeat 0 -48px;}
#print ul#nav li#illus a:hover {background-position: 0 -158px;}


/* CONTACT PAGE ***************************************************************/
body#contact {background: url(../img/b-body-landing-tile.jpg) repeat-x top center;}
#contact #container {position: relative; height: 657px; background: url(../img/b-contact.jpg) no-repeat top center;}
#contact h1 {text-indent: -9999px;}
#contact ul#contact-info {position: relative; top: 443px; left: 353px; width: 145px; height: 64px; text-indent: -9999px; background: url(../img/b-contact-info.jpg) no-repeat 0 0;}


/* CONTENT LANDING PAGES ***************************************************************/
body.content-landing {background: url(../img/b-content-landing-tile.jpg) repeat-x top center;}
.content-landing #container {position: relative; height: 657px; background: url(../img/b-content-landing.jpg) no-repeat top center;}
.content-landing #content {clear: both; margin-top: 298px;}
.content-landing ol#nav {text-align: center;}
.content-landing ol#nav li {display: inline; padding: 13px; font-size: 1.25em}
.content-landing ol#nav li a {color: #cc6729;}
#screenshot {position: absolute; border: 1px solid #d3d7c9; background: #fff; padding: 5px; display: none; color: #000; font-size: 12px; font-family: "Museo 300", sans-serif;}
#screenshot img {margin-bottom: 5px;}


/* BROCHURES LANDING PAGE ***************************************************************/
body#brochures h1 {position: relative; top: 273px; margin: 0 auto; width: 398px; height: 52px; text-indent: -9999px; background: url(../img/h-brochures.png) no-repeat top center;}


/* BIZ CARDS LANDING PAGE ***************************************************************/
body#biz-cards h1 {position: relative; top: 273px; margin: 0 auto; width: 354px; height: 52px; text-indent: -9999px; background: url(../img/h-biz-cards.png) no-repeat top center;}
.biz-cards #content img {border: 0!important;}


/* IDENTITY LANDING PAGE ***************************************************************/
body#identity h1 {position: relative; top: 273px; margin: 0 auto; width: 306px; height: 66px; text-indent: -9999px; background: url(../img/h-identity.png) no-repeat top center;}
#identity #content {clear: both; margin-top: 283px;}


/* LOGOS LANDING PAGE ***************************************************************/
body#logos h1 {position: relative; top: 273px; margin: 0 auto; width: 209px; height: 66px; text-indent: -9999px; background: url(../img/h-logos.png) no-repeat top center;}
#logos #content {clear: both; margin-top: 283px;}
.logos #content img {border: 0!important;}


/* ILLUSTRATIONS LANDING PAGE ***************************************************************/
body#illustrations h1 {position: relative; top: 273px; margin: 0 auto; width: 478px; height: 52px; text-indent: -9999px; background: url(../img/h-illustrations.png) no-repeat top center;}


/* INVITATIONS LANDING PAGE ***************************************************************/
body#invitations h1 {position: relative; top: 273px; margin: 0 auto; width: 423px; height: 52px; text-indent: -9999px; background: url(../img/h-invitations.png) no-repeat top center;}


/* MUSIC LANDING PAGE ***************************************************************/
body#music h1 {position: relative; top: 273px; margin: 0 auto; width: 230px; height: 52px; text-indent: -9999px; background: url(../img/h-music.png) no-repeat top center;}


/* PUBLICATIONS LANDING PAGE ***************************************************************/
body#publications h1 {position: relative; top: 273px; margin: 0 auto; width: 491px; height: 66px; text-indent: -9999px; background: url(../img/h-publications.png) no-repeat top center;}
#publications #content {clear: both; margin-top: 283px;}


/* CONTENT PAGES ***************************************************************/
body#content-page {background: url(../img/b-body-landing-tile.jpg) repeat-x top center;}
#content-page #container {position: relative;}
#content-page h1 {margin: 5px 0 80px 0; width: 700px; font-size: 1.50em; font-family: "Museo 300", sans-serif; color: #b45931;}
#content-page .bigger {float: right;}
#content-page .bigger .medium {width: 600px; height: 450px;}
#content-page #content img {float: right; padding: 3px; border: 1px dashed #d3d7c9;}
#content-page #footer {position: absolute; top: 657px; left: 0; right: 0; clear: both;}
#content-page .description {float: left; width: 300px;}
#content-page .description h2 {margin-bottom: 15px; font-size: 1.15em; font-family: "Museo 300", sans-serif; color: #b45931;}
#content-page .description p {margin-bottom: 15px; font-size: 0.75em; line-height: 1.45em; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
#content-page .description p.quote {font-style: italic;}
#content-page #next-prev {position: absolute; top: 0; right: 0;}
#content-page #next-prev li {float: right; margin-left: 20px;}
#content-page #next-prev li a {display: block; text-indent: -9999px;}
#content-page #next-prev li#next a {width: 52px; height: 18px; background: url(../img/b-next.jpg) no-repeat 0 0;}
#content-page #next-prev li#next a:hover {background-position: 0 -20px;}
#content-page #next-prev li#prev a {width: 85px; height: 18px; background: url(../img/b-prev.jpg) no-repeat 0 -1px;}
#content-page #next-prev li#prev a:hover {background-position: 0 -21px;}


/* TOC *********************************************************************/
#toc #container {position: relative; height: 657px;}
#toc h1 {position: relative; top: 266px; margin: 0 auto; width: 550px; height: 52px; font-size: 4.25em; color: #d2deb3; font-family: 'Museo 300';}
#toc #container {position: relative; height: 657px; background: url(../img/b-content-landing.jpg) no-repeat top center;}
#toc #content {clear: both; margin-top: 298px; font-family: 'Museo 300';}
#toc #list {margin-left: 210px;}
#toc ul ul {margin-left: 10px;}
#toc #list li {padding: 3px 0;}
#toc a {color: #9eb739;}
#toc #footer {display: none;}


