/*
Theme Name: SpotCo
Theme URI: http://spotnyc.com
Description: A custom theme developed for the 2009/2010 redesign of spotnyc.com
Version: 1.0
Author: Dan Hodos
Author URI: http://danhodos.com
Tags: spotco, spot, nyc
*/


/* general */
html { background: #f9f6e3; overflow-x: hidden; }
html.home { background: #8f8a54; }
body { font: 11px/16px Arial, Helvetica, sans-serif; color: #666; text-align: center; padding: 10px 0 20px; }

a, a:visited { color: #8f8a54; }
a:hover { color: #f63; }
strong { font-weight: bold; }
em { font-style: italic; }

header h1 img { margin: 0 0 14px 32px; }
h3 { font-size: 14px; line-height: 16px; }
h4 { font-weight: bold; }

hr { border: 0; border-bottom: 1px dotted #ccc; background: #fff; color: #fff; }

/* layout */
#container-wrapper { -moz-box-shadow: 8px 10px 23px #d6d3c3; -webkit-box-shadow: 8px 10px 23px #d6d3c3; box-shadow: 8px 10px 23px #d6d3c3; filter: progid:DXImageTransform.Microsoft.dropShadow(color=#d6d3c3, offX=8, offY=10, positive=true); }
.home #container-wrapper { -moz-box-shadow: 8px 10px 23px #7b7748; -webkit-box-shadow: 8px 10px 23px #7b7748; box-shadow: 8px 10px 23px #7b7748; filter: progid:DXImageTransform.Microsoft.dropShadow(color=#7b7748, offX=8, offY=10, positive=true); }

.content-container { width: 900px; margin: 0 auto; text-align: left; }
#container { background: #fff; padding: 29px 0 24px; }
footer p.content-container { text-align: left; color: #393722; font-family: Verdana, Arial, sans-serif; font-size: 9px; padding: 18px 0 0; width: 880px; }
  footer a { color: #393722; }
  footer span { text-transform: uppercase; float: right; margin-top: -10px;  }
    footer span img { position: relative; top: 5px; }
  
#content-wrapper { overflow: hidden; clear: left; }

/* this line allows for less flickering from the JS that controls hiding/showing the correct part of the nav */
header ul li ul { display: none; }

/* top-level, e.g. Our Work  */
#branding, .home #main-navigation { width: 170px; float: left; }
  #main-navigation ul { margin-bottom: 18px; width: 160px; }
    #main-navigation ul li { margin-bottom: 3px; display: inline; }
      #main-navigation ul li a { display: block; font-size: 20px; color: #8f8a54; text-decoration: none; text-transform: uppercase; margin-bottom: 4px; padding-left: 15px; }
        #main-navigation ul li a:hover, #main-navigation ul li.current_page_item>a, 
        #main-navigation ul li.current_page_ancestor>a { color: #f63; }

/* normal second-level e.g. items under Case Studies */
#main-navigation ul ul { margin: 6px 0 0 4px;  }
  #main-navigation ul ul li { border: 0; padding: 0; }
    #main-navigation ul ul li:first-child { border-top: none; } 
    #main-navigation ul ul li a { padding-left: 26px; text-transform: none; font-size: 11px; color: #999; }
      #main-navigation ul ul li a.hovered { color: #f63; }

/* search form */
#searchform { position: relative; margin-left: 10px; }
  #searchform label { color: #ccc; position: absolute; left: 10px; top: 6px; display: block; width: 141px; background: #fff url(images/search-arrow.gif) 95% 3px no-repeat; }
  #s { border: 0; border-top: 1px solid #cecece; border-left: 1px solid #dfdfdf; padding: 6px 10px; }
  #searchsubmit { display: none; }

/* Our Work second-level, e.g. Highlights */
#main-navigation ul .page-item-12 ul { margin-bottom: 9px; }
  #main-navigation ul .page-item-12 ul li {border-bottom: 1px dotted #ccc; padding: 7px 0; }
    #main-navigation ul .page-item-12 ul li:first-child { border-top: 1px dotted #ccc; }
    #main-navigation ul .page-item-12 ul li a { text-transform: uppercase; font-size: 12px; padding-left: 24px; color: #8f8a54; }
      #main-navigation ul .page-item-12 li.active a { color: #f63; }

/* Our Work third-level, e.g. Avenue Q */
#main-navigation ul .page-item-12 ul ul { margin: 6px 0 0 4px;  }
  #main-navigation ul .page-item-12 ul ul li { border: 0; padding: 0; }
    #main-navigation ul .page-item-12 ul ul li:first-child { border-top: none; } 
    #main-navigation ul .page-item-12 ul ul li a { text-transform: none; font-size: 11px; color: #999; }
      #main-navigation ul .page-item-12 ul ul li a.hovered { color: #f63; }
      #main-navigation ul .page-item-12 li.active li a { color: #999; }

  #main-navigation ul .page-item-12 ul ul li.current_page_item a { color: #f63; background: url(images/main-navigation-selected-item.gif) no-repeat 9px 7px; }

/* expand/collapse images */
#main-navigation span { display: none; float: left; background: url(images/main-navigation-item-collapsed.gif) 15px 5px no-repeat; width: 24px; height: 100%; cursor:pointer; }
  #main-navigation ul .page-item-12 ul span { display: block; }
    #main-navigation ul .page-item-12 ul ul span { display: none; }

#main-navigation ul li.active>a { color: #f63; }
  #main-navigation ul ul li.active span { background: url(images/main-navigation-item-expanded.gif) 14px 7px no-repeat; }

/* style second-level like third-level for outside of our work */

/* wordpress-generated */
.aligncenter { display:block; margin:0 auto; }
.alignleft { float:left; clear: both; margin: 5px 5px 5px 0; }
.alignright { float:right; clear:both; margin: 5px 0 5px 5px; }
.alignnone { display: block; margin: 0 0 5px 0; }

/* home */
.home body #content-wrapper { background: url(images/home-content-background.gif) repeat-y; }
#spotco-large-type-logo { position: relative; width: 100%; height: 396px; background-color: #fff; z-index: 3000;}
#spotco-large-type-logo img { width: 880px; margin: 70px auto 0; }
#welcome-to-spotco { float: left; width: 468px; margin: 0 22px 0 10px; }
  #welcome-to-spotco h2 { color: #f63; font-size: 32px; text-transform: uppercase; margin-bottom: 6px; }
  #welcome-to-spotco p { font-size: 21px; line-height: 1.2; }
  #welcome-to-spotco a { color: #000; padding-bottom: 1px; border-bottom: 1px solid #000; text-decoration: none;  }
    #welcome-to-spotco a:hover { color: #f63; border-color: #f63; }
#latest-and-greatest { float: left; width: 220px; font-size: 10px; }
  #latest-and-greatest h2 { font-size: 18px; text-transform: uppercase; margin-bottom: 8px; }

#carousel-area { margin-bottom: 36px; height: 396px; position: relative; }

.home .item-arrow { position: relative; top: 170px; }
.home #previous-item-arrow { margin-right: 9px; margin-left: 9px;  }
.home #next-item-arrow { float: left; margin-left: 9px; }

/* page */
article header h1 { color: #919191; font-size: 45px; line-height: 45px; text-align: center; text-transform: uppercase; margin-bottom: 27px; }
  
/* portfolio */
.search-results #content-wrapper, .page-template #content-wrapper { background: url(images/page-content-background.gif) repeat-y; }
article { float: left; margin-left: 11px; width: 709px; padding-right: 10px; }

/* portfolio category page */
#portfolio-items { margin-left: -10px; width: 722px; }
#portfolio-items li { float: left; margin: 0 0 5px 10px; text-align: center; }
  #portfolio-items li a { text-decoration: none; color: #999; font-weight: bold; font-size: 10px; }
    #portfolio-items li span { display: block; margin-bottom: 17px; color: #999; font-weight: bold; }
    #portfolio-items li a:hover, #portfolio-items li a.hovered { color: #f63; }
    #portfolio-items em { font-style: italic; font-family: Georgia, Times, "Times New Roman", serif; }
    
.flash-category-video { width: 230px; height: 176px; }
    
/* portfolio item */
#portfolio-item-wrapper { overflow: auto; margin-bottom: 12px; }
#campaign-and-thumbnails, #portfolio-description { float: left; width: 360px; } 
#portfolio-description { width: 339px; margin-left: 10px; }
  #portfolio-description h1, #campaign-and-thumbnails h1 { display: none; }
  #campaign-and-thumbnails nav h1 { text-transform: uppercase; display: block; }

.page-page-template-portfolio-item-php #carousel-wrapper { border: 1px solid #ccc; padding: 11px; width: 673px; margin: 0 auto; line-height: 0; }  
  #portfolio-image-carousel li { width: 100%; text-align: center; height: 570px; }
    .page-template-case-study-php #portfolio-image-carousel li { height: 470px; }

.item-arrow { margin-top: 15px; cursor:pointer; }
#previous-item-arrow { float: left; }
#next-item-arrow { float: right; }

#carousel-navigation ul { margin-left: -6px; }
  #carousel-navigation li { margin-left: 6px; float: left; }
    #carousel-navigation li a img { opacity: 0.5; }
      #carousel-navigation li a:hover img, #carousel-navigation li.active a img { opacity: 1.0; }

.flash-audio .flash-video-wrapper img { z-index: 1000; position: relative; }

/* add this*/
.addthis_container { margin-top: 2px; float: right; }
.addthis_button { text-decoration: none; }

/* search */
.search-list .hentry { margin-bottom: 12px; }
  .search-list h3 em { color: #999; font-size: 11px; }
  .search-list h3 a { text-decoration: none; }
  
.search-list ul li { overflow: auto; }
  .search-list ul li .search-image { float: left; margin-right: 12px; width: 80px; }
  .search-list ul li .result { float: left; width: 610px; }
  .search-list ul li .long { width: 100% }
    
article header h1.bordered { text-align: left; line-height: 20px; font-weight: bold; color: #f63; font-size: 20px; border: 1px solid #ccc; border-width: 1px 0; padding: 7px 0; text-transform: uppercase; width: 100%; margin-bottom: 15px; }

/* text-navigation, used for portfolio item campaign nav and case study content section nav */
.text-navigation ul { margin-left: -6px; overflow: auto; margin-bottom: 16px; }
  .text-navigation li { float: left; margin-left: 6px; border-right: 1px solid #ccc; padding-right: 6px; line-height: 1.1; }
    .text-navigation li:last-child { border-right: 0; }
    .text-navigation li a { color: #999; }
      .text-navigation li a:hover, .text-navigation li a.active { color: #f63; }

.initially-hidden { display: none ;}

/* ancillary */
article p,
article ul { margin-bottom: 12px; }
article h2 { font-size: 22px; line-height: 26px; color: #8f8a54; margin-bottom: 12px; margin-top: 4px; }
article h4 { margin-bottom: 6px; }
article blockquote { font-size: 22px; line-height: 26px; }

aside { margin-left: 23px; float: right; }
  aside img { margin-bottom: 24px; }

.main-content a, article blockquote a { color: #999; }

/* employment */
.page-template-default article li { margin-left: 20px; list-style-type: disc; }

/* contact */
.page-template-contact-us-php article h2 { margin-top: 20px; }
.page-template-contact-us-php article hr { padding-bottom: 20px; }

/* about us */
.page-template-about-us-php article blockquote { font-size: 20px; line-height: 25px; }
.page-template-about-us-php article h2 { font-size: 15px; line-height: 16px; text-transform: uppercase; }
.page-template-about-us-php aside img { padding-right: 44px; }
.page-template-about-us-php .main-content { float: left; width: 480px; }
.page-template-about-us-php #header-carousel { padding-bottom: 22px; }

/* clients */
.page-template-clients-php .main-content ul li { width: 33%; float: left; }
.page-template-clients-php .main-content ul li li { width: auto; float: none; margin-bottom: 6px; width: 90%; }

/* two column equal */
.column { width: 345px; float: left; border-right: 1px dotted #ccc; padding-right: 6px; }
.column.last { border-right: 0; margin-left: 12px; padding-right: 0;}
article.columnized ul li, .search-list ul li, .blog .main-content ul li { margin-bottom: 12px; padding-bottom: 7px; border-bottom: 1px dotted #ccc; }

/* staff */
.page-template-staff-php .column ul li { font-style: italic; padding-left: 16px; background: url(images/icon-email.gif) no-repeat 0 3px;  }
  .page-template-staff-php .column ul li a { font-style: normal; }
  
/* press */
.page-template-press-php h3 { color: #8f8a54; margin-bottom: 6px; font-style: italic; }
.page-template-press-php .column ul li { overflow: auto; }
  .page-template-press-php .column ul li .image-and-pdf { float: left; margin-right: 12px; }
    .image-and-pdf img { display: block; margin-bottom: 10px; }
    .image-and-pdf a { padding: 2px 0 2px 20px; display: block; background: url(images/icon-pdf.gif) no-repeat 0 2px; }
  .page-template-press-php .column ul li .press-content { float: left; width: 252px; }
  .page-template-press-php .column ul li .long { width: 100%; }

#press-content { clear: both; padding-top: 20px; }

/* blog */
.byline { margin: 0; color: #999; font-size: 11px; }
.blog h3, .archive h3, .single h3 { font-size: 16px; line-height: 18px; margin-bottom: 6px; }
  .blog h3 a, .archive h3 a, .single h3 a { text-decoration: none; color: #8f8a54; }
  .blog a.more-link, .archive a.more-link, .single a.more-link { text-decoration: none; }
  
.blog article, .archive article, .single article { overflow: auto; }
.blog .main-content, .archive .main-content, .single .main-content { float: left; width: 470px; padding: 0 10px; border-right: 1px dotted #ccc; }
.blog article, .archive article, .single article { float: left; border-left: 1px dotted #ccc; width: 708px; }

.sidebar { float: left; margin-left: 12px; width: 205px; }
  .sidebar a { color: #999; text-decoration: none; }
  .sidebar dt { color: #444; margin-bottom: 2px; }
  .sidebar dd { padding-bottom: 8px; margin-bottom: 10px; border-bottom: 1px dotted #ccc; }
  .sidebar dd:last-child { border: 0; }
  .sidebar select { padding: 1px; }
  .sidebar ul li { margin-bottom: 4px; font-size: 11px; }
/*  .sidebar ul li.current_page_item a { color: #f1592a; }*/

.blog .addthis_container { position: relative; top: -12px; }
.single .addthis_container { position: relative; top: -2px; }

/* print archive */
#archive-nav p { margin-bottom: 3px; }
#archive-nav ul { overflow: hidden; line-height: 1; margin-bottom: 22px; }
  #archive-nav li { float: left; border-right: 1px solid #ccc; margin-right: 6px; padding-right: 6px; }
    #archive-nav li:last-child { border-right: 0; }
    
/* lower the lights */
#shadow { background-image: url(images/shade1x1.png); position: absolute; left: 0; top: 0; width: 100%; display: none; }
.lightSwitcher { z-index: 1000; }


#makeMeScrollable { filter: Alpha(Opacity=0); opacity: 0; width: 900px; height: 396px; position: absolute; opacity: 0; top: 0; }
#makeMeScrollable.visible { filter: Alpha(Opacity=100); }
  #makeMeScrollable li { position: relative; float: left; white-space: normal; margin-left: 3px;margin-right: 3px; background: black; font-size: 10px; line-height: 12px; z-index: 1; }
    #makeMeScrollable li a { color: #808080; text-decoration: none; }
      #makeMeScrollable li a:hover { color: #fff; }
    #makeMeScrollable li img { padding-bottom: 59px; }
    
    #makeMeScrollable li p, #makeMeScrollable li h2 { left: 0; position: absolute; padding: 0 5px; z-index: 2; }
    #makeMeScrollable li h2 { top: 344px; text-transform: uppercase; }
    #makeMeScrollable li p { top: 358px; }

/* case studies */
#case-study-wrapper { overflow: auto; }
#content-sections { min-height: 80px; }

article p.unfortunately { clear: both; }