/*
This entire file is for:
@media only screen and (max-width: 760px),(min-device-width: 210px) and (max-device-width: 600px){
*/

body{
	margin-top:150px;
}
#login,#signup
{
	width: 90%; 
	font-size:5em;
	line-height:1em;
}

form input
{
	height:100%;
	width:90%;
	font-size:1em;
}
form input.login
{
/*	height:1em;*/
	font-size:1.5em;
}

.button 
{
	font-size:1em;
	max-width: 500px;
	max-height: 200px;
	margin-top:.25em;
}

/* Menu bar */
.navbar {
  overflow: hidden;
  background-color: #333;
  position: fixed;
  top: 0;
  width: 100%;
}

.navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}
/* end Menu bar */

/* Force table to not be like tables anymore */
table, table.history, thead, tbody, th, td, tr { 
	display: block; 
}

table,table.history{
	width:90%;
	margin-left:5%;
	margin-right:5%;
}

/*
Don't put as much padding on top or bottom as you would with a normal table
*/
th, td{
	border:1px solid black;
	text-align:left;
	height:1.5em;
	vertical-align:bottom;
	padding-top:2px;
	padding-bottom:2px;
	font-size:3em;
}
th.cellcenter,td.cellcenter{
	text-align:left;
}
th.cellright,td.cellright{
	text-align:left
}
caption{
	font-size:2.5em;
	font-weight:bold;
	text-align:center;
}

/* Hide table headers (but not display: none;, for accessibility) */
thead tr { 
	position: absolute;
	top: -9999px;
	left: -9999px;
}

tr.history { 
	border: 2px solid #000000; 
	margin-top:2em;
	margin-bottom:2em;
}
	
td.history { 
	/* Behave  like a "row" */
	border: none;
	border-bottom: 1px solid #eee; 
	position: relative;
	padding-left: 50%; 
}
	
td:before.history { 
	/* Now like a table header */
	position: absolute;
	/* Top/left values mimic padding */
	top: 6px;
	left: 6px;
	width: 45%; 
	padding-right: 10px; 
	white-space: nowrap;
}
	
/*
Label the data
*/
td:nth-of-type(1):before.history { content: "Date"; }
td:nth-of-type(2):before.history { content: "From"; }
td:nth-of-type(3):before.history { content: "To"; }
td:nth-of-type(4):before.history { content: "Amount"; }
td:nth-of-type(5):before.history { content: "Notes"; }
td:nth-of-type(6):before.history { content: "Delete"; }

div.logo{
	width:90%;
	margin-left:5%;
	margin-right:5%;
}


h3
{
	line-height:0;
}

/* Attendance Types */
.present{
	color:black;
}
.absent{
	color:red;
}
.visitor{
	color:blue;
}