@CHARSET "UTF-8";

body
{
	background: darkgray;
	margin-top: 1em;
}

#tasks-inner button
{
	font-size: 90%
}


#toolbar {
	padding: 0;
	background: black;
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.5);
	padding: 0.2em;
	width: 100%;
	z-index: 10;
	display: table;
	font-size: 120%;
	box-sizing: border-box;
	position: fixed;
}

#toolbar div#menu,
#toolbar div#userinfo
{
	display: table-cell;
}

#toolbar div#userinfo
{
	color: white;
	padding:0.2em;
	text-align:right;
}

#toolbar a {
	padding: 2px;
	padding-left: 0.5em;
	padding-right: 0.5em;
	margin: 3px;
	color: white;
	text-decoration: none;
	border-radius: 0.2em;
}

#toolbar a:hover {
	background: green;
	color: white;
	background: linear-gradient(to top, #00AA00, #00FF00) repeat scroll 0 0 rgba(0, 0, 0, 0);
}

#toolbar a:active {
	color: green;
}

#toolbar a.selected
{
	background: green;
	color: white;
	background: linear-gradient(to top, #007700, #00ee00) repeat scroll 0 0 rgba(0, 0, 0, 0);
}


#content {
	vertical-align: top;
	margin-top: 2em;
	padding : 1em;
	padding-left: 2em;
	display: inline-block;
	padding: 1em
}

#infoBox {
	position: absolute;
	background: green;
	color: white;
	right: 1em;
	top: 1em;
	padding: 0.5em;
	padding-left: 1em;
	padding-right: 1em;
	text-align: Right;
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.5);
	border-radius: 0.5em;
}

#userInfo {
	float: right;
}



#browser-warning,
.dialog,
#dialog
{
	background-color: white;
	border: medium ridge;
	border-radius: 9px; padding : 1em; position : fixed;
	position: fixed;
	padding: 1em;
}
#browser-warning,
#dialog
{
	display: none;
}
#browser-warning
{
	display: block;
	top: 50%;
	left: 50%;
	margin-left: -10em;
	margin-top: -4em;
}

.browserOverlay,
#shadyOverlay {
	opacity: 0.50;
	background-color: black; cursor : pointer;
	height: 100%;
	display: none;
	position: fixed;
	width: 100%;
	cursor: pointer;
}

.browserOverlay
{
	display: block;
}


body.showDialog #shadyOverlay {
	display: block;
}

/********/
html,body {
	height: 100%;
	padding: 0;
	margin: 0;
}

img { border: none; }

div.mainFrame
{
	background: white;
	padding: 1em;
	min-width: 16em;
	border-radius: 0.5em;
	border-top-left-radius: 0;
}

#mainPage div.mainFrame
{
	border-radius: 0.5em;
}

div.mainFrame h2,
div.mainFrame h3
{
	margin: 0 ;
	padding-top: 0.3em;
	padding-bottom: 0.1em;
}

div.container
{
	display: inline-block;
	vertical-align: top;
	margin-left: 0.5em;
	margin-right: 0.5em;
}

div#timeit-webui,
#tasks-inner table,
#tasks-inner table td.name,
#times .summary table,
#times .summary table td.name,
#content
{
	width: 100%;
	box-sizing: border-box;
}

div#tasks,
div#times
{
	min-width: 46%;
	box-sizing: border-box;
	display: table-cell;
}
div#timeit-webui
{
	display: table;
	border-spacing: 10px;
}

div.data
{
	border: solid 1px black;
	border-radius: 0.5em;
	min-height: 15em;
	background: white;
	padding: 0.5em;
}


.table
{
	display: table;
}
.row
{
	display: table-row;
}
.cell
{
	display: table-cell;
}
.summary
{
	min-height: 1em;
}

div.toolbar
{
	display: table-row;
}
div.toolbar span
{
	display: table-cell;
}

div.tabs
{
	display: table-row;
}

div.tabs h1,
div.tabs h2,
div.tabs h3
{
	margin: 0.3em 0.2em 0.2em;
}

div.tabs a,
div.tab
{
	display: table-cell;
}

div.tab
{
	padding-left: 0.8em;
	padding-right: 0.8em;
	background-color: transparent;
	border: 1px solid darkgray;
	border-bottom: none;
	border-top-left-radius: 0.5em;
	border-top-right-radius: 0.5em;
	background: lightgray;
	z-index: 0;
}

div.tab.selected
{
	background-color: white;
	z-index: 1;
}

#userlist td.username
{
	min-width: 15em;
}

div#message
{
	border: groove 2px black;
	border-radius: 0.3em;
	padding: 1em;
	box-shadow: 2px 2px 7px rgba(0, 0, 0, 0.5);
	background-color: lightgreen;
}


@media all and (max-width: 600px)
{
	#content
	{
		padding: 0;
	}

}
@media all and (min-resolution:130dpi) and (max-width:1000px),
@media all and (min-resolution:200dpi) and (max-width:2000px)
{
button
{
	font-size: 120%;
}

body
{
	font-size: 250%;
}

#content
{
	padding: 0;
}

div#timeit-webui,
div#tasks,
div#times
{
	min-width: 98%;
	display: block;
}
}


