@font-face {
   font-family: lcd;
   src: url(LiquidCrystal-Bold.otf);
}

@font-face {
   font-family: minnie;
   src: url(Minnie.ttf);
}

.lcd {
	font-family			: lcd;
	color				: orange;
}

.off {
	display				: none;
}

body {
	background-image			: url("../img/background.png");
	background-position			: center;
	background-repeat			: repeat-y;
	background-size				: 100% auto;
	overflow					: hidden;
}

.velo {
	position					: absolute;
	top							: 0px;
	left						: 0px;
	bottom						: 52px;
	right						: 0px;
	background-color			: black;
	opacity						: 0.6;
}
  
@media all and (orientation:portrait) {
  /* Styles for Portrait screen */

  .adsense {
	position					: absolute;
	height						: 24vh;
	top							: 75vh;
	left						: 0px;
	right						: 0px;
	background-color			: white;
	padding						: 2px;
	border						: 1px solid black;
	overflow				 	: hidden;
  }
  
  .base_menu {
	  position					: absolute;
	  top						: 5%;
	  left						: 5%;
	  right						: 5%;
	  bottom					: 5%;
  }

  .menu_back {
	  width						: 100%;
  }
  
  .xp {
	  position					: absolute;
	  left						: 38%;
	  top						: 13%;
	  width						: 18%
  }

  .xp_points {
	  position					: absolute;
	  left						: 59%;
	  top						: 15.1%;
	  font-size					: 5.5vh;
  }

  .easy {
	  position					: absolute;
      left						: 20vw;
      right						: 20%;
      top						: 40vw;
      bottom					: 30%;
      height					: 10vh;
  }

  .medium {
	  position					: absolute;
      left						: 18vw;
      right						: 20%;
      top						: 56vw;
      bottom					: 30%;
      height					: 10vh;
  }

  .hard {
	  position					: absolute;
      left						: 18vw;
      right						: 20%;
      top						: 73vw;
      bottom					: 30%;
      height					: 10vh;
  }

  .insane {
	  position					: absolute;
      left						: 18vw;
      right						: 20%;
      top						: 90vw;
      bottom					: 30%;
      height					: 10vh;
  }

  .image_menu {
	  width						: 100%;
	  height					: 100%;
  }

  .popup {
  	  position					: absolute;
  	  left						: 10%;
  	  right						: 10%;
  	  top						: 25%;
  	  bottom					: 25%;
  	  background-image			: url("../img/base_menu.png");
	  background-position		: center;
	  background-size			: contain;
	  background-repeat			: no-repeat;
	  
  }
  
  .xp_popup {
  	  position					: absolute;
  	  left						: 50%;
  	  top						: 13vh;
  	  margin-left				: -10vw;
  	  width						: 20vw;
  }
  
  .points_popup {
  	  position					: absolute;
  	  left						: 50%;
  	  top						: 25vh;
  	  margin-left				: -15vw;
  	  width						: 30vw;
  	  font-size					: 10vw;
  }
  
  .message_popup {
  	  position					: absolute;
  	  left						: 50%;
  	  top						: 31vh;
  	  margin-left				: -20vw;
  	  width						: 40vw;
  	  font-size					: 7vw;
  	  font-family				: minnie;
  	  text-align				: center;
  	  text-shadow				: 2px 2px black;
  	  color						: orangered;
  }
}


@media all and (orientation:landscape) and (max-height: 401px) {
  .menu_back {
	  height					: 108%;
  }
}


@media all and (orientation:landscape) and (min-height: 400px) {
  .menu_back {
	  height					: 93%;
  }
}
  
@media all and (orientation:landscape) {
  /* Styles for Landscape screen -> Orizzontale... */

  .base_menu {
	  position					: absolute;
	  top						: 5%;
	  left						: 5%;
	  right						: 5%;
	  bottom					: 80px;
	  text-align				: center;
  }


  .xp {
	  position					: absolute;
	  left						: 45%;
	  top						: 15%;
	  height					: 12%
  }

  .xp_points {
	  position					: absolute;
	  left						: 55%;
	  top						: 17.5%;
	  font-size					: 6vh;
  }

  .easy {
	  position					: absolute;
	  left						: 50%;
	  top						: 25vh;
	  width						: 36vh;
	  margin-left				: -18vh;
  }

  .medium {
	  position					: absolute;
	  left						: 50%;
	  top						: 37vh;
	  width						: 36vh;
	  margin-left				: -19vh;
  }

  .hard {
	  position					: absolute;
	  left						: 50%;
	  top						: 49vh;
	  width						: 36vh;
	  margin-left				: -19vh;vh;
  }

  .insane {
	  position					: absolute;
	  left						: 50%;
	  top						: 61vh;
	  width						: 36vh;
	  margin-left				: -19vh;
  }

  .image_menu {
	  width						: 100%;
	  height					: 100%
  }

  .popup {
  	  position					: absolute;
  	  left						: 10%;
  	  right						: 10%;
  	  top						: 15%;
  	  bottom					: 25%;
  	  background-image			: url("../img/base_menu.png");
	  background-position		: center;
	  background-size			: contain;
	  background-repeat			: no-repeat;
	  
  }
  
  .xp_popup {
  	  position					: absolute;
  	  left						: 50%;
  	  top						: 16vh;
  	  margin-left				: -5vw;
  	  width						: 10vw;
  }
  
  .points_popup {
  	  position					: absolute;
  	  left						: 50%;
  	  top						: 33vh;
  	  margin-left				: -15vw;
  	  width						: 30vw;
  	  font-size					: 4vw;
  	  text-align				: center;
  }
  
  .message_popup {
  	  position					: absolute;
  	  left						: 50%;
  	  top						: 44vh;
  	  margin-left				: -10vw;
  	  width						: 20vw;
  	  font-size					: 4vw;
  	  font-family				: minnie;
  	  text-align				: center;
  	  text-shadow				: 2px 2px black;
  	  color						: orangered;
  	  line-height				: 1;
  }
  
  .adsense {
	  position			: absolute;
	  bottom			: 2px;
	  left				: 2px;
	  right				: 2px;
	  height			: 50px;
	  background-color	: white;
	  text-align		: center;
	  padding			: 2px;
	  overflow			: hidden;
  }
}