<!--------------------------------------------
Coded & Designed by Alexandrine Team 
ZAKAZ KOPIOWANIA I ROZPOWSZECHNIANIA!
--------------------------------------------->.

@font-face {
    font-family: Comic Sans MS, Arial, sans-serif;
    src: url(KomikaText.ttf);
}

html,body {
	width: 100%; 
	height: 100%; 
	margin: 0; 
	padding: 0;
	font-family: 'Komika';
}

body{
font-family: 'Komika';
}

a {
	text-decoration: none;
}

h2{
	text-align: center;
}

img{
	vertical-align: bottom;
}

#show { 
	display: none; 
} 

#black-screen
{
	height: 100%; 
	width: 100%; 
	position: fixed; 
	top: 0px; 
	left: 0px; 
	background: rgba(0, 0, 0, 0.8); 
	z-index: 99;
}

#box {
	z-index: 100; 
	position: fixed; 
	width: 600px; 
	height: 333px; 
	background: url("../images/pages/box_game.png");
	left: 50%; 
	top: 50%; 
	margin-left: -300px; 
	margin-top: -175px; 
	padding: 25px;
	box-sizing: border-box;
	font-family: 'Gorilla', sans-serif; 
	border-radius: 3px;
	box-shadow: 0px 0px 30px #000;
	font-size: 18px;
}

#logo {
	display: block;
	width: 500px; 
	height: 69px; 
	margin: 0 auto; 
	margin-bottom: 50px;
 }

#left {
	width: 265px; 
	float: left;
}

#right {
	width: 265px; 
	float: right;
}

#left > .link {
	display: block;
	background-image: url("../images/pages/button_box.png"); 
	padding: 15px 10px; 
	margin-top: 5px;
	font-weight: bold;
	color: #fff;
	padding-bottom: 10px;
	width: 180px;
	height: 28px;
	text-decoration: none;
	overflow: hidden;
	text-align: center;
	margin-right: auto;
	border-style: none;
}

#left > .link:first-child {
	margin-top: 0;
}

#left > .link:hover {
	background-image: url("../images/pages/button_box_active.png");
	cursor: pointer;
}

#left > .facebook {
	float: left;
	display: block; 
	background-image: url("../images/pages/facebook.png");
	padding: 15px 10px; 
	margin-top: 5px;
	margin-left: 65px;
	padding-bottom: 10px;
	width: 20px;
	height: 15px;
	text-decoration: none;
	overflow: hidden;
	text-align: center;
	margin-right: auto;
	border-style: none;
}

#left > .facebook:hover {
	background-image: url("../images/pages/facebook_active.png");
	cursor: pointer;
}

#left > .youtube {
	display: block; 
	background-image: url("../images/pages/youtube.png");
	padding: 15px 10px; 
	margin-top: 5px;
	margin-left: 80px;
	padding-bottom: 10px;
	width: 20px;
	height: 15px;
	text-decoration: none;
	overflow: hidden;
	text-align: center;
	margin-right: auto;
	border-style: none;
}

#left > .youtube:hover {
	background-image: url("../images/pages/youtube_active.png");
	cursor: pointer;
}

#right > .panel {
	margin-top: 20px;
}

#right > .panel:first-child {
	margin-top: 0;
}

#right > .panel > h2 {
	margin: 0; 
	padding: 0; 
	color: #F0BB0E; 
	font-weight: 900;
}

#right > .panel > span {
	color: #FFFFFF;
	text-align: center;
	font-size: 18px;
}

#footer {
	text-align: center;
}

#close {
	position: absolute; 
	bottom: 310px;
	margin-left: 270px;
	width: 30px;
	height: 34px;
	padding: 5px 10px; 
	font-weight: bold; 
	z-index: 99;
	cursor: pointer;
	background-image: url("../images/pages/close.png");
}

#close:hover {
	background-image: url("../images/pages/close_active.png");
}

