body { padding: 0; margin: 0; overflow: hidden; } #canvas { position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; } .checkbox label { margin-right: 10px; } form { margin-bottom: 0px; } .btn-play, .btn-settings, .btn-spectate { display: block; height: 35px; } .btn-play { width: 85%; float: left; } .btn-settings { width: 13%; float: right; } .btn-spectate { display: block; float: right; } #adsBottom { position: absolute; left: 0; right: 0; bottom: 0; } #adsBottomInner { margin: 0px auto; width: 728px; height: 90px; border: 5px solid white; border-radius: 5px 5px 0px 0px; background-color: #FFFFFF; box-sizing: content-box; } .region-message { display: none; margin-bottom: 12px; margin-left: 6px; margin-right: 6px; text-align: center; } #nick, #locationKnown #region { width: 45%; float: left; margin-right: 10px; } #locationUnknown #region { margin-bottom: 15px; } #gamemode, #spectateBtn { width: 33%; float: right; } #helloDialog { width: 390px; background-color: #FFFFFF; margin: 10px auto; border-radius: 15px; border: 5px double #000000; padding: 5px 45px 5px 15px; position: absolute; top: 50%; left: 50%; margin-right: -50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #chat_textbox { -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; position: absolute; z-index: 1; bottom: 10px; background: rgba(0, 0, 0, .2); border: 0px; outline: none; color: #FFF; height: 30px; text-indent: 12px; left: 10px; width: 220px; } #chat_settings { position: absolute; z-index: 0; bottom: 3px; left: 230px; border: solid; outline: none; background: rgba(0, 0, 0, .2); z-index: 1; bottom: 10px; border: 0px; outline: none; color: #FFF; height: 30px; text-indent: px; text-align: center; left: px; width: 70px; } #chat_textbox:focus { background: rgba(0, 0, 0, .5); } #duyuru_info { position: absolute; z-index: 1; bottom: 10px; border: 1px; background: rgba(0, 0, 0, .2); color: #FFFF00; height: 30px; text-indent: 12px; left: 550px; width: 400px; font-size: 20px; } .progress1 { width: 100%; height: 10px; } .progress-wrap1 { background: #f80; margin: 20px 0; overflow: hidden; position: relative; } .progress-wrap1 .progress-bar1 { background: #ddd; left: 0; position: absolute; top: 0; } .progress2 { width: 100%; height: 10px; } .progress-wrap2 { background: #f80; margin: 20px 0; overflow: hidden; position: relative; } .progress-wrap2 .progress-bar2 { background: #ddd; left: 0; position: absolute; top: 0; } .magic{ background: url('../img/magic.png') no-repeat; width: 192px; height: 192px; display: none; position: absolute; left: calc(50% - 96px); top: calc(50% - 96px); z-index: 9999; } .controls{ position: fixed; left: 10px; top: 185px; width: 143px; } .gallery{ margin-top: 10px; margin-left: 0px; padding: 0px; } .gallery img{ width: 143px; border-radius:7px; float: left; margin-right: 10px; cursor: pointer; } .btn-social{ display: none; } #window{ width: 70%; height: auto; position: fixed; left: calc(50% - 35%); top: 30px; z-index: 9999; } #window img{ width: 100%; height: auto; } #window .btn{ position: absolute; z-index: 101; margin-left: 20px;}

#timerest{
	font-family: 'Oxygen',sans-serif;
    text-align: left;
    color: #C34343;
    font-size: 3rem;
    border: 0 solid #000;
    float: right;
    margin-left: 45%;
    margin-right: 45%;
    position: absolute;
    top: 10px;
}
#levelBar{background:#f0ad4e;transition:width .6s ease;line-height:20px;height:100%}#liquid{background:url(../images/liquid.gif) right center;opacity:.3;width:auto;height:20px;z-index:-1;display:block}#level{position:fixed;bottom:360px;left:10px;z-index:2;width:205px;color:#fff;display:block}#lvl{color:#fff;border-radius:50%;width:30px;display:block;text-align:center;line-height:30px;position:absolute;left:-10px;height:30px;border:solid 3px #41608f;background:#5877a5;margin-top:-5px;z-index:5}#level label{color:#41608f;padding-left:20px}.progress{box-shadow:none!important;border-radius:4px;border:solid 3px #41608f}

#level .twirl{
	width: 30px;
	height: 30px;
	z-index: 5;
}

.twirl{
	background: url('../images/twirl.jpg') no-repeat center center;
	background-size: 100% 100%;
	width: 110px;
	border-radius:50%;
	height: 110px;
	z-index: -1;
	position: absolute;
	animation:twirl 3s linear infinite;
}

