html, body {
  width:   100%;
  height:  100%;
  margin:  0px;
  padding: 0px;
  border:  0px;
  background: #000000;
  color: #FFFFFF;
}

body, input, button, select, option, textarea {
    font-family: Arial, Helvetica, sans-serif; /* whatever font */
}
input, button, select, option {
    font-size: 125%;
}

th, td {
   padding: 0px;
}

#title {
  border-collapse: collapse;
  display: none;
  max-width: 100%;
  max-height: 66%;
  margin-left: auto;
  margin-right: auto;
  padding:0px;
  border: 0px;
  position: fixed;
  margin-left: -276px;
  left: 50%;
  top: 5%;
  image-rendering: optimizeSpeed; /* STOP SMOOTHING, GIVE ME SPEED  */
	image-rendering: -moz-crisp-edges; /* Firefox                        */
	image-rendering: -o-crisp-edges; /* Opera                          */
	image-rendering: -webkit-optimize-contrast; 	/* Chrome (and eventually Safari) */
	image-rendering: pixelated; /* Chrome */
	image-rendering: optimize-contrast; 	/* CSS3 Proposed                  */
	-ms-interpolation-mode: nearest-neighbor; 	/* IE8+                           */
}

#menuArea {
/*  position:absolute; */
/*	left: 0px; */
/*  top: 0px; */
	border-collapse: collapse;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  background: #000000;
  padding:0px;
  border: 0px;
}

#gameArea {
/*  position:absolute; */
/*  left: 0px; */
/*  top: 0px; */
  border-collapse: collapse;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  background: #000000;
  padding:0px;
  border: 0px;
  overflow: hidden;
}

#statusArea {
  position:absolute;
  left: 0px;
  bottom: 0px;
	border-collapse: collapse;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin: 0px;
  background: #000000;
  padding:0px;
  border: 0px;
}

#exit {
  position:absolute;
  display: none;
  left:0px;
  top:0px;
}

#replay {
  position:absolute;
  display: none;
  left:0px;
  top:0px;
}

#soundOn {
  position:absolute;
  display: none;
  right:0px;
  top:0px;
}

#soundOff {
  position:absolute;
  display: none;
  right:0px;
  top:0px; 
}

#cursorOn {
  position:absolute;
  display: none;
  right:0px;
  top:0px;
}

#cursorOff {
  position:absolute;
  display: none;
  right:0px;
  top:0px; 
}

#bomb, #bomb2, #bomb3 {
  position:absolute;
  display: none;
  left:0px;
  bottom:0px;
}

#blocker, #blocker2 {
  position:absolute;
  display: none;
  left:0px;
  bottom:0px;
}

#splash {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top:  -120px;
  margin-left: -120px; 
}

#progress {
  position: fixed;
  display: block;
  text-align: center;
  bottom:20px;
  left: 0px;
  right: 0px;
  margin-left: auto;
  margin-right: auto;
}

.slide {
  -webkit-animation:move 1s forwards;
  -moz-animation:move 1s forwards;
  animation:move 1s forwards;
}

@-webkit-keyframes move { 
  0% {
    -webkit-transform: translate(0px, 180px); /* Chrome, Safari, Opera */
  }
	100% {}
}
@-moz-keyframes move { 
	0% {
    -moz-transform: translate(0px, 180px); /* Firefox */
  }
  100% {}
}
@keyframes move {
  0% {
    transform: translate(0px, 180px);
  }
	100% {}
}

.slide2 {
  -webkit-animation:move2 2s backwards;
  -moz-animation:move2 2s backwards;
  animation:move2 2s backwards;
}

@-webkit-keyframes move2 { 
  0% {
    -webkit-transform: translate(0px, -1024px); /* Chrome, Safari, Opera */
  }
  100% {}
}
@-moz-keyframes move2 { 
  0% {
    -moz-transform: translate(0px, -1024px); /* Firefox */
  }
  100% {}
}
@keyframes move2 {
  0% {
    transform: translate(0px, -1024px);
  }
  100% {}
}

.slide-Delay-5 {
  -webkit-animation-delay:5s;
  -moz-animation-delay:5s;
  -o-animation-delay:5s;
  animation-delay:5s;
}

.slide-Delay-1 {
  -webkit-animation-delay:1s;
  -moz-animation-delay:1s;
  -o-animation-delay:1s;
  animation-delay:1s;
}

#innerprogress {
	left: 0px;
	right: 0px;
  margin: auto;
}

#cursors {
  position:absolute;
  display: none;
  right:150px;
  bottom:150px;
}

.settingsButton {
  padding: 0px;
  color: #FFFFFF;
  border-color: #8080FF; 
  border-style: outset;
  background-color: rgba(0,0,0,1);
  -webkit-transition-duration: 0.1s; /* Safari */
  transition-duration: 0.1s;
}

.settingsButton:hover:enabled {
  background-color: rgba(0,0,0,1);
  border-color: #FFFFFF;
  color: #FFFFFF;
}

.settingsButton:disabled {
  background-color: rgba(0,0,0,1);
  border-color: #808080; 
  border-style: solid;
  color: #0000FF;
  opacity: 0.3;
}

.settingsButton:focus {
	outline: none;
}

.worldSettings {
  background-color: rgba(150,150,150,0.3);
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
}

.worldSettings:hover {
  background-color: rgba(150,150,150,0.7);
}

.closed {
  max-height: 0px;
	overflow: hidden;
  -webkit-transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
  -moz-transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
  -ms-transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
  transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
}

.open {
  max-height: 1000px;
	overflow: hidden;
  -webkit-transition: max-height 0.5s cubic-bezier(1, 0, 1, 0);
  -moz-transition: max-height 0.5s cubic-bezier(1, 0, 1, 0);
  -ms-transition: max-height 0.5s cubic-bezier(1, 0, 1, 0);
  transition: max-height 0.5s cubic-bezier(1, 0, 1, 0);
}

.donut {
  background-color: rgba(0,0,0,0);
  border: 3px solid rgba(0,100,250,0.8);
  opacity: .9;
  border-left: 1px solid rgba(0,0,0,0);
  border-right: 1px solid rgba(0,0,0,0);
  border-radius: 50px;
  box-shadow: 0 0 60px #8080FF;
  width: 50px;
  height: 50px;
  margin: 0 auto;
  animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -webkit-animation: spin 2s infinite linear;
  position: fixed;
  margin-left: -30px; 
  top: 50%;
  left: 50%;
}

.donutInDialog {
  background-color: rgba(0,0,0,0);
  border: 3px solid rgba(0,100,250,0.8);
  opacity: .9;
  border-left: 1px solid rgba(0,0,0,0);
  border-right: 1px solid rgba(0,0,0,0);
  border-radius: 50px;
  box-shadow: 0 0 60px #8080FF;
  width: 50px;
  height: 50px;
  margin: 0 auto;
  animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -webkit-animation: spin 2s infinite linear;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@-moz-keyframes spin {
    0% { -moz-transform: rotate(0deg); }
    100% { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

*:not(textarea):not(input) { /* Disable selection/copy in UIWebView */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -ms-touch-select: none;
    user-select: none;
}
