html
{
	font-size: 1em;
	height: 100%;
}

body
{
	padding: 0;
	margin: 0;
	background-color: #FFF;
	font-size: 1em;
	color: #333;
	height: 100%;
}

textarea
{
	resize: none;
}

input[type="button"], input[type="submit"], .button.special, .button, input, textarea, select
{
	display: none;
}

input[type="password"], input[type="text"], input[type="number"], select, textarea, input[type="file"]
{
	display: none;
}

.button:hover
{
	display: none;
}

input[type="button"], input[type="submit"], .button.special
{
	display: none;
}

input[type="button"]:hover, input[type="submit"]:hover, .button.special:hover
{
	display: none;
}

a, a:visited
{
	display: none;
}

p
{
	padding: 2% 0;
	margin: 0;
}

h1, h2, h3, h4, h5, h6
{
	margin: 0;
	padding: 0;
	font-weight: normal;
}

h1
{
	font-size: 200%;
}

h2
{
	font-size: 175%;
}

h3
{
	font-size: 120%;
}

/**************
 * ID section *
 **************/

#page
{
	padding: 0;
	min-height: 100%;
	box-sizing: padding-box;
}

#content
{
	min-height: 5px;
	border-radius:0;
	/*border-top-left-radius: 0;*/
	padding: 2%;
	margin: 0 5%;
	margin-bottom: 2%;
	margin-top: 1%;
	box-sizing: padding-box;
	
	/* Experiment */
	border: 0;
}

#topbar
{
	display: none;
}

#topbar a
{
	display: none;
}

#topbar a:hover
{
	display: none;
}

#topbar > .left-box
{
	display: none;
}

#topbar > .right-box
{
	display: none;
}

#title
{
	padding: 1% 0;
	text-align: center;
	width: 100%;
	margin-left: 5%;
	/*color: #EEE;*/
}

.week-event-list
{
	display: table;
	width: 100%;
	table-layout: fixed;
	border: 0;
}

.week-event-list-head
{
	display: table;
	width: 100%;
	table-layout: fixed;
	border: 0;
}

.week-event-list-head > .day
{
	display: table_cell;
	text-align: center;
	font-size: 100%;
	border-bottom: 2px solid #333;
	padding: 0.7% 0;
}

.day:last-child
{
	border-right: 2px solid #333;
}

.day
{
	font-size: 70%;
	border-left: 2px solid #333;
	display: table-cell;
	box-sizing: border-box;
}

.day > div
{
	font-size: 0.75em;
}

.event
{
	display: block;
	padding: 3%;
	margin: 7%;
	border-radius: 5px;
	background-color: #ddd;
	box-sizing: padding-box;
}

.event:hover
{
	background-color: #ccc;
}

.login-box
{
	background-color: #EEE;
	width: 33vmax;
	box-shadow: 0 0 0 4px #EEE, 2px 1px 6px 4px rgba(10, 10, 0, 0.5);
	padding: 2%;
	box-sizing: padding-box;
	border-radius: 10px;
	border: 2px dashed #39F;
	text-shadow: 1px 1px #CCCCCC;
}


.login-box > div
{
	white-space: nowrap;
	margin-bottom: 5%;
}

.login-box > div:last-child
{
	margin-bottom: 0;
	text-align: right;
}

.login-box > div:last-child > input
{
	width: auto;
}

.login-box > div > span
{
	width: 30%;
	display: inline-block;
}

.login-box > div > input
{
	width: 70%;
}

.detail-box > .left-box
{
	width: 0;
}

.detail-box > .left-box img
{
	display: none;
}

.detail-box > .right-box
{
	width: 55.75%;
	max-width: none;
	float: left;
}

.detail-box > .right-box .details
{
	border-bottom: 0.1em solid #333;
	margin-bottom: 2%;
}

.detail-box > .right-box > p
{
	border-bottom: 0.1em solid #333;
	font-size: 70%;
	white-space: pre-wrap;
}