#facebook {
	position: absolute; 
	width: 40px;
	height: 40px; 
	right: 25px;
	z-index: 99;
	background-image: url("../images/pages/facebook.png");
}

#facebook:hover {
	background-image: url("../images/pages/facebook_active.png");
}

#youtube {
	position: absolute; 
	width: 40px;
	height: 40px; 
	top: 50px;
	right: 80px;
	z-index: 99;
	background-image: url("../images/pages/youtube.png");
}

#youtube:hover {
	background-image: url("../images/pages/youtube_active.png");
}

#contact {
	position: absolute; 
	width: 40px;
	height: 40px; 
	top: 100px;
	z-index: 99;
	background-image: url("../images/pages/contact.png");
}

#contact:hover {
	background-image: url("../images/pages/contact_active.png");
}

#camp {
	position: absolute; 
	width: 40px;
	height: 40px; 
	top: 100px;
	right: 25px;
	z-index: 99;
	background-image: url("../images/pages/camp.png");
}

#camp:hover {
	background-image: url("../images/pages/camp_active.png");
}

#shop {
	position: absolute; 
	width: 40px;
	height: 40px; 
	top: 100px;
	right: 80px;
	z-index: 99;
	background-image: url("../images/pages/shop.png");
}

#shop:hover {
	background-image: url("../images/pages/shop_active.png");
}

#item_50 {
	background-image: url("../images/pages/gift.png");
	width: 90px;
	height: 90px; 
	top: 10px;
	right: 630px;
    position: absolute;
}

#item_50:hover {
	background-image: url("../images/pages/gift_active.png");
}

#stats_1 {
	background-image: url("../images/pages/stats_box.png");
	font-size: 12px;
	color: #FFFFFF;
	font-family: Comic Sans MS, Arial, sans-serif;
    position: absolute;
    left: 1px;
	width: 145px;
	height: 198px;
	top: 1%; 
	right: 94%;
	z-index: 1002;
	overflow: auto;
	margin: auto;
}

#stats_2 {
	background-image: url("../images/pages/stats_box.png");
	font-size: 12px;
	color: #FFFFFF;
	font-family: Comic Sans MS, Arial, sans-serif;
    position: absolute;
    left: 1px;
	width: 145px;
	height: 198px;
	top: 32%; 
	right: 94%;
	z-index: 1002;
	overflow: auto;
	margin: auto;
}

#stats_3 {
	background-image: url("../images/pages/stats_box.png");
	font-size: 12px;
	color: #FFFFFF;
	font-family: Comic Sans MS, Arial, sans-serif;
    position: absolute;
    left: 1px;
	width: 145px;
	height: 198px;
	top: 63%; 
	right: 94%;
	z-index: 1002;
	overflow: auto;
	margin: auto;
}

#stats_4 {
	background-image: url("../images/pages/stats_box.png");
	font-size: 12px;
	color: #FFFFFF;
	font-family: Comic Sans MS, Arial, sans-serif;
    position: absolute;
    right: 1px;
	width: 145px;
	height: 198px;
	top: 1%; 
	z-index: 1002;
	overflow: auto;
	margin: auto;
}

#stats_5 {
	background-image: url("../images/pages/stats_box.png");
	font-size: 12px;
	color: #FFFFFF;
	font-family: Comic Sans MS, Arial, sans-serif;
    position: absolute;
    right: 1px;
	width: 145px;
	height: 198px;
	top: 32%; 
	z-index: 1002;
	overflow: auto;
	margin: auto;
}

#stats_6 {
	background-image: url("../images/pages/stats_box.png");
	font-size: 12px;
	color: #FFFFFF;
	font-family: Comic Sans MS, Arial, sans-serif;
    position: absolute;
    right: 1px;
	width: 145px;
	height: 198px;
	top: 63%; 
	z-index: 1002;
	overflow: auto;
	margin: auto;
}

.clear {
	clear: both;
}