/* Membership */

table.membership {
	margin: 0px auto 1em auto;
	border-spacing: 0;
	width: auto;
	border: 1px solid #6F6F6F;
	background-color: #ffffff;
}

table.membership th, table.membership td {
	padding: 0.5em 1em;
	margin: 0;
}

table.membership td {
	border: 1px solid #6F6F6F;
}

table.membership td.disabled {
	background-color: #f0eef9;
}

table.membership td input[type="radio"] + label.check {
	margin-right: 0.5em;
}

table.membership th.attendance {
	text-align: right;
}

div.choosecol {
	display: none;
	margin-bottom: 1em;
}

div.choosecol div {
	margin-bottom: 0.2em;
}

div.choosecol label.forcheck {
	margin-right: 0px;
}

div.prepaid {
	text-align: right;
	margin-top: 1em;
}

a.editbutton {
	float: right;
	margin-bottom: 1em;
	max-width: 40%;
}


span.current, div.current {
	border: 2px solid #f472cc;
	padding: 0.2em 0.5em;
	margin: 0.2em auto;
}

option.current {
	background-color: #f472cc;
	color: #ffffff;
}

a.remove {
	display: inline-block;
	vertical-align: top;
	font-weight: bold;
	color: #aa6666;
	border: 1px solid #aa6666;
	height: 1em;
	width: 1em;
	text-align: center;
	line-height: 1em;
	font-size: 70%;
}

@media only screen and (max-width: 800px)  {
	tr, th, td {
		position: static;
	}

	th, td {
		display: table-cell;
		padding: 0.5em;
	}

	td:before {
		width: 0px;
	}
}


@media only screen and (max-width: 600px)  {
	div.choosecol {
		display: block;
	}

	td, th {
		display: none;
	}

	th.attendance {
		display: table-cell;
	}

	div.prepaid {
		margin-right: 0px;
	}

	div.prepaid input {
		margin-top: 0.5em;
	}
}

@media only screen and (max-width: 400px)  {
	a.editbutton {
		width: 100%;
		max-width: 100%;
	}
}

.acc ul {
	display: inline-block;
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
	width: 100%;
}

.acc li label.forcheck {
	display: inline-block;
	margin: 0.5em 0px;
}

button.finish  {
	font-size: 120%;
}

/* confirm popup */

div.popupouter {
	display: none;
	position: fixed;
	z-index: 99;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
	background-color: rgba(128,128,128,0.5);
	overflow: auto;
}

div.popup {
	display: block;
	box-sizing: border-box;
	width: 36em;
	border: 1px solid #6747aa;
	-moz-border-radius: 1em;
	border-radius: 1em;
	padding: 2em;
	background-color: #ffffff;
	max-width: 100%;
	margin: 10% auto;
}

div.popup h2 {
	margin: 0px 0px 1em 0px;
}

@media only screen and (max-width: 600px)  {
	div.popup {
		padding: 1em;
		width: 99%;
	}
}