.detail-box > .right-box .details > div
{
	margin-top: 2%;
	font-size: 70%;
}

.detail-box > .right-box .details > div:last-child
{
	margin: 2% 0;
}

.detail-box > .right-box .details > div > span
{
	display: inline-block;
	width: 25%;
}

.add-member-box h3
{
	margin-bottom: 2%;
}

.add-member-box input[type="text"]
{
	margin-right: 2%;
}

.add-member-box > div:last-child
{
	text-align: right;
}

.add-member-box .members > div
{
	margin-bottom: 2%;
}

.add-box > div
{
	margin-bottom: 2%;
}

.add-box > div > span:first-child
{
	display: inline-block;
	width: 20%;
}

.add-box > div > input[type="text"],
.add-box > div > textarea
{
	width: 58%
}

.add-box > div > textarea
{
	height: 5.3em;
}

.add-box input[type="number"],
.add-box > .date > select
{
	width: 10%;
	margin-right: 2%;
}

.add-box input[name="cent"], .add-box input[name="startHour"], .add-box input[name="startMin"], .add-box input[name="endHour"], .add-box input[name="endMin"], .add-box input[name="endDay"], .add-box input[name="startDay"]
{
	width: 3em;
}

.add-box > div:last-child
{
	margin-bottom: 0;
	text-align: right;
}

.add-box > div:nth-child(2) > span
{
	vertical-align: top;
}

.reg-box > div > span
{
	display: inline-block;
	width: 32%;
	margin: 1%;
	text-align: right;
}

.reg-box > div > input, .reg-box > div > select
{
	margin-right: 1%;
	width: calc(30% + 4em);
}

.reg-box > div > .smallinp
{
	margin-right: 1%;
	width: 29%;
}

.reg-box > div > input[type="submit"]
{
	margin-left: 18%;
	width: 15%;
}

.tlight
{
	border-radius: 1vh;
	height: 2vh !important;
	width: 2vh !important;
	display: inline-block;
}

.tlight.red
{
	background-color: #ff0000;
}

.tlight.green
{
	background-color: #00ff00;
}

.tlight.yellow
{
	background-color: #ffff00;
}

.error
{
	border: 2px solid #a20000;
	background-color: #d13131;
	padding: 0 2%;
	border-radius: 10px;
	text-shadow: 1px 1px #a20000;
	color: #333;
	margin-bottom: 2%;
	word-wrap: break-word;
	white-space: normal !important;
	overflow: hidden;
	text-shadow: none;
}

.info
{
	border: 2px solid #39F;
	background-color: #69adf0;
	padding: 0 2%;
	border-radius: 10px;
	text-shadow: 1px 1px #39F;
	color: #111;
	margin-bottom: 2%;
	word-wrap: break-word;
	overflow: hidden;
	white-space: normal !important;
}

.event-list > div
{
	padding: 2%;
	border-bottom: 2px solid #333;
}

.event-list > div:last-child
{
	border-bottom: 0;
}

.event-list > div > .left-box
{
	max-width: 70%;
}

.event-list > div > .right-box > .buttons
{
	text-align: right;
}

.date
{
	margin-bottom: 2%;
}

.date > *
{
	margin-right: 2%;
}

/******************
 * helper classes *
 ******************/
 
 .button
 {
	
 }

.left-box
{
	height: 100%;
	max-width: 50%;
	float: left;
}

.right-box
{
	height: 100%;
	max-width: 50%;
	float: right;
}

.clear:after
{
	content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.vcenter
{
	text-align: center;
	height: 100%;
}

.vcenter:before
{
	content: '';
	display: inline-block;
	height: 15%;
	vertical-align: middle;
	margin-right: -0.25em;
}

.hide
{
	display: none;
}

.vcenter > *
{
	display: inline-block;
	text-align: initial;
	vertical-align: middle;
}