body
{
        font-family: SCUMMvttf, SCUMMveot, SCUMMvsvg, SCUMMvwoff, SCUMMvwoff2;
	color: white;
	background-color: #013366;
	background-image: url(background.gif);
	background-size:100%;
	background-repeat: repeat;
	background-attachment: fixed;
}

frameset
{
        font-family: SCUMMvttf, SCUMMveot, SCUMMvsvg, SCUMMvwoff, SCUMMvwoff2;
        color: white;
        background-color: #013366;
        background-image: url(background.gif);
        background-size:100%;
        background-repeat: repeat;
        background-attachment: fixed;
}


p
{
	font-size: 30px;
	text-align: center;
	font-weight: bold;
	line-height: 50%;
}

#botonStart
{
	font-size: 70px;
}

#contador
{
	font-size: 50px;
	line-height: 50%;
}

img
{
	display: block;
	margin-left: auto;
	margin-right: auto;
}

@font-face
{
        font-family: 'SCUMMvttf';
        src: url(fonts/SCUMMv.ttf);
}

@font-face
{
        font-family: 'SCUMMveot';
        src: url(fonts/SCUMMv.eot);
}

@font-face
{
        font-family: 'SCUMMvsvg';
        src: url(fonts/SCUMMv.svg);
}

@font-face
{
        font-family: 'SCUMMvwoff';
        src: url(fonts/SCUMMv.woff);
}

@font-face
{
        font-family: 'SCUMMvwoff2';
        src: url(fonts/SCUMMv.woff2);
}


a:link {
        text-decoration: none;
        color: blue;
}

a:visited {
        text-decoration: none;
        color: purple;
}

a:hover {
        text-decoration: underline;
        color: blue;
}

a:active {
        text-decoration: underline;
        color: red;
}




.star {
  font-size: 5em;
  position: absolute;
}

.star .wrapper {
  position: absolute;
  height: 10em;
  width: 10em;
}

.star .dot {
  background: white;
  height: 1em;
  width: 1em;
  position: absolute;
  display: none;
  top: 50%;
  left: 50em;
}

.star.frame-1 .wrapper {
  right: 5em;
}

.star.frame-2 .wrapper {
  right: 10em;
}

.star.frame-3 .wrapper {
  right: 15em;
}

.star.frame-4 .wrapper {
  right: 20em;
}

.star.frame-5 .wrapper {
  right: 25em;
}

.star.frame-1 .dot-1,.star.frame-2 .dot-1,.star.frame-4 .dot-1 {
  margin-top: -.5em;
  margin-left: -.5em;
  display: block;
}

.star.frame-2 .dot-2,.star.frame-3 .dot-2 {
  margin-top: -1.5em;
  margin-left: -1.5em;
  display: block;
}

.star.frame-2 .dot-3,.star.frame-3 .dot-3 {
  margin-top: .5em;
  margin-left: .5em;
  display: block;
}

.star.frame-2 .dot-4,.star.frame-3 .dot-4 {
  margin-top: .5em;
  margin-left: -1.5em;
  display: block;
}

.star.frame-2 .dot-5,.star.frame-3 .dot-5 {
  margin-top: -1.5em;
  margin-left: .5em;
  display: block;
}

.star.frame-3 .dot-6,.star.frame-4 .dot-6 {
  margin-top: -2.5em;
  margin-left: -2.5em;
  display: block;
}

.star.frame-3 .dot-7,.star.frame-4 .dot-7 {
  margin-top: 1.5em;
  margin-left: -2.5em;
  display: block;
}

.star.frame-3 .dot-8,.star.frame-4 .dot-8 {
  margin-top: -2.5em;
  margin-left: 1.5em;
  display: block;
}

.star.frame-3 .dot-9,.star.frame-4 .dot-9 {
  margin-top: 1.5em;
  margin-left: 1.5em;
  display: block;
}

.star.frame-4 .dot-2,.star.frame-5 .dot-6 {
  margin-top: -3.5em;
  margin-left: -3.5em;
  display: block;
}

.star.frame-4 .dot-3,.star.frame-5 .dot-7 {
  margin-top: 2.5em;
  margin-left: -3.5em;
  display: block;
}

.star.frame-4 .dot-4,.star.frame-5 .dot-9 {
  margin-top: -3.5em;
  margin-left: 2.5em;
  display: block;
}

.star.frame-4 .dot-5,.star.frame-5 .dot-8 {
  margin-top: 2.5em;
  margin-left: 2.5em;
  display: block;
}