body
{
	background-color: #303030;
	color: #ffffff;
	font-family: 'Lato', sans-serif;
	font-size: 20px;
}
#container
{
		width: 1600px;
		margin-left: auto;
		margin-right: auto;
}
.rectangle
{
	width: 1400px;
	margin: 20px;
	text-align: center;
}
	
.square{
	width: 100%;
	float: left;
	text-align: center;
	padding-left:170px;
}
	
#logo
{
	float: left;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 63px;
	width: 1300px;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: center;
}
#servername
{
	float: left;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 50px;
	width: 1300px;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: center;
}
#zegar
{
	float: left;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 70px;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: right;
}
.tile0
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #87cefa;
	float: left;
	text-align: center;
}	
.tile0:hover
{
	background-color: #76bde9;
}
.tile1
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #ffa500;
	float: left;
	text-align: center;
}	
.tile1:hover
{
	background-color: #ee9400;
}

.tile2
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #ff0000;
	float: left;
	text-align: center;
}	
.tile2:hover
{
	background-color: #ee0000;
}

.tile3
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #93c748;
	float: left;
	text-align: center;
}
.tile3:hover
{
	background-color: #82b637;
}	
.tile4
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #4B0082;
	float: left;
	text-align: center;
}
.tile4:hover
{
	background-color: #3a0071;
}	
.tile5
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #DA70D6;
	float: left;
	text-align: center;
}
.tile5:hover
{
	background-color: #C960C5;
}	

.tile6
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #adff2f;
	float: left;
	text-align: center;
}
.tile6:hover
{
	background-color: #9cee1e;
}	

.tile7
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #b22222;
	float: left;
	text-align: center;
}
.tile7:hover
{
	background-color: #a11111;
}	

.tile8
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #ff7f50;
	float: left;
	text-align: center;
}
.tile8:hover
{
	background-color: #ee6e40;
}	

.tile9
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #f0e68c;
	float: left;
	text-align: center;
}
.tile9:hover
{
	background-color: #e0d57b;
}	

.tile10
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #6495ed;
	float: left;
	text-align: center;
}
.tile10:hover
{
	background-color: #5384dc;
}	

.tile11
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #b8860b;
	float: left;
	text-align: center;
}
.tile11:hover
{
	background-color: #a7750a;
}	

.tile12
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #9932cc;
	float: left;
	text-align: center;
}
.tile12:hover
{
	background-color: #8821bb;
}	

.tile13
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #ff1493;
	float: left;
	text-align: center;
}
.tile13:hover
{
	background-color: #ee0382;
}	

.tile14
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #228b22;
	float: left;
	text-align: center;
}
.tile14:hover
{
	background-color: #117a11;
}	

.tile15
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #ffd700;
	float: left;
	text-align: center;
}
.tile15:hover
{
	background-color: #eec600;
}	

.tile16
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #e6e6fa;
	float: left;
	text-align: center;
}
.tile16:hover
{
	background-color: #d5d5e9;
}	

.tile17
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #87cefa;
	float: left;
	text-align: center;
}
.tile17:hover
{
	background-color: #76bde9;
}	

.tile18
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #ff00ff;
	float: left;
	text-align: center;
}
.tile18:hover
{
	background-color: #ee00ee;
}	

.tile19
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #32cd32;
	float: left;
	text-align: center;
}
.tile19:hover
{
	background-color: #21bc21;
}	

.tile20
{
	margin: 10px;
	width: 670px;
	height: 82px;
	background-color: #ddb500;
	text-align: center;
	font-size: 26px;
	padding: 30px;
	line-height: 150%;
}

.tile21
{
	margin: 10px;
	width: 420px;
	height: 405px;
	background-color: #666666;
	text-align: justify;
	padding: 30px;
}	

.tile22
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #ff0000;
	float: left;
	text-align: center;
}
.tile22:hover
{
	background-color: #7EAB7E;
}	

.tile23
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #00BFFF;
	float: left;
	text-align: center;
}
.tile23:hover
{
	background-color: #00AEEE;
}	

.tile24
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #CD5C5C;
	float: left;
	text-align: center;
}
.tile24:hover
{
	background-color: #BC4B4B;
}	

.tile25
{
	margin: 10px;
	width: 230px;
	height: 142px;
	background-color: #FF4500;
	float: left;
	text-align: center;
}
.tile25:hover
{
	background-color: #EE3400;
}	
.tile26
{
	margin: 10px;
	width: 920px;
	height: 153px;
	background-color: #ddb500;
	text-align: center;
	font-size: 26px;
	padding: 30px;
	line-height: 150%;
}
.yt
{
	margin: 10px;
	width: 105px;
	height: 142px;
	background-color: #b94348;
	float: left;
}	
.yt:hover
{
	background-color: #a83237;
}	
.fb
{
	margin: 10px;
	width: 105px;
	height: 142px;
	background-color: #4668b3;
	float: left;
}	
.fb:hover
{
	background-color: #3557a2;
}	
.gplus
{
	margin: 10px;
	width: 105px;
	height: 142px;
	background-color: #d95333;
	float: left;
}	
.gplus:hover
{
	background-color: #c84222;
}	
.tw
{
	margin: 10px;
	width: 105px;
	height: 142px;
	background-color: #3095d3;
	float: left;
}	
.tw:hover
{
	background-color: #2084c2;
}	

a.tilelink
{
	color: #ffffff;
	text-decoration: none;
}

a.serverlink
{
	color: #4169E1;
	text-decoration: none;
}