*{
  font-family: PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Noto Sans CJK SC,WenQuanYi Micro Hei,Arial,sans-serif;
}

/*----------Bright Style Start----------*/

nav.page-nav-outer {
  display:block;
  text-align: center;
}
nav.page-nav-outer .page-nav-inner {
  display: inline-block;
  padding-top:2px;
}

nav.page-nav-outer .pagination {
  float: left;
  padding-left: 0;
  margin:0;
  border-radius: 4px;
  display: inline-block;
}
nav.page-nav-outer .pagination > li{
  display: inline;

}
.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    background-color:rgba(0,0,0,0.35);
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
nav.page-nav-outer .pagination > li > a {
  position: relative;
  float: left;
  padding: 3px 8px;
  margin-left: -1px;
  line-height: 1.4em;
  color: #fff;
  text-decoration: none;
  background-color: rgba(0,0,0,0.35);
  border: 0px solid black;
}
nav.page-nav-outer .pagination > li a:hover {
  z-index: 2;
  color: #23527c;
  background-color: #eee;
  border-color: #ddd;
}
nav.page-nav-outer .pagination > .active > a {
  z-index: 3;
  color: #fff;
  cursor: default;
  background-color: #337ab7;
  border-color: #337ab7;
}
nav.page-nav-outer .pagination > .active > a:hover {
  z-index: 3;
  color: #fff;
  cursor: default;
  background-color: #337ab7;
  border-color: #337ab7;
}
nav.page-nav-outer .pagination > .disabled > a {
  cursor:no-drop;
}
nav.page-nav-outer .pagination > .disabled a:hover {
  
}
nav.page-nav-outer .page-input-box {
  display: inline-block;
  border-radius: 4px;
  margin: 0;
  margin-top: 0;
  margin-left: 14px;
  float: left;
}
nav.page-nav-outer .page-input-box input {
  width: 23px;
  height:23px;
  padding: 0 4px;
  color: #fff;
  background:rgba(0,0,0,0.35);
  border:0px;
}
nav.page-nav-outer .page-input-box button {
  padding: 0px 2px;
  outline:none;
  background: black;
  opacity:0.5;
}

/*----------Bright Style End----------*/




/*----------Dark Style Start----------*/

nav.page-nav-outer.dark {
  text-align: center;
}
nav.page-nav-outer.dark .page-nav-inner {
  display: inline-block;
  padding-top:2px;
}
nav.page-nav-outer.dark .pagination {
  margin-top: 15px;
  margin-bottom: 15px;
  display: inline-block;
  float: left;
}
nav.page-nav-outer.dark .pagination > li > a {
  color: #FFF;
  font-weight: bold;
  background-color: rgba(0, 0, 0, 0.15);
  border-color: rgba(131, 233, 255, 0.75);
}
nav.page-nav-outer.dark .pagination > li a:hover {
  background-color: rgba(90, 255, 200, 0.5);
}
nav.page-nav-outer.dark .pagination > .active > a {
  color: #FFEB3B;
  border-color: #FFEB3B;
}
nav.page-nav-outer.dark .pagination > .active > a:focus {
  background-color: rgba(90, 255, 200, 0.5);
}
nav.page-nav-outer.dark .pagination > .disabled > a {
  color: #fff;
  border-color: rgba(131, 233, 255, 0.75);
}
nav.page-nav-outer.dark .pagination > .disabled > a:focus {
  background-color: rgba(0, 0, 0, 0.15);
}
nav.page-nav-outer.dark .pagination > .disabled a:hover {
  background-color: rgba(0, 0, 0, 0.15);
}
nav.page-nav-outer.dark .page-input-box {
  display: inline-block;
  border-radius: 4px;
  margin: 0;
  margin-top: 0px;
  margin-left: 5px;
  float: left;
}
nav.page-nav-outer.dark .page-input-box input {
  width: 35px;
  height:28px;
  padding: 0 4px;
  box-sizing: border-box;
  color: #333;
}
nav.page-nav-outer.dark .page-input-box button {
  padding: 0 2px;

}
.dark button.btn-green {
  padding: 3px 15px;
  text-decoration: none;
  outline: none;
  border: 0;
  background: rgba(0, 0, 0, 0.15);
  cursor: pointer;

}
.dark button.btn-green:hover {
  color: #fff;
  text-decoration: none;
}
.dark button.btn-green:active {
  background: rgba(144, 255, 146, 0.4);
}

/*----------Dark Style End----------*/