* {
  margin: 0;
  padding: 0;
}

html, body {
	height: 100%;
}

canvas {
  width: 100%;
  height: 100%;
  position: absolute;
}

#creditos {
	font-family: 'Source Sans Pro', sans-serif;
	background: #8d161a url(images/bg_creditos.png) no-repeat top right;
	color: #FFF;
	padding: 50px;
}

#creditos h1 {
	font-weight: 300;
	text-transform: uppercase;
	text-align: center;
	font-size: 45px;
	margin-bottom: 20px;
}

#creditos p {
	font-weight: 300;
}




#preloader {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;

	background: #8d161a;
}

.centraliza {
	position: absolute;
	top: 50%;
	width: 100%;
	text-align: center;
	margin-top: -160px;
}

.centraliza img {
	margin-bottom: 20px;
}

/* SIPner */

.windows8 {
	position: relative;
	width: 28px;
	height:28px;
	margin:auto;
}

.windows8 .wBall {
	position: absolute;
	width: 27px;
	height: 27px;
	opacity: 0;
	transform: rotate(225deg);
		-o-transform: rotate(225deg);
		-ms-transform: rotate(225deg);
		-webkit-transform: rotate(225deg);
		-moz-transform: rotate(225deg);
	animation: orbit 6.050000000000001s infinite;
		-o-animation: orbit 6.050000000000001s infinite;
		-ms-animation: orbit 6.050000000000001s infinite;
		-webkit-animation: orbit 6.050000000000001s infinite;
		-moz-animation: orbit 6.050000000000001s infinite;
}

.windows8 .wBall .wInnerBall{
	position: absolute;
	width: 3px;
	height: 3px;
	background: rgb(255,255,255);
	left:0px;
	top:0px;
	border-radius: 3px;
}

.windows8 #wBall_1 {
	animation-delay: 1.32s;
		-o-animation-delay: 1.32s;
		-ms-animation-delay: 1.32s;
		-webkit-animation-delay: 1.32s;
		-moz-animation-delay: 1.32s;
}

.windows8 #wBall_2 {
	animation-delay: 0.26s;
		-o-animation-delay: 0.26s;
		-ms-animation-delay: 0.26s;
		-webkit-animation-delay: 0.26s;
		-moz-animation-delay: 0.26s;
}

.windows8 #wBall_3 {
	animation-delay: 0.53s;
		-o-animation-delay: 0.53s;
		-ms-animation-delay: 0.53s;
		-webkit-animation-delay: 0.53s;
		-moz-animation-delay: 0.53s;
}

.windows8 #wBall_4 {
	animation-delay: 0.79s;
		-o-animation-delay: 0.79s;
		-ms-animation-delay: 0.79s;
		-webkit-animation-delay: 0.79s;
		-moz-animation-delay: 0.79s;
}

.windows8 #wBall_5 {
	animation-delay: 1.06s;
		-o-animation-delay: 1.06s;
		-ms-animation-delay: 1.06s;
		-webkit-animation-delay: 1.06s;
		-moz-animation-delay: 1.06s;
}

@keyframes orbit {
	0% {
		opacity: 1;
		z-index:99;
		transform: rotate(180deg);
		animation-timing-function: ease-out;
	}

	7% {
		opacity: 1;
		transform: rotate(300deg);
		animation-timing-function: linear;
		origin:0%;
	}

	30% {
		opacity: 1;
		transform:rotate(410deg);
		animation-timing-function: ease-in-out;
		origin:7%;
	}

	39% {
		opacity: 1;
		transform: rotate(645deg);
		animation-timing-function: linear;
		origin:30%;
	}

	70% {
		opacity: 1;
		transform: rotate(770deg);
		animation-timing-function: ease-out;
		origin:39%;
	}

	75% {
		opacity: 1;
		transform: rotate(900deg);
		animation-timing-function: ease-out;
		origin:70%;
	}

	76% {
	opacity: 0;
		transform:rotate(900deg);
	}

	100% {
	opacity: 0;
		transform: rotate(900deg);
	}
}

