h6._title {
	font-size:24px; font-family:'Poppins'; text-align:center; margin-bottom:25px;
}

div[data-layer='account'] {
	display:-webkit-flex; justify-content:space-between; column-gap:30px; row-gap:30px; width:100%; box-sizing:border-box;
}
div[data-layer='account'] ._left {
	width:30%; box-sizing:border-box; flex-shrink:0;
}
div[data-layer='account'] ._right {
	width:100%; box-sizing:border-box;
}

div[data-layer='account'] .box {
	border:1px solid #DEDEDE; border-radius:6px; padding:30px 0; background:white; box-shadow:0 2px 5px rgba(0,0,0,.2); margin-bottom:18px;
}
div[data-layer='account'] .box .img {
	width:140px; height:140px; box-sizing:border-box; margin:0 auto 40px; background:#DEDEDE; box-shadow:0 2px 5px #DEDEDE; border-radius:50%; overflow:hidden;
}
div[data-layer='account'] .box .content {
	width:85%; box-sizing:border-box; margin:0 auto;
}
div[data-layer='account'] .box .content .items {
	display:-webkit-flex; justify-content:space-between; column-gap:10px; margin-bottom:12px;
}
div[data-layer='account'] .box:last-child,
div[data-layer='account'] .box .content .items:last-child {
	margin:0;
}
div[data-layer='account'] .box .content .items p {
	font-size:12px; font-family:'Poppins','sans-serif';
}
div[data-layer='account'] .box .content .items p:nth-child(1) {
	width:100px; box-sizing:border-box; flex-shrink:0; color:#C0C0C0; position:relative; font-weight:normal;
}
div[data-layer='account'] .box .content .items p:nth-child(1):before {
	content:':'; position:absolute; right:0;
}
div[data-layer='account'] .box .content .items p:nth-child(2) {
	width:100%; box-sizing:border-box; color:black;
}

div[data-layer='account'] .box h6 {
	font-size:15px; font-family:'Poppins'; color:black;
}
div[data-layer='account'] .box .content .items._roles p {
	color:black;
}
div[data-layer='account'] .box .content .items._roles p:before {
	content:' ';
}
div[data-layer='account'] .box .content .items._password p:nth-child(2) {
	cursor:pointer; color:#0055FF; text-decoration:underline;
}
div[data-layer='account'] .box .button {
	background:var(--button-color); color:black; width:140px; margin:20px auto 0; border-radius:6px; text-align:center; padding:6px 13px; box-sizing:border-box; cursor:pointer; font-family:'Poppins','sans-serif'; font-size:13px; border:1px solid transparent; transition:.4s;
}
div[data-layer='account'] .box .button:hover {
	background:white; border-color:black; transition:.4s;
}
@media (min-width:360px) and (max-width:960px) {
	div[data-layer='account'] {
		flex-direction:column;
	}
	div[data-layer='account'] ._right,
	div[data-layer='account'] ._left {
		width:100%;
	}
	div[data-layer='account'] .box .content .items {
		flex-direction:column;
	}
	div[data-layer='account'] .box .content .items._password {
		flex-direction:row;
	}
	div[data-layer='account'] .box .content .items p:before {
		content:' ' !important;
	}
	div[data-layer='account'] .box .content .items._password p:nth-child(1):before {
		content:':' !important;
	}
}


