﻿/* Thumbnail Effects Style */
.tj_container{
	width:980px;
	height:420px;
	position:relative;
	margin:30px auto;
}
.tj_nav{
	position:absolute;
	right:29px;
	top:-66px;
	height:70px;
	width:39px;
}
.tj_nav span{
	width:27px;
	height:27px;
	background:transparent url(../images/small-arrows.png) no-repeat top left;
	background-position: 0 0;
	position:absolute;
	top:0px;
	left:0px;
	text-indent:-9000px;
	cursor:pointer;
}
.tj_nav span.tj_prev {
	top:0;
	bottom:0;
	left:-37px;
}
.tj_nav span.tj_next{
	background-image:url(../images/small-arrows.png);
	background-position: -27px 0;
	top:0;
	bottom:0;
	left:0;
}
.tj_nav span.tj_prev:hover { 
	background-position: 0 -27px;
}
.tj_nav span.tj_next:hover {
	background-position: -27px -27px;
}
.tj_wrapper{
	width:105%;
	height:100%;
	position:relative;
	margin:0px auto;
}
.tj_wrapper ul li{
	float:left;
}
.tj_wrapper ul li img{
	display:block;
	border:none;
	margin-right: 20px;
	margin-bottom: 20px;
	cursor: pointer
}
.tj_wrapper ul li a img:hover{
	opacity:1.0;
	
}

.tj_gallery {
	position: relative
}

ul.tj_gallery {
	list-style-type: none;
}

.tj_gallery li .mask a.facebook-icon {
	background: url(../images/social-icons.png) left top no-repeat;
	background-position: 0 0;
	display: block;
	height: 23px;
	width: 23px;
	position: absolute;
	bottom: 50px;
	left: 108px;
	opacity: 0.0; 
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
}
.tj_gallery li .mask a.facebook-icon:hover {
	background-position: -23px 0;
	cursor: pointer;	
} 


.tj_gallery li .mask a.twitter-icon {
	background: url(../images/social-icons.png) left top no-repeat;
	background-position: 0px -23px;
	display: block;
	height: 23px;
	width: 23px;
	position: absolute;
	bottom: 50px;
	left: 138px;
		opacity: 0.0; 
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
}

.tj_gallery li .mask a.twitter-icon:hover {
	background-position: -23px -23px;
	cursor: pointer;	
}

.tj_gallery li .mask a.zoom-icon {
	background: url(../images/social-icons.png) left top no-repeat;
	background-position: 0px -46px;
	display: block;
	height: 23px;
	width: 23px;
	position: absolute;
	bottom: 50px;
	left: 168px;
	opacity: 0.0; 
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
}
.tj_gallery li .mask a.zoom-icon:hover {
	background-position: -23px -46px;
	cursor: pointer;	
}
.tj_gallery li .mask:hover a.facebook-icon,.tj_gallery li .mask:hover a.twitter-icon,.tj_gallery li .mask:hover a.zoom-icon   {
	opacity: 1.0; 
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
} 
.tj_gallery .bottom-header { 
	position: absolute;
	background-color: #111;
	bottom: 20px;
	width: 300px;
	height: 30px;
	text-align: center;
}	
.tj_gallery  h5 { color: #ffe55a; text-align: center; margin-top: 10px; font-size: 12px; }
.tj_gallery .bottom-header h4 {
	color: #FFF;
	line-height: 30px;
}	

.tj_gallery .bottom-header .yellow-line {
	width: 15px;
	height: 1px;
	float: right;
	line-height: 30px;
	border-top: 1px solid #ffe55a;
}	


.tj_gallery .bottom-header .yellow-line.right { float: right }
.tj_gallery .bottom-header .yellow-line.left {
	position: absolute;
	left:0;
		-webkit-transition: all 0.3s linear;
	-moz-transition:all 0.3s linear;
	-o-transition: all 0.3s linear;
	-transition: all 0.3s linear;	
  }
  .tj_gallery .bottom-header .yellow-line.right {
	position: absolute;
	right:0;
		-webkit-transition: all 0.3s linear;
	-moz-transition:all 0.3s linear;
	-o-transition: all 0.3s linear;
	-transition: all 0.3s linear;	
  }
 .tj_gallery li:hover .bottom-header .yellow-line.left {
 	left: 135px;
 }   
 .tj_gallery li:hover .bottom-header .yellow-line.right {
 	right: 135px;
 } 
  
.tj_gallery .bottom-header a { text-decoration: none !important;  }
.tj_gallery .bottom-header a:hover h4 { color: #ffe55a }

.tj_gallery li .mask { 
	width: 300px; 
	height: 200px; 
	background-color: #000;
	position: absolute;
	text-align: center;
	left: 0;
	top: 0;
	opacity: 0.0; 
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   	
		-webkit-transition: all 0.3s linear;
	-moz-transition:all 0.3s linear;
	-o-transition: all 0.3s linear;
	-transition: all 0.3s linear;
}
.tj_gallery .mask p { display: block; width: 280px; padding: 0 10px; color: #FFF }
.tj_gallery li:hover .mask { 
	opacity: 0.8;
	   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=80)";
   filter: alpha(opacity=80);
	cursor: pointer
}