@font-face{
	font-family: "Game Played";
	src: url('fonts/Game Played.otf') format("truetype");	
}

@font-face{
	font-family: "Gothic Bold";
	src: url('fonts/Gothic Bold.ttf') format("truetype");	
}

@font-face{
	font-family: "Arial";
	src: url('fonts/arial.ttf') format("truetype");	
}


body{
	margin: 0;
	padding: 0;
	background: url('img/bg.jpg') top center;
	background-repeat: repeat-x;
	background-color: #fffff0;	
}

.container{
	margin: auto;
	width: 1350px;
	min-height: 700px;
	height: auto;
}

.header {
	margin: auto;
	margin-top: 95px;
	background: url('img/bg-header.png') top center no-repeat;
	background-position: 45px 0;
	width: 1100px;
	height: 518px;
}

.logo {
	position: relative;
	top: -40px;
	margin: auto;
	width: 335px;
	height: auto;
	text-align: center;
}

.logo-1 {
	-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 2s; /* Firefox < 16 */
        -ms-animation: fadein 2s; /* Internet Explorer */
         -o-animation: fadein 2s; /* Opera < 12.1 */
            animation: fadein 2s;
}

.logo-2 {
	animation: bounceIn 0.8s;
	transition: all 0.4s cubic-bezier(.8,1.8,.75,.75);
}


.header-content {
	margin-top: 120px;
}

.header-content .player-online {
	position: absolute;
	margin: 83px 0 0 65px;
	font-family: "Gothic Bold";
	color: #fff;
	font-size: 20pt;
	width: 145px;
	height: 40px;
	text-align: center;
	text-shadow: 1px 1px 3px #000;
}

.header-content .player-peak {
	position: absolute;
	margin: 83px 0 0 887px;
	font-family: "Gothic Bold";
	color: #fff;
	font-size: 20pt;
	width: 145px;
	height: 40px;
	text-align: center;
	text-shadow: 1px 1px 3px #000;
}

#countdown{
	position: absolute;	
	font-family: "Game Played";
	color: #fff;
	font-size: 45pt;
	margin: 60px 0 0 320px;
	text-shadow: 1px 1px 3px #000;
	font-style: italic;
}

#days{
	opacity: 0;
	position: absolute;
	width: 80px;
	text-align: center;
	margin-top: 10px;
	margin-left: 35px;
}

#hours{
	opacity: 0;
	position: absolute;
	width: 80px;
	text-align: center;
	margin-top: 10px;
	margin-left: 140px;
}

#minutes{
	opacity: 0;
	position: absolute;
	width: 80px;
	text-align: center;
	margin-top: 10px;
	margin-left: 250px;
}

#seconds{
	opacity: 0;
	position: absolute;
	width: 80px;
	text-align: center;
	margin-top: 10px;
	margin-left: 355px;
}

.slider {
	margin: auto;
	margin-top: -60px;
	background: url('img/bg-slider.png') top center no-repeat;
	background-position: 30px 0;
	width: 1400px;
	height: 471px;
}

.slider-content {
	position: relative;
	z-index: 0;
	top: 60px;
	left: -28px;
	margin: auto;
	width: 1006px;
	height: 339px;
	overflow: hidden;
}

.slider-arrows .a-left {
	position: absolute;
	z-index: 9999;
	margin: 210px 0 0 180px;
}

.slider-arrows .a-right {
	position: absolute;
	z-index: 9999;
	margin: 210px 0 0 1133px;
}


.slider-nav {
	position: absolute;
	width: 500px;
	text-align: center;
	margin: 395px 0 0 425px;
}
.slider-nav a { 
	text-decoration: none;
	background: url('img/slider-page.png') no-repeat;
	width: 12px;
	height: 9px;
}
.slider-nav a.activeSlide { 
	background: url('img/slider-page-h.png') no-repeat;
	width: 12px;
	height: 9px;
}
.slider-nav a:focus { 
	outline: none; 
}

.slider-nav a:visited { 
	outline: none; 
	text-decoration: none;
}



.navigation {
	width: 880px;
	margin: auto;
}

.navigation a {
	opacity: 1;
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;	
}

.navigation a:hover{
	opacity: 0.8;
}

.lpane {
	float: left;
	width: 205px;
	height: auto;
}

.mpane {
	float: left;
	width: 428px;
	height: auto;
	margin: 0 20px 0 20px;
}

.rpane {
	float: left;
	width: 205px;
	height: auto;
	margin: 25px 0 0 0;
}

.footer-logo {
	margin: 30px 0 30px 0;
	text-align: center;
}


.footer {
	font-family: "Arial";
	font-size: 10pt;
	color: #655851;
	margin: 0 0 30px 0;
	text-align: center;
}

.clearfix {
	clear: both;
}


@keyframes bounceIn {
  0% {
    opacity: 1;
    transform: rotate(90deg) scale(0.3);
  } 

  50% {
    opacity: 1;
    transform: scale(1.05);
  } 

  70% {
    opacity: 1;
    transform: scale(.9);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}