/*Topup Request*/
div[data-layer='myhistory'] ._full {
	width:100%; box-sizing:border-box; 
}
div[data-layer='myhistory'] .box:not(:first-child) {
	min-height:500px;
}
div[data-layer='myhistory'] .box {
	border:1px solid #DEDEDE; border-radius:6px; background:white; box-shadow:0 2px 5px rgba(0,0,0,.2); margin-bottom:18px; position:relative; 
}
div[data-layer='myhistory'] ._full .box .content {
	width:100%; box-sizing:border-box; margin:0 auto;
}
div[data-layer='myhistory'] ._full:first-child > .box {
	width:fit-content;
}
div[data-layer='myhistory'] ._full .box .content._status {
	display:-webkit-flex; align-items:center; padding:10px 0;
}
div[data-layer='myhistory'] ._full .box .content._status ._items div {
	width:fit-content; box-sizing:border-box; transition:.5s; border-bottom:2px solid transparent; margin:0 auto;
}
div[data-layer='myhistory'] ._full .box .content._status ._items.active div {
	border-bottom-color:var(--button-color); transition:.5s;
}
div[data-layer='myhistory'] ._full .box .content._status ._items {
	width:120px; box-sizing:border-box; border-right:1px solid #C2C2C2; text-align:center; font-size:13px; font-family:'Poppins'; cursor:pointer;
}
div[data-layer='myhistory'] ._full .box .content._status ._items:last-child {
	border-right:0;
}
div[data-layer='myhistory'] .box ul._wrapper_items,
div[data-layer='myhistory'] .box ul._header {
	display:-webkit-flex; align-items:center; padding:12px 0; border-bottom:1px solid #DEDEDE; font-size:13px; font-family:'Poppins'; color:black; justify-content:space-between;
}
div[data-layer='myhistory'] .box ul._wrapper_items {
	font-size:15px; padding:15px 0; width:100%; box-sizing:border-box;
}
div[data-layer='myhistory'] .box ul li {
	width:100%; box-sizing:border-box; flex-shrink:0; text-align:center;
}
div[data-layer='myhistory'] .box ul li.items:nth-child(1),
div[data-layer='myhistory'] .box ul li.items:nth-child(2) {
	max-width:200px; 
}
div[data-layer='myhistory'] .box ul li.items:nth-child(3),
div[data-layer='myhistory'] .box ul li.items:nth-child(4) {
	max-width:140px;
}
div[data-layer='myhistory'] .box ul li.items:nth-child(5) {
	max-width:150px;
}
div[data-layer='myhistory'] ._full .box .content[data-table='_body'] {
	min-height:500px;
}
div[data-layer='myhistory'] .box .content ._pag_list {
	display:-webkit-flex; align-items:center; width:100%; box-sizing:border-box; justify-content:center; padding-top:20px; position:relative; bottom:20px; left:0; right:0;
}
div[data-layer='myhistory'] .box .content ._pag_list ._pag {
	display:grid; place-items:center; width:30px; height:30px; box-sizing:border-box; transition:.4s; cursor:pointer;  font-size:15px; font-family:'Poppins'; pointer-events:none; color:#C2C2C2;
}
div[data-layer='myhistory'] .box .content ._pag_list ._pag.active {
	pointer-events:auto; color:black;
}
div[data-layer='myhistory'] .box .content ._pag_list ._pag_jump {
	display:grid; place-items:center; width:30px; height:30px; box-sizing:border-box; transition:.4s; font-size:15px; font-family:'Poppins';
}
@media (min-width:360px) and (max-width:960px) {
	div[data-layer='myhistory'] .box .content.header {
		display:none;
	}
	div[data-layer='myhistory'] ._full:not(:first-child) .box {
		background:transparent; box-shadow:none; border:0px;
	}
	div[data-layer='myhistory'] .box .content.body {
		display:-webkit-flex; column-gap:10px; row-gap:10px; flex-wrap:wrap;
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items {
		max-width:300px; border:1px solid #DEDEDE; border-radius:6px; background:white; box-shadow:0 2px 5px rgba(0,0,0,.2); flex-direction:column; align-items:flex-start; padding:20px;
	}
	div[data-layer='myhistory'] ._full .box .content._status {
		max-width:300px; overflow-x:auto;
	}
	div[data-layer='myhistory'] .box .content ._pag_list {
		position:relative; margin-top:10px;
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items .items {
		margin-bottom:8px; text-align:left; font-size:13px;
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items .items:last-child {
		margin:0;
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items .items:before {
		color:#C0C0C0; font-size:10px;
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items .items:nth-child(1):before {
		content:'Request ID:';
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items .items:nth-child(2):before {
		content:'Date:';
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items .items:nth-child(3):before {
		content:'Amount:';
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items .items:nth-child(4):before {
		content:'Upgrade To:';
	}
	div[data-layer='myhistory'] .box .content.body ._wrapper_items .items:nth-child(5):before {
		content:'Status:';
	}
}


/*Topup*/
div[data-layer='topup'] {
	width:100%; box-sizing:border-box; display:-webkit-flex;
}
div[data-layer='topup'] ._normal {
	width:100%; box-sizing:border-box; max-width:550px;
}
div[data-layer='topup'] .box {
	border:1px solid #DEDEDE; border-radius:6px; padding:15px 0; background:white; box-shadow:0 2px 5px rgba(0,0,0,.2); margin-bottom:18px;
}
div[data-layer='topup'] .box .content {
	width:95%; box-sizing:border-box; margin:0 auto;
}
div[data-layer='topup'] .box .content .myLeaderLine {
	border-bottom:1px solid #DEDEDE; padding-bottom:3px;
}
div[data-layer='topup'] .box .content ._current.myLeader p {
	font-size:18px; color:black;
}
div[data-layer='topup'] .box .content ._current.myLeader span {
	font-size:13px; font-family:'Poppins'; color:rgba(0,0,0,.5); margin-left:3px; margin-bottom:6px;
}
div[data-layer='topup'] .box .content .items p {
	font-size:12px; font-family:'Poppins','sans-serif'; margin-bottom:7px; margin-left:3px; line-height:1; color:rgb(80,80,80);
}
div[data-layer='topup'] .button {
	background:var(--button-color); color:black; width:140px; margin:20px auto 0; border-radius:6px; text-align:center; padding:6px 13px; box-sizing:border-box; cursor:pointer; font-family:'Poppins','sans-serif'; font-size:13px; border:1px solid transparent; transition:.4s;
}
div[data-layer='topup'] .button:hover {
	background:white; border-color:black; transition:.4s;
}
div[data-layer='topup'] .box .content .items .selection ._current, 
div[data-layer='topup'] .box .content .items .selection ._upable, 
div[data-layer='topup'] .box .content .items .selection ._upgrade {
	display:-webkit-flex; align-items:center; column-gap:8px;
}
div[data-layer='topup'] .box .content .items .selection ._upgrade {
	max-height:0; transition:0.5s; overflow:hidden;
}
div[data-layer='topup'] .box .content .items .selection ._upgrade.active {
	max-height:300px; transition:0.5s;
}
div[data-layer='topup'] .box .content .items .selection ._upgrade ._cols > div {
	 font-family:'Poppins'; font-size:13px; color:#C0C0C0;
}
div[data-layer='topup'] .box .content .items .selection ._current {
	margin-bottom:20px;
}
div[data-layer='topup'] .box .content .items .selection ._upable {
	border-top:1px solid black; padding:10px 0;
}
div[data-layer='topup'] .box .content .items .selection ._upable > input {
	width:13px; height:13px; flex-shrink:0; cursor:pointer;
}
div[data-layer='topup'] .box .content .items .selection ._upable > label {
	cursor:pointer; font-family:'Poppins'; font-size:13px;
}

div[data-layer='topup'] .box .content .items .selection .button {
	margin:0; color:black !important;
}
div[data-layer='topup'] .box .content .items .selection ._select {
	background:white; border:1px solid black;
}
div[data-layer='topup'] .box .content .items .selection ._select.active {
	background:var(--button-color);
}
div[data-layer='topup'] .panel-image .single-img .blank {
	overflow:hidden; width:110px; height:110px; box-sizing:border-box;
}
@media (min-width:360px) and (max-width:960px) {
	div[data-layer='topup'] .box .content .items .selection .button {
		margin:8px auto 0; width:100%; max-width:240px;
	}
	div[data-layer='topup'] .box .content .items .selection ._upgrade ._cols {
		margin-bottom:8px; width:100%; max-width:240px;
	}
	div[data-layer='topup'] .box .content .items .selection ._current, 
	div[data-layer='topup'] .box .content .items .selection ._upgrade {
		flex-direction:column;
	}
	div[data-layer='topup'] .box .content .items .selection ._upgrade .button {
		margin-top:0;
	}
}


/*Edit Modal*/
div.edit-modal {
	position:fixed; width:100%; box-sizing:border-box; top:0; bottom:0; left:0; right:0; background:rgba(0,0,0,.2); z-index:9999; height:100vh; display:grid; place-items:center; overflow:hidden; transition:.4s; opacity:0; pointer-events:none;
}
div.edit-modal.active {
	opacity:1; pointer-events:auto; transition:.4s;
}
div.edit-modal .box {
	width:100%; box-sizing:border-box; max-width:400px; background:white; border-radius:11px;  box-shadow:0 2px 5px rgba(0,0,0,.2); overflow:hidden;
}
div.edit-modal .box .panel-image .single-img .blank {
	width:110px; height:110px; overflow:hidden; box-sizing:border-box;
}
div.edit-modal .box .title {
	width:100%; box-sizing:border-box; padding:8px 30px; font-family:'Poppins'; font-size:21px; background:#F3F3F3;
}
div.edit-modal[data-layer='edit-address'] .box {
	max-width:540px;
}
div.edit-modal .box .content {
	margin-bottom:20px; padding:30px 30px 0;
}
div.edit-modal .box .content .panel-input {
	margin-bottom:12px;
}
div.edit-modal .box .button {
	background:var(--button-color); color:black; width:140px; margin:20px auto 0; border-radius:6px; text-align:center; padding:6px 13px; box-sizing:border-box; cursor:pointer; font-family:'Poppins','sans-serif'; font-size:13px; border:1px solid transparent; transition:.4s; margin-bottom:30px;
}
div.edit-modal .box .button:hover {
	background:white; border-color:black; transition:.4s;
}