



@media only screen and (max-width: 768px)
{
	/* Mobile */
	
/*
	#tile-container
	{
		position:relative;
		
		left:0%;
		width:100%;
		
		background-image:url('../img/wallpaper/tile-background.jpg');
		background-size:100% auto;
		background-repeat:no-repeat;
	}
*/
	 
	.application-tile-container
	{
		position:relative;
		
		margin-top:10px;
		left:0;
		width:100%;
		 
		color:black;
		text-align:center;
		background-color:black;
		z-index:100;
		
		box-shadow:0 0 5px black;
		
		background-image:url('../img/wallpaper/tile-background.jpg');
		background-size:auto 100%;
		background-repeat:no-repeat;

	}
	
	.tile-holder
	{
		position:relative;
		
		left:50%;
		top:0%;
		width:316px;
		margin-left: -158px;
		
		background-color:;
	}
	.tile-block
	{
		position:relative;
		display:inline-block;

		overflow:hidden;

		margin-left:5px;
		margin-top:5px;
		
		width:100px;
		height:100px;
		
		color:white;
		font-size:14px;
		
		padding-top:35px;

		letter-spacing: auto;
		opacity:0.8;
		background-color:#000000;

		-moz-transition:all 0.2s linear;
		-webkit-transition:all 0.2s linear;
		transition:all 0.2s linear;
	
	}
	
	#tile-logo
	{
		padding-top:40px;
		font-size:20px;
	}
	
	#motto
	{
		padding-left:5px;
		padding-right:5px;
		padding-top:30px;
		color:black;
		background-color:white;
	}
	
}

@media only screen and (min-width: 769px)
{
	/* Desktop */
	
	#tile-container
	{
		position:relative;

		left:0%;
		width:100%;
		height:400px;

		background-image:url('../img/wallpaper/tile-background.jpg');
		background-size:100% auto;
		background-position: 0 -350px;
		background-repeat:no-repeat;


		background-color:black;
	}

	.application-tile-container
	{

		position:relative;
		overflow:hidden;
		top:25px;
		height:calc(100% - 50px);
		width:740px;
		left:50%;
		margin-left:-370px;



		font-size:0px;
		word-spacing: 0;
		letter-spacing: 0;
	}

	.tile-block
	{
		position:relative;
		display:inline-block;

		overflow:hidden;

		width:calc( (100% - 30px) / 4 );
		height:calc( (100% - 10px) / 2 );



		color:white;
		font-size:18px;

		margin:0px;
		padding:0px;
		padding-top:65px;
		text-align:center;
		padding-left:10px;
		padding-right:10px;

		margin-left:5px;
		margin-top:5px;

		letter-spacing: auto;
		opacity:0.8;
		background-color:#000000;

		-moz-transition:all 0.2s linear;
		-webkit-transition:all 0.2s linear;
		transition:all 0.2s linear;
	
	}

	.tile-block:nth-child(1)
	{
		padding-top:70px;
		font-size:30px;
	}
	.tile-block:nth-child(2)
	{
	/*	margin-top:10px;*/
	}
	.tile-block:nth-child(3)
	{
	/*	margin-top:10px;*/
	}
	.tile-block:nth-child(4)
	{
	/*	margin-top:10px;*/
	}

	.tile-block:nth-child(8)
	{
		background-color:white;
		color:black;
	}

	/* General Tile Hover */
	.tile-block:hover
	{
		width:calc( (100% - 30px) / 4 ) + 40px);
		background-color:grey;
	}
	.tile-block:nth-child(8):hover
	{
		background-color:black;
		color:white;
	}
	
}