
#portfolio { background: #d6d6d6; font-size: 62.5%; line-height: 1; padding-bottom: 65px; }

#portfolio ol, ul { list-style: none; }

#portfolio blockquote, q { quotes: none; }
#portfolio blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
#portfolio strong { font-weight: bold; }



#w { display: block; max-width: 750px; min-width: 420px; padding: 0px 15px; padding-top: 45px; margin: 0 auto; }

#container { width: 100%; background: #fff; padding-top: 20px; }

#thumbs { list-style: none; text-align: center; }
#thumbs li { position: relative; margin-right: 7px; margin-bottom: 14px; }

#thumbs li img {
  float: left;
  cursor: pointer;
  opacity: 0.6;

  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
#thumbs li:hover img {
  opacity: 1.0
}

#thumbs li > .meta {
  float: left;
  overflow: hidden;
  z-index: 9999;
  left: 125px;
  height: 85px;
  width: 0;

  font-family: Arial, Tahoma, sans-serif;
  font-size: 1.2em;
  background: #fff;

  -webkit-box-shadow: 1px 0px 4px #8f8e88;
  -moz-box-shadow: 1px 0px 4px #8f8e88;
  -o-box-shadow: 1px 0px 4px #8f8e88;
  box-shadow: 1px 0px 4px #8f8e88;


  -webkit-border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -moz-border-radius-topright: 4px;
  -moz-border-radius-bottomright: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;


  -webkit-transition: width 0.3s linear;
  -moz-transition: width 0.3s linear;
  -ms-transition: width 0.3s linear;
  -o-transition: width 0.3s linear;
  transition: width 0.3s linear;
}

#thumbs li:hover > .meta {
  width: 115px;
  padding: 3px 5px;
}


#thumbs li .meta h4 { font-weight: bold; margin-bottom: 11px; font-size: 1.25em; padding-top: 8px; color: #363636; }
#thumbs li .meta span { display: block; margin-bottom: 5px; }


/* clearfix */
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }

html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }
