body {
  /*background-color: #160440;*/

  background: -webkit-linear-gradient(90deg, #c04848 10%, #480048 90%); /* Chrome 10+, Saf5.1+ */
  background: -moz-linear-gradient(90deg, #c04848 10%, #480048 90%); /* FF3.6+ */
  background: -ms-linear-gradient(90deg, #c04848 10%, #480048 90%); /* IE10 */
  background: -o-linear-gradient(90deg, #c04848 10%, #480048 90%); /* Opera 11.10+ */
  background: linear-gradient(90deg, #c04848 10%, #480048 90%);
}

.stars {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  display: block;
  background-image: url('stars.png');
  /*   background: url("stars.png"); */
  z-index: -1;
  /*   background-size: 1260px; */
}

.container {
  position: relative;
  margin: auto;
  display: block;
  width: 600px;
  height: 700px;
  background: none;
  top: 60px;
  /*outline: red dashed 3px;*/
}

.tardis-back-body {
  position: absolute;
  top: 20%;
  left: 20%;
  width: 60%;
  height: 77%;
  background: #324aa5;
}

.tardis-front-body {
  position: absolute;
  top: -10%;
  left: 10%;
  width: 80%;
  height: 110%;
  background: #4159b5;
}

.top-sign {
  position: absolute;
  top: -5%;
  left: 5%;
  width: 90%;
  height: 5%;
  background: #3d54ab;
  /*background: red;*/

  background: #3d54ab;
  background: -webkit-linear-gradient(#4a64c7, #3a4e9a); /* Safari*/
  background: -o-linear-gradient(#4a64c7, #3a4e9a); /*Opera */
  background: -moz-linear-gradient(#4a64c7, #3a4e9a); /*Firefox */
  background: linear-gradient(#4a64c7, #3a4e9a);
}

.tardis-door {
  position: absolute;
  top: 18%;
  left: 4%;
  width: 92%;
  height: 82%;
  background: #4f65b3;

  -moz-box-shadow: 0px 0px 16px #384692;
  -webkit-box-shadow: 0px 0px 16px #384692;
  box-shadow: 0px 0px 16px #384692;
}

.centre-door {
  position: absolute;
  /* top: -10%; */
  left: 47%;
  width: 6%;
  height: 100%;
  background: #586bb3;

  -moz-box-shadow: 1px 0px 8px #384692;
  -webkit-box-shadow: 1px 0px 8px #384692;
  box-shadow: 1px 0px 8px #384692;
}

.window-1,
.window-2,
.window-3,
.window-4,
.window-5,
.window-6,
.window-7,
.window-8 {
  position: absolute;
  width: 32%;
  height: 19%;
}

.window-4,
.window-5,
.window-6,
.window-7,
.window-8 {
  background: #4159b5;

  -moz-box-shadow: inset 3px -3px 10px #273686;
  -webkit-box-shadow: inset 3px -3px 10px #273686;
  box-shadow: inset 3px -3px 10px #273686;
}

.window-3 {
  border: 10px solid #3a51a7;
  background: #fafafa;
  text-align: center;
  font-size: 4px;

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

.window-1,
.window-3,
.window-5,
.window-7 {
  left: 9%;
}

.window-2,
.window-4,
.window-6,
.window-8 {
  right: 9%;
}

.window-1,
.window-2 {
  top: 5%;
  background: #e6e6e5;
}

/**/
.grid {
  margin-top: 55%;
  height: 4px;
  width: 100%;
  background: #2c3c79;
}
.grid:before {
  margin: -55% 31.3%;
  height: 100%;
  width: 4px;
  background: #2c3c79;
  content: '';
  position: absolute;
}
.grid:after {
  margin: -55% 64.6%;
  height: 100%;
  width: 4px;
  background: #2c3c79;
  content: '';
  position: absolute;
}
/**/

.window-3,
.window-4 {
  top: 28.5%;
}

.window-5,
.window-6 {
  bottom: 28.5%;
}

.window-7,
.window-8 {
  bottom: 5%;
}

.sign {
  position: absolute;
  top: 9.1%;
  left: -5%;
  width: 110%;
  height: 7%;
  border: 4px solid #4159b5;
  text-align: center;
  font-family: verdana;
  background-color: #222;
  color: white;

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

  -moz-box-shadow: 0px 6px 24px #161a2f;
  -webkit-box-shadow: 0px 6px 24px #161a2f;
  box-shadow: 0px 6px 24px #161a2f;
}

span.big {
  text-transform: uppercase;
  font-size: 25px;
}

span.small {
  display: inline-block;
  width: 64px;
  font-size: 12px;
  text-align: center;
  text-transform: uppercase;
  padding-top: 6px;
  line-height: 11px;
}

.step {
  position: absolute;
  bottom: -4%;
  left: -5%;
  width: 110%;
  height: 4%;
  background: #4159b5;

  /**/
  background: #3d54ab;
  background: -webkit-linear-gradient(#455cb1, #2c3c79);
  background: -o-linear-gradient(#455cb1, #2c3c79);
  background: -moz-linear-gradient(#455cb1, #2c3c79);
  background: linear-gradient(#455cb1, #2c3c79);
}

.ears {
  position: absolute;
  top: 1%;
  left: -2%;
  width: 104%;
  height: 7%;
  background: #2e418a;
  z-index: -1;
}

.lamp-base {
  position: absolute;
  top: -1.85%;
  left: 44%;
  width: 12%;
  height: 2%;
  background: #3d54ab;

  /**/
  background: #3d54ab;
  background: -webkit-linear-gradient(left, #4f67c3, #31448c);
  background: -o-linear-gradient(right, #4f67c3, #31448c);
  background: -moz-linear-gradient(right, #4f67c3, #31448c);
  background: linear-gradient(to right, #4f67c3, #31448c);
  /**/
}

.lamp-middle {
  position: absolute;
  bottom: 101%;
  width: 100%;
  height: 300%;
  background: #efff98;
}

.lamp-top {
  position: absolute;
  top: -415%;
  left: -15%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 22px 14px 22px;
  border-color: transparent transparent #3d54ab transparent;
}

.light {
  position: absolute;
  bottom: -140%;
  left: -140%;
  background: none;
  animation: glow 800ms ease-out infinite alternate;
  background: -webkit-radial-gradient(circle, red, yellow, green);
  background: -o-radial-gradient(circle, red, yellow, green);
  background: -moz-radial-gradient(circle, red, yellow, green);
  background: radial-gradient(circle, rgba(240, 249, 171, 0.72), rgba(255, 255, 255, 0) 65%);

  z-index: 1;
}

@keyframes glow {
  0% {
    bottom: 50%;
    left: 50%;
    width: 0%;
    height: 0%;
  }
  100% {
    bottom: -140%;
    left: -140%;
    width: 400%;
    height: 400%;
  }
}

.tardis-back-body {
  animation: pulse 5s ease-in-out infinite alternate;
}

@keyframes pulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  50% {
    transform: scale(0.98);
    opacity: 0.5;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.l1,
.l3 {
  font-size: 6px;
  margin: 2px 0;
}

.l2,
.l4 {
  font-size: 9px;
  margin: -1px 0;
}

.l5 {
  margin: 3px 0 2px;
}

.l6 {
  margin: -3px 5px;
}

.l7 {
  margin: 4px 0;
}

.l8 {
  margin: -5px 0;
}

.l9 {
  font-size: 7px;
  margin: 7px 0;
}

.l5,
.l6,
.l7,
.l8,
.l9 {
  font-family: verdana;
}

.l5,
.l6,
.l7,
.l8 {
  font-size: 3px;
}