/* *** JOIN *** */

h3 {
	font-size: min(4.75vw, 5.2vh);
}

#join_tableName_container {
	border-radius: 50px;
	padding: 2%;
	background: #498991;
	margin: 0 5%;
	font-size: min(3.35vw, 4.2vh);
}

#join_tableName_label,
#join_tableName_input,
#join_tableName_submit {
	font-size: min(4.75vw, 5.2vh);
}

#join_tableName_input {
	width: 40%;
	height: min(5.2vw, 5.2vh);
	background: #b7e4eb;
	padding: 0 2px;
}

#join_tableName_submit {
	width: 10%;
	padding: 0.1% 1%;
	border-radius: 20px;
	box-shadow: 0px 2px #0f608a;
	background: #54a6ec;
	cursor: pointer;
}

#join_widget_publistToggle {
	width: 70%;
	margin: 0 auto;
	font-size: min(3.35vw, 4.2vh);
}

.join_desc {
	margin: 0 2%;
	font-size: min(3.6vw, 3.6vh);
}

#join_publist_container {
	position: relative;
	display: none;
	min-height: 10%;
	border-radius: 50px;
	width: 90%;
	background: #498991;
	padding: 2% 0;
}

#join_publist_listbox {
	width: 95%;
	margin: 1.5% auto;
	font-size: min(3.2vw, 4.2vh);
	max-height: 66vh;
	display: block;
	overflow-y: scroll;
	overflow-x: hidden;
	table-layout: auto;
	border-radius: 0 0 42px 42px;
	-ms-overflow-style: none;  /* IE and Edge */
	scrollbar-width: none;  /* Firefox */
}

#join_publist_listbox::-webkit-scrollbar {  /* Chrome, Safari, and Opera */
	display: none;
}

#join_publist_listbox tbody {
	width: 100%;
	background: unset;
	display: table;
}

img.join_publist_header_icon {
	height: min(2.3vw, 3vh);
}

#join_publist_listbox th {
	position: sticky;
	top: 0; /* required for stickiness */
	background: #498991;
}

#join_publist_listbox tr {
	cursor: pointer;
}

#join_publist_listbox tr:nth-child(even) {background: #b7e4eb}
#join_publist_listbox tr:nth-child(odd) {background: #85c0c9}

#join_publist_listbox td {
	vertical-align: middle;
	height: max(3.8vw, 4.2vh);
	padding: 2px 6px;
}

.join_publist_listbox_tName {
	width: 55%;
	overflow: hidden;
}

.join_publist_listbox_boardShape {
	width: 5%;
}

.join_publist_listbox_boardSize {
	width: 5%;
}

.join_publist_listbox_turnTimeCap {
	width: 5%;
}

.join_publist_listbox_aiCount {
	width: 5%;
}

.join_publist_listbox_pCount {
	width: 10%;
}

.join_publist_listbox_status {
	width: 15%;
	padding-right: 0.2em;
}

#join_publistBgtxtContainer,
#join_savePref_container {
	font-size: min(3.2vw, 4.2vh);
}

#join_savePref_container {
	text-align: right;
	padding-right: 11%;
}

#join_savePref {
	width: 0.8em;
	height: 0.8em;
}

#join_savePref,
#join_savePref_label {
	cursor: pointer;
}
	
#join_publistBgtxtContainer {
	display: none;
}