.roomTabView {
	width: 560px;
	height: 400px;
}

.roomListLayoutCell {
	padding-right: .5em;
	padding-left: .5em;
}

.gameModeSwitcherDdl {
	position: relative;
    top: 10px;
}

.gameModeSwitcherBtn {
	width: 240px;
    height: 32px;
    font-size: 16px;
    line-height: 32px;
    padding-left: 10px;
}

.gameNameTextInput {
	display: inline-block;
	position: relative;
    top: -9px;
}

.gameNameTextInput input{
	width: 180px;
	height: 22px;
}

.nameFilterSearchBtn {
	position: relative;
    top: 10px;
    left: 2px;
}

.nameFilterSearchBtnIcon {
	background-image: url("../imgs/main_ui/icon_search.png");
    background-size: 44px 48px;
}

.roomListWrapper {
	position: relative;
	width: 550px;
}

.roomListWrapper .roomListEmpty {
	position: absolute;
    top: 0;
    left: 0;
    width: 545px;
    height: 295px;
    color: #81814d;
    font-size: 20px;
    text-align: center;
    line-height: 30px;
    display: none;
}

.roomListWrapper .roomListEmpty img {
	width: 90px;
    image-rendering: pixelated;
}

.roomListWrapper .roomListContent {
	width: 100%;
	text-align: center;
}

.roomListWrapper .roomListContent .roomListHeader {
	width: 100%;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    background-color: #140f0e;
    color: #555540;
}

.roomListWrapper .roomListContent .roomListHeader .roomListHeaderField {
	display: inline-block;
	width: 18%;
	position: relative;
}

.roomListWrapper .roomListContent .roomListHeader .roomFieldID {
	width: 10%;
}

.roomListWrapper .roomListContent .roomListHeader .roomFieldMapName {
	width: 25%;
}

.roomListWrapper .roomListContent .roomListHeader .roomFieldMode {
	width: 25%;
}

.roomListWrapper .roomListContent .roomListHeader .roomFieldOperations {
	width: 20%;
}

