/*
   WearitwithPride - Stylesheet CSS - ./_inc/css/stylesheet.css
   $ Revision: 3.1 Build 20080720 $
   Copyright (c) 2009 WearitwithPride. All Rights Reserved.

/////////////////          Import Stylesheets        ///////////////*/

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

/*///////////////          Import Fonts        ///////////////*/

  @font-face {
    font-family: 'Variable Black';
    src: url('../ttf/VARIABLB.eot');
    src: local('Variable Black'), local('Variable-Black'), url('../ttf/VARIABLB.ttf') format('truetype'), url('../ttf/VARIABLB.svg#Variable-Black') format('svg');
  }

/*///////////////         Standard Elements        ///////////////*/

  html, body { height: 100%; min-height: 100%; }
  body { font-size: 62.5%; font-family: Georgia, "Times New Roman", serif; font-style: normal; background: #121212 url(../img/background.gif) top left repeat-y; color: #fff; }
  a { text-decoration: none; white-space: nowrap; color: #595959; }
  a:hover {  }

/*///////////////          Wrapper        ///////////////*/

  #wrapper { height: 100%; }

  #curtain { position: fixed; z-index: 95; left: 220px; right: 0; top: 0; bottom: 0; background: #000; opacity: 0.8; display: none; }

/*///////////////          Wrapper        ///////////////*/

  #headerContainer, #followContainer, #contentContainer, #optionsContainer, #miscContainer, #helpContainer, #footerContainer { position: absolute; }

  #headerContainer { width: 160px; left: 30px; top: 25px; }
    #header h1 a { display: block; width: 160px; height: 46px; background: transparent url(../img/logo.gif) no-repeat; text-indent: -900em; }

    #navigation { margin: 87px 0 0; border-top: #d3c9bd 1px solid; }
      #navigation li, #options li { font-size: 1.1em; }
      #navigation li a {  padding: 3px 0; display: block; border-bottom: 1px solid #d3c9bd; width: 160px; text-align: center; font-style: normal;  }
      #options li { padding: 3px 0; display: block;  border-top:  1px solid #333; color: #333; }
      #followContainer a, #options li a { color: #fff; border-bottom: #d3c9bd 1px solid;   }
      #options li span { float: right; } #options li span a { border-bottom: none; color: #333; }
      #navigation li a:hover { color: #d3c9bd; }

  .selected { color: #d3c9bd; }

  #loading { position: fixed; bottom: 10px; right: 10px; height: 16px; width: 16px; background: url(../img/loading.gif); }

/*///////////////          Wrapper        ///////////////*/

  #otherContainer { top: 26px; width: 340px; position: relative; left: 430px; z-index: 90; }

  #followContainer { border-bottom: 1px solid #333; width: 160px; left: 0; border-top: 1px solid #333; padding: 3px 0; top: 26px;  font-size: 1.1em; color: #333; display: none; }


  #optionsContainer { top: 0; left: 180px; width: 160px; border-bottom: 1px solid #333; display: none; color: #333; }
    #optionsContainer p { color: #333; font-size: 1.1em; }
      #optionsContainer a { color: #d3c9bd; } #optionsContainer a:hover { color: #fff; }

      #subscribeContainer, #subscribeContainer dt { display: none; }

      #btnSubscribe { width: 150px; display: block; padding: 5px; background: #333; color: #d3c9bd; }

      #subscribeContainer { padding: 0 0 5px; background: #333; }
      input.comInput {color: #999; width: 144px; margin: 0 5px; font-size: 0.9em;	padding: 5px 2px; border: 1px solid #333; background: #121212; }
      input.blur { color: #333; }
      input.focus { color: #fff; }

      input.comButton { border: none; background: #d3c9bd; color: #324a40; padding: 3px 5px; cursor: pointer; margin: 5px 0 0 6px; }
      input:hover.comButton { color: #fff; }

      #optionsContainer .selected { color: #fff; }
      #options { padding: 5px 0 0; }




  #contentContainer { top: 0; left: 220px; width: 570px; }
    #content h3 { font-size: 1.6em;  }

    .contentTitle h3, .contentSection h2, .contentSection p { text-shadow: #000 0 -1px 1px; -webkit-text-stroke:1px transparent; }

  #purchaseInfo { padding: 25px 0 0; color: #828282; }
    #purchaseInfo h3 { color: #fff; text-decoration: underline; margin: 0 0 20px;  }

    #purchaseInfo p { font-style: normal; line-height: 1.12em; margin: 0 0 12px; }

    .itemContainer { width: 160px; height: 320px; margin: 0 20px 20px 0; background: #292929; float: left; }
      .itemThumbnail { width: 160px; height: 160px; background: #191919; }
      .itemInformation { padding: 5px; }
        .itemTitle { font-size: 1.6em; color: #d3c9bd; /* font-style: italic; */ line-height: 1.3em; margin: 0 0 5px; }
        .itemDetails { color: #616161; line-height: 1.2em; height: 50px; }
        .itemOptions {  padding: 10px 0 0; border-top: #616161 1px solid; color: #fff; font-size: 1.1em;  }
        .itemOptions a { color: #fff; border-bottom: #d3c9bd 1px solid; }
        .itemCreator { color: #fff; font-size: 1.1em; }
        .itemDetail { height: 120px; }
        .itemAvailability { float: right; }
        .sold { text-transform: uppercase; color: red; }
        .price { font-size: 1.5em; color: #d3c9bd; line-height: 0.6em; }
    .shipping, .payment { float: left; }
    .shipping a, .payment a {  border-bottom: #fff 1px solid; color: #fff;  }
    .shipping { width: 340px; padding: 0 20px 50px 0;  }
    .payment { width: 160px;}

  #preview{
    position:absolute;
  /*	border:1px solid #ccc; */
    background:#fff url(../img/caching.gif) no-repeat;
    display:none;
    color:#fff;
    width: 400px;
    height: 475px;
  }

  .projectContainer { width: 640px; background: #fff; padding: 0 0 10px; margin: 0 0 30px;  }
    .projectGallery { background: #fff; width: 640px; overflow: hidden;  }
    .projectNumber { width: 144px; padding: 8px; background: #d3c9bd; color: #3a3e6b; position: absolute; z-index: 10; }

    .projectNo { color: #000; height: 114px; }
    .projectNo strong { font-weight: normal; color: #3a3e6b; font-size: 1.6em; text-decoration: underline; display: block; margin: 0 0 20px; line-height: 1.2em; }
    .projectNo span { display: block; font-style: normal; font-family: 'Variable Black', Arial, sans-serif; color: #3a3e6b; position: relative;}
    .projectNo i { font-size: 5em; font-style: normal; }
    .projectNo sup { font-size: 1.6em; position: absolute; top: 0; }
    .projectFlickr { border-top: #3a3e6b 1px solid; padding: 15px 0 5px; }
    .projectFlickr a { color: #68635d; }
    .projectSlideshow { padding: 10px; height: 420px; }
    .projectSlideshowContainer {  height: 400px; display: block; }
    .projectDetail { display: none; }
    .projectContent { color: #000; padding: 20px 0; background: url(../img/divider.jpg) top left no-repeat; }
    .projectFloat { float: left; padding: 0 10px; width: 235px; }
      .projectFloat h1 { font-size: 2.4em; margin: 0 0 5px; text-decoration: underline; line-height: 1.1em; }
      .projectFloat h2 { font-size: 1.6em; color: #666; line-height: 1.2em; margin: 0 0 30px; }
      .projectFloat p { font-style: normal; margin: 0 0 15px; line-height: 1.2em; }
      .projectFloat h4 { color: #666; }
      .projectFloat li { font-style: italic; margin: 0 0 2px;}
      .projectFloat a { color: #3a3e6b; }
      .proLinks { font-size: 1.1em; color: #666; }
      .proLinks a { border-bottom: 1px solid #d3c9bd; }
  #shopContainer { background: url(../img/shop-cont.gif); }
    .extra { font-size: 0.65em; position: relative; top: -2px; color: #616161; }


  #miscContainer, #helpContainer { top: 0; left: 220px; width: 550px; height: 1800px; background: #d3c9bd; display: none; }
  #miscContainer {  z-index: 100; }
  #helpContainer { z-index: 99; }
    #content { padding: 160px 0 0 30px; }

    .contentSection { height: 80px; }
    .contentSection p span { color: #d3c9bd; }
    .contentTitle { height: 80px; color: #fff; font-size: 1.6em; }
      .contentTitle span { color: #d3c9bd; }
      span.itemCategory, span.itemCount { color: #fff; }

    #misc, #help { padding: 160px 30px 0; }
    #misc h2, #help h2, .contentSection h2 { font-size: 1.8em; text-decoration: underline; margin: 0 0 4px;   }
    #misc h2, #help h2 { color: #3a3e6b; }
    .contentSection h2 { color: #fff; }
    #misc h2, #help h2, #tabs li, #misc h3 { text-shadow: #d3c9bd 0 -1px 1px; -webkit-text-stroke:1px transparent; }


    .fragment { clear: both; }
    .fragment h3 { font-size: 2.6em; position: absolute; top: 240px; color: #3a3e6b; } .fragment h3 span { border-bottom: 2px solid #fff;  }
    .fragment a { color: #68635d; }

    .qna { position: absolute; top: 320px; width: 490px; color: #000; padding: 8px 0 0; }
      .qna dt { font-size: 1.6em; line-height: 1.2em; margin: 0 0 15px; color: #3a3e6b; text-decoration: underline; }
      .qna dd { font-style: normal; margin: 0 0 15px; line-height: 1.2em; color: #3a3e6b; }

    .abstract { position: absolute; top: 320px; width: 235px; padding: 8px 255px 0 0; height: 228px; background: url(../img/abstract.jpg) top right no-repeat; color: #000; }


    .abstract h4  { font-size: 1.6em; line-height: 1.2em; margin: 0 0 15px; color: #3a3e6b; }

    .abstract h4 sup { font-size: 0.6em; position: relative; top: -5px; }

    .close  { float: right; background: url(../img/tabs.jpg) center left no-repeat; padding: 0 0 0 15px; font-size: 1.8em; color: #68635d; cursor: pointer; }

    .a1 { border-bottom: #3a3e6b 1px solid; height: 115px; color: #3a3e6b; margin: 0 0 20px;  }
    .a1 p { line-height: 1.12em  }
    .a2 { font-style: normal; line-height: 1.2em; color: #3a3e6b; }

    .aa1, .aa2 { height: 55px; width: 75px; text-indent: -999em; background-repeat: no-repeat; }
    .aa1 { background-image: url(../img/1of2.png); }
    .aa2 { background-image: url(../img/2of2.png); }

    .aaa2 { height: 68px; display: block; font-style: italic; color: #3a3e6b; }
    .aaa2 h5 { font-size: 1.6em; margin: 0 0 12px;  }

    .quote { font-style: italic; color: #3a3e6b; font-size: 1.4em; line-height: 1.2em; margin: 0 0 20px; }

    .sort { color: #3a3e6b; }
    #tabs li, .contentSection p { font-size: 1.8em;  }
    .contentSection p { color: #68635d; }
    #tabs li a, .contentSection a { padding: 0 10px 0 15px;  }
    #tabs li a { background: url(../img/tabs.jpg) center left no-repeat; }
    .contentSection a { background: url(../img/tabsFilter.jpg) center left no-repeat;  }
    .filter { color: #434242; text-shadow: none; -webkit-text-stroke: none; }
    .contentSection strong { display: none; }
    .contentSection .current { color: #d3c9bd; }

    #background .abstract { background-position-y: 0; }
    #press .abstract { background-position-y: -240px; }
    #credits .abstract {  background-position-y: -480px; }


    .column { line-height: 1.2em; color: #3a3e6b;  font-style: normal;  }
    .column h4 { font-style: italic; color: #3a3e6b; }
      .column p { margin: 0 0 12px;  }


    .c1, .c2 { position: absolute; top: 580px; width: 235px;  border-top: #3a3e6b 1px solid; border-bottom: #3a3e6b 1px solid; padding: 20px 0 10px;  }
    .c2 { left: 285px; }

      .white { color: #fff;}

      .fragment hr { margin: 20px 0; height: 0; clear: both; border-width: 0; border-top: none; border-bottom: #3a3e6b 1px solid; }


   #teaser { position: absolute; left: 30px; z-index: 1; top: 160px; }

/*///////////////          Footer Container        ///////////////*/

  #footerContainer { width: 160px; top: 320px; left: 30px; }


 /* #information { width: 144px; height: 144px; padding: 8px 8px; background: #d3c9bd; color: #324a40; position: relative; margin: 0 0 20px; }
      #information h3 { text-decoration: underline;  font-size: 1.6em;  }
      #information dl { position: absolute; bottom: 13px; width: 144px;  }
      #information dt { border-bottom: #456557 1px solid; padding: 0 0 15px; margin: 0 0 12px; line-height: 1.12em }
      #information dd { color: #000; text-decoration: underline; font-size: 1.1em; } */

 /* #bulletin { background: #151515; width: 144px; height: 144px; padding: 8px; color: #81b89c; } */
    #bulletin { background: #d3c9bd; color: #3a3e6b; padding: 8px; width: 144px; height: 144px; text-align: center; }
      #bulletin h3 { text-decoration: underline; font-size: 1.6em; color: #3a3e6b; margin: 0 0 3px; }
      .bulletinWrapper { width: 144px; height: 96px; position: relative; top: 0; left: 0; overflow: hidden; border-bottom: 1px solid #3a3e6b; }
      #bulletin ul { font-size: 1.1em; height: 100px; width: 9999px;  position: absolute; top: 0; left: 0;  }
      #bulletin li { height: 100px; display: block; width: 144px;  float: left;  }
      #bulletin em { float: right; text-align: right; }
      span.bulletinTitle, span.bulletinNews { display: block; }
      span.bulletinTitle { padding: 2px 0 18px; font-size: 1.4em; }
      span.bulletinNews { color: #3a3e6b; font-size: 0.9em;  }
      span.bulletinNews a { color: #3a3e6b; text-decoration: underline; }
      span.bulletinNews a:hover { color: #fff; text-decoration: none; }



  #footer { margin: 150px 0 25px; color:#47423E; line-height:1.12em; display: none; }
    #footer a { border-bottom: #d3c9bd 1px solid;  color: #fff; }