#tiles {
	list-style-type: none;
	position: relative; /** Needed to ensure items are laid out relative to this container **/
	margin: 0;
	padding: 0;
	
}
#tiles li:hover img{
	opacity:0.8;
}
/**
 * Grid items
 */
#tiles li {
	width: 290px;
	background-color: rgba(38, 28, 44, 0.2);
	cursor: pointer;
	border-radius: 0.2em;
	clear: none;
	float: left;
	border-right-width: 1px;
	border-right-style: dotted;
	border-right-color: #CCC;
}
#tiles li:hover{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a90329+0,8f0222+44,6d0019+100&0.73+0,0.86+100 */
background: -moz-linear-gradient(-45deg, rgba(169,3,41,0.73) 0%, rgba(143,2,34,0.79) 44%, rgba(109,0,25,0.86) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(169,3,41,0.73) 0%,rgba(143,2,34,0.79) 44%,rgba(109,0,25,0.86) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(169,3,41,0.73) 0%,rgba(143,2,34,0.79) 44%,rgba(109,0,25,0.86) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#baa90329', endColorstr='#db6d0019',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	z-index: 9999;
	margin-top: -1em;
	box-shadow: 2px 4px 5px #999;
}
#tiles li img{
	border-top-left-radius:0.2em;
	border-top-right-radius:0.2em;
}
#tiles li.inactive {
  visibility: hidden;
  opacity: 0;
}

#tiles li img {
 	display: block;
}
@media (min-width: 50px) and (max-width: 1199px) {


	}