.roomListWrapper .roomListContent .roomListBody {
	width: 100%;
    height: 295px;
    margin-top: 5px;
    overflow-x: hidden;
    overflow-y: scroll;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow {
	position: relative;
	width: 100%;
	height: 50px;
	line-height: 50px;
	background-color: #1d1a1a;
	margin: 10px 0;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .roomListField {
	display: inline-block;
	vertical-align: text-bottom;
	width: 18%;
	height: 50px;
	font-size: 14px;
	line-height: 50px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow:hover .roomListField {
	background-color: #413727;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .roomFieldID {
	width: 10%;
	color: #c4cb9e;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .roomFieldMapName {
	width: 25%;
	color: #c4cb9e;
	overflow: hidden;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .roomFieldPlayers {
	color: #8c955a;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .roomFieldMode {
	width: 25%;
	overflow: hidden;
	color: #676037;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .roomFieldOperations {
	width: 20%;
	/*background-color: #413727;*/
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .roomListTip {
	position: fixed;
    right: 590px;
    top: 218px;
    z-index: 100001;
	padding: 5px 5px 3px;
    background-clip: padding-box;
    -webkit-border-image: url("../imgs/main_ui/tip_frame.png") 3 3 3 3 repeat;
    -moz-border-image: url("../imgs/main_ui/tip_frame.png") 3 3 3 3 repeat;
    -o-border-image: url("../imgs/main_ui/tip_frame.png") 3 3 3 3 repeat;
    border-image: url("../imgs/main_ui/tip_frame.png") 3 3 3 3 repeat;
    background-color: #251e1a;
    border-style: solid;
    border-width: 6px 6px 6px 6px;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaThumbnail {
	display: block;
	width: 120px;
	height: 175px;
	margin-right: 5px;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaThumbnail {
	width: 100%;
	text-align: center;
	font-size: 14px;
	line-height: 16px;
	margin-top: 4px;
    color: #c4cb9e;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 5px;
}

.mapMetaTitle {
	width: 100%;
	text-align: left;
	font-size: 14px;
	line-height: 16px;
	margin-top: 0px;
	margin-left: 4px;
	color: #c4cb9e;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaThumbnail img {
	width: 110px;
	height: 110px;
	margin: 5px;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaThumbnail .mapMetaSize {
	width: 100%;
	text-align: center;
	position: relative;
    font-size: 14px;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaDesc {
	display: block;
	color: #6d6d4d;
	font-size: 14px;
	line-height: 20px;
	width: 200px;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaDesc .mapMetaPlayers {
	width: 100%;
	text-align: left;
	margin-top: 3px;
}

.mapMetaPlayers {
	width: 100%;
	text-align: left;
	margin-top: 3px;
	margin-left: 4px;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaDesc .mapMetaPlayers span {
	color: #c4cb9e;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaDesc {
	width: 100%;
	text-align: left;
	color: #9ba564;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mapMetaMode {
	width: 100%;
	text-align: left;
	color: #9ba564;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-left: 4px;
	margin-botton: 4px;
}

.roomListWrapper .roomListContent .roomListBody .roomListRow .mapMetaDesc .mapMetaDetail {
	text-align: left;
	border-top: 2px solid #666648;
	margin-top: 2px;
    padding-top: 8px;
}

.mapListWrapper {
	position: relative;
	width: 530px;
	height: 235px;
	background-color: #1e1b1b;
}

.mapListWrapper .mapListLoading {
	width: 100%;
	height: 235px;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

.mapListWrapper .mapListBody {
	width: 100%;
	height: 235px;
	overflow-x: hidden;
	overflow-y: scroll;
}

.mapListWrapper .mapListBody .mapListRow {
	width: 530px;
	margin: 5px
}

.mapListWrapper .mapListBody .mapListRow .mapListCell {
	position: relative;
	display: inline-block;
	width: 170px;
	margin: 0;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode {
	position: relative;
	width: 170px;
	text-align: center;
	font-size: 14px;
	line-height: 14px;
	background-image: url("../imgs/main_ui/frame_map.png");
    background-size: 154px 186px;
    background-position: 6px 6px;
    background-repeat: no-repeat;
    padding-bottom: 5px
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapListTip {
	position: fixed;
    right: 590px;
    top: 218px;
    z-index: 100001;
	padding: 5px 5px 3px;
    background-clip: padding-box;
    -webkit-border-image: url("../imgs/main_ui/tip_frame.png") 3 3 3 3 repeat;
    -moz-border-image: url("../imgs/main_ui/tip_frame.png") 3 3 3 3 repeat;
    -o-border-image: url("../imgs/main_ui/tip_frame.png") 3 3 3 3 repeat;
    border-image: url("../imgs/main_ui/tip_frame.png") 3 3 3 3 repeat;
    background-color: #251e1a;
    border-style: solid;
    border-width: 6px 6px 6px 6px;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapListTip .mapTipWrapper {
	display: block;
	font-size: 14px;
	width: 250px;
	text-align: left;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapListTip .mapTipWrapper .mapMetaDetail {
	color: #6d6d4d;
	width: 100%;
	line-height: 20px;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .selectedNode {
	background-image: url("../imgs/main_ui/frame_map_selected.png");
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode .mapNodeHighlight {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	width: 166px;
	height: 198px;
	background-image: url("../imgs/main_ui/frame_map_selected_fg.png");
	background-repeat: no-repeat;
	background-size: cover;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode .mapTitle {
	width: 120px;
    color: #c4cb9e;
    line-height: 18px;
    padding-top: 15px;
    padding-left: 25px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode .mapThumbail {
	position: relative;
	width: 100%;
	margin: 3px 0;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode .mapThumbail img {
	width: 110px;
	height: 110px;
	image-rendering: pixelated;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode .mapThumbail .mapSize {
	position: absolute;
    left: 0;
    bottom: 8px;
    width: 100%;
    color: #e3f196;
    font-size: 12px;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode .mapCapacity {
	width: 120px;
	color: #6d6d4d;
	text-align: left;
	padding-left: 25px;
	line-height: 18px;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode .mapCapacity span {
	color: #b4ba91;
}

.mapListWrapper .mapListBody .mapListRow .mapListCell .mapNode .mapMode {
	width: 120px;
	color: #9ba564;
	text-align: left;
	padding-left: 25px;
	line-height: 18px;
	padding-bottom: 5px;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.roomCreateLayoutCell {
	padding: 0 .5em;
}

.gameModeSwitcherDdlWrapper {
	position: relative;
    top: 0;
    left: 10px;
}

.roomCreateParamInput {
	position: relative;
	font-size: 16px;
    color: #91915b;
	float: left;
}

.roomCreateParamInput .fieldLabel {
	display: inline-block;
	width: 120px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.roomCreateParamInput .staticNum {
	display: inline-block;
	padding: 6px;
	text-align: center;
	height: 34px;
	width: 80px;
}

.roomCreateParamInput input {
	width: 80px;
	text-align: center;
	color: #a2a258;
}

.roomCreatePrivateCheckbox {
	margin-top: 12px;
	margin-left: 50px;
}

.botNumTextInput {
	display: inline-block;
}

.roundTimeTextInput {
	display: inline-block;
	margin-right: 5px;
}

.roomCreateSubmitButton {
	position: relative;
    top: 38px;
}