.tile{
	color: #FFF;
	display:block;
	padding:0;
	margin: 0;
	position:absolute;
	overflow:hidden;	
	transition: box-shadow 0.25s ease-out;
	-moz-transition: box-shadow 0.25s ease-out;
	-webkit-transition:  box-shadow 0.25s ease-out;
	-o-transition:  box-shadow 0.25s ease-out;
	-ms-transition:  box-shadow 0.25s ease-out;
	font-weight:normal;
	text-decoration:none; /* They are links for google, so we'll decorate them like normal text :) */
}
.loading>.tile{
	transition: none;
	-moz-transition: none;
	-webkit-transition:  none;
	-o-transition:  none;
	-ms-transition:  none;
}
.tile:visited{
	color:#FFF;
}

.tile:hover{
	text-decoration: none;
	color:#FFF;
	cursor:pointer;
}
.tile img{
	border:none;
}
.tile.noClick:hover{
	cursor:default !important;
	box-shadow: none !important;
	-moz-box-shadow:none !important;
	-webkit-box-shadow:none !important;
	outline:none !important;
	
}
.tileTitle{
	margin:5px 3px 5px 15px;
	padding: 0px;
	font-size: 28px;
	font-weight:300;
}
.tileDesc{
	margin: 0 12px 0 12px;
	padding: 0;
	font-size: 13px;
	position:absolute;	
}

/*LABELS */
.tileLabelWrapper{
	position:absolute;
	right:0;
	padding:0;
	margin:0;
	height:auto;
	z-index:11;
}
.tileLabel{
	position:relative;
	display:inline-block;
	font-size:13px;	
	text-decoration: none;  
    color: #FFF; 
}
.tileLabelDesc{
	border-top:1px solid #999;
	background-color:rgb(140,140,140);
	background-color:rgba(55,55,55,0.6);
	filter:opacity(alpha=0.8);
	color:#CCC;
	padding:3px;
	font-size:12px;
}
.showOnHover{
	display:none;
}
/*BOTTOM LABEL */
.tileLabelWrapper.bottom{
	bottom:0;
	left:0;	
	
}
.tileLabel.bottom{	
	position:relative;
	padding: 2px 2px 0px 2px;
	margin-bottom:-4px;  
    border-right: 15px solid transparent;  
    border-bottom: 20px solid #777;    
    height: 0;  
    line-height: 17px;  
}
/* TOP LABEL */
.tileLabelWrapper.top{
	top:0;
	border-left: 15px solid transparent;  
    border-top: 20px solid #777;
	height: 0;
	z-index:15;
}
.tileLabel.top{
	padding: 0px 2px 2px 2px;  
	top:-19px;	 
}

/*Misc tiles */
.tileImg>img{
	position:absolute;
	height:auto;
	top:50%;
	left:50%;
	z-index:1;
}
.tileImg .imgDesc{
	position:relative;
	top:0;
	margin:0;
	bottom:0;
	z-index:2;
	background: rgb(100,100,100);
	background: rgba(70,70,70,0.8);
	border-top:  1px solid #AAA;
	padding:5px;
	font-size:12px;
}
.tileImg>.tileLabelWrapper.top>.imgDesc{
	margin-top:-20px;
}
.tileImg>.tileLabelWrapper>.tileLabel.bottom{
	bottom:-2px;
}/* Flip tile */
.tileFlip{
	z-index:0;	
	overflow:visible;
}
.tileFlip:hover{
	box-shadow:none;
	outline:none;
	padding:0;
}
.tileFlip>.flipContainer{
	height:100%;
	width:100%;
	z-index:0;	
	-webkit-transition:-webkit-transform 0.6s;
	-moz-transition:-moz-transform 0.6s;
	-o-transition:-o-transform 0.6s;
	-ms-transition:-ms-transform 0.6s;
	transition:transform 0.6s;
}
.tileFlipped{
	-webkit-perspective: 600px;
	-moz-perspective: 600px;
	-o-perspective: 600px;
	-ms-perspective: 600px;
	perspective: 600px;
}
.tileFlipped>.flipContainer{
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;		
}
.tileFlip:hover .flipContainer{
	outline: 1px solid #FFF;
	-moz-box-shadow: 0 0 10px #DDD;
	-webkit-box-shadow: 0 0 10px #DDD;
	box-shadow: 0 0 10px #DDD;
}
@-moz-document url-prefix() { /* Firefox renders outlines wrong, so fix it */
   .tileFlip:hover .flipContainer{
		outline: none;
		-moz-box-shadow: 0 0 10px #DDD, 0 0 1px 1px #FFF;
		box-shadow: 0 0 10px #DDD, 0 0 1px 1px #FFF;
	}	
}

.tileFlip:hover.noClick .flipContainer{
	outline: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.support3D:hover .flipContainer{
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-ms-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.tileFlipped .flipBack{
	-webkit-backface-visibility: hidden;	
	-moz-backface-visibility: hidden;	
	-ms-backface-visibility: hidden;	
	-o-backface-visibility: hidden;	
	backface-visibility: hidden;	
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-ms-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.tileFlipped .flipFront{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;	
	-ms-backface-visibility: hidden;	
	-o-backface-visibility: hidden;	
	backface-visibility: hidden;		
}
.flipImgCenterer{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	width: 100%;
	height: 100%;
}
.flipImgCenterer>img{
	display:inline;
	position:relative;
	z-index:5;
	width:auto;
	height:auto;
}
.flipImgWrapper{
	display:table;
	width: 100%;
	height: 100%;
}
.flipFront{
	position: absolute;
	display:block;
	padding:0;
	marign:0;
	width: 100%;
	height: 100%;
	overflow:hidden;
	z-index:2;
}
.flipBack{
	position: absolute;
	width: 100%;
	height: 100%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	display: block;
	padding: 10px;
	color: white;
	text-align: center;
	z-index:0;
	background:inherit;
}
.tileFlipped  .tileLabelWrapper{
	-webkit-backface-visibility: hidden;	
	-moz-backface-visibility: hidden;	
	-ms-backface-visibility: hidden;	
	-o-backface-visibility: hidden;	
	backface-visibility: hidden;
	z-index:30;
}
.tileFlip .tileLabelWrapper.top{
	right:-2px;
}
.tileFlip .tileLabelWrapper.bottom{
	bottom:-2px;
	right:0;
	left:0;
}
html.safari {-webkit-font-smoothing: antialiased}