body:before {
  content: '';
  position: fixed;
  top: 0 !important;
  left: 0;
  right: 0;
  width: 100%;
  height: 550px;
  background-image: url(/statics/pc/image/blur-shape.png);
  background-size: cover;
  z-index: -1;
}

.page-header {
  background: none !important;
}

.io-black-mode .page-header {
  background: rgba(44, 46, 47, 0.7) !important;
}

.url-card .max .url-img {
  width: 40px;
  height: 40px;
}

.panel-body.single.mt-2 img {
  border-radius: 6px;
}

.meta-media {
  position: relative;
  margin-bottom: 30px;
  float: left;
  width: 100%;
  height: 0;
  padding-bottom: 75%;
}

.video {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}


@media (min-width: 2100px) { /* 110% 缩放后，视口变大 */
  .customize-width {
      max-width: 1850px;
  }
}
.sidebar-nav {
  width: 220px
}

@media (min-width: 768px) {
  .main-content {
      margin-left: 220px;
  }

  .main-content .page-header {
      left: 220px;
  }
}

.customize-width {
  max-width: 1900px
}

.sidebar-nav {
  width: 200px
}

@media (min-width: 768px) {
  .main-content {
      margin-left: 200px;
  }

  .main-content .page-header {
      left: 200px;
  }
}

.panel-body a:not(.no-c) {
  color: #5b3fea
}

.panel-body a:not(.no-c):hover {
  color: #2069c9
}

a:hover,
.io-grey-mode .sidebar-show,
.io-grey-mode .sidebar-item>a:hover,
.io-grey-mode .sidebar-item li>a:hover,
.home-like:hover,
.io-grey-mode .sidebar-popup>div>ul>li>a:hover {
  color: #7041f2
}

/* 选中状态 */
a.active,
.io-grey-mode .sidebar-item.active > a,
.io-grey-mode .sidebar-item > a.active {
    border-radius: 0.2rem;
    color: #7041f2;
    background: #8785854d;
}

.header-mini-btn label:hover path {
  stroke: #7041f2
}

.url-card .max .tga a:not(.no-tag):hover,
.card-app.card .tga a:not(.no-tag):hover {
  background: #7041f2
}

.sidebar .url-card .card:hover {
  border: 1px solid #7041f2 !important;
}

.tags i {
  color: #5a3ee8
}

.custom-piece_c_b {
  background: #5a3ee8 !important
}

.custom-piece_c {
  color: #5a3ee8 !important
}

.slider_menu[sliderTab] .anchor,
.customize-menu .btn-edit,
.badge-danger,
.comment-list .rank,
.sidebar .card-header:after {
  background: #5a3ee8
}

.badge-outline-primary {
  color: #5a3ee8;
  border: #5a3ee8 solid 1px
}

.posts-nav .page-numbers.current,
.posts-nav .page-numbers:not(.dots):hover,
#comments-navi>a:hover,
#comments-navi>.current,
.page-nav>a:hover span,
.page-nav>.current span {
  background-color: #5a3ee8;
  box-shadow: 0px 5px 20px -3px rgba(90, 62, 232, .6);
}

.custom-control-input:not(:disabled):active~.custom-control-label::before {
  background-color: rgba(90, 62, 232, .15);
  border-color: rgba(90, 62, 232, .15);
}

.custom-control-input:focus~.custom-control-label::before {
  box-shadow: 0 0 0 .2rem rgba(90, 62, 232, .25)
}

.custom-control-input:focus:not(:checked)~.custom-control-label::before {
  border-color: #5a3ee8
}

.custom-control-input:checked~.custom-control-label::before {
  border-color: #5a3ee8;
  background-color: #5a3ee8
}

.btn-search:hover,
.btn-search.current {
  background-color: #5a3ee8;
  box-shadow: 0 5px 20px -3px rgba(90, 62, 232, .6)
}

.btn-search.current:after {
  border-top-color: #5a3ee8
}

.panel-body h2,
.panel-body h3 {
  border-color: #5a3ee8
}

.custom_btn-outline {
  color: #3e44e8;
  background-color: transparent;
  border-color: #3e44e8;
}

.custom_btn-outline:hover {
  color: #ffffff;
  background-color: #14171B;
  border-color: #14171B;
}

