body {
	background-color:black;
	color:white;
	text-align:center;
	font-family: 'Alegreya Sans', sans-serif;
}
#container{
	max-width:90%;
 	position: fixed;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
}
#border_box{
	position:relative;
  	border-radius: 0px;
  	border-style: solid;
  	border-color: white;
}
#text{
	position:relative;
	font-size:4em;
	margin:5% 5% 5% 5%;
}
#button{
	margin-top:5%;
	position:relative;
  	border-radius: 10px;
  	border-style: solid;
  	border-color: black;
  	background-color: white;
  	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}
#button:hover{
	background-color: #C0C0C0;
    color: white;
}
 #button_text{
 	font-size:2em;
 	color:black;
 	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s; 
}
#button_text:hover{
	margin:1% 0 1% 0;
}
#footer{
	position:fixed;
	height:10%;
	width:100%;
	bottom:0%;
	right:0%;
}
#footer_text{
	display:inline-block;
	font-size:1.5em;
}

/* Mobile Settings */
/* Having issues with iPhones.  Updated the viewport, but still not fixed... */

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
#container{
	top:5%;
	left:5%;
}
#text{
	font-size:3em;
}
}