/* wrapper */
#container { padding: 4px 0px 4px 4px; }

/* unit global */
.unit { 
  float: left; 
  width: 140px; 
  height: 140px; 
  padding: 10px; 
  margin: 0px 4px 4px 0px;
  position: relative;
  text-decoration: none;
  overflow: hidden;
}

/* typography */
body { font-family: "Helvetica Neue", arial, sans-serif; }
h1 { font-size: 18px; }
/*.unit p { font-family: Georgia, Times; font-size: 13px; }*/
.unit p { margin-top: 8px; font-size: 12px; line-height: 13px; }
.arrow { font-size: 24px; }
.small { font-size: 9px; }
.xsmall { font-size: 7px; }
.post h2 { font-size: 12px; }

/* general colors */
body { background-color: #efefef; }
.light { color: #ccc; }
.white { color: #fff; }

/* unit types */
.blank { background-color: #efefef; color: #000; }
.post { background-color: #fff; color: #000;}
.image { background: #000 url() no-repeat center center; }
.info { width: 138px; height: 138px; border: 1px solid #fff; background-color: #efefef; }
.stripe { background: #fff url(/img/diagonal_ccc.png) repeat; }
.copy { background-color: #000; color: #fff; }
.nav1 { background-color: #000; color: #fff; }
.nav2 { background-color: #333; color: #fff; }
.nav3 { background-color: #666; color: #fff; }

/* unit internals */
.topRight { position: absolute; top: 5px; right: 10px; }
.topLeft { position: absolute; top: 10px; left: 10px; }
.bottomRight { position: absolute; right: 10px; bottom: 10px; }
.bottomLeft { position: absolute; bottom: 10px; left: 10px; }
.post p { color: #ccc; }
.blank h1 { width: 110px; }
.post h1 { color: #ccc; }
.post h2 { color: #ccc; }
.info pre { line-height: 10px; }
.cclogos { position: absolute; left: 7px; top: 7px; }
.cclogos img { width: 22px; height: 22px; }

/* unit states */
.disabled { text-decoration: line-through; }
.selected { background-color: #c03; }
a:hover	 { background-color: #c03; color:#fff;}
a:hover.image { background-image: none !important; background-color: #c03;}
p a, p a:active, p a:link, p a:visited { color: #ccc; border-bottom: dotted 2px #efefef; text-decoration:none;}
p a:hover { color: #fff; background-color: #c03; }

/* behaviors */
.hide { display: none; }
.pop { cursor:hand; cursor: pointer; background-color: #c03; color: #fff; }

/* alt hover colors
CC5C52
800020
803933
*/
/* transparencies
a:hover.image { filter: alpha(opacity=40); -moz-opacity: 0.4; opacity: 0.4; background-color: transparent;}
*/