.custom_btn-outline:focus,
.custom_btn-outline.focus {
  color: #14171B;
  box-shadow: 0 0 0 0 transparent !important;
  background-color: transparent;
}

.custom_btn-outline.disabled,
.custom_btn-outline:disabled {
  color: #3e44e8;
  background-color: transparent !important;
}

.custom_btn-outline:not(:disabled):not(.disabled):active,
.custom_btn-outline:not(:disabled):not(.disabled).active,
.show>.custom_btn-outline.dropdown-toggle {
  color: #fff;
  background-color: #3e44e8;
  border-color: #3e44e8;
}

.custom_btn-outline:not(:disabled):not(.disabled):active:focus,
.custom_btn-outline:not(:disabled):not(.disabled).active:focus,
.show>.custom_btn-outline.dropdown-toggle:focus {
  box-shadow: 0 0 0 0 transparent !important;
}

.custom_btn-d {
  color: #ffffff;
  background-color: #3e44e8;
  border-color: #3e44e8;
}

.custom_btn-d:hover {
  color: #ffffff;
  background-color: #14171B;
  border-color: #14171B;
}

.custom_btn-d:focus,
.custom_btn-d.focus {
  color: #ffffff;
  background-color: #14171B;
  border-color: #14171B;
  box-shadow: 0 0 0 0 transparent !important;
}

.custom_btn-d.disabled,
.custom_btn-d:disabled {
  color: #ffffff;
  background-color: #3e44e8;
  border-color: #3e44e8;
}

.custom_btn-d:not(:disabled):not(.disabled):active,
.custom_btn-d:not(:disabled):not(.disabled).active {
  color: #ffffff;
  background-color: #14171B;
  border-color: #14171B;
}

.custom_btn-d:not(:disabled):not(.disabled):active:focus,
.custom_btn-d:not(:disabled):not(.disabled).active:focus {
  box-shadow: 0 0 0 0 transparent !important;
}

.btn.custom_btn-d {
  color: #ffffff;
  background-color: #3e44e8;
  border-color: #3e44e8;
}

.btn.custom_btn-d:hover {
  color: #ffffff;
  background-color: #14171B;
  border-color: #14171B;
}

.btn.custom_btn-d:focus,
.btn.custom_btn-d.focus {
  color: #ffffff;
  background-color: #14171B;
  border-color: #14171B;
  box-shadow: 0 0 0 0 transparent !important;
}

.btn.custom_btn-d.disabled,
.btn.custom_btn-d:disabled {
  color: #ffffff;
  background-color: #3e44e8;
  border-color: #3e44e8;
}

.btn.custom_btn-d:not(:disabled):not(.disabled):active,
.btn.custom_btn-d:not(:disabled):not(.disabled).active,
.show>.custom_btn-d.dropdown-toggle {
  color: #ffffff;
  background-color: #14171B;
  border-color: #14171B;
}

.btn.custom_btn-d:not(:disabled):not(.disabled):active:focus,
.btn.custom_btn-d:not(:disabled):not(.disabled).active:focus,
.show>.custom_btn-d.dropdown-toggle:focus {
  box-shadow: 0 0 0 0 transparent !important;
}

.btn-dark:hover {
  background-color: #3e44e8;
  border-color: #3e44e8
}

.sidebar .card .searchform input[type='submit'] {
  border: 1px solid #3e44e8;
  background-color: #3e44e8
}

.sidebar .card .searchform input[type='submit']:hover {
  border: 1px solid #14171B;
  background-color: #14171B
}



/* hover 时的样式 */
a.btn.btn-arrow:hover {
  background-color: #7041f2; /* 设置背景颜色为蓝色 */
  color: white; /* 可选：如果你需要改变文字颜色为白色 */
}


.custom-container-show{
  padding-left: 26rem !important;
  padding-right: 26rem !important;
}

.show-article{
  margin-left: 12.5rem;
}

.custom-container-showart{
  margin-left: 200px;
}
.content-art{
  padding-left: 200px;
}
/* 手机端样式（屏幕宽度小于768px时） */
@media (max-width: 768px) {
  .custom-container-show {
      padding-left: 0rem !important;  /* 手机端适配 */
      padding-right: 0rem !important;
  }
  .custom-container-showart {
    margin-left: 0px;  /* 手机端适配 */
}
  .show-article{
    margin-left: 0rem;
  }
  .content-art{
    padding-left: 0px;
  }
}