.ui-tables table td { font-size:12pt; }
	.INPUT_FORM td{ height:30px; }
	.button_small { height:28px; font-size:9pt; line-height:14px; }
	.txt_small { font-size:8pt; }
	.input { height:22px; border:1px solid #8a8a8a; background-color:#3f5655; border-radius:5px; color:#ffffff;}
	.click_txt { font-weight:bold; cursor:pointer;	}

	.color-red { color : #ff7373; }
	.color-blue { color : #86c9df; }
	.deleted { text-decoration: line-through; }

	.white-popup-block th { color:#fff; }
	.white-popup-block td { color:#fff; }
	.white-popup-block h5 { color:#fff; }

	.white-popup-block {
		background:url(../images/Dark_background_1920x1080.png);
		padding: 20px 30px;
		text-align: left;
		max-width: 750px;
		margin: 40px auto;
		position: relative;
	}

	.mfp-close-btn-in .mfp-close {
		color: #333;
	}
	button.mfp-arrow, button.mfp-close {
		overflow: visible;
		cursor: pointer;
		background: 0 0;
		border: 0;
		-webkit-appearance: none;
		display: block;
		outline: 0;
		padding: 0;
		z-index: 1046;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	.mfp-close {
		width: 44px;
		height: 44px;
		line-height: 44px;
		position: absolute;
		right: 0;
		top: 0;
		text-decoration: none;
		text-align: center;
		opacity: .65;
		filter: alpha(opacity=65);
		padding: 0 0 18px 10px;
		color: #FFF;
		font-style: normal;
		font-size: 28px;
		font-family: Arial,Baskerville,monospace;
	}

	.mfp-arrow, .mfp-close, .mfp-counter, .mfp-preloader {
		-webkit-user-select: none;
		-moz-user-select: none;
		user-select: none;
	}

.mdl-data-table__cell--non-numeric	.center { text-align:center; }
.userid { font-weight:bold; color: #3399ff; cursor:pointer;}
.favo_member { background-color:rgba(255,0,0,0.5); }
.nickname { font-weight:bold; color: #ff6600; cursor:pointer;}
.charge_history , .exchange_history { font-weight:bold; color: #33cc00; cursor:pointer;}


*, *::after, *::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

html * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-size: 1.6rem;
  font-family: "PT Sans", sans-serif;
  color: #2E4057;
  background-color: #ffffff;
}

a {
  /*color: #2E4057;*/
  text-decoration: none;
}

section {
  /* used just to separate paginations */
  border-bottom: 1px solid #e6e6e6;
}
section h2 {
  width: 90%;
  margin: 2em auto 0;
  color: #7d98ba;
  font-weight: 700;
  text-align: center;
}
@media only screen and (min-width: 1170px) {
  section h2 {
    margin: 4em auto 0;
  }
}

/* -------------------------------- 

Basic style

-------------------------------- */
nav[role="navigation"] {
  text-align: center;
}

.cd-pagination {
  width: 90%;
  max-width: 768px;
  margin: 2em auto 4em;
  text-align: center;
}
.cd-pagination li {
  /* hide numbers on small devices */
  display: none;
  margin: 0 .2em;
}
.cd-pagination li.button {
  /* make sure prev next buttons are visible */
  display: inline-block;
}
.cd-pagination a, .cd-pagination span {
  display: inline-block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* use padding and font-size to change buttons size */
  padding: .6em .8em;
  font-size: 1.6rem;
}
.cd-pagination a {
  border: 1px solid #e6e6e6;
  border-radius: 0.25em;
}
.no-touch .cd-pagination a:hover {
  background-color: #f2f2f2;
}
.cd-pagination a:active {
  /* click effect */
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  -o-transform: scale(0.9);
  transform: scale(0.9);
}
.cd-pagination a.disabled {
  /* button disabled */
  color: rgba(46, 64, 87, 0.4);
  pointer-events: none;
}
.cd-pagination a.disabled::before, .cd-pagination a.disabled::after {
  opacity: .4;
}
.cd-pagination .button:first-of-type a::before {
  content: '\00ab  ';
}
.cd-pagination .button:last-of-type a::after {
  content: ' \00bb';
}
.cd-pagination .current {
  /* selected number */
  background-color: #64a281;
  border-color: #64a281;
  color: #ffffff;
  pointer-events: none;
}
@media only screen and (min-width: 768px) {
  .cd-pagination li {
    display: inline-block;
  }
}
@media only screen and (min-width: 1170px) {
  .cd-pagination {
    margin: 4em auto 8em;
  }
}

/* -------------------------------- 

No space - remove distance between list items

-------------------------------- */
.cd-pagination.no-space {
  width: auto;
  max-width: none;
  display: inline-block;
  border-radius: 0.25em;
  border: 1px solid #e6e6e6;
}
.cd-pagination.no-space:after {
  content: "";
  display: table;
  clear: both;
}
.cd-pagination.no-space li {
  margin: 0;
  float: left;
  border-right: 1px solid #e6e6e6;
}
.cd-pagination.no-space li:last-of-type {
  border-right: none;
}
.cd-pagination.no-space a, .cd-pagination.no-space span {
  float: left;
  border-radius: 0;
  padding: .8em 1em;
  border: none;
}
.cd-pagination.no-space li:first-of-type a {
  border-radius: 0.25em 0 0 0.25em;
}
.cd-pagination.no-space li:last-of-type a {
  border-radius: 0 0.25em 0.25em 0;
}

/* -------------------------------- 

move buttons - move prev and next buttons to the sides

-------------------------------- */
.cd-pagination.move-buttons:after {
  content: "";
  display: table;
  clear: both;
}
.cd-pagination.move-buttons .button:first-of-type {
  float: left;
}
.cd-pagination.move-buttons .button:last-of-type {
  float: right;
}

.cd-pagination.no-space.move-buttons {
  width: 90%;
  max-width: 768px;
  display: block;
  overflow: hidden;
}
.cd-pagination.no-space.move-buttons li {
  float: none;
  border: none;
}
.cd-pagination.no-space.move-buttons a, .cd-pagination.no-space.move-buttons span {
  float: none;
}

/* -------------------------------- 

custom icons - customize the small arrow inside the next and prev buttons 

-------------------------------- */
.cd-pagination.custom-icons .button a {
  position: relative;
}
.cd-pagination.custom-icons .button:first-of-type a {
  padding-left: 2.4em;
}
.cd-pagination.custom-icons .button:last-of-type a {
  padding-right: 2.4em;
}
.cd-pagination.custom-icons .button:first-of-type a::before,
.cd-pagination.custom-icons .button:last-of-type a::after {
  content: '';
  position: absolute;
  display: inline-block;
  /* set size for custom icons */
  width: 16px;
  height: 16px;
  top: 50%;
  /* set margin-top = icon height/2 */
  margin-top: -8px;
  background: transparent url("../img/cd-icon-arrow-1.svg") no-repeat center center;
}
.cd-pagination.custom-icons .button:first-of-type a::before {
  left: .8em;
}
.cd-pagination.custom-icons .button:last-of-type a::after {
  right: .8em;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

/* -------------------------------- 

custom buttons - replace prev and next buttons text with a custom icon 

-------------------------------- */
.cd-pagination.custom-buttons a, .cd-pagination.custom-buttons span {
  vertical-align: middle;
}
.cd-pagination.custom-buttons .button a {
  /* set custom width */
  width: 40px;
  /* image replacement */
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
  color: transparent;
  background-image: url("../img/cd-icon-arrow-2.svg");
  background-repeat: no-repeat;
  background-position: center center;
}
.cd-pagination.custom-buttons .button:last-of-type a {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.no-touch .cd-pagination.custom-buttons .button:last-of-type a:active {
  -webkit-transform: scale(0.9) rotate(180deg);
  -moz-transform: scale(0.9) rotate(180deg);
  -ms-transform: scale(0.9) rotate(180deg);
  -o-transform: scale(0.9) rotate(180deg);
  transform: scale(0.9) rotate(180deg);
}

.cd-pagination.no-space.custom-buttons .button:last-of-type a {
  border-radius: 0.25em 0 0 0.25em;
}

/* -------------------------------- 

animated buttons - animate the text inside prev and next buttons 

-------------------------------- */
.cd-pagination.animated-buttons a, .cd-pagination.animated-buttons span {
  padding: 0 1.4em;
  height: 50px;
  line-height: 50px;
  overflow: hidden;
}
.cd-pagination.animated-buttons .button a {
  position: relative;
  padding: 0 2em;
}
.cd-pagination.animated-buttons .button:first-of-type a::before,
.cd-pagination.animated-buttons .button:last-of-type a::after {
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  right: auto;
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}
.cd-pagination.animated-buttons .button:last-of-type a::after {
  -webkit-transform: translateX(-50%) rotate(180deg);
  -moz-transform: translateX(-50%) rotate(180deg);
  -ms-transform: translateX(-50%) rotate(180deg);
  -o-transform: translateX(-50%) rotate(180deg);
  transform: translateX(-50%) rotate(180deg);
}
.cd-pagination.animated-buttons i {
  display: block;
  height: 100%;
  -webkit-transform: translateY(100%);
  -moz-transform: translateY(100%);
  -ms-transform: translateY(100%);
  -o-transform: translateY(100%);
  transform: translateY(100%);
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}

.no-touch .cd-pagination.animated-buttons .button a:hover i {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}

.no-touch .cd-pagination.animated-buttons .button:first-of-type a:hover::before {
  -webkit-transform: translateX(-50%) translateY(-50px);
  -moz-transform: translateX(-50%) translateY(-50px);
  -ms-transform: translateX(-50%) translateY(-50px);
  -o-transform: translateX(-50%) translateY(-50px);
  transform: translateX(-50%) translateY(-50px);
}

.no-touch .cd-pagination.animated-buttons .button:last-of-type a:hover::after {
  -webkit-transform: translateX(-50%) rotate(180deg) translateY(50px);
  -moz-transform: translateX(-50%) rotate(180deg) translateY(50px);
  -ms-transform: translateX(-50%) rotate(180deg) translateY(50px);
  -o-transform: translateX(-50%) rotate(180deg) translateY(50px);
  transform: translateX(-50%) rotate(180deg) translateY(50px);
}

.even , over { color:#ff6633; }
.odd , under{ color: #33ccff}
.per { font-size:8pt; color:#aaaaaa; }

 .note-editable { background-color: #171a23 !important; color: #fff !important; }

.pg{padding:20px 0;text-align: center;line-height: 25px;}
.pg strong,.pg a{display: inline-block;padding:0 4px;font-style: 14px;}
.pg strong.pg_current{color: #00fff2;font-weight: 500;}
.pg a.pg_page{color: #aaa;font-weight: 400;text-align: center;}
.pg a.pg_page:hover{color: #fff;}
.pg a.pg_end{color: #aaa;font-weight: 400; background: #222;border-radius:5px;width: 40px;height: 25px;font-size: 13px;margin-left:5px;}
.pg a.pg_start{color: #aaa;font-weight: 400;background: #222;border-radius:5px;width: 40px;height:25px;font-size: 13px;margin-right:5px;}
.pg a.pg_next{color: #aaa;font-weight: 400;background: #222;border-radius:5px;width: 25px;height:25px;font-size: 13px;margin-left:5px;}
.pg a.pg_prev{color: #aaa;font-weight: 400;background: #222;border-radius:5px;width: 25px;height:25px;font-size: 13px;margin-right:5px;}

.pg {
    padding: 20px 0;
    text-align: center;
    line-height: 25px;
}

a.pg_start {
    color: #aaa;
    font-weight: 400;
    background: #222;
    border-radius: 5px;
    width: 40px;
    height: 25px;
    font-size: 13px;
    margin-right: 5px;
}

strong.pg_current {
    color: #00fff2;
	font-size:2rem;
    font-weight: 500;
}

strong, .pg a {
    display: inline-block;
    padding: 0 4px;
	font-size:2rem;
}

a.pg_page {
    color: #aaa;
	font-size:2rem;
    font-weight: 400;
    text-align: center;
	margin:5px;

}
a.pg_end {
    color: #aaa;
    font-weight: 400;
    background: #222;
    border-radius: 5px;
    width: 40px;
    height: 25px;
    font-size: 13px;
    margin-left: 5px;
}
a.user_add_money { display:inline-block; width:50px;color:#fff;border:none; height:25px;line-height:25px; border-radius:10px; cursor:pointer; text-align:center; font-size:0.8em; margin-right:5px}
a.user_add_money.add { background-color:red; }
a.user_add_money.sub { background-color:#1c4ba4; }

.button_lev1 { display:inline-block;border-radius:10px; background:#ff6600;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev2 { display:inline-block;border-radius:10px; background:#ff9999;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev3 { display:inline-block;border-radius:10px; background:#cc66ff;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev4 { display:inline-block;border-radius:10px; background:#6666ff;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev5 { display:inline-block;border-radius:10px; background:#999900;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev6 { display:inline-block;border-radius:10px; background:#008459;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev7 { display:inline-block;border-radius:10px; background:#ff9900;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev8 { display:inline-block;border-radius:10px; background:#ff0000;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev9 { display:inline-block;border-radius:10px; background:#003399;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev10 { display:inline-block;border-radius:10px;background:#000;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}

.button_lev1 { display:inline-block;border-radius:10px; background:#ff6600;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev2 { display:inline-block;border-radius:10px; background:#ff9999;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev3 { display:inline-block;border-radius:10px; background:#cc66ff;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev4 { display:inline-block;border-radius:10px; background:#6666ff;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev5 { display:inline-block;border-radius:10px; background:#999900;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}
.button_lev0,.button_lev6 { display:inline-block;border-radius:10px; background:#003399;color:#fff; width:40px;height:20px;line-height:20px;text-align:center; font-size:0.9rem}