@media screen 
  and (max-height: 990px) {
	#gameScreen {
		height: 85%;
	}
}

@media screen 
  and (max-height: 660px) {
	#gameScreen {
		height: 80%;
	}
}

@media screen 
  and (max-height: 440px) {
	#gameScreen {
		height: 75%;
	}
}

@media screen 
  and (max-height: 330px) {
	#gameScreen {
		height: 70%;
	}
}

@media screen 
  and (max-width: 600px) {
	
	/* BASICS */
	.button, input {
		font-size: 1.2em;
		padding: 12px 18px;
	}

	#gameTitle {
		font-size: 2.5em;
		width: 100%;
	}

	/* SCREENS */
	#newWordScreen {
		width: 100%;
	}

	#newWordScreen input {
		margin-bottom: 60px;
	}

	#gameScreen {
		margin: 0 auto;
	}
}

@media screen 
  and (max-width: 540px) {
	.spaceship {
		height: 45%;
	}

	.alphabet {
		height: 25%;
	}

	.guessedLetters li {
		min-width: 28px;
		height: 28px;
		line-height: 27px;
		font-size: 1em;
		margin: 0 2px 2px 0;
	}

	.alphabet li {
		min-width: 48px;
	    height: 48px;
	    line-height: 46px;
	}

	.alphabet button {
		font-size: 1em;
	}

	.alphabet button.used:before {
		top: 14px;
	    left: 21px;
	    transform: rotate(45deg) scale(3.3);
	}
}

@media screen 
  and (max-width: 395px) {
	.spaceship {
		height: 35%;
	}

	.guessedLetters li {
		min-width: 23px;
		height: 23px;
		line-height: 22px;
		font-size: 1em;
		margin: 0 2px 2px 0;
	}

	.alphabet li {
		min-width: 40px;
	    height: 40px;
	    line-height: 38px;
	}

	.alphabet button.used:before {
		top: 8px;
	    left: 19px;
	    transform: rotate(45deg) scale(3.5);
	}
}

@media screen 
  and (max-width: 330px) {

	/* BASICS */
	button, input {
		font-size: 1em;
		padding: 12px 18px;
	}

	button {
		display: block;
		margin: 5px auto;
		width: 100%;
	}

	#gameTitle {
		font-size: 2em;
		width: 100%;
	}

	.alphabet li {
		min-width: 35px;
	    height: 35px;
	}

	.alphabet button {
	    line-height: 0px;	
		font-size: 0.8em;
	}

	.guessedLetters li {
		min-width: 20px;
	    height: 20px;
	    line-height: 22px;
	    font-size: 1em;
	    margin: 0 2px 2px 0;
	}

	.alphabet button.used:before {
		top: 14px;
    	left: 23px;
	}

	/* BASICS */
	body {
		padding: 20px 5px;
	}
}