@-o-keyframes orbit {
	0% {
		opacity: 1;
		z-index:99;
		-o-transform: rotate(180deg);
		-o-animation-timing-function: ease-out;
	}

	7% {
		opacity: 1;
		-o-transform: rotate(300deg);
		-o-animation-timing-function: linear;
		-o-origin:0%;
	}

	30% {
		opacity: 1;
		-o-transform:rotate(410deg);
		-o-animation-timing-function: ease-in-out;
		-o-origin:7%;
	}

	39% {
		opacity: 1;
		-o-transform: rotate(645deg);
		-o-animation-timing-function: linear;
		-o-origin:30%;
	}

	70% {
		opacity: 1;
		-o-transform: rotate(770deg);
		-o-animation-timing-function: ease-out;
		-o-origin:39%;
	}

	75% {
		opacity: 1;
		-o-transform: rotate(900deg);
		-o-animation-timing-function: ease-out;
		-o-origin:70%;
	}

	76% {
	opacity: 0;
		-o-transform:rotate(900deg);
	}

	100% {
	opacity: 0;
		-o-transform: rotate(900deg);
	}
}

@-ms-keyframes orbit {
	0% {
		opacity: 1;
		z-index:99;
		-ms-transform: rotate(180deg);
		-ms-animation-timing-function: ease-out;
	}

	7% {
		opacity: 1;
		-ms-transform: rotate(300deg);
		-ms-animation-timing-function: linear;
		-ms-origin:0%;
	}

	30% {
		opacity: 1;
		-ms-transform:rotate(410deg);
		-ms-animation-timing-function: ease-in-out;
		-ms-origin:7%;
	}

	39% {
		opacity: 1;
		-ms-transform: rotate(645deg);
		-ms-animation-timing-function: linear;
		-ms-origin:30%;
	}

	70% {
		opacity: 1;
		-ms-transform: rotate(770deg);
		-ms-animation-timing-function: ease-out;
		-ms-origin:39%;
	}

	75% {
		opacity: 1;
		-ms-transform: rotate(900deg);
		-ms-animation-timing-function: ease-out;
		-ms-origin:70%;
	}

	76% {
	opacity: 0;
		-ms-transform:rotate(900deg);
	}

	100% {
	opacity: 0;
		-ms-transform: rotate(900deg);
	}
}

@-webkit-keyframes orbit {
	0% {
		opacity: 1;
		z-index:99;
		-webkit-transform: rotate(180deg);
		-webkit-animation-timing-function: ease-out;
	}

	7% {
		opacity: 1;
		-webkit-transform: rotate(300deg);
		-webkit-animation-timing-function: linear;
		-webkit-origin:0%;
	}

	30% {
		opacity: 1;
		-webkit-transform:rotate(410deg);
		-webkit-animation-timing-function: ease-in-out;
		-webkit-origin:7%;
	}

	39% {
		opacity: 1;
		-webkit-transform: rotate(645deg);
		-webkit-animation-timing-function: linear;
		-webkit-origin:30%;
	}

	70% {
		opacity: 1;
		-webkit-transform: rotate(770deg);
		-webkit-animation-timing-function: ease-out;
		-webkit-origin:39%;
	}

	75% {
		opacity: 1;
		-webkit-transform: rotate(900deg);
		-webkit-animation-timing-function: ease-out;
		-webkit-origin:70%;
	}

	76% {
	opacity: 0;
		-webkit-transform:rotate(900deg);
	}

	100% {
	opacity: 0;
		-webkit-transform: rotate(900deg);
	}
}

@-moz-keyframes orbit {
	0% {
		opacity: 1;
		z-index:99;
		-moz-transform: rotate(180deg);
		-moz-animation-timing-function: ease-out;
	}

	7% {
		opacity: 1;
		-moz-transform: rotate(300deg);
		-moz-animation-timing-function: linear;
		-moz-origin:0%;
	}

	30% {
		opacity: 1;
		-moz-transform:rotate(410deg);
		-moz-animation-timing-function: ease-in-out;
		-moz-origin:7%;
	}

	39% {
		opacity: 1;
		-moz-transform: rotate(645deg);
		-moz-animation-timing-function: linear;
		-moz-origin:30%;
	}

	70% {
		opacity: 1;
		-moz-transform: rotate(770deg);
		-moz-animation-timing-function: ease-out;
		-moz-origin:39%;
	}

	75% {
		opacity: 1;
		-moz-transform: rotate(900deg);
		-moz-animation-timing-function: ease-out;
		-moz-origin:70%;
	}

	76% {
	opacity: 0;
		-moz-transform:rotate(900deg);
	}

	100% {
	opacity: 0;
		-moz-transform: rotate(900deg);
	}
}