@charset "utf-8";
/* CSS Document */

body{
	margin:auto;
	padding: auto;
	max-width:  100%;
	height: 100%;
	background-color:#F7EDD2; 
}
#header {
	width: 100%;
	height: 5%;
	background-color: #2F2811;
	float: left;
	position: fixed;
	padding: 1%;
}
#utama{
	width: 100%;
	height: 100%;
	float: left;
	margin: 3% 0 0 0 ;
}
.logoatas{
	width: 15%;
	float: left;

}
.headerfoto{
	width: 100%;
	float: left;
}
#papan{
	border:solid #FFFFFF ;
	width: 40%;
	height: 40%;
	margin: 29% 0 0 27%;
	padding: 1%;
	float: left;
	position: absolute;
	background-color: #3C2500;
	border-top-left-radius: 1em; 
	border-top-right-radius: 1em; 
	border-bottom-right-radius: 1em;
	border-bottom-left-radius: 1em;
}
h2{
	color: white;
	text-align: center;
	margin: 0;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
}
h3{
	color: white;
	text-align: center;
	margin: 0;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
}
#input1{
	width: 93%;
	height: 40%;
	padding: 2%;
	margin: 1%;
	align-content: center;
	border-top-left-radius: 1em; 
	border-top-right-radius: 1em; 
	border-bottom-right-radius: 1em;
	border-bottom-left-radius: 1em;
	float: left;
}
#input2{
	width: 98%; 
	height: 20%;
	padding: 1%;
	margin: 1%;
	align-content: center;
	border-top-left-radius: 1em; 
	border-top-right-radius: 1em; 
	border-bottom-right-radius: 1em;
	border-bottom-left-radius: 1em;
	text-align: center;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	float: left;
}
#input2 a{
  			display: block;
  			color: black;
  			text-align: center;
  			padding: 2%;
			margin:auto;
  			text-decoration: none;
}
#input a:hover{
			color: black;
			border-top-left-radius: 1em; 
			border-top-right-radius: 1em; 
			border-bottom-right-radius: 1em;
			border-bottom-left-radius: 1em;
			background-color: yellow;
			margin: 0;
}
#inputpapan{
	margin: 2% 0 5% 0;
}
.hasil{
	text-align: center;
	color: white;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	font-size: 90%;
	margin: 10% 0 0 0;
}

@media only screen and (max-width:480px){
	
	body{
	margin:0;
	padding: 0;
	max-width:  100%;
	height: 100%;
	background-color:#F7EDD2; 
}
#header {
	width: 100%;
	height: 3%;
	background-color: #2F2811;
	float: left;
	position: fixed;
	padding: 1%;
}
#utama{
	width: 100%;
	height: 100%;
	float: left;
	margin: 5% 0 0 0 ;
}
.logoatas{
	width: 20%;
	float: left;

}
.headerfoto{
	width: 100%;
	float: left;
}
#papan{
	border: #FFFFFF ;
	width: 80%;
	height: 25%;
	margin: 60% 0 0 8%;
	padding: 2%;
	float: left;
	position: absolute;
	background-color: #3C2500;
	border-top-left-radius: 1em; 
	border-top-right-radius: 1em; 
	border-bottom-right-radius: 1em;
	border-bottom-left-radius: 1em;
}
h2{
	color: white;
	text-align: center;
	margin: 0;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
}
h3{
	color: white;
	text-align: center;
	margin: 0;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	font-size: 80%;
}
#input1{
	width: 95%;
	height: 5%;
	padding: 0.5%;
	margin: 1%;
	align-content: center;
	border-top-left-radius: 0.4em; 
	border-top-right-radius: 0.4em; 
	border-bottom-right-radius: 0.4em;
	border-bottom-left-radius: 0.4em;
	float: left;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	font-size: 75%;
}
#input2{
	width: 97%; 
	height: 5%;
	padding: 0.5%;
	margin: 1% 0 0 1%;
	align-content: center;
	border-top-left-radius: 1em; 
	border-top-right-radius: 1em; 
	border-bottom-right-radius: 1em;
	border-bottom-left-radius: 1em;
	text-align: center;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	float: left;
	font-size: 70%;
}
#input2 a{
  			display: block;
  			color: black;
  			text-align: center;
  			padding: 2%;
			margin:auto;
  			text-decoration: none;
}
#input a:hover{
			color: black;
			border-top-left-radius: 1em; 
			border-top-right-radius: 1em; 
			border-bottom-right-radius: 1em;
			border-bottom-left-radius: 1em;
			background-color: yellow;
			margin: 0;
}
#inputpapan{
	margin: 3% 0 7% 0;
}
.hasil{
	text-align: center;
	color: white;
	font-family: Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", "monospace";
	font-size: 65%;
	margin:1%;
}
	
}