/* CSS Document */
.in-header {
	padding: 7px 20px;
}

.small-world-logo,
.comp-logo {
	height: 36px;
	cursor: pointer;
}

img.comp-img {
	height: 36px;
	display: block;
}

.logoTxt {
	padding: 0 0 0 15px;
	cursor: pointer;
	line-height: 18px;
	font-style: italic;
}

.h1s {
	font-weight: 700;
	font-size: 20px;
}

.h2s {
	font-size: 13px;
	white-space: nowrap;
	color: var(--yellorg);
}

.right-sider .logoTxt {
	font-style: normal;
}

.tp-gut {
	width: 5px;
}

.user-profile {
	padding: 0 15px 0 0;
	text-align: right;
	flex-direction: row-reverse;
}

.top-det {
	margin: auto;
	line-height: 32px;
}

.left-panel {
	position: absolute;
	transition: .2s all;
	z-index: 3;
	width: 544px;
	height: 50px;
	left: 0;
	top: 0px;
	margin: auto;
	right: 0;
	line-height: 50px;
}

.menu-btn {
	width: 183px;
	cursor: pointer;
	display: flex;
	color: #fff;
}

/* ------------------------------------------------------------------- left panel css START */
.left-panel[data-id="0"] {
	width: 60px;
}

.left-panel-flex {
	flex-direction: column;
	height: 100%;
}

.col-exp {
	width: 23px;
	height: 23px;
	position: absolute;
	right: 10px;
	top: 10px;
	cursor: pointer;
	background-image: url(../images/collapse.svg);
	transform: rotate(90deg);
}

.left-menu-area {
	width: 100%;
	margin: auto;
	text-align: center;
	display: flex;
}

.menu-icon {
	width: 20px;
	height: 50px;
	background-image: url(../images/mainmap_icon.svg);
	background-repeat: no-repeat;
	background-position: center;
	margin-right: 10px;
	background-size: 20px;
}

.menu-btn[data-id="2"] .menu-icon {
	background-image: url(../images/leaderboard_icon.svg);
	background-size: 17px;
}

.menu-btn[data-id="3"] .menu-icon {
	background-image: url(../images/race_icon.svg);
}

.menu-btn[data-id="4"] .menu-icon {
	background-image: url(../images/about_icon.svg);
	background-size: 17px;
}

.menu-btn[data-id="1"].activelike .menu-icon,
.menu-btn[data-id="1"]:hover .menu-icon {
	background-image: url(../images/mainmap_icon1.svg);
}

.menu-btn[data-id="2"].activelike .menu-icon,
.menu-btn[data-id="2"]:hover .menu-icon {
	background-image: url(../images/leaderboard_icon1.svg);
}

.menu-btn[data-id="3"].activelike .menu-icon,
.menu-btn[data-id="3"]:hover .menu-icon {
	background-image: url(../images/race_icon1.svg);
}

.menu-btn[data-id="4"].activelike .menu-icon,
.menu-btn[data-id="4"]:hover .menu-icon {
	background-image: url(../images/about_icon1.svg);
}

.menu-btn.activelike .menu-text,
.menu-btn:hover .menu-text {
	color: var(--yellorg);
}

.left-panel[data-id="0"] .menu-text {
	display: none;
}

.left-panel[data-id="0"] .menu-icon {
	width: 20px;
	height: 20px;
}

.left-panel[data-id="0"] .menu-btn {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	margin: 0 auto 35px;
	padding: 9px;
}

/* ------------------------------------------------------------------- left panel css END */