@keyframes twirl{
	from {
		transform : rotate(0deg);
	}

	to {
		transform : rotate(360deg);
	}

	0% {
		opacity: 0.1;
	}

	70% {
		opacity: 0.2;
	}

	100% {
		opacity: 0.1;
	}
}

@keyframes blink{
	0% {
		box-shadow: 0px 0px 0px #fff;
	}

	50% {
		box-shadow: 0px 0px 10px #ccc;
	}

	100% {
		box-shadow: 0px 0px 0px #fff;
	}
}

@keyframes blink_text{
	0% {
		text-shadow: 0px 0px 0px #fff;
	}

	50% {
		text-shadow: 0px 0px 10px #ccc;
	}

	100% {
		text-shadow: 0px 0px 0px #fff;
	}
}
.ads-160x600
{
	font-family:Arial,Verdana,sans-serif;
	font-size:13px;
	font-weight:700;
	display:block;
	height:600px;
	line-height:600px;
	width:160px;
	border:1px solid #DDD;
	text-align:center;
	background:#e9e9e9
}

.ads-160x600:hover
{
	border:1px solid #ccc;
	color:#000;
	background:#E0E0E0
}










.controlsx {
    position: fixed;
    right: 240px;
    top: 12px;
    width: 160px;
	z-index:100;
}
.gallery {
    margin-left: 0;
    margin-top: 10px;
    padding: 0;
}
.gallery img {
    border-radius: 7px;
    cursor: pointer;
    float: left;
    margin-right: 10px;
    width: 160px;
}




	
ul.skortablosu {
    background: #fff none repeat scroll 0 0;
    border-radius: 3px;
    cursor: pointer;
    left: -275px;
    list-style: outside none none;
    margin-bottom: 0;
    margin-right: 0;
    margin-top: 0;
    padding: 5px;
    position: absolute;
    top: 200px;
	box-shadow:0 1px 8px #aaa;
    width: 275px;
    z-index: 220;
}
ul.skortablosu .skorlar_baslik {
    background: #ffa900 none repeat scroll 0 0 !important;
    color: #fff !important;
    font-family: arial;
    font-size: 110%;
    margin-bottom: 5px;
    padding: 10px 0;
}
ul.skortablosu .skorlar_baslik span {
    color: #fff !important;
}
ul.skortablosu .skorlar_baslik .skor_no {
    background: #ffa900 none repeat scroll 0 0 !important;
    color: #fff !important;
    text-align: center;
}
ul.skortablosu .skorlar_baslik .basliktext {
    display: inline-block;
    margin-left: 15px;
}
ul.skortablosu .bildirim {
    color: #666;
    font-family: arial;
    font-size: 75%;
    margin-top: 15px;
    text-align: center;
}
ul.skortablosu li {
    clear: both;
    margin-bottom: 0;
    padding: 4px 0;
}
ul.skortablosu li:nth-child(2n+1) {
    background: #e0e0e0 none repeat scroll 0 0;
}
ul.skortablosu li:nth-child(2n) {
    background: #eee none repeat scroll 0 0;
}
ul.skortablosu li a {
    color: #555;
    font-family: arial;
    font-size: 90%;
    font-weight: bold;
    line-height: 20px;
    margin-left: 15px;
    text-decoration: none;
}
ul.skortablosu li a:hover {
    color: #111;
}
ul.skortablosu li span {
    color: #666;
    float: right;
    font-family: arial;
    font-size: 90%;
    font-weight: bold;
    margin-right: 10px;
}
ul.skortablosu li .skor_no {
    background: #e67d00 none repeat scroll 0 0 !important;
    border-radius: 2px !important;
    color: #eee !important;
    float: left !important;
    font-family: arial !important;
    font-size: 90% !important;
    height: 20px !important;
    line-height: 20px !important;
    margin-left: 10px !important;
    padding: 0 7px !important;
    text-align: center !important;
    width: 30px !important;
}
ul.skortablosu li:hover .skor_no {
    background: #444 none repeat scroll 0 0;
    color: #fff;
}
ul.skortablosu li:hover a {
    color: #000;
    text-decoration: underline;
}
.skor_buton {
    background: #fff none repeat scroll 0 0;
    border-radius: 3px;
    color: #ab3900;
    font-size: 120%;
    font-weight: 700;
    padding: 4px 5px;
    position: absolute;
	box-shadow:0 1px 3px #aaa;
    right: -155px;
    text-align: center;
    top: 0;
    width: 150px;
}


.baktif {
}
.bpasif {
}
 
 .butonew {
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 38px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}

.butonew:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}