/*
Theme Name:     Twenty Ten ToolGuyd Child Page Template
Theme URI:      http: //toolguyd.com/
Description:    A ToolGuyd Child theme for the Twenty Ten theme custom page template
Author:         Stuart Deutsch
Author URI:     http: //toolguyd.com/
Template:       twentyten
Version:        0.1.0
*/

/*Layout and Structure*/
.tool-guide #content {
	margin: 0 auto;
	width: 920px;
}
.tool-guide #content {
	width: 100%;
	}
#guide-container{
	width:940px;
}

.item {
  width: 280px;
  margin: 8px 4px;
  float: left;
  padding:5px 8px 0;
  border:1px solid #e5e5e5;
  background-color: #f6f6f6;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.itemlead {
  width: 586px;
  margin: 8px 4px;
  float: left;
  padding:5px 8px 0;
  border:1px solid #e5e5e5;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
div.itemlead p{
font-family:Georgia, Serif;
font-size:16px;
line-height:24px;
}

#collection .item h3{
	font-size:18px;
	color:#505050;
	font-weight:bold;
	margin:0;
	padding: 0 0 6px 0;
	line-height:18px;
}

#collection .item p.tool-summary{
	font-size:12px;
	margin:0;
	padding: 0;
}

#collection .item p.tool-details{
	margin:0;
	font-size:14px;
}

#tiledtoc .item h3{
	font-size:18px;
	color:#505050;
	font-weight:bold;
	margin:0;
	padding: 0 0 6px 0;
	line-height:18px;
}

#tiledtoc .item p.tool-summary{
	font-size:12px;
	margin:0;
	padding: 0;
}

#tiledtoc .item p.tool-details{
	margin:0;
	font-size:14px;
}

.item:hover{
	border:1px solid #cecece;
	background-color:#ebebeb;
}
.item img
{
	width:280px;
	border:1px solid #e5e5e5;
	margin-top:2px;
}
.item:hover img{
	border:1px solid #cecece;
}
/**** Transitions ****/

.masonry,
.masonry .item {
  -webkit-transition-duration: 0.7s;
     -moz-transition-duration: 0.7s;
      -ms-transition-duration: 0.7s;
       -o-transition-duration: 0.7s;
          transition-duration: 0.7s;
}

.masonry {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.masonry .item {
  -webkit-transition-property: left, right, top;
     -moz-transition-property: left, right, top;
      -ms-transition-property: left, right, top;
       -o-transition-property: left, right, top;
          transition-property: left, right, top;
}


/* Tool Caption Transition */
figure, figcaption{
	margin:0;
	}
figure { 
  display: block; 
  position: relative; 
  overflow: hidden; 
}

figcaption { 
  position: absolute; 
  background: rgba(0,0,0,0.75); 
  color: white; 
  padding: 5px 5px;
	font-size:14px;
	line-height:18px;
  opacity: 0;
  bottom: 0; 
  left: -30%;
  -webkit-transition: all 0.6s ease;
  -moz-transition:    all 0.6s ease;
  -o-transition:      all 0.6s ease;
}

figure:hover figcaption {
  opacity: 1;
  left: 0;
}
.cap-left figcaption { bottom: 0; left: -30%; }
.cap-left:hover figcaption { left: 0; }

.cap-right figcaption { bottom: 0; right: -30%; }
.cap-right:hover figcaption { right: 0; }

.cap-top figcaption { left: 0; top: -30%; }
.cap-top:hover figcaption { top: 0; }

.cap-bot figcaption { left: 0; bottom: -30%;}
.cap-bot:hover figcaption { bottom: 0; }
#guide-container #content p{line-height:18px;margin-bottom:4px;}

#content .guide-title{
	color:#630;
	font-size:22px;
	font-weight:bold;
	line-height: 1.3em;
	margin-bottom:0;
	padding-left: 16px;
}