/* =========================== */
/* CSS for control sap.m/Tile  */
/* Base theme                  */
/* =========================== */

.sapMTile {
	display: inline-block;
	-webkit-transition-property: transform3d;
	-webkit-transition-duration: 0.2s;
	transition-property: transform3d;
	transition-duration: 0.2s;
	width: 12rem;
	height: 14rem;
	margin: 0.5rem;
	-webkit-touch-callout: none;
	background-color: @sapUiTileBackground;
	border: 1px solid @sapUiTileBorderColor;
	border-radius: 0.125rem;
	box-shadow: @sapUiShadowLevel0;
	/*margin:0.6em;*/ /* in case of some behavior problems uncomment this line, it was comment because the margin causes the blurring of the focus rectangle in IE9*/
}

.sapMTile * {   /* FIXME!!! (star rule with any-parent selector...) */
	-webkit-user-select: none;
	-webkit-user-drag: none;
	-moz-user-select:  -moz-none;
}

.sapMTCEditable .sapMTile {
	background-color: fade(@sapUiTileBackground, 50);
}

.sapMTile.sapMTileActive{
	background: @sapUiHighlight;
}

html.sap-phone .sapMTile {
	width: 8.5rem;
	height: 10rem;
	margin: 0.5rem;
}

html.sap-phone .sapMTileContent {
	width: 8.5rem;
	height: 10rem;
}

.sapMTileContent {
	overflow: hidden;
	width: 12rem;
	height: 14rem;
}

.sapMTileDrag {
	opacity : 0.8;
	z-index : 10;
	-webkit-transition-property : none;
	transition-property: none;
}

.sapMNavItemFlipping .sapMTile {
	opacity: 0.01;
}

.sapMTile:focus {
	outline: 1px dotted @sapUiContentFocusColor;
	position: relative;
}

.sapMTile .sapMTileDrag {
	opacity : 0.6;
	box-shadow: 0px 1px 3px fade(@sapUiContentShadowColor,60);
}