html,body
{
	padding:0;
	margin:0;
	width:100%;
	height:100%;
	
}
#container
{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}

#part1, #part2, #part3, #part4, #part5
{
	width:100%;
	height:20%;
	line-height:20%;
	
	
	border:#FFF 1px solid;
	-moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
	
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color:#FFF;
	
	
	
	
	display: -webkit-box;
  	display: -moz-box;
  	display: -ms-flexbox;
  	display: -webkit-flex;
  	display: flex;
 	-webkit-box-pack: center;
 	-moz-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
#part1
{
	background:#C83939;
	white-space: nowrap;
	
}
#part2
{
	background:#396BC8;
}
#part3
{
	background:#39C839;
}
#part4
{
	background:#DBBE35;
}
#part5
{
	background:#A635DB;
}


input 
{
    background:#FFF;
    border-width:0px;
	border:none;
	text-align:center;
}
@media screen and (orientation:portrait) 
{
	
	#part1
	{
		font-size:4.5vw;
	}
    #part2, #part3, #part4, #part5
	{
		font-size:7vw;
	}
	input 
	{
		width:20%;
		height:30%;
		font-size:6vw;
		
	}
	
}
@media screen and (orientation:landscape) 
{
	#part1
	{
		font-size:4vw;
	}
	
    #part2, #part3, #part4, #part5
	{
		font-size:4vw;
	}
	input 
	{
		width:10%;
		height:35%;
		font-size:3vw;
		
	}
	
}