@import url('https://fonts.googleapis.com/css?family=Open+Sans');
@import url('https://fonts.googleapis.com/css?family=Teko');
body {
	background:#CCCCCC;
	margin:0px;
}

div.titlebar {
	border-bottom:1px solid #BBBBBB;
	background:#EEEEEE;
}

div.title {
	display:inline-block;
	font-family: 'Teko', sans-serif;
	font-size:35px;
	width:250px;
	padding:20px 20px;
	text-align:center;
	border-right:1px solid #BBBBBB;
	background:#EEEEEE;
	color:#333333;
}

div.button {
	float:right;
	display:inline-block;
	padding-top:24px;
	height:66px;
	width:91px;
	border-left:1px solid #BBBBBB;
	background:#EEEEEE;
}

div.square {
	margin:7px auto;
	width:40%;
	height:4px;
	border-radius:3px;
	background:#333333;
}

div.button:hover {
	cursor:pointer;
}

div.button:hover div.square {
	background:#0099ff;
}

div.menu {
	position:absolute;
	right:0px;
	clear:both;
	float:right;
	width:300px;
	margin-top:1px;
	background:#FFFFFF;
	border-bottom-left-radius:5px;
}

div.link {
	display:block;
	width:299px;
	padding:20px 0px;
	text-indent:20px;
	border-left:1px solid #BBBBBB;
	border-bottom:1px solid #BBBBBB;
	font-family: 'Teko', sans-serif;
	font-size:25px;
	text-decoration:none;
	color:#333333;
}

div.link:last-child {
	border-bottom-left-radius:5px;
}

div.link:hover {
	background:#EEEEEE;
	cursor:pointer;
	color:#0099FF;
}

div.page {
	width:90%;
	margin:0px auto;
	padding:10px 0px;
	background:#EEEEEE;
	border-left:4px solid #0099FF;
}

p.heading {
	width:90%;
	margin:30px auto 0px;
	padding:10px 0px;
	font-family: 'Teko', sans-serif;
	font-size:25px;
	color:#EEEEEE;
	text-indent:20px;
	background:#333333;
	border-left:4px solid #0099FF;
}

p.detail, table.detail {
	width:90%;
	margin:20px auto;
	font-family: 'Open Sans', sans-serif;
	font-size:20px;
	color:#333333;
}

td.label {
	width:120px;
}

input[type="time"], input[type="number"], input[type="tel"], input[type="text"], input[type="password"], input[type="date"] {
	border:1px solid #CCCCCC;
	padding:20px;
	background:#EEEEEE;
	font-family: 'Open Sans', sans-serif;
	font-size:20px;
}

input[type="number"], input[type="tel"] {
	width:70px;
}

input[type="text"], input[type="password"] {
	width:120px;
}

div.timebutton {
	margin:0px auto;
	text-align:center;
	font-family: 'Teko', sans-serif;
	font-size:25px;
	width:90%;
	padding:2%;
	background:#333333;
	border-radius:2px;
	color:#EEEEEE;
}

div.timebutton:hover {
	cursor:pointer;
	background:#0099FF;
}

@media screen and (max-width: 770px) {
	div.title {
		width:190px;
		font-size:30px;
	}
	
	div.button {
		width:82px;
		padding-top:20px;
		height:63px;
	}
	
	div.menu {
		width:100%;
		border-bottom-left-radius:0px;
	}
	
	div.link {
		width:100%;
		border-left:0px;
	}
	
	div.link:last-child {
		border-bottom-left-radius:0px;
	}
}