@import url(reset.css);
@import url(tricks.css);


body {
    font-size: 12px;
    font-family: Arial, sans-serif;
    background-color: #111;
    color: #888;
}

*:focus { outline: none; }

#container {
    margin: 0 auto;
    width: 900px;
}

#header {
    height: 130px;
    border-bottom: 1px solid #262626;
    position: relative;
}
#header a:focus {
    outline: 0;
}
#logo {
    position: absolute;
    bottom: 5px;
    left: -8px;
}



/*
 * Top-level nav stuff
 */

#nav {
    position: absolute;
    bottom: 25px;
    right: 0;
}
#nav ul {
    float: right;
}
#nav li {
    float: left;
    margin-left: 11px;
}
#nav li a {
    display: block;
    height: 20px;
    text-indent: -9999px;
    background-image: url(/img/nav_bg.png);
}
#branding a         { width: 56px; background-position: 0 0; }
#pr a               { width: 20px; background-position: -67px 0; }
#online_marketing a { width: 104px; background-position: -97px 0; }
#web_development a  { width: 109px; background-position: -212px 0; }
#media a            { width: 41px; background-position: -331px 0; }
#agency a           { width: 49px; background-position: -383px 0; }
#work a             { width: 38px; background-position: -441px 0; }
#case_studies a     { width: 78px; background-position: -489px 0; }
#contact a          { width: 45px; background-position: -577px 0; }

/* Hover state or current page */
#branding a:hover,
body.branding #branding a { background-position: 0 -20px; }

#pr a:hover,
body.pr #pr a { background-position: -67px -20px; }

#online_marketing a:hover,
body.online_marketing #online_marketing a { background-position: -97px -20px; }

#web_development a:hover,
body.web_development #web_development a { background-position: -212px -20px; }

#media a:hover,
body.media #media a { background-position: -331px -20px; }

#agency a:hover,
body.agency #agency a { background-position: -383px -20px; }

#work a:hover,
body.work #work a { background-position: -441px -20px; }

#case_studies a:hover,
body.case_studies #case_studies a { background-position: -489px -20px; }

#contact a:hover,
body.contact #contact a { background-position: -577px -20px; }



/*
 * Rib-ticklers
 */

#rib-tickler {
    float: left;
    width: 285px;
    margin-top: 50px;
    text-indent: -9999px;
    background-repeat: no-repeat;
}
/* Rib-ticklers corresponding to MAIN NAV items */
body.home             #rib-tickler { height: 649px; background-image: url(/img/rib-ticklers/home.png); }
body.branding         #rib-tickler { height: 375px; background-image: url(/img/rib-ticklers/services_branding.png); }
body.pr               #rib-tickler { height: 429px; background-image: url(/img/rib-ticklers/services_pr.png); }
body.services.online_marketing #rib-tickler { height: 431px; background-image: url(/img/rib-ticklers/services_online_marketing.png); }
body.web_development  #rib-tickler { height: 406px; background-image: url(/img/rib-ticklers/services_web_development.png); }
body.media            #rib-tickler { height: 325px; background-image: url(/img/rib-ticklers/services_media.png); }
body.case_studies     #rib-tickler { height: 230px; background-image: url(/img/rib-ticklers/case_studies.png); }
body.contact          #rib-tickler { height: 173px; background-image: url(/img/rib-ticklers/contact.png); }
body.learn_more       #rib-tickler { height: 422px; background-image: url(/img/rib-ticklers/learn_more.png); }
body.lp.online_marketing   #rib-tickler { height: 422px; background-image: url(/img/rib-ticklers/lp_online_marketing.png); }
body.lp.thank_you		  #rib-tickler { height: 422px; background-image: url(/img/rib-ticklers/lp_online_marketing.png); }

/* Rib-ticklers corresponding to WORK sections */
body.tv      #rib-tickler { height: 389px; background-image: url(/img/rib-ticklers/work_tv.png); }
body.radio   #rib-tickler { height: 236px; background-image: url(/img/rib-ticklers/work_radio.png); }
body.print   #rib-tickler { height: 170px; background-image: url(/img/rib-ticklers/work_print.png); }
body.identity  #rib-tickler { height: 226px; background-image: url(/img/rib-ticklers/work_identity.png); }
body.online  #rib-tickler { height: 226px; background-image: url(/img/rib-ticklers/work_online.png); }
body.other   #rib-tickler { height: 216px; background-image: url(/img/rib-ticklers/work_other.png); }

/* Rib-ticklers corresponding to AGENCY sections */
body.awards  #rib-tickler { height: 298px; background-image: url(/img/rib-ticklers/agency_awards.png); }
body.news    #rib-tickler { height: 300px; background-image: url(/img/rib-ticklers/agency_news.png); }
body.jobs    #rib-tickler { height: 350px; background-image: url(/img/rib-ticklers/agency_jobs.png); }
body.clients #rib-tickler { height: 182px; background-image: url(/img/rib-ticklers/agency_clients.png); }
body.people  #rib-tickler { height: 231px; background-image: url(/img/rib-ticklers/agency_people.png); }

/* Rib-ticklers corresponding to SIMPLIFY secion */
body.simplify  #rib-tickler { height: 388px; background-image: url(/img/rib-ticklers/simplify.png); }



/*
 * Main Section
 */

#main {
    width: 575px;
    float: right;
}
#main h1 {
    font-size: 16px;
    height: 24px;
    color: #fff;
    margin: 50px 0 16px;
}
#main p {
    line-height: 2em;
    margin-bottom: 1.5em;
}
#main strong {
    font-weight: normal;
    font-size: 90%;
    text-transform: uppercase;
}



/*
 * Footer
 */

#footer {
    clear: both;
    font-size: 11px;
    font-style: normal;
    padding-top: 36px;
    overflow: auto;
    display: block;
    width: 900px;
}
#footer br {
    display: none;
}
#footer .fn.org {
    display: block;
    height: 30px;
    margin-bottom: 12px;
    text-indent: -9999px;
    background: url(/img/footer.png);
}
#footer .adr {
    display: block;
    float: left;
}
#footer .tel {
    display: block;
    float: right;
}

