#wrapper{
	max-width: 1260px;
		position: relative;
margin: 0 auto;
}
#container{
	position: relative;
margin: 0 auto;

}

.item {
  width: 300px;
  float: left;
  margin: 10px 0px 10px 0px;
  /*background-color: #000000;*/
  -webkit-user-select: none;
-webkit-touch-callout: none;   
}


.item h2{
display: block;
margin: 0;
top: 10px;
left: 10px;

color: #FFFFFF;
font-family: 'Open Sans Condensed', Helvetica, sans-serif;
font-weight: 700;
font-size: 2em;

position:absolute;
}

.item a{
text-decoration: none;
}

.item p a:link{
color: #FFFFFF;
}

.item p a:visited{
color: #FFFFFF;
}

.item p{
display: block;
margin: 0;
top: 45px;
padding: 10px 30px 10px 10px;

color: #FFFFFF;
font-family: 'Open Sans Condensed', Helvetica, sans-serif;
font-weight: 400;
font-size: 1em;

position:absolute;

}

.sublink{
display: block;
margin: 0;
top: 331px;
left:128px;
padding: 10px 30px 10px 10px;

color: #FFFFFF;
font-family: 'Open Sans Condensed', Helvetica, sans-serif;
font-weight: 400;
font-size: 1em;

position:absolute;
}

a.sublink:link{
text-decoration: underline;
color: #999999;

}

a.sublink:visited{
color: #999999;

}

/*
@media only screen and (min-device-width : 1281px){
.item:hover h2, item.hover_effect h2, .item:hover p, item.hover_effect p, .item:hover a, item.hover_effect a{
   visibility: visible;
   opacity: 1;
   transition: opacity .25s linear;
   -moz-transition: opacity .25s linear;
   -webkit-transition: opacity .25s linear;
}
.item:hover img, item.hover_effect img{
   filter:alpha(opacity=30);
   opacity:0.2;
   transition: opacity .25s linear;
   -moz-transition: opacity .25s linear;
   -webkit-transition: opacity .25s linear;
}
}
*/


.item img{
display: block;
   transition: opacity .25s linear;
   -moz-transition: opacity .25s linear;
   -webkit-transition: opacity .25s linear;
}



.test{
  height: 300px;
  background-color: #999999;
}

.masonry, .masonry .masonry-brick {
  transition-timing-function: ease-in-out;
  -webkit-transition-duration: .7s;
     -moz-transition-duration: .7s;
      -ms-transition-duration: .7s;
       -o-transition-duration: .7s;
          transition-duration: .7s;
}

.masonry {

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

.masonry .masonry-brick {

  -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;
}

/* hoverbox */

/* 
 * 	Author: Piotr Elmanowski
 *  Company: Frontoes.com
 *  Distributed and described: css-workshop.com
 *	v1.0
 */

.hvrbox,
.hvrbox * {
	box-sizing: border-box;
}
.hvrbox {
	position: relative;
	display: inline-block;
	overflow: hidden;
	max-width: 100%;
	height: auto;
}
.hvrbox img {
	max-width: 100%;
}
.hvrbox_background {
	width: 400px;
	height: 250px;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
.hvrbox .hvrbox-layer_bottom {
	display: block;
}
.hvrbox .hvrbox-layer_top {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.75);
	color: #fff;
	-moz-transition: all 0.4s ease-in-out 0s;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-ms-transition: all 0.4s ease-in-out 0s;
	transition: all 0.4s ease-in-out 0s;
}
.hvrbox:hover .hvrbox-layer_top,
.hvrbox.active .hvrbox-layer_top {
	opacity: 1;
}
.hvrbox .hvrbox-text {
	/*text-align: center;
	font-size: 18px;
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	-moz-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);*/
}
.hvrbox .hvrbox-text_mobile {
	/*font-size: 15px;*/
	border-top: 1px solid rgb(179, 179, 179); /* for old browsers */
	border-top: 1px solid rgba(179, 179, 179, 0.7);
	width: 100%;
	padding: 5px 30px 0px 30px;
	color: #FFFFFF;
	font-family: 'Open Sans Condensed', Helvetica, sans-serif;
	font-weight: 400;
	font-size: 1em;
	text-align: center;
	position:absolute;
	bottom: 5px;
	display: none;
}
.hvrbox.active .hvrbox-text_mobile {
	display: block;
}
.hvrbox .hvrbox-layer_image {
	padding: 0;
	background: none;
}
.hvrbox .hvrbox-layer_slideup {
	-moz-transform: translateY(100%);
	-webkit-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
}
.hvrbox:hover .hvrbox-layer_slideup,
.hvrbox.active .hvrbox-layer_slideup {
	-moz-transform: translateY(0);
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
}
.hvrbox .hvrbox-layer_slidedown {
	-moz-transform: translateY(-100%);
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
}
.hvrbox:hover .hvrbox-layer_slidedown,
.hvrbox.active .hvrbox-layer_slidedown {
	-moz-transform: translateY(0);
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
}
.hvrbox .hvrbox-layer_slideleft {
	-moz-transform: translateX(100%);
	-webkit-transform: translateX(100%);
	-ms-transform: translateX(100%);
	transform: translateX(100%);
}
.hvrbox:hover .hvrbox-layer_slideleft,
.hvrbox.active .hvrbox-layer_slideleft {
	-moz-transform: translateX(0);
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
}
.hvrbox .hvrbox-layer_slideright {
	-moz-transform: translateX(-100%);
	-webkit-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	transform: translateX(-100%);
}
.hvrbox:hover .hvrbox-layer_slideright,
.hvrbox.active .hvrbox-layer_slideright {
	-moz-transform: translateX(0);
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
}
.hvrbox .hvrbox-layer_scale {
	border-radius: 50%;
	-moz-transform: scale(0);
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
}
.hvrbox:hover .hvrbox-layer_scale,
.hvrbox.active .hvrbox-layer_scale {
	border-radius: 0%;
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
}
.hvrbox .hvrbox-layer_rotate {
	border-radius: 50%;
	-moz-transform: rotateZ(0);
	-webkit-transform: rotateZ(0);
	-ms-transform: rotateZ(0);
	transform: rotateZ(0);
}
.hvrbox:hover .hvrbox-layer_rotate,
.hvrbox.active .hvrbox-layer_rotate {
	border-radius: 0%;
	-moz-transform: rotateZ(360deg);
	-webkit-transform: rotateZ(360deg);
	-ms-transform: rotateZ(360deg);
	transform: rotateZ(360deg);
}
.hvrbox .hvrbox-layer_scale-rotate {
	border-radius: 50%;
	-moz-transform: scale(0) rotateZ(0);
	-webkit-transform: scale(0) rotateZ(0);
	-ms-transform: scale(0) rotateZ(0);
	transform: scale(0) rotateZ(0);
}
.hvrbox:hover .hvrbox-layer_scale-rotate,
.hvrbox.active .hvrbox-layer_scale-rotate {
	border-radius: 0%;
	-moz-transform: scale(1) rotateZ(360deg);
	-webkit-transform: scale(1) rotateZ(360deg);
	-ms-transform: scale(1) rotateZ(360deg);
	transform: scale(1) rotateZ(360deg);
}