html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%
}

body {
  margin: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block
}

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline
}

audio:not([controls]) {
  display: none;
  height: 0
}

[hidden],
template {
  display: none
}

a {
  background-color: transparent
}

a:active,
a:hover {
  outline: 0
}

abbr[title] {
  border-bottom: 1px dotted
}

b,
strong {
  font-weight: bold
}

dfn {
  font-style: italic
}

h1 {
  margin: .67em 0;
  font-size: 2em
}

mark {
  color: #000;
  background: #ff0
}

small {
  font-size: 80%
}

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline
}

sup {
  top: -.5em
}

sub {
  bottom: -.25em
}

img {
  border: 0
}

svg:not(:root) {
  overflow: hidden
}

figure {
  margin: 1em 40px
}

hr {
  height: 0;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box
}

pre {
  overflow: auto
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font: inherit;
  color: inherit
}

button {
  overflow: visible
}

button,
select {
  text-transform: none
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer
}

button[disabled],
html input[disabled] {
  cursor: default
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0
}

input {
  line-height: normal
}

input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto
}

input[type="search"] {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-appearance: textfield
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none
}

fieldset {
  padding: .35em .625em .75em;
  margin: 0 2px;
  border: 1px solid #c0c0c0
}

legend {
  padding: 0;
  border: 0
}

textarea {
  overflow: auto
}

optgroup {
  font-weight: bold
}

table {
  border-spacing: 0;
  border-collapse: collapse
}

td,
th {
  padding: 0
}

.header-menu li .grand-menu,
.header-menu li .descendant-menu {
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
  background: #fff
}

.rotate-90 {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg)
}

.rotate-180 {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg)
}

.transition {
  -webkit-transition: all ease 0.2s;
  -moz-transition: all ease 0.2s;
  -ms-transition: all ease 0.2s;
  -o-transition: all ease 0.2s;
  transition: all ease 0.2s
}

@-webkit-keyframes fade-zoom-in {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
  }
}

@-o-keyframes fade-zoom-in {
  0% {
    opacity: 0;
    -o-transform: scale(1.1);
    transform: scale(1.1)
  }

  100% {
    opacity: 1;
    -o-transform: scale(1);
    transform: scale(1)
  }
}

@keyframes fade-zoom-in {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1)
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1)
  }
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1
  }

  100% {
    opacity: 0
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1
  }

  100% {
    opacity: 0
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

.card {
  box-shadow: 0px 2px 0px rgba(170, 170, 170, 0.1);
  background: #fff
}

.card-block {
  padding: 25px
}

@media (max-width: 575px) {
  .card-block {
    padding: 10px
  }
}

.btn {
  display: inline-block;
  padding: 6px 16px;
  text-align: center;
  border-radius: 2px;
  color: #fff !important;
  border: 1px solid transparent
}

.btn-geek {
  background-color: #222
}

.btn-primary {
  background: #0275d8
}

.btn-success {
  background-color: #5cb85c
}

.btn-info {
  background-color: #5bc0de
}

.btn-warning {
  background-color: #f0ad4e
}

.btn-danger {
  background-color: #ed1c24
}

.btn:active,
.btn:hover {
  background-image: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05));
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))
}

.btn-line {
  display: inline-block;
  padding: 4px 20px;
  border: 1px solid;
  border-radius: 20px;
  line-height: 20px
}

.btn-line-white {
  color: #fff
}

.btn-line-white:hover {
  background-color: #171717;
  border-color: #171717
}

.btn-line-geek {
  color: #fff
}

.btn-line-geek:hover {
  background-color: #171717;
  border-color: #fff
}

.btn-line-primary {
  color: #0275d8
}

.btn-line-primary:hover {
  background-color: #0275d8;
  border-color: #0275d8;
  color: #5cb85c
}

.btn-line-success {
  color: #5cb85c
}

.btn-line-success:hover {
  background-color: #5cb85c;
  border-color: #5cb85c;
  color: #5cb85c
}

.btn-line-info {
  color: #5bc0de
}

.btn-line-info:hover {
  background-color: #5bc0de;
  border-color: #5bc0de
}

.btn-line-warning {
  color: #f0ad4e
}

.btn-line-warning:hover {
  background-color: #f0ad4e;
  border-color: #f0ad4e
}

.btn-line-danger {
  color: #ed1c24
}

.btn-line-danger:hover {
  background-color: #ed1c24;
  border-color: #ed1c24
}

.btn-line:hover {
  color: #fff !important
}

.cursor-pointer {
  cursor: pointer
}

.img-response {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center
}

.mask {
  position: relative
}

.mask:after {
  opacity: 0.3;
  background: #000;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: " ";
  overflow: hidden;
  display: block
}

.mask-animate {
  position: relative;
  -webkit-border-radius: inherit;
  -moz-border-radius: inherit;
  border-radius: inherit
}

.mask-animate:hover:after {
  opacity: 0.5
}

.mask-animate:after {
  opacity: 0.3;
  background: #000;
  transition: opacity .4s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: " ";
  overflow: hidden;
  display: block
}

.gradient-mask {
  position: relative
}

.gradient-mask:hover:after {
  opacity: 0.5
}

.gradient-mask:after {
  opacity: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.01) 2%, rgba(0, 0, 0, 0.95));
  transition: opacity .4s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: " ";
  overflow: hidden;
  display: block
}

.backdrop {
  position: fixed;
  z-index: 100;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  opacity: 0;
  background: #222;
  visibility: hidden
}

.backdrop-animate {
  visibility: visible;
  opacity: 0.5
}

.align-baseline {
  vertical-align: baseline !important
}

.align-top {
  vertical-align: top !important
}

.align-middle {
  vertical-align: middle !important
}

.align-bottom {
  vertical-align: bottom !important
}

.align-text-bottom {
  vertical-align: text-bottom !important
}

.align-text-top {
  vertical-align: text-top !important
}

.vertical-middle {
  width: 100%;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%)
}

.d-block {
  display: block
}

.d-inline-block {
  display: inline-block
}

.d-inline {
  display: inline
}

.d-table {
  display: table
}

.d-table-cell {
  display: table-cell
}

.d-table-row {
  display: table-row
}

.show {
  display: block !important
}

.hidden {
  display: none !important
}

@media (max-width: 575px) {
  .hidden-xs {
    display: none !important
  }
}

@media (max-width: 767px) {
  .hidden-sm {
    display: none !important
  }
}

@media (max-width: 991px) {
  .hidden-md {
    display: none !important
  }
}

.show-xs {
  display: none
}

@media (max-width: 575px) {
  .show-xs {
    display: block !important
  }
}

.show-sm {
  display: none
}

@media (max-width: 767px) {
  .show-sm {
    display: block !important
  }
}

.opacity-0 {
  opacity: 0
}

.opacity-1 {
  opacity: 1
}

.pull-left {
  float: left
}

.pull-right {
  float: right
}

.fixed-top {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 100
}

.fixed-bottom {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100
}

.fixed-fluid {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100
}

.ps-r {
  position: relative
}

.ps-a {
  position: absolute
}

.top-0 {
  top: 0 !important
}

.p-0 {
  padding: 0 !important
}

.p-1 {
  padding: 5px
}

.p-2 {
  padding: 10px
}

.p-3 {
  padding: 15px
}

.p-4 {
  padding: 20px
}

.px-1 {
  padding-left: 5px;
  padding-right: 5px
}

.px-2 {
  padding-left: 10px;
  padding-right: 10px
}

.px-3 {
  padding-left: 15px;
  padding-right: 15px
}

.px-4 {
  padding-left: 20px;
  padding-right: 20px
}

.py-1 {
  padding-top: 5px;
  padding-bottom: 5px
}

.py-2 {
  padding-top: 10px;
  padding-bottom: 10px
}

.py-3 {
  padding-top: 15px;
  padding-bottom: 15px
}

.py-4 {
  padding-top: 20px;
  padding-bottom: 20px
}

.py-5 {
  padding-top: 25px;
  padding-bottom: 25px
}

.py-6 {
  padding-top: 30px;
  padding-bottom: 30px
}

.pt-2 {
  padding-top: 10px
}

.pr-2 {
  padding-right: 10px
}

.pb-2 {
  padding-bottom: 10px
}

.pl-2 {
  padding-left: 10px
}

.pt-6 {
  padding-top: 30px
}

.pr-6 {
  padding-right: 30px
}

.pb-6 {
  padding-bottom: 30px
}

.pl-6 {
  padding-left: 30px
}

.pt-8 {
  padding-top: 40px
}

.pr-8 {
  padding-right: 40px
}

.pb-8 {
  padding-bottom: 40px
}

.pl-8 {
  padding-left: 40px
}

@media (min-width: 576px) {
  .pt-xs-6 {
    padding-top: 30px
  }
}

.mt-1 {
  margin-top: 5px
}

.mr-1 {
  margin-right: 5px
}

.mb-1 {
  margin-bottom: 5px
}

.ml-1 {
  margin-left: 5px
}

.mt-2 {
  margin-top: 10px;
  margin-left: 15px;
  margin-right: 15px;
  padding-bottom: 6px
}

.mr-2 {
  margin-right: 10px
}

.mb-2 {
  margin-bottom: 10px
}

.ml-2 {
  margin-left: 10px
}

.mt-3 {
  margin-top: 15px
}

.mr-3 {
  margin-right: 15px
}

.mb-3 {
  margin-bottom: 15px
}

.ml-3 {
  margin-left: 15px
}

.mt-4 {
  margin-top: 20px
}

.mr-4 {
  margin-right: 20px
}

.mb-4 {
  margin-bottom: 20px
}

.ml-4 {
  margin-left: 20px
}

.mt-6 {
  margin-top: 30px
}

.mr-6 {
  margin-right: 30px
}

.mb-6 {
  margin-bottom: 30px
}

.ml-6 {
  margin-left: 30px
}

.mt-8 {
  margin-top: 40px
}

.mr-8 {
  margin-right: 40px
}

.mb-8 {
  margin-bottom: 40px
}

.ml-8 {
  margin-left: 40px
}

.mt-10 {
  margin-top: 50px
}

.mr-10 {
  margin-right: 50px
}

.mb-10 {
  margin-bottom: 50px
}

.ml-10 {
  margin-left: 50px
}

.mb-12 {
  margin-bottom: 60px
}

.text-center {
  text-align: center
}

.text-left {
  text-align: left
}

.text-right {
  text-align: right
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0 0 0.5rem
}

.h1 {
  font-size: 2.5rem
}

.h2 {
  font-size: 2rem
}

.h3 {
  font-size: 1.75rem
}

.h4 {
  font-size: 1.5rem
}

.h5 {
  font-size: 1rem
}

.h6 {
  font-size: 0.5rem
}

.f-bold {
  font-weight: bold
}

.f-bolder {
  font-weight: bolder
}

.container:after,
.row:after {
  clear: both;
  content: "";
  display: table
}

.container {
  margin-right: auto;
  margin-left: auto;
  padding-right: 15px;
  padding-left: 15px
}

@media (min-width: 576px) {
  .container {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 768px) {
  .container {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 992px) {
  .container {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 1200px) {
  .container {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 576px) {
  .container {
    width: 560px;
    max-width: 100%
  }
}

@media (min-width: 768px) {
  .container {
    width: 720px;
    max-width: 100%
  }
}

@media (min-width: 992px) {
  .container {
    width: 960px;
    max-width: 100%
  }
}

@media (min-width: 1200px) {
  .container {
    width: 1600px;
    max-width: 100%
  }
}

.container-fluid {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 15px;
  padding-left: 15px
}

@media (min-width: 576px) {
  .container-fluid {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 768px) {
  .container-fluid {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 992px) {
  .container-fluid {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 1200px) {
  .container-fluid {
    padding-right: 15px;
    padding-left: 15px
  }
}

.row {
  margin-right: -15px;
  margin-left: -15px
}

@media (min-width: 576px) {
  .row {
    margin-right: -15px;
    margin-left: -15px
  }
}

@media (min-width: 768px) {
  .row {
    margin-right: -15px;
    margin-left: -15px
  }
}

@media (min-width: 992px) {
  .row {
    margin-right: -15px;
    margin-left: -15px
  }
}

@media (min-width: 1200px) {
  .row {
    margin-right: -15px;
    margin-left: -15px
  }
}

.no-gutters {
  margin-right: 0;
  margin-left: 0
}

.no-gutters>.col,
.no-gutters>[class*="col-"] {
  padding-right: 0;
  padding-left: 0
}

@media (max-width: 575px) {
  .no-gutter-xs {
    padding-left: 0 !important;
    padding-right: 0 !important
  }
}

.clear:after {
  display: block;
  content: '';
  clear: both
}

@media (min-width: 576px) {
  .row-sm-up {
    margin-left: -15px;
    margin-right: -15px
  }
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-xl-1,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12 {
  float: left;
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px
}

@media (min-width: 576px) {

  .col-1,
  .col-2,
  .col-3,
  .col-4,
  .col-5,
  .col-6,
  .col-7,
  .col-8,
  .col-9,
  .col-10,
  .col-11,
  .col-12,
  .col-sm-1,
  .col-sm-2,
  .col-sm-3,
  .col-sm-4,
  .col-sm-5,
  .col-sm-6,
  .col-sm-7,
  .col-sm-8,
  .col-sm-9,
  .col-sm-10,
  .col-sm-11,
  .col-sm-12,
  .col-md-1,
  .col-md-2,
  .col-md-3,
  .col-md-4,
  .col-md-5,
  .col-md-6,
  .col-md-7,
  .col-md-8,
  .col-md-9,
  .col-md-10,
  .col-md-11,
  .col-md-12,
  .col-lg-1,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-lg-10,
  .col-lg-11,
  .col-lg-12,
  .col-xl-1,
  .col-xl-2,
  .col-xl-3,
  .col-xl-4,
  .col-xl-5,
  .col-xl-6,
  .col-xl-7,
  .col-xl-8,
  .col-xl-9,
  .col-xl-10,
  .col-xl-11,
  .col-xl-12 {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 768px) {

  .col-1,
  .col-2,
  .col-3,
  .col-4,
  .col-5,
  .col-6,
  .col-7,
  .col-8,
  .col-9,
  .col-10,
  .col-11,
  .col-12,
  .col-sm-1,
  .col-sm-2,
  .col-sm-3,
  .col-sm-4,
  .col-sm-5,
  .col-sm-6,
  .col-sm-7,
  .col-sm-8,
  .col-sm-9,
  .col-sm-10,
  .col-sm-11,
  .col-sm-12,
  .col-md-1,
  .col-md-2,
  .col-md-3,
  .col-md-4,
  .col-md-5,
  .col-md-6,
  .col-md-7,
  .col-md-8,
  .col-md-9,
  .col-md-10,
  .col-md-11,
  .col-md-12,
  .col-lg-1,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-lg-10,
  .col-lg-11,
  .col-lg-12,
  .col-xl-1,
  .col-xl-2,
  .col-xl-3,
  .col-xl-4,
  .col-xl-5,
  .col-xl-6,
  .col-xl-7,
  .col-xl-8,
  .col-xl-9,
  .col-xl-10,
  .col-xl-11,
  .col-xl-12 {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 992px) {

  .col-1,
  .col-2,
  .col-3,
  .col-4,
  .col-5,
  .col-6,
  .col-7,
  .col-8,
  .col-9,
  .col-10,
  .col-11,
  .col-12,
  .col-sm-1,
  .col-sm-2,
  .col-sm-3,
  .col-sm-4,
  .col-sm-5,
  .col-sm-6,
  .col-sm-7,
  .col-sm-8,
  .col-sm-9,
  .col-sm-10,
  .col-sm-11,
  .col-sm-12,
  .col-md-1,
  .col-md-2,
  .col-md-3,
  .col-md-4,
  .col-md-5,
  .col-md-6,
  .col-md-7,
  .col-md-8,
  .col-md-9,
  .col-md-10,
  .col-md-11,
  .col-md-12,
  .col-lg-1,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-lg-10,
  .col-lg-11,
  .col-lg-12,
  .col-xl-1,
  .col-xl-2,
  .col-xl-3,
  .col-xl-4,
  .col-xl-5,
  .col-xl-6,
  .col-xl-7,
  .col-xl-8,
  .col-xl-9,
  .col-xl-10,
  .col-xl-11,
  .col-xl-12 {
    padding-right: 15px;
    padding-left: 15px
  }
}

@media (min-width: 1200px) {

  .col-1,
  .col-2,
  .col-3,
  .col-4,
  .col-5,
  .col-6,
  .col-7,
  .col-8,
  .col-9,
  .col-10,
  .col-11,
  .col-12,
  .col-sm-1,
  .col-sm-2,
  .col-sm-3,
  .col-sm-4,
  .col-sm-5,
  .col-sm-6,
  .col-sm-7,
  .col-sm-8,
  .col-sm-9,
  .col-sm-10,
  .col-sm-11,
  .col-sm-12,
  .col-md-1,
  .col-md-2,
  .col-md-3,
  .col-md-4,
  .col-md-5,
  .col-md-6,
  .col-md-7,
  .col-md-8,
  .col-md-9,
  .col-md-10,
  .col-md-11,
  .col-md-12,
  .col-lg-1,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-lg-10,
  .col-lg-11,
  .col-lg-12,
  .col-xl-1,
  .col-xl-2,
  .col-xl-3,
  .col-xl-4,
  .col-xl-5,
  .col-xl-6,
  .col-xl-7,
  .col-xl-8,
  .col-xl-9,
  .col-xl-10,
  .col-xl-11,
  .col-xl-12 {
    padding-right: 15px;
    padding-left: 15px
  }
}

.col-1 {
  max-width: 8.3333333333%
}

.col-2 {
  max-width: 16.6666666667%
}

.col-3 {
  max-width: 25%
}

.col-4 {
  max-width: 33.3333333333%
}

.col-5 {
  max-width: 41.6666666667%
}

.col-6 {
  max-width: 50%
}

.col-7 {
  max-width: 58.3333333333%
}

.col-8 {
  max-width: 66.6666666667%
}

.col-9 {
  max-width: 75%
}

.col-10 {
  max-width: 83.3333333333%
}

.col-11 {
  max-width: 91.6666666667%
}

.col-12 {
  max-width: 100%
}

.pull-0 {
  right: auto
}

.pull-1 {
  right: 8.3333333333%
}

.pull-2 {
  right: 16.6666666667%
}

.pull-3 {
  right: 25%
}

.pull-4 {
  right: 33.3333333333%
}

.pull-5 {
  right: 41.6666666667%
}

.pull-6 {
  right: 50%
}

.pull-7 {
  right: 58.3333333333%
}

.pull-8 {
  right: 66.6666666667%
}

.pull-9 {
  right: 75%
}

.pull-10 {
  right: 83.3333333333%
}

.pull-11 {
  right: 91.6666666667%
}

.pull-12 {
  right: 100%
}

.push-0 {
  left: auto
}

.push-1 {
  left: 8.3333333333%
}

.push-2 {
  left: 16.6666666667%
}

.push-3 {
  left: 25%
}

.push-4 {
  left: 33.3333333333%
}

.push-5 {
  left: 41.6666666667%
}

.push-6 {
  left: 50%
}

.push-7 {
  left: 58.3333333333%
}

.push-8 {
  left: 66.6666666667%
}

.push-9 {
  left: 75%
}

.push-10 {
  left: 83.3333333333%
}

.push-11 {
  left: 91.6666666667%
}

.push-12 {
  left: 100%
}

.offset-1 {
  margin-left: 8.3333333333%
}

.offset-2 {
  margin-left: 16.6666666667%
}

.offset-3 {
  margin-left: 25%
}

.offset-4 {
  margin-left: 33.3333333333%
}

.offset-5 {
  margin-left: 41.6666666667%
}

.offset-6 {
  margin-left: 50%
}

.offset-7 {
  margin-left: 58.3333333333%
}

.offset-8 {
  margin-left: 66.6666666667%
}

.offset-9 {
  margin-left: 75%
}

.offset-10 {
  margin-left: 83.3333333333%
}

.offset-11 {
  margin-left: 91.6666666667%
}

@media (min-width: 576px) {
  .col-sm-1 {
    max-width: 8.3333333333%
  }

  .col-sm-2 {
    max-width: 16.6666666667%
  }

  .col-sm-3 {
    max-width: 25%
  }

  .col-sm-4 {
    max-width: 33.3333333333%
  }

  .col-sm-5 {
    max-width: 41.6666666667%
  }

  .col-sm-6 {
    max-width: 50%
  }

  .col-sm-7 {
    max-width: 58.3333333333%
  }

  .col-sm-8 {
    max-width: 66.6666666667%
  }

  .col-sm-9 {
    max-width: 75%
  }

  .col-sm-10 {
    max-width: 83.3333333333%
  }

  .col-sm-11 {
    max-width: 91.6666666667%
  }

  .col-sm-12 {
    max-width: 100%
  }

  .pull-sm-0 {
    right: auto
  }

  .pull-sm-1 {
    right: 8.3333333333%
  }

  .pull-sm-2 {
    right: 16.6666666667%
  }

  .pull-sm-3 {
    right: 25%
  }

  .pull-sm-4 {
    right: 33.3333333333%
  }

  .pull-sm-5 {
    right: 41.6666666667%
  }

  .pull-sm-6 {
    right: 50%
  }

  .pull-sm-7 {
    right: 58.3333333333%
  }

  .pull-sm-8 {
    right: 66.6666666667%
  }

  .pull-sm-9 {
    right: 75%
  }

  .pull-sm-10 {
    right: 83.3333333333%
  }

  .pull-sm-11 {
    right: 91.6666666667%
  }

  .pull-sm-12 {
    right: 100%
  }

  .push-sm-0 {
    left: auto
  }

  .push-sm-1 {
    left: 8.3333333333%
  }

  .push-sm-2 {
    left: 16.6666666667%
  }

  .push-sm-3 {
    left: 25%
  }

  .push-sm-4 {
    left: 33.3333333333%
  }

  .push-sm-5 {
    left: 41.6666666667%
  }

  .push-sm-6 {
    left: 50%
  }

  .push-sm-7 {
    left: 58.3333333333%
  }

  .push-sm-8 {
    left: 66.6666666667%
  }

  .push-sm-9 {
    left: 75%
  }

  .push-sm-10 {
    left: 83.3333333333%
  }

  .push-sm-11 {
    left: 91.6666666667%
  }

  .push-sm-12 {
    left: 100%
  }

  .offset-sm-0 {
    margin-left: 0%
  }

  .offset-sm-1 {
    margin-left: 8.3333333333%
  }

  .offset-sm-2 {
    margin-left: 16.6666666667%
  }

  .offset-sm-3 {
    margin-left: 25%
  }

  .offset-sm-4 {
    margin-left: 33.3333333333%
  }

  .offset-sm-5 {
    margin-left: 41.6666666667%
  }

  .offset-sm-6 {
    margin-left: 50%
  }

  .offset-sm-7 {
    margin-left: 58.3333333333%
  }

  .offset-sm-8 {
    margin-left: 66.6666666667%
  }

  .offset-sm-9 {
    margin-left: 75%
  }

  .offset-sm-10 {
    margin-left: 83.3333333333%
  }

  .offset-sm-11 {
    margin-left: 91.6666666667%
  }
}

@media (min-width: 768px) {
  .col-md-1 {
    max-width: 8.3333333333%
  }

  .col-md-2 {
    max-width: 16.6666666667%
  }

  .col-md-3 {
    max-width: 25%
  }

  .col-md-4 {
    max-width: 33.3333333333%
  }

  .col-md-5 {
    max-width: 41.6666666667%
  }

  .col-md-6 {
    max-width: 50%
  }

  .col-md-7 {
    max-width: 58.3333333333%
  }

  .col-md-8 {
    max-width: 66.6666666667%
  }

  .col-md-9 {
    max-width: 75%
  }

  .col-md-10 {
    max-width: 83.3333333333%
  }

  .col-md-11 {
    max-width: 91.6666666667%
  }

  .col-md-12 {
    max-width: 100%
  }

  .pull-md-0 {
    right: auto
  }

  .pull-md-1 {
    right: 8.3333333333%
  }

  .pull-md-2 {
    right: 16.6666666667%
  }

  .pull-md-3 {
    right: 25%
  }

  .pull-md-4 {
    right: 33.3333333333%
  }

  .pull-md-5 {
    right: 41.6666666667%
  }

  .pull-md-6 {
    right: 50%
  }

  .pull-md-7 {
    right: 58.3333333333%
  }

  .pull-md-8 {
    right: 66.6666666667%
  }

  .pull-md-9 {
    right: 75%
  }

  .pull-md-10 {
    right: 83.3333333333%
  }

  .pull-md-11 {
    right: 91.6666666667%
  }

  .pull-md-12 {
    right: 100%
  }

  .push-md-0 {
    left: auto
  }

  .push-md-1 {
    left: 8.3333333333%
  }

  .push-md-2 {
    left: 16.6666666667%
  }

  .push-md-3 {
    left: 25%
  }

  .push-md-4 {
    left: 33.3333333333%
  }

  .push-md-5 {
    left: 41.6666666667%
  }

  .push-md-6 {
    left: 50%
  }

  .push-md-7 {
    left: 58.3333333333%
  }

  .push-md-8 {
    left: 66.6666666667%
  }

  .push-md-9 {
    left: 75%
  }

  .push-md-10 {
    left: 83.3333333333%
  }

  .push-md-11 {
    left: 91.6666666667%
  }

  .push-md-12 {
    left: 100%
  }

  .offset-md-0 {
    margin-left: 0%
  }

  .offset-md-1 {
    margin-left: 8.3333333333%
  }

  .offset-md-2 {
    margin-left: 16.6666666667%
  }

  .offset-md-3 {
    margin-left: 25%
  }

  .offset-md-4 {
    margin-left: 33.3333333333%
  }

  .offset-md-5 {
    margin-left: 41.6666666667%
  }

  .offset-md-6 {
    margin-left: 50%
  }

  .offset-md-7 {
    margin-left: 58.3333333333%
  }

  .offset-md-8 {
    margin-left: 66.6666666667%
  }

  .offset-md-9 {
    margin-left: 75%
  }

  .offset-md-10 {
    margin-left: 83.3333333333%
  }

  .offset-md-11 {
    margin-left: 91.6666666667%
  }
}

@media (min-width: 992px) {
  .col-lg-1 {
    max-width: 8.3333333333%
  }

  .col-lg-2 {
    max-width: 16.6666666667%
  }

  .col-lg-3 {
    max-width: 25%
  }

  .col-lg-4 {
    max-width: 33.3333333333%
  }

  .col-lg-5 {
    max-width: 41.6666666667%
  }

  .col-lg-6 {
    max-width: 50%
  }

  .col-lg-7 {
    max-width: 58.3333333333%
  }

  .col-lg-8 {
    max-width: 66.6666666667%
  }

  .col-lg-9 {
    max-width: 75%
  }

  .col-lg-10 {
    max-width: 83.3333333333%
  }

  .col-lg-11 {
    max-width: 91.6666666667%
  }

  .col-lg-12 {
    max-width: 100%
  }

  .pull-lg-0 {
    right: auto
  }

  .pull-lg-1 {
    right: 8.3333333333%
  }

  .pull-lg-2 {
    right: 16.6666666667%
  }

  .pull-lg-3 {
    right: 25%
  }

  .pull-lg-4 {
    right: 33.3333333333%
  }

  .pull-lg-5 {
    right: 41.6666666667%
  }

  .pull-lg-6 {
    right: 50%
  }

  .pull-lg-7 {
    right: 58.3333333333%
  }

  .pull-lg-8 {
    right: 66.6666666667%
  }

  .pull-lg-9 {
    right: 75%
  }

  .pull-lg-10 {
    right: 83.3333333333%
  }

  .pull-lg-11 {
    right: 91.6666666667%
  }

  .pull-lg-12 {
    right: 100%
  }

  .push-lg-0 {
    left: auto
  }

  .push-lg-1 {
    left: 8.3333333333%
  }

  .push-lg-2 {
    left: 16.6666666667%
  }

  .push-lg-3 {
    left: 25%
  }

  .push-lg-4 {
    left: 33.3333333333%
  }

  .push-lg-5 {
    left: 41.6666666667%
  }

  .push-lg-6 {
    left: 50%
  }

  .push-lg-7 {
    left: 58.3333333333%
  }

  .push-lg-8 {
    left: 66.6666666667%
  }

  .push-lg-9 {
    left: 75%
  }

  .push-lg-10 {
    left: 83.3333333333%
  }

  .push-lg-11 {
    left: 91.6666666667%
  }

  .push-lg-12 {
    left: 100%
  }

  .offset-lg-0 {
    margin-left: 0%
  }

  .offset-lg-1 {
    margin-left: 8.3333333333%
  }

  .offset-lg-2 {
    margin-left: 16.6666666667%
  }

  .offset-lg-3 {
    margin-left: 25%
  }

  .offset-lg-4 {
    margin-left: 33.3333333333%
  }

  .offset-lg-5 {
    margin-left: 41.6666666667%
  }

  .offset-lg-6 {
    margin-left: 50%
  }

  .offset-lg-7 {
    margin-left: 58.3333333333%
  }

  .offset-lg-8 {
    margin-left: 66.6666666667%
  }

  .offset-lg-9 {
    margin-left: 75%
  }

  .offset-lg-10 {
    margin-left: 83.3333333333%
  }

  .offset-lg-11 {
    margin-left: 91.6666666667%
  }
}

@media (min-width: 1200px) {
  .col-xl-1 {
    max-width: 8.3333333333%
  }

  .col-xl-2 {
    max-width: 16.6666666667%
  }

  .col-xl-3 {
    max-width: 25%
  }

  .col-xl-4 {
    max-width: 33.3333333333%
  }

  .col-xl-5 {
    max-width: 41.6666666667%
  }

  .col-xl-6 {
    max-width: 50%
  }

  .col-xl-7 {
    max-width: 58.3333333333%
  }

  .col-xl-8 {
    max-width: 66.6666666667%
  }

  .col-xl-9 {
    max-width: 75%
  }

  .col-xl-10 {
    max-width: 83.3333333333%
  }

  .col-xl-11 {
    max-width: 91.6666666667%
  }

  .col-xl-12 {
    max-width: 100%
  }

  .pull-xl-0 {
    right: auto
  }

  .pull-xl-1 {
    right: 8.3333333333%
  }

  .pull-xl-2 {
    right: 16.6666666667%
  }

  .pull-xl-3 {
    right: 25%
  }

  .pull-xl-4 {
    right: 33.3333333333%
  }

  .pull-xl-5 {
    right: 41.6666666667%
  }

  .pull-xl-6 {
    right: 50%
  }

  .pull-xl-7 {
    right: 58.3333333333%
  }

  .pull-xl-8 {
    right: 66.6666666667%
  }

  .pull-xl-9 {
    right: 75%
  }

  .pull-xl-10 {
    right: 83.3333333333%
  }

  .pull-xl-11 {
    right: 91.6666666667%
  }

  .pull-xl-12 {
    right: 100%
  }

  .push-xl-0 {
    left: auto
  }

  .push-xl-1 {
    left: 8.3333333333%
  }

  .push-xl-2 {
    left: 16.6666666667%
  }

  .push-xl-3 {
    left: 25%
  }

  .push-xl-4 {
    left: 33.3333333333%
  }

  .push-xl-5 {
    left: 41.6666666667%
  }

  .push-xl-6 {
    left: 50%
  }

  .push-xl-7 {
    left: 58.3333333333%
  }

  .push-xl-8 {
    left: 66.6666666667%
  }

  .push-xl-9 {
    left: 75%
  }

  .push-xl-10 {
    left: 83.3333333333%
  }

  .push-xl-11 {
    left: 91.6666666667%
  }

  .push-xl-12 {
    left: 100%
  }

  .offset-xl-0 {
    margin-left: 0%
  }

  .offset-xl-1 {
    margin-left: 8.3333333333%
  }

  .offset-xl-2 {
    margin-left: 16.6666666667%
  }

  .offset-xl-3 {
    margin-left: 25%
  }

  .offset-xl-4 {
    margin-left: 33.3333333333%
  }

  .offset-xl-5 {
    margin-left: 41.6666666667%
  }

  .offset-xl-6 {
    margin-left: 50%
  }

  .offset-xl-7 {
    margin-left: 58.3333333333%
  }

  .offset-xl-8 {
    margin-left: 66.6666666667%
  }

  .offset-xl-9 {
    margin-left: 75%
  }

  .offset-xl-10 {
    margin-left: 83.3333333333%
  }

  .offset-xl-11 {
    margin-left: 91.6666666667%
  }
}

* {
  -webkit-tap-highlight-color: transparent;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

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

html {
  font-size: 16px;
  height: 100%
}

body {
  font-family: Helvetica, Arial, "PingFang SC", "Microsoft YaHei", "WenQuanYi Micro Hei", "tohoma,sans-serif";
  font-size: 14px;
  line-height: 1.42857143;
  color: #3f3f3f;
  background-color: #f4f4f4;
  height: 100%
}

input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  -webkit-appearance: none;
  box-shadow: none
}

ul {
  padding: 0;
  margin: 0;
  list-style: none
}

a {
  text-decoration: none
}

a:hover {
  cursor: pointer
}

::-moz-selection {
  background: #111;
  color: #fff
}

::selection {
  background: #111;
  color: #fff
}

.popup-effect {
  transform: scale(1) !important
}

#main {
  min-height: 100%
}

.form-group {
  margin-bottom: 16px
}

.form-group label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: 700
}

.form-group .form-control {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
}

.form-group input {
  height: 34px
}

.form-group textarea {
  height: 160px
}

@font-face {
  font-family: 'strawberryicon';
  src: url("../zpz-fonts/strawberryicon.eot?w9sgwo");
  src: url("../zpz-fonts/strawberryicon.eot?w9sgwo#iefix") format("embedded-opentype"), url("../zpz-fonts/strawberryicon.ttf?w9sgwo") format("truetype"), url("../zpz-fonts/strawberryicon.woff?w9sgwo") format("woff"), url("../zpz-fonts/strawberryicon.svg?w9sgwo#strawberryicon") format("svg");
  font-weight: normal;
  font-style: normal
}

[class^="czs-"],
[class*=" czs-"] {
  font-family: 'strawberryicon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

.czs-about:before {
  content: "\e900";
}

.czs-about-l:before {
  content: "\e901";
}

.czs-add:before {
  content: "\e902";
}

.czs-airplane:before {
  content: "\e903";
}

.czs-airplane-l:before {
  content: "\e904";
}

.czs-alipay:before {
  content: "\e905";
}

.czs-analysis:before {
  content: "\e906";
}

.czs-android:before {
  content: "\e907";
}

.czs-angle-down-l:before {
  content: "\e917";
}

.czs-angle-left-l:before {
  content: "\e909";
}

.czs-angle-right-l:before {
  content: "\e90a";
}

.czs-angle-up-l:before {
  content: "\e90b";
}

.czs-apple:before {
  content: "\e90c";
}

.czs-arrow-down-l:before {
  content: "\e90d";
}

.czs-arrow-up-l:before {
  content: "\e90e";
}

.czs-baiduwangpan:before {
  content: "\e90f";
}

.czs-bar-chart:before {
  content: "\e910";
}

.czs-bar-chart-l:before {
  content: "\e911";
}

.czs-battery:before {
  content: "\e912";
}

.czs-battery-l:before {
  content: "\e913";
}

.czs-bell:before {
  content: "\e914";
}

.czs-bell-l:before {
  content: "\e915";
}

.czs-bevel:before {
  content: "\e916";
}

.czs-bilibili:before {
  content: "\e908";
}

.czs-bitcoin:before {
  content: "\e918";
}

.czs-blackboard:before {
  content: "\e919";
}

.czs-blackboard-l:before {
  content: "\e91a";
}

.czs-block:before {
  content: "\e91b";
}

.czs-block-l:before {
  content: "\e91c";
}

.czs-bluetooth:before {
  content: "\e91d";
}

.czs-bluetooth-l:before {
  content: "\e91e";
}

.czs-board:before {
  content: "\e91f";
}

.czs-board-l:before {
  content: "\e920";
}

.czs-book:before {
  content: "\e921";
}

.czs-book-l:before {
  content: "\e922";
}

.czs-bookmark:before {
  content: "\e923";
}

.czs-bookmark-l:before {
  content: "\e924";
}

.czs-books:before {
  content: "\e925";
}

.czs-books-l:before {
  content: "\e926";
}

.czs-bot:before {
  content: "\e927";
}

.czs-bot-l:before {
  content: "\e928";
}

.czs-box:before {
  content: "\e929";
}

.czs-box-l:before {
  content: "\e92a";
}

.czs-briefcase:before {
  content: "\e92b";
}

.czs-briefcase-l:before {
  content: "\e92c";
}

.czs-brush:before {
  content: "\e92d";
}

.czs-brush-l:before {
  content: "\e92e";
}

.czs-bug:before {
  content: "\e92f";
}

.czs-bug-l:before {
  content: "\e930";
}

.czs-building:before {
  content: "\e931";
}

.czs-building-l:before {
  content: "\e932";
}

.czs-buy:before {
  content: "\e933";
}

.czs-buy-l:before {
  content: "\e934";
}

.czs-calculator:before {
  content: "\e935";
}

.czs-calculator-l:before {
  content: "\e936";
}

.czs-calendar:before {
  content: "\e937";
}

.czs-calendar-l:before {
  content: "\e938";
}

.czs-camber:before {
  content: "\e939";
}

.czs-camber-l:before {
  content: "\e93a";
}

.czs-camber-o:before {
  content: "\e93b";
}

.czs-camera:before {
  content: "\e93c";
}

.czs-camera-l:before {
  content: "\e93d";
}

.czs-caomei:before {
  content: "\e93e";
}

.czs-car:before {
  content: "\e93f";
}

.czs-car-l:before {
  content: "\e940";
}

.czs-category-l:before {
  content: "\e941";
}

.czs-certificate:before {
  content: "\e942";
}

.czs-certificate-l:before {
  content: "\e943";
}

.czs-chemistry:before {
  content: "\e944";
}

.czs-chemistry-l:before {
  content: "\e945";
}

.czs-choose-list-l:before {
  content: "\e946";
}

.czs-chrome:before {
  content: "\e947";
}

.czs-chuangzaoshi:before {
  content: "\e948";
}

.czs-circle:before {
  content: "\e949";
}

.czs-circle-l:before {
  content: "\e94a";
}

.czs-circle-o:before {
  content: "\e94b";
}

.czs-clip-l:before {
  content: "\e94c";
}

.czs-clock:before {
  content: "\e94d";
}

.czs-clock-l:before {
  content: "\e94e";
}

.czs-close-l:before {
  content: "\e94f";
}

.czs-clothes:before {
  content: "\e950";
}

.czs-clothes-l:before {
  content: "\e951";
}

.czs-cloud:before {
  content: "\e952";
}

.czs-cloud-download-l:before {
  content: "\e953";
}

.czs-cloud-l:before {
  content: "\e954";
}

.czs-cloud-upload-l:before {
  content: "\e955";
}

.czs-code-branch:before {
  content: "\e956";
}

.czs-code-file:before {
  content: "\e957";
}

.czs-code-file-l:before {
  content: "\e958";
}

.czs-code-fork:before {
  content: "\e959";
}

.czs-code-l:before {
  content: "\e95a";
}

.czs-coin:before {
  content: "\e95b";
}

.czs-coin-l:before {
  content: "\e95c";
}

.czs-collection:before {
  content: "\e95d";
}

.czs-come-l:before {
  content: "\e95e";
}

.czs-command:before {
  content: "\e95f";
}

.czs-command-l:before {
  content: "\e960";
}

.czs-commed2:before {
  content: "\e961";
}

.czs-commed2-l:before {
  content: "\e962";
}

.czs-comment:before {
  content: "\e963";
}

.czs-comment-l:before {
  content: "\e964";
}

.czs-computer:before {
  content: "\e965";
}

.czs-computer-l:before {
  content: "\e966";
}

.czs-configuration:before {
  content: "\e967";
}

.czs-configuration-l:before {
  content: "\e968";
}

.czs-container:before {
  content: "\e969";
}

.czs-container-l:before {
  content: "\e96a";
}

.czs-control:before {
  content: "\e96b";
}

.czs-control-rank:before {
  content: "\e96c";
}

.czs-credit-card:before {
  content: "\e96d";
}

.czs-credit-card-l:before {
  content: "\e96e";
}

.czs-crown:before {
  content: "\e96f";
}

.czs-crown-l:before {
  content: "\e970";
}

.czs-css3:before {
  content: "\e971";
}

.czs-cube:before {
  content: "\e972";
}

.czs-cube-l:before {
  content: "\e973";
}

.czs-cup:before {
  content: "\e974";
}

.czs-cup-l:before {
  content: "\e975";
}

.czs-dashboard:before {
  content: "\e976";
}

.czs-dashboard-l:before {
  content: "\e977";
}

.czs-database:before {
  content: "\e978";
}

.czs-database-l:before {
  content: "\e979";
}

.czs-dev-board:before {
  content: "\e97a";
}

.czs-dev-board-l:before {
  content: "\e97b";
}

.czs-d-glasses:before {
  content: "\e97c";
}

.czs-diamond:before {
  content: "\e97d";
}

.czs-diamond-l:before {
  content: "\e97e";
}

.czs-doc-edit:before {
  content: "\e97f";
}

.czs-doc-edit-l:before {
  content: "\e980";
}

.czs-doc-file:before {
  content: "\e981";
}

.czs-doc-file-l:before {
  content: "\e982";
}

.czs-download-l:before {
  content: "\e983";
}

.czs-dribbble:before {
  content: "\e984";
}

.czs-dropbox:before {
  content: "\e985";
}

.czs-earth:before {
  content: "\e986";
}

.czs-earth-l:before {
  content: "\e987";
}

.czs-education:before {
  content: "\e988";
}

.czs-education-l:before {
  content: "\e989";
}

.czs-eye:before {
  content: "\e98a";
}

.czs-eye-l:before {
  content: "\e98b";
}

.czs-face:before {
  content: "\e98c";
}

.czs-facebook:before {
  content: "\e98d";
}

.czs-face-l:before {
  content: "\e98e";
}

.czs-file:before {
  content: "\e98f";
}

.czs-file-l:before {
  content: "\e990";
}

.czs-film:before {
  content: "\e991";
}

.czs-film-l:before {
  content: "\e992";
}

.czs-fingerprint:before {
  content: "\e993";
}

.czs-fingerprint-l:before {
  content: "\e994";
}

.czs-fire-l:before {
  content: "\e995";
}

.czs-firewall:before {
  content: "\e996";
}

.czs-firewall-l:before {
  content: "\e997";
}

.czs-folder:before {
  content: "\e998";
}

.czs-folder-l:before {
  content: "\e999";
}

.czs-forum:before {
  content: "\e99a";
}

.czs-forum-l:before {
  content: "\e99b";
}

.czs-game:before {
  content: "\e99c";
}

.czs-game-l:before {
  content: "\e99d";
}

.czs-gene:before {
  content: "\e99e";
}

.czs-gift:before {
  content: "\e99f";
}

.czs-gift-l:before {
  content: "\e9a0";
}

.czs-github:before {
  content: "\e9a1";
}

.czs-github-logo:before {
  content: "\e9a2";
}

.czs-Google:before {
  content: "\e9a3";
}

.czs-greatwall:before {
  content: "\e9a4";
}

.czs-hacker:before {
  content: "\e9a5";
}

.czs-hacker-l:before {
  content: "\e9a6";
}

.czs-hammer:before {
  content: "\e9a7";
}

.czs-hammer-l:before {
  content: "\e9a8";
}

.czs-hand-bevel:before {
  content: "\e9a9";
}

.czs-hand-button:before {
  content: "\e9aa";
}

.czs-hande-vertical:before {
  content: "\e9ab";
}

.czs-hand-gather:before {
  content: "\e9ac";
}

.czs-hand-grasp:before {
  content: "\e9ad";
}

.czs-hand-horizontal:before {
  content: "\e9ae";
}

.czs-hand-pointer:before {
  content: "\e9af";
}

.czs-hand-slide:before {
  content: "\e9b0";
}

.czs-hand-stop:before {
  content: "\e9b1";
}

.czs-hand-touch:before {
  content: "\e9b2";
}

.czs-hdmi:before {
  content: "\e9b3";
}

.czs-hdmi-l:before {
  content: "\e9b4";
}

.czs-headset:before {
  content: "\e9b5";
}

.czs-headset-l:before {
  content: "\e9b6";
}

.czs-heart:before {
  content: "\e9b7";
}

.czs-heart-l:before {
  content: "\e9b8";
}

.czs-home:before {
  content: "\e9b9";
}

.czs-home-l:before {
  content: "\e9ba";
}

.czs-html5:before {
  content: "\e9bb";
}

.czs-image:before {
  content: "\e9bc";
}

.czs-image-l:before {
  content: "\e9bd";
}

.czs-inbox:before {
  content: "\e9be";
}

.czs-inbox-l:before {
  content: "\e9bf";
}

.czs-Instagram:before {
  content: "\e9c0";
}

.czs-key:before {
  content: "\e9c1";
}

.czs-keyboard:before {
  content: "\e9c2";
}

.czs-keyboard-l:before {
  content: "\e9c3";
}

.czs-key-l:before {
  content: "\e9c4";
}

.czs-label-info:before {
  content: "\e9c5";
}

.czs-label-info-l:before {
  content: "\e9c6";
}

.czs-laptop:before {
  content: "\e9c7";
}

.czs-laptop-l:before {
  content: "\e9c8";
}

.czs-layers:before {
  content: "\e9c9";
}

.czs-layout-grid:before {
  content: "\e9ca";
}

.czs-layout-grids:before {
  content: "\e9cb";
}

.czs-layout-list:before {
  content: "\e9cc";
}

.czs-light:before {
  content: "\e9cd";
}

.czs-light-flash-l:before {
  content: "\e9ce";
}

.czs-light-l:before {
  content: "\e9cf";
}

.czs-lightning:before {
  content: "\e9d0";
}

.czs-lightning-l:before {
  content: "\e9d1";
}

.czs-link-l:before {
  content: "\e9d2";
}

.czs-linux:before {
  content: "\e9d3";
}

.czs-list-clipboard:before {
  content: "\e9d4";
}

.czs-list-clipboard-l:before {
  content: "\e9d5";
}

.czs-location:before {
  content: "\e9d6";
}

.czs-location-l:before {
  content: "\e9d7";
}

.czs-lock:before {
  content: "\e9d8";
}

.czs-lock-l:before {
  content: "\e9d9";
}

.czs-map:before {
  content: "\e9da";
}

.czs-map-l:before {
  content: "\e9db";
}

.czs-medal:before {
  content: "\e9dc";
}

.czs-medal-l:before {
  content: "\e9dd";
}

.czs-menu-l:before {
  content: "\e9de";
}

.czs-message:before {
  content: "\e9df";
}

.czs-message-l:before {
  content: "\e9e0";
}

.czs-microchip:before {
  content: "\e9e1";
}

.czs-microchip-l:before {
  content: "\e9e2";
}

.czs-microphone:before {
  content: "\e9e3";
}

.czs-microphone-l:before {
  content: "\e9e4";
}

.czs-microsoft:before {
  content: "\e9e5";
}

.czs-mobile:before {
  content: "\e9e6";
}

.czs-mobile-l:before {
  content: "\e9e7";
}

.czs-moments:before {
  content: "\e9e8";
}

.czs-money:before {
  content: "\e9e9";
}

.czs-moon:before {
  content: "\e9ea";
}

.czs-moon-l:before {
  content: "\e9eb";
}

.czs-more:before {
  content: "\e9ec";
}

.czs-mouse:before {
  content: "\e9ed";
}

.czs-mouse-l:before {
  content: "\e9ee";
}

.czs-music:before {
  content: "\e9ef";
}

.czs-music-file:before {
  content: "\e9f0";
}

.czs-music-file-l:before {
  content: "\e9f1";
}

.czs-music-l:before {
  content: "\e9f2";
}

.czs-music-note:before {
  content: "\e9f3";
}

.czs-music-note-l:before {
  content: "\e9f4";
}

.czs-nail:before {
  content: "\e9f5";
}

.czs-nail-l:before {
  content: "\e9f6";
}

.czs-nas:before {
  content: "\e9f7";
}

.czs-nas-l:before {
  content: "\e9f8";
}

.czs-network:before {
  content: "\e9f9";
}

.czs-network-l:before {
  content: "\e9fa";
}

.czs-new:before {
  content: "\e9fb";
}

.czs-new-l:before {
  content: "\e9fc";
}

.czs-newspaper:before {
  content: "\e9fd";
}

.czs-newspaper-l:before {
  content: "\e9fe";
}

.czs-operation:before {
  content: "\e9ff";
}

.czs-operation-l:before {
  content: "\ea00";
}

.czs-out-l:before {
  content: "\ea01";
}

.czs-pad:before {
  content: "\ea02";
}

.czs-pad-l:before {
  content: "\ea03";
}

.czs-paper:before {
  content: "\ea04";
}

.czs-paper-l:before {
  content: "\ea05";
}

.czs-paper-plane:before {
  content: "\ea06";
}

.czs-paper-plane-l:before {
  content: "\ea07";
}

.czs-pause-l:before {
  content: "\ea08";
}

.czs-paypal:before {
  content: "\ea09";
}

.czs-pen:before {
  content: "\ea0a";
}

.czs-pen-write:before {
  content: "\ea0b";
}

.czs-people:before {
  content: "\ea0c";
}

.czs-phone:before {
  content: "\ea0d";
}

.czs-phone-l:before {
  content: "\ea0e";
}

.czs-pinterest:before {
  content: "\ea0f";
}

.czs-pixel:before {
  content: "\ea10";
}

.czs-platform:before {
  content: "\ea11";
}

.czs-platform-l:before {
  content: "\ea12";
}

.czs-play-l:before {
  content: "\ea13";
}

.czs-plugin:before {
  content: "\ea14";
}

.czs-pokemon-ball:before {
  content: "\ea15";
}

.czs-port:before {
  content: "\ea16";
}

.czs-port-l:before {
  content: "\ea17";
}

.czs-printer:before {
  content: "\ea18";
}

.czs-printer-l:before {
  content: "\ea19";
}

.czs-product:before {
  content: "\ea1a";
}

.czs-program:before {
  content: "\ea1b";
}

.czs-program-framework:before {
  content: "\ea1c";
}

.czs-program-l:before {
  content: "\ea1d";
}

.czs-prototype:before {
  content: "\ea1e";
}

.czs-prototype-l:before {
  content: "\ea1f";
}

.czs-prototype-select:before {
  content: "\ea20";
}

.czs-prototype-select-l:before {
  content: "\ea21";
}

.czs-qq:before {
  content: "\ea22";
}

.czs-qrcode-l:before {
  content: "\ea23";
}

.czs-quadrotor:before {
  content: "\ea24";
}

.czs-quote-left:before {
  content: "\ea25";
}

.czs-quote-right:before {
  content: "\ea26";
}

.czs-qzone:before {
  content: "\ea27";
}

.czs-raspberry:before {
  content: "\ea28";
}

.czs-raspberry-l:before {
  content: "\ea29";
}

.czs-read:before {
  content: "\ea2a";
}

.czs-read-l:before {
  content: "\ea2b";
}

.czs-red-envelope:before {
  content: "\ea2c";
}

.czs-renew:before {
  content: "\ea2d";
}

.czs-right-clipboard:before {
  content: "\ea2e";
}

.czs-right-clipboard-l:before {
  content: "\ea2f";
}

.czs-robot:before {
  content: "\ea30";
}

.czs-robot-l:before {
  content: "\ea31";
}

.czs-rocket:before {
  content: "\ea32";
}

.czs-rocket-l:before {
  content: "\ea33";
}

.czs-rollerbrush:before {
  content: "\ea34";
}

.czs-rollerbrush-l:before {
  content: "\ea35";
}

.czs-router:before {
  content: "\ea36";
}

.czs-router-l:before {
  content: "\ea37";
}

.czs-rss:before {
  content: "\ea38";
}

.czs-ruler:before {
  content: "\ea39";
}

.czs-ruler-l:before {
  content: "\ea3a";
}

.czs-save:before {
  content: "\ea3b";
}

.czs-save-l:before {
  content: "\ea3c";
}

.czs-scan-l:before {
  content: "\ea3d";
}

.czs-scissors:before {
  content: "\ea3e";
}

.czs-sdcard:before {
  content: "\ea3f";
}

.czs-sdcard-l:before {
  content: "\ea40";
}

.czs-search-l:before {
  content: "\ea41";
}

.czs-server:before {
  content: "\ea42";
}

.czs-server-l:before {
  content: "\ea43";
}

.czs-servers:before {
  content: "\ea44";
}

.czs-setting:before {
  content: "\ea45";
}

.czs-setting-l:before {
  content: "\ea46";
}

.czs-share:before {
  content: "\ea47";
}

.czs-shield:before {
  content: "\ea48";
}

.czs-shield-l:before {
  content: "\ea49";
}

.czs-shop:before {
  content: "\ea4a";
}

.czs-shop-l:before {
  content: "\ea4b";
}

.czs-shopping-cart:before {
  content: "\ea4c";
}

.czs-shopping-cart-l:before {
  content: "\ea4d";
}

.czs-site-folder:before {
  content: "\ea4e";
}

.czs-site-folder-l:before {
  content: "\ea4f";
}

.czs-slider-l:before {
  content: "\ea50";
}

.czs-square:before {
  content: "\ea51";
}

.czs-square-l:before {
  content: "\ea52";
}

.czs-square-o:before {
  content: "\ea53";
}

.czs-star:before {
  content: "\ea54";
}

.czs-star-l:before {
  content: "\ea55";
}

.czs-steam:before {
  content: "\ea56";
}

.czs-storage:before {
  content: "\ea57";
}

.czs-storage-l:before {
  content: "\ea58";
}

.czs-sun:before {
  content: "\ea59";
}

.czs-sun-l:before {
  content: "\ea5a";
}

.czs-sword:before {
  content: "\ea5b";
}

.czs-sword-l:before {
  content: "\ea5c";
}

.czs-tab:before {
  content: "\ea5d";
}

.czs-tab-l:before {
  content: "\ea5e";
}

.czs-tag:before {
  content: "\ea5f";
}

.czs-tag-l:before {
  content: "\ea60";
}

.czs-taiji:before {
  content: "\ea61";
}

.czs-talk:before {
  content: "\ea62";
}

.czs-talk-l:before {
  content: "\ea63";
}

.czs-taobao:before {
  content: "\ea64";
}

.czs-t-brian:before {
  content: "\ea65";
}

.czs-telegram:before {
  content: "\ea66";
}

.czs-text-l:before {
  content: "\ea67";
}

.czs-thumbs-up:before {
  content: "\ea68";
}

.czs-thumbs-up-l:before {
  content: "\ea69";
}

.czs-ticket:before {
  content: "\ea6a";
}

.czs-ticket-l:before {
  content: "\ea6b";
}

.czs-time:before {
  content: "\ea6c";
}

.czs-time-l:before {
  content: "\ea6d";
}

.czs-tmall:before {
  content: "\ea6e";
}

.czs-transmission-l:before {
  content: "\ea6f";
}

.czs-transport:before {
  content: "\ea70";
}

.czs-trash:before {
  content: "\ea71";
}

.czs-trash-l:before {
  content: "\ea72";
}

.czs-triangle:before {
  content: "\ea73";
}

.czs-triangle-l:before {
  content: "\ea74";
}

.czs-triangle-o:before {
  content: "\ea75";
}

.czs-trophy:before {
  content: "\ea76";
}

.czs-trophy-l:before {
  content: "\ea77";
}

.czs-truck:before {
  content: "\ea78";
}

.czs-truck-l:before {
  content: "\ea79";
}

.czs-tv:before {
  content: "\ea7a";
}

.czs-tv-l:before {
  content: "\ea7b";
}

.czs-twitter:before {
  content: "\ea7c";
}

.czs-upload-l:before {
  content: "\ea7d";
}

.czs-usb:before {
  content: "\ea7e";
}

.czs-usb-l:before {
  content: "\ea7f";
}

.czs-user:before {
  content: "\ea80";
}

.czs-user-l:before {
  content: "\ea81";
}

.czs-v2ex:before {
  content: "\ea82";
}

.czs-vector-design:before {
  content: "\ea83";
}

.czs-video-camera:before {
  content: "\ea84";
}

.czs-video-camera-l:before {
  content: "\ea85";
}

.czs-video-file:before {
  content: "\ea86";
}

.czs-video-file-l:before {
  content: "\ea87";
}

.czs-vimeo:before {
  content: "\ea88";
}

.czs-virtual:before {
  content: "\ea89";
}

.czs-virtual-l:before {
  content: "\ea8a";
}

.czs-volume:before {
  content: "\ea8b";
}

.czs-volume-l:before {
  content: "\ea8c";
}

.czs-volume-x-l:before {
  content: "\ea8d";
}

.czs-wallet:before {
  content: "\ea8e";
}

.czs-wallet-l:before {
  content: "\ea8f";
}

.czs-warning:before {
  content: "\ea90";
}

.czs-warning-l:before {
  content: "\ea91";
}

.czs-watch:before {
  content: "\ea92";
}

.czs-watch-l:before {
  content: "\ea93";
}

.czs-webcam:before {
  content: "\ea94";
}

.czs-webcam-l:before {
  content: "\ea95";
}

.czs-web-edit:before {
  content: "\ea96";
}

.czs-web-edit-l:before {
  content: "\ea97";
}

.czs-weibo:before {
  content: "\ea98";
}

.czs-weixin:before {
  content: "\ea99";
}

.czs-weixinzhifu:before {
  content: "\ea9a";
}

.czs-wifi:before {
  content: "\ea9b";
}

.czs-wordpress:before {
  content: "\ea9c";
}

.czs-wrench:before {
  content: "\ea9d";
}

.czs-wrench-l:before {
  content: "\ea9e";
}

.czs-write-l:before {
  content: "\ea9f";
}

.czs-x-buy-l:before {
  content: "\eaa0";
}

.czs-youtube:before {
  content: "\eaa1";
}

.czs-zhihu:before {
  content: "\eaa2";
}

.czs-zip-folder:before {
  content: "\eaa3";
}

.czs-zip-folder-l:before {
  content: "\eaa4";
}

.hljs {
  display: block;
  overflow-x: auto;
  padding: 0.5em;
  background: #F0F0F0
}

.hljs,
.hljs-subst {
  color: #444
}

.hljs-comment {
  color: #888888
}

.hljs-keyword,
.hljs-attribute,
.hljs-selector-tag,
.hljs-meta-keyword,
.hljs-doctag,
.hljs-name {
  font-weight: bold
}

.hljs-type,
.hljs-string,
.hljs-number,
.hljs-selector-id,
.hljs-selector-class,
.hljs-quote,
.hljs-template-tag,
.hljs-deletion {
  color: #880000
}

.hljs-title,
.hljs-section {
  color: #880000;
  font-weight: bold
}

.hljs-regexp,
.hljs-symbol,
.hljs-variable,
.hljs-template-variable,
.hljs-link,
.hljs-selector-attr,
.hljs-selector-pseudo {
  color: #BC6060
}

.hljs-literal {
  color: #78A960
}

.hljs-built_in,
.hljs-bullet,
.hljs-code,
.hljs-addition {
  color: #397300
}

.hljs-meta {
  color: #1f7199
}

.hljs-meta-string {
  color: #4d99bf
}

.hljs-emphasis {
  font-style: italic
}

.hljs-strong {
  font-weight: bold
}

.carousel-wrap {
  background: #fff;
  padding-top: 40px
}

@media (max-width: 575px) {
  .carousel-wrap {
    padding-top: 0
  }
}

#carousel {
  position: relative;
  width: 100%;
  overflow: hidden;
  z-index: 1
}

#carousel .carousel-item {
  border-radius: 5px;
  width: 100%;
  float: left;
  height: 0;
  padding-bottom: 29.66%;
  position: relative;
  overflow: hidden
}

@media (max-width: 575px) {
  #carousel .carousel-item {
    border-radius: 0;
    padding-bottom: 29.66%
  }
}

#carousel .carousel-item .carousel-info {
  z-index: 2
}

#carousel .carousel-item .carousel-info .carousel-info-title {
  text-align: center;
  font-size: 34px;
  color: #fff;
  margin-top: 6px;
  text-shadow: 0 0 5px #333
}

@media (max-width: 575px) {
  #carousel .carousel-item .carousel-info .carousel-info-title {
    font-size: 16px
  }
}

#carousel .carousel-item .carousel-info .carousel-info-meta {
  text-align: center;
  color: #fff
}

#carousel .carousel-item .carousel-info .carousel-info-meta .carousel-info-category {
  padding: 3px 8px
}

#carousel .carousel-item a {
  display: block;
  height: 180px
}

#carousel .carousel-item .carousel-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  opacity: 0.1;
  background: #000;
  transition: all .4s;
  width: 100%;
  height: 100%
}

@media screen and (max-width: 767px) {
  #carousel .owl-nav {
    display: none
  }
}

#carousel .owl-nav .owl-prev,
#carousel .owl-nav .owl-next {
  position: absolute;
  z-index: 2;
  top: 50%;
  margin-top: -14px;
  display: inline-block;
  zoom: 1;
  cursor: pointer;
  width: 40px;
  height: 40px;
  font-size: 16px;
  color: #fff;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 20px;
  padding: 8px;
  text-align: center
}

#carousel .owl-nav .owl-prev {
  left: -40px
}

#carousel .owl-nav .owl-next {
  right: -40px
}

#carousel .owl-nav .owl-prev-animation {
  transform: translateX(52px)
}

#carousel .owl-nav .owl-next-animation {
  transform: translateX(-52px)
}

#carousel .owl-dots {
  position: absolute;
  bottom: 8px;
  width: 100%;
  height: 20px;
  text-align: center
}

#carousel .owl-dots .owl-dot {
  display: inline-block;
  zoom: 1
}

#carousel .owl-dots .owl-dot span {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background: #888;
  margin: 3px 4px;
  opacity: 1
}

@media screen and (max-width: 767px) {
  #carousel .owl-dots .owl-dot span {
    margin: 3px 2px
  }
}

#carousel .owl-dots .active span {
  background-color: #fff
}

.custom-carousel {
  overflow: hidden;
  height: 180px
}

.custom-carousel .carousel-item {
  position: relative;
  height: 180px;
  color: #fff;
  font-size: 14px;
  max-width: 360px
}

.custom-carousel .owl-dots {
  position: absolute;
  bottom: -28px;
  width: 100%;
  height: 20px;
  text-align: right
}

.custom-carousel .owl-dots .owl-dot {
  display: inline-block;
  zoom: 1
}

.custom-carousel .owl-dots .owl-dot span {
  display: block;
  width: 12px;
  height: 12px;
  background: #bbb;
  margin: 3px 4px;
  opacity: 1
}

.custom-carousel .owl-dots .active span {
  background: #000
}

.custom-carousel .custom-carousel-info {
  z-index: 2;
  padding: 10px;
  text-shadow: 0 0 2px #000;
  font-size: 12px
}

.custom-carousel .custom-carousel-info .custom-carousel-info-name {
  border: 1px solid #fff;
  margin: 0 auto
}

.custom-carousel .custom-carousel-info .custom-carousel-info-description {
  font-size: 18px
}

.custom-carousel .mask {
  background: rgba(0, 0, 0, 0.5)
}

.custom-carousel.owl-carousel {
  position: static !important
}

.form-submit-wrap {
  background: #fff;
  padding: 25px 30px
}

@media screen and (max-width: 767px) {
  .form-submit-wrap {
    padding: 12px
  }
}

.form-submit-wrap .form-submit-title {
  text-align: center;
  font-size: 22px
}

.form-submit-wrap .form-submit-description {
  font-size: 15px;
  line-height: 28px
}

#error-page header {
  display: none
}

.fancybox-close {
  display: none
}

@media screen and (max-width: 767px) {
  .fancybox-title-float-wrap .child {
    display: none !important
  }
}

.fancybox-next span,
.fancybox-prev span {
  visibility: visible !important
}

.header {
  background: #171717;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  top: 0;
  position: fixed;
  width: 100%
}

@media (max-width: 767px) {
  .header {
    height: 52px
  }
}

.header .menu-button {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  width: 40px;
  text-align: center;
  height: 100%
}

@media (max-width: 767px) {
  .header .menu-button {
    display: block
  }
}

.header .search-button {
  color: #dbdbdb;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1000;
  width: 40px;
  text-align: center;
  font-size: 18px;
  height: 100%;
  line-height: 70px
}

.header .search-button:active {
  border: none;
  background: none
}

@media (max-width: 767px) {
  .header .search-button {
    line-height: 52px
  }
}

.header .search-button span {
  position: absolute;
  top: 1px;
  right: 12px
}

.search-wrap.search-wrap-animate {
  opacity: 1;
  visibility: visible
}

.search-wrap {
  background-color: #fff;
  position: fixed;
  top: 70px;
  visibility: hidden;
  opacity: 0;
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  z-index: 1000;
  width: 100%
}

@media (max-width: 767px) {
  .search-wrap {
    top: 52px
  }
}

.search-wrap .header-search {
  position: relative
}

.search-wrap .header-search input {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  display: block;
  border: none;
  height: 46px;
  padding: 30px 15px;
  font-size: 16px;
  outline: none;
  box-shadow: none;
  border-radius: 0 !important;
  -webkit-appearance: none
}

@media (max-width: 575px) {
  .search-wrap .header-search input {
    padding: 15px
  }
}

.admin-login {
  position: absolute;
  right: 50px;
  height: 100%;
  line-height: 70px
}

.header-menu {
  margin: 0 18px;
  padding: 0;
  list-style: none;
  float: left
}

@media screen and (max-width: 767px) {
  .header-menu {
    display: none
  }
}

.header-menu>li>a:hover {
  background: #1f1f1f;
  color: #fff
}

.header-menu li {
  display: inline-block;
  height: 70px;
  line-height: 70px;
  position: relative
}

.header-menu li a {
  display: block;
  padding-left: 12px;
  padding-right: 12px;
  font-size: 16px;
  color: #dbdbdb;
  position: relative
}

.header-menu li a .dot {
  background-color: #f23030;
  position: absolute;
  top: 16px;
  right: -2px;
  width: 5px;
  height: 5px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%
}

.header-menu li a i {
  display: inline-block;
  margin-right: 5px
}

.header-menu li .grand-menu,
.header-menu li .descendant-menu {
  z-index: 3;
  position: absolute;
  left: 100%;
  top: 0;
  padding: 16px 20px;
  opacity: 0;
  transform-origin: 40% 0;
  transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  white-space: nowrap
}

.header-menu li .sub-menu {
  transform: scale3d(0, 0, 0);
  opacity: 0
}

.header-menu li .sub-menu-animate {
  transform: scale3d(1, 1, 1) !important;
  opacity: 1 !important
}

.header-menu li .child-menu {
  z-index: 2;
  position: absolute;
  top: 70px;
  margin: 0;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
  background: #fff;
  white-space: nowrap;
  padding: 16px 20px;
  opacity: 0;
  transform-origin: 40% 0;
  transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transform: scale3d(0, 0, 0)
}

.header-menu li .child-menu:before {
  content: "";
  height: 10px;
  width: 10px;
  background-color: #fff;
  border: 1px solid #f0f0f0;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  border-left: 0;
  border-bottom: 0;
  position: absolute;
  top: -3px;
  left: 28px
}

.header-menu li .child-menu li {
  display: block;
  line-height: 35px;
  height: 35px;
  border-bottom: 1px solid #f0f0f0
}

.header-menu li .child-menu li:last-child {
  border-bottom: none
}

.header-menu li .child-menu li a {
  font-size: 14px;
  padding: 0;
  color: #171717
}

.header nav {
  position: relative;
  text-align: center
}

.header nav .logo {
  float: left;
  margin-top: 10px
}

.header nav .logo img {
  width: auto;
  height: 50px
}

.header nav .mobile-logo {
  display: none;
  padding-top: 8px
}

.header nav .mobile-logo img {
  width: auto;
  height: 36px
}

.header nav .site-title {
  font-size: 26px;
  height: 70px;
  line-height: 70px;
  color: #000
}

.header nav .menu-item-has-children>a:after {
  content: "\e917";
  font-family: strawberryicon;
  display: inline-block;
  margin-left: 10px;
  color: #B5B5B5;
  font-size: 10px;
  -webkit-transition: transform ease 0.3s;
  -moz-transition: transform ease 0.3s;
  -ms-transition: transform ease 0.3s;
  -o-transition: transform ease 0.3s;
  transition: transform ease 0.3s
}

.header nav .menu-item-has-children>a.active:after {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg)
}

.open-menu-wrap {
  -webkit-transform: translate(0, 0) !important;
  transform: translate(0, 0) !important
}

.menu-wrap {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  width: 260px;
  overflow: scroll;
  overflow-x: hidden;
  background: #171717ed;
  z-index: 101;
  padding-top: 52px;
  transform: translate(-300px, 0);
  -webkit-transition: -webkit-transform 430ms cubic-bezier(0.3, 0, 0, 1);
  transition: transform 430ms cubic-bezier(0.3, 0, 0, 1)
}

.menu-wrap .child-menu,
.menu-wrap .grand-menu,
.menu-wrap .sub-menu {
  display: none;
  list-style: none;
  padding: 0
}

.menu-wrap .child-menu {
  background: #00000073;
  padding-left: 40px
}

.menu-wrap .grand-menu {
  /* background: #ddd */
  padding-left: 36px;
}

.menu-wrap .mobile-menu-nav {
  list-style: none;
  padding: 0
}

.menu-wrap .mobile-menu-nav li {
  line-height: 40px;
  font-size: 16px
}

.menu-wrap .mobile-menu-nav li a {
  display: block;
  padding: 0 15px;
  text-decoration: none;
  color: #fff
}

.menu-wrap .mobile-menu-nav li i {
  margin-right: 20px;
  width: 20px
}

.menu-wrap .mobile-menu-nav .menu-item-has-children {
  position: relative
}

.menu-wrap .mobile-menu-nav .menu-item-has-children:after {
  font-family: strawberryicon;
  font-style: normal;
  font-weight: 400;
  font-size: 10px;
  position: absolute;
  width: 50px;
  line-height: 40px;
  right: 10px;
  top: 0;
  text-align: center;
  color: #50514f;
  z-index: 3;
  content: '\e917';
  -webkit-transition: transform ease .3s;
  -moz-transition: transform ease .3s;
  -ms-transition: transform ease .3s;
  -o-transition: transform ease .3s;
  transition: transform ease .3s
}

.menu-wrap .mobile-menu-nav .menu-item-has-children.active:after {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg)
}

.nav-bar {
  text-align: center;
  position: absolute;
  z-index: 1000;
  padding: 18px 15px
}

.nav-bar span {
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 20px;
  height: 1px;
  margin-bottom: 6px;
  position: relative;
  background: #dbdbdb;
  border-radius: 2px;
  z-index: 1;
  -webkit-transform-origin: 20px;
  transform-origin: 20px;
  -webkit-transition: background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);
  transition: background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1);
  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease;
  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1)
}

.nav-bar-animate span {
  opacity: 1;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  background: #fff
}

.nav-bar-animate span:nth-last-child(3) {
  opacity: 1;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg)
}

.nav-bar-animate span:nth-last-child(2) {
  opacity: 0
}

.menu-wrap-backdrop {
  background: rgba(0, 0, 0, 0.55);
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 430ms;
  animation-duration: 430ms;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-direction: normal;
  animation-direction: normal;
  -webkit-animation-delay: 0s;
  animation-delay: 0s
}

#footer {
  background: #222;
  border-top: 1px solid #eaeaea;
  color: #999;
  font-size: 14px
}

#footer p {
  color: #818181;
  font-size: 12px
}

#footer .footer-theme,
#footer .footer-feature,
#footer .footer-friends {
  overflow: hidden;
  margin: 8px 0 0
}

@media screen and (max-width: 767px) {

  #footer .footer-theme,
  #footer .footer-feature,
  #footer .footer-friends {
    margin-bottom: 20px
  }
}

#footer .footer-theme strong,
#footer .footer-feature strong,
#footer .footer-friends strong {
  color: #9b9b9b
}

@media screen and (max-width: 767px) {

  #footer .footer-theme strong,
  #footer .footer-feature strong,
  #footer .footer-friends strong {
    float: none;
    margin-bottom: 8px
  }
}

#footer .footer-theme span,
#footer .footer-feature span,
#footer .footer-friends span {
  color: #818181
}

@media screen and (max-width: 767px) {

  #footer .footer-theme,
  #footer .footer-feature,
  #footer .footer-friends {
    text-align: center
  }
}

#footer .footer-feature {
  position: relative
}

#footer .footer-feature .footer-menu {
  margin: 0;
  padding: 0;
  list-style: none
}

#footer .footer-feature .footer-menu li {
  display: inline-block;
  margin-right: 8px
}

#footer .footer-feature .footer-menu li a {
  text-decoration: none;
  color: #818181;
  display: block
}

#footer .footer-friends li {
  display: inline-block;
  margin-right: 20px;
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap
}

#footer .footer-friends li a {
  text-decoration: none;
  color: #fff
}

#footer .footer-friends li a span {
  color: #999999
}

#footer .footer-friends li img {
  float: left;
  margin: 2px 5px 0 0;
  width: 18px;
  height: 18px
}

.copyright {
  background-color: #222;
  padding: 10px 0;
  margin-top: 22px
}

.copyright p {
  margin: 0
}

@media screen and (max-width: 767px) {
  .copyright {
    text-align: center
  }
}

.copyright img {
  vertical-align: middle
}

.footer-follow {
  padding: 0;
  margin: 0;
  list-style: none;
  position: absolute;
  top: 0;
  right: 0
}

@media screen and (max-width: 767px) {
  .footer-follow {
    position: static;
    text-align: center
  }
}

.footer-follow li {
  display: inline-block;
  margin-right: 8px;
  background-color: #383838;
  text-align: center;
  line-height: 38px;
  width: 38px;
  height: 38px;
  border-radius: 38px;
  position: relative;
  cursor: pointer
}

.footer-follow li:hover:before {
  -webkit-transform: scale(1, 1);
  -moz-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  -o-transform: scale(1, 1);
  transform: scale(1, 1);
  opacity: 1
}

.footer-follow li:before {
  content: "";
  position: absolute;
  left: 0;
  z-index: 0;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  opacity: 0;
  -webkit-transition: 0.3s cubic-bezier(0.3, 0, 0, 1.3);
  -moz-transition: 0.3s cubic-bezier(0.3, 0, 0, 1.3);
  -ms-transition: 0.3s cubic-bezier(0.3, 0, 0, 1.3);
  -o-transition: 0.3s cubic-bezier(0.3, 0, 0, 1.3);
  transition: 0.3s cubic-bezier(0.3, 0, 0, 1.3);
  -webkit-transform: scale(0, 0);
  -moz-transform: scale(0, 0);
  -ms-transform: scale(0, 0);
  -o-transform: scale(0, 0);
  transform: scale(0, 0)
}

.footer-follow li a {
  width: 38px;
  height: 38px;
  border-radius: 38px;
  display: block;
  color: #999
}

.footer-follow li a:hover {
  color: #fff
}

.footer-follow li a,
.footer-follow li i {
  font-size: 18px;
  cursor: pointer;
  position: relative
}

.footer-follow .follow-wechat:hover:before {
  background-color: #51c332
}

.footer-follow .follow-qq:hover:before {
  background-color: #38B7EA
}

.footer-follow .follow-douyin {
  background-color: #383838;
  background-image: url(../zpz-images/douyin.png);
  background-size: 100% 100%;
}

.footer-follow .follow-douyin:hover:before {
  background-color: #f8991d;
  background-image: url(../zpz-images/douyin-hover.png);
  background-size: 100% 100%;
}

.footer-follow .follow-email {
  background-color: #383838;
  background-image: url(../zpz-images/email.png);
  background-size: 100% 100%;
}

.footer-follow .follow-email:hover:before {
  background-color: #DD3D53;
  background-image: url(../zpz-images/email-hover.png);
  background-size: 100% 100%;
}

.follow-wechat-popup {
  width: 120px;
  height: 120px;
  position: absolute;
  z-index: 10;
  opacity: 0;
  display: none;
  bottom: 58px;
  left: -44px;
  box-shadow: 0 0 6px rgba(14, 22, 30, 0.3)
}

.follow-wechat-popup img {
  display: block;
  width: 100%
}

.follow-wechat-popup:after {
  content: "";
  height: 10px;
  width: 10px;
  background-color: #fff;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  border-left: 0;
  border-bottom: 0;
  position: absolute;
  z-index: 0;
  bottom: -4px;
  left: 56px
}

.follow-douyin-popup {
  width: 120px;
  height: 120px;
  position: absolute;
  z-index: 10;
  opacity: 0;
  display: none;
  bottom: 58px;
  left: -44px;
  box-shadow: 0 0 6px rgba(14, 22, 30, 0.3)
}

.follow-douyin-popup img {
  display: block;
  width: 100%
}

.follow-douyin-popup:after {
  content: "";
  height: 10px;
  width: 10px;
  background-color: #fff;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  border-left: 0;
  border-bottom: 0;
  position: absolute;
  z-index: 0;
  bottom: -4px;
  left: 56px
}

.overlay {
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99;
  display: none
}

.scrollTop.active {
  opacity: 0.5
}

.scrollTop {
  width: 42px;
  height: 42px;
  position: fixed;
  bottom: 186px;
  right: 42px;
  z-index: 1000;
  border: 1px solid #333;
  border-radius: 42px;
  opacity: 0;
  background: #222;
  text-align: center;
  line-height: 42px;
  cursor: pointer;
  color: #fff
}

@media (max-width: 575px) {
  .scrollTop {
    bottom: 82px;
    right: 22px
  }
}

.scrollTop i {
  color: #fff;
  font-size: 18px
}

.scrollTop:hover {
  opacity: 1
}

.shot {
  background: #fff;
  border-bottom: 1px solid #e8e8e8
}

.shot .shot-type {
  text-align: center;
  padding-bottom: 58px;
}

.shot .shot-type li {
  cursor: pointer;
  display: inline-block;
  padding: 19px
}

@media (max-width: 575px) {
  .shot {
    display: none;
  }

  .shot .shot-type li {
    padding: 14px
  }
}

.shot .shot-type li a {
  color: #000
}

.shot .shot-type li.active {
  border-bottom: 2px solid #000
}

.archive-header {
  background: #fff
}

.archive-body:after {
  content: '';
  display: table;
  clear: both
}

main {
  margin-bottom: 68px
}

body {
  padding-top: 70px
}

@media screen and (max-width: 767px) {
  body {
    padding-top: 52px
  }
}

.post-wrap:after {
  clear: both;
  content: "";
  display: table
}

.post {
  margin-bottom: 30px;
  padding: 25px;
  background: #fff
}

@media (max-width: 575px) {
  .post {
    padding: 15px;
    margin-bottom: 10px
  }
}

.post .post-title a {
  color: #000;
  font-size: 24px
}

@media (max-width: 575px) {
  .post .post-title a {
    font-size: 16px
  }
}

.post .post-meta-author a {
  color: #404040
}

.post .post-meta-author img {
  width: 22px;
  height: 22px;
  border-radius: 22px;
  top: 0;
  left: 0;
  display: inline-block;
  vertical-align: middle
}

.post .post-meta-top {
  margin-bottom: 10px;
  font-size: 13px
}

.post .post-meta-top i {
  font-size: 12px
}

.post .post-meta-top .post-meta-time {
  color: #8a8a8a
}

.post .post-meta-bottom {
  overflow: hidden
}

.post .post-meta-bottom li {
  display: inline-block;
  vertical-align: middle;
  color: #aaa;
  margin-right: 8px
}

.post .post-meta-bottom li i {
  font-size: 16px
}

.post .post-body {
  word-break: break-all
}

.post .post-body a {
  color: #777
}

.post-style-standard .post-img {
  height: 0;
  padding-bottom: 50%;
  position: relative;
  display: block;
  overflow: hidden;
  margin-bottom: 10px
}

.post-style-standard .post-body {
  position: relative;
  overflow: hidden;
  margin-bottom: 10px
}

.post-style-standard .post-body a {
  color: #555;
  font-size: 15px;
  line-height: 20px
}

@media (max-width: 575px) {
  .post-style-standard .post-body a {
    margin: 0 20px
  }
}

.post-advertisement {
  background: #fff;
  padding: 25px;
  margin-bottom: 30px
}

@media (max-width: 575px) {
  .post-advertisement {
    padding: 15px;
    margin-bottom: 10px
  }
}

.post-advertisement img {
  width: 100%;
  height: 100%;
  display: block
}

.post-style-card {
  margin-bottom: 30px;
  border-radius: 3px;
  padding: 0 !important
}

@media (max-width: 575px) {
  .post-style-card {
    margin-bottom: 15px
  }
}

.post-style-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08)
}

.post-style-card .post-img {
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  height: 0;
  padding-bottom: 82%;
  position: relative;
  display: block;
  overflow: hidden
}

.post-style-card .post-top {
  padding: 25px 15px 0
}

.post-style-card .post-title a {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  font-size: 20px;
  display: block;
  color: #000
}

.post-style-card .post-top-meta {
  overflow: hidden
}

.post-style-card .post-top-meta .post-tag a,
.post-style-card .post-top-meta .post-tag i {
  color: #aaa
}

.post-style-card .post-top-meta .post-category {
  color: #aaa
}

.post-style-card .post-top-meta .post-time {
  float: right;
  color: #aaa
}

.post-style-feature {
  padding: 0 !important;
  margin-bottom: 60px;
  background: #fff;
  box-shadow: none;
  border-radius: 6px
}

.post-style-feature:hover .post-meta {
  bottom: 0
}

@media (max-width: 575px) {
  .post-style-feature {
    margin-bottom: 15px
  }
}

.post-style-feature .post-title a {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  display: block;
  color: #000
}

.post-style-feature .post-excerpt {
  margin-left: 15px;
  margin-right: 15px;
  padding-bottom: 20px;
  overflow: hidden
}

.post-style-feature .post-excerpt a {
  color: #aaa
}

.post-style-feature .post-img {
  height: 0;
  padding-bottom: 26%;
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 6px 6px 0px 0px
}

.post-style-feature .post-meta {
  width: 100%;
  position: absolute;
  bottom: -41px;
  background: rgba(0, 0, 0, 0.6)
}

.post-style-feature .post-meta li {
  color: #fff !important;
  font-size: 13px
}

.post-style-feature .post-meta li i {
  font-size: 13px
}

.post-style-feature .post-meta-bottom li {
  margin-right: 6px
}

.pagination-number {
  text-align: left !important
}

.pagination {
  overflow: hidden;
  padding-bottom: 3px;
  text-align: center;
  margin-top: 20px
}

.pagination a {
  text-decoration: none;
  color: #333;
  display: block;
  background: #fff;
  padding: 10px 22px
}

.pagination .pagination-num {
  display: inline-block;
  margin-right: 10px;
  width: 40px;
  height: 40px;
  border-radius: 100%;
  line-height: 40px;
  text-align: center;
  padding: 0 !important
}

.pagination .pagination-num.current {
  background: #000;
  color: #fff
}

.pagination .previous,
.pagination .next {
  background: #fff
}

.pagination .count {
  display: inline-block;
  padding: 6px 12px
}

.pagination .more {
  color: #777
}

#comment-nav-below {
  text-align: center
}

#comment-nav-below .page-numbers {
  border-radius: 2px;
  padding: 5px;
  color: #333;
  border: 1px solid #f3f3f3
}

#sidebar {
  position: relative
}

@media screen and (max-width: 767px) {
  #sidebar {
    display: none
  }
}

@media screen and (max-width: 767px) {
  #sidebar .affix {
    display: none
  }
}

.widget {
  background: #fff;
  margin-bottom: 30px;
  padding: 16px;
  position: relative
}

@media screen and (max-width: 767px) {
  .widget {
    padding: 12px
  }
}

.widget .widget-title {
  margin-bottom: 15px;
  font-size: 15px;
  font-weight: 600;
  padding-bottom: 5px;
  border-bottom: 1px solid #ddd;
  position: relative
}

.widget .widget-title span {
  display: inline-block;
  padding-right: 20px;
  position: relative
}

.widget .widget-title span:after {
  position: absolute;
  z-index: 2;
  content: "";
  border-bottom: 1px solid #000;
  width: 100%;
  height: 1px;
  left: 0;
  bottom: -6px
}

.widget ul {
  list-style: none;
  padding: 0;
  margin: 0
}

.widget ul a {
  text-decoration: none;
  color: #555
}

.calendar_wrap {
  position: relative
}

.calendar_wrap table {
  width: 100%
}

.calendar_wrap table thead tr {
  color: #666
}

.calendar_wrap table td {
  text-align: center;
  background-color: #f6f6f6;
  border: 2px solid #fff;
  font-size: 14px;
  color: #666;
  line-height: 1.5em
}

.calendar_wrap table td a {
  text-decoration: none;
  display: block;
  color: #fff
}

.calendar_wrap table .pad {
  background-color: #fff
}

.calendar_wrap caption {
  position: absolute;
  top: -32px;
  right: 0;
  background: #fff;
  padding: 0 0 0 6px
}

.widget_links li {
  overflow: hidden;
  margin-bottom: 8px;
  padding-left: 22px;
  position: relative;
  font-size: 13px;
  color: #888
}

.widget_links li a {
  overflow: hidden;
  display: block;
  font-size: 15px;
  color: #000
}

.widget_links li img {
  position: absolute;
  left: 0;
  top: 2px;
  display: block;
  width: 18px;
  height: 18px;
  margin-right: 6px
}

.widget-wechat .widget-wechat-body {
  overflow: hidden
}

.widget-wechat .widget-wechat-body .widget-wechat-img img {
  width: 110px;
  height: 110px;
  float: left;
  margin-right: 5px;
  display: block
}

.widget-wechat .widget-wechat-body .widget-wechat-content .widget-wechat-title {
  font-size: 17px;
  margin-top: -2px;
  margin-bottom: 12px
}

.widget-wechat .widget-wechat-body .widget-wechat-content .widget-wechat-account {
  font-weight: 600;
  font-size: 10px;
  margin-top: 0;
  margin-bottom: 2px
}

.widget-wechat .widget-wechat-body .widget-wechat-content .widget-wechat-description {
  margin-top: 0;
  font-size: 15px;
  font-weight: 600
}

.widget_search input {
  display: block;
  margin: 0;
  padding: 3px;
  width: 100%;
  height: 26px;
  border: 1px solid #ddd
}

.tagcloud {
  overflow: hidden;
  width: 202px;
  margin: auto;
}

.tagcloud a {
  padding: 5px 8px;
  text-decoration: none;
  border: 1px solid #f0f0f0;
  font-size: 14px !important;
  color: #777;
  border-radius: 100px;
  margin: 0 6px 6px 0;
  display: block;
  float: left;
  transition: all 0.1s
}

.tagcloud a:hover {
  color: #fff;
  border: 1px solid #fff
}

.tagcloud a span {
  display: none
}

.widget-hotpost-image .widget-hotpost-image-item {
  margin-bottom: 16px;
  display: block;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 108px
}

.widget-hotpost-image .widget-hotpost-image-item:hover .widget-hotpost-image-overlay {
  opacity: .6
}

.widget-hotpost-image .widget-hotpost-image-item:last-child {
  margin-bottom: 0
}

.widget-hotpost-image .recent-post-img {
  width: 100%;
  height: 108px;
  overflow: hidden;
  border-radius: 2px
}

.widget-hotpost-image .recent-post-img img {
  border-radius: 2px;
  display: block;
  width: 100%;
  min-height: 100%;
  height: auto
}

.widget-hotpost-image .widget-hotpost-meta {
  position: absolute;
  bottom: 0;
  padding: 10px;
  z-index: 100;
  width: 100%;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
  color: #ddd
}

.widget-hotpost-image .widget-hotpost-meta .widget-hotpost-image-title {
  color: #fff
}

.widget-hotpost-side ul,
.widget-hotpost-side li {
  overflow: hidden
}

.widget-hotpost-side a {
  display: block;
  margin-top: 13px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden
}

.widget-hotpost-side .recent-post-img {
  width: 46px;
  height: 46px;
  float: left;
  margin-right: 10px;
  margin-bottom: 8px;
  overflow: hidden;
  border-radius: 5px
}

.widget-hotpost-side .recent-post-img img {
  border-radius: 5px;
  display: block;
  width: auto;
  height: 100%
}

.widget-hotpost-brief li {
  position: relative;
  padding-left: 12px;
  margin-bottom: 12px
}

.widget-hotpost-brief li:last-child {
  margin-bottom: 0
}

.widget-hotpost-brief li i {
  position: absolute;
  left: 0;
  top: 4px;
  font-size: 10px;
  font-weight: bolder
}

.widget-hotpost-brief li .widget-hotpost-brief-time {
  color: #bbb
}

.widget-comments .widget-comments-item {
  padding-bottom: 12px
}

.widget-comments .widget-comments-item .avatar {
  display: inline-block;
  vertical-align: middle;
  border-radius: 16px;
  width: 24px;
  height: 24px
}

.widget-comments .widget-comments-item .widget-comment-author {
  display: inline-block;
  color: #666
}

.widget-comments .widget-comments-item:last-child {
  margin-bottom: 0;
  border-bottom: none;
  padding-bottom: 0
}

.widget-comments .widget-comments-item .widget-comment-content {
  margin-bottom: 8px;
  display: block;
  background: #f0f0f0;
  padding: 10px 20px;
  position: relative
}

.widget-comments .widget-comments-item .widget-comment-content:before {
  position: absolute;
  top: -4px;
  left: 40px;
  content: "";
  height: 8px;
  width: 8px;
  background: #f0f0f0;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg)
}

.widget-comments .widget-comments-item .widget-comment-meta {
  color: #aaa;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  position: relative;
  line-height: 18px
}

.widget-comments .widget-comments-item .widget-comment-meta .widget-comment-date {
  color: #aaa
}

.widget-comments .widget-comments-item .widget-comment-meta .widget-comment-title {
  color: #666
}

.widget-profile-elegant .widget-profile-avatar {
  width: 88px;
  height: 88px;
  margin: 15px auto 8px;
  border-radius: 100%
}

.widget-profile-elegant .widget-profile-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 100%
}

.widget-profile-elegant .widget-profile-user {
  margin-top: 8px;
  font-size: 18px
}

.widget-profile-elegant .widget-profile-user a {
  text-decoration: none;
  color: #000
}

.widget-profile-elegant .widget-profile-description {
  color: #888;
  font-size: 13px
}

.widget-profile-elegant .widget-profile-role {
  text-align: center
}

.widget-profile-elegant .widget-profile-role span {
  display: inline-block;
  padding: 1px 10px;
  border-radius: 2px;
  font-size: 12px;
  background-color: #000;
  color: #fff
}

.widget-profile-elegant .widget-profile-footer {
  border-top: 1px solid #eee;
  margin: 0 -16px -16px;
  overflow: hidden;
  font-size: 14px
}

.widget-profile-elegant .widget-profile-footer a {
  color: #777
}

.widget-profile-elegant .widget-profile-footer a:hover {
  background: #f8f8f8;
  color: #000
}

.widget-profile-elegant .widget-profile-footer a i {
  margin-right: 4px;
  font-size: 16px
}

.widget-follow table {
  width: 100%
}

.widget-follow table td {
  text-align: center;
  font-size: 18px;
  color: #999;
  cursor: pointer;
  transition: all .3s
}

.widget-follow table td a {
  display: block;
  color: #999
}

.widget-follow table .follow-wechat {
  position: relative
}

.widget-follow table .follow-wechat:hover {
  color: #5FC26E
}

.widget-follow table .follow-wechat-popup {
  left: -8px
}

.widget-follow table .follow-douyin-popup {
  left: -8px
}

.widget-follow table .follow-weibo a:hover {
  color: #DD3D53
}

.widget-follow table .follow-qq a:hover {
  color: #38B7EA
}

.widget-follow table .follow-rss a:hover {
  color: #f2c136
}

.sidebar-advertisement {
  margin-bottom: 30px;
  background: #fff;
  padding: 16px
}

.sidebar-advertisement a img {
  width: 100%;
  height: 100%;
  display: block
}

.article-btn-group {
  background: #fff;
  position: fixed;
  bottom: auto;
  margin-left: -90px;
  width: 60px;
  text-align: center
}

.article-btn-group .article-btn-primary:hover:after {
  background: #0275d8
}

.article-btn-group .article-btn-warning:hover:after {
  background: #f0ad4e
}

.article-btn-group .article-btn-danger:hover:after {
  background: #ed1c24
}

.article-btn-group .article-btn-info:hover:after {
  background: #5bc0de
}

.article-btn-group .article-btn-success:hover:after {
  background: #5cb85c
}

.article-btn-group ul li a {
  color: #777;
  display: inline-block;
  height: 60px;
  width: 100%;
  line-height: 60px;
  font-size: 20px;
  border-bottom: 1px solid #eee;
  position: relative;
  z-index: 1
}

.article-btn-group ul li a:hover {
  color: #fff
}

.article-btn-group ul li a:hover:after {
  opacity: 1;
  background: #ff5b77;
  transform: scale(1, 1)
}

.article-btn-group ul li a:after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  top: 0;
  width: 60px;
  height: 60px;
  opacity: 0;
  transition: 0.5s cubic-bezier(0.3, 0, 0, 1.3);
  transform: scale(0, 0)
}

.article {
  background: #fff;
  margin-bottom: 30px;
  padding: 25px 30px;
  overflow: hidden
}

@media screen and (max-width: 767px) {
  .article {
    padding: 12px
  }
}

.article p {
  word-wrap: break-word;
  word-break: normal
}

.article-indent p {
  /* text-indent: 2em */
}

.article-indent .btn {
  text-indent: 0
}

.btn-pay {
  border-radius: 2px;
  color: #fff !important;
  text-decoration: none;
  font-size: 17px;
  transition: all .8s;
  padding: 9px 22px;
  background-color: #38B7EA;
  border: 1px solid #33acdc
}

.btn-pay:hover {
  opacity: 0.8
}

.article-img img {
  display: block;
  width: 100%;
  max-height: 620px;
  height: auto;
  margin-bottom: 8px
}

.article-title {
  font-size: 28px
}

@media (max-width: 575px) {
  .article-title {
    font-size: 18px
  }
}

.article-title a {
  color: #000;
  font-weight: 800
}

.article-meta {
  margin-bottom: 20px;
  position: relative;
  color: #aaa
}

.article-meta a {
  text-decoration: none;
  color: #aaa;
  margin-right: 16px
}

.article-meta .article-meta-tags {
  margin-top: 6px;
  overflow: hidden
}

.article-meta .article-meta-tags a {
  padding: 2px 8px;
  text-decoration: none;
  font-size: 14px !important;
  color: #fff;
  border-radius: 100px;
  margin: 0 6px 6px 0;
  display: block;
  float: left;
  transition: all 0.1s
}

.article-meta .article-meta-tags a:hover {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05));
  color: #fff
}

.article-meta .article-meta-tags a span {
  display: none
}

.article-meta .article-meta-time {
  margin-right: 12px
}

.article-meta .article-meta-comment {
  position: relative;
  margin-right: 6px
}

.article-body {
  margin-bottom: 28px;
  overflow: hidden;
  font-size: 16px;
  line-height: 1.8
}

.article-body blockquote {
  padding-left: 18px;
  border-left: 3px solid #ddd;
  font-size: 15px
}

.article-body blockquote p {
  font-size: 15px
}

.article-body p {
  word-break: break-all;
  margin-block-start: 0em;
  margin-block-end: 0em;
  word-wrap: break-word
}

.article-body ul,
.article-body ol {
  list-style: disc;
  padding-left: 40px
}

.article-body ul li,
.article-body ol li {
  margin-bottom: 12px
}

.article-body h2,
.article-body h3 {
  font-size: 18px;
  margin-bottom: 15px;
  margin-top: 32px;
  padding-left: 9px
}

.article-body pre {
  background-color: #f0f0f0;
  padding: 12px
}

.article-body code {
  background: #f3f3f3;
  border-radius: 2px;
  font-family: "Courier New"
}

.article-body img,
.article-body video {
  /* display: block;
  max-width: 100%;
  margin: 12px auto;
  height: auto */
}

.article-body embed {
  display: block;
  max-width: 100%;
  margin: 12px auto
}

.article-body iframe {
  display: block;
  max-width: 100%;
  margin: 12px auto
}

.article-body .wp-caption {
  width: 100% !important
}

.article-body .wp-caption img {
  width: 100%;
  height: 100%
}

.article-body .wp-caption-text {
  text-align: center;
  color: #aaa
}

.article-body .wp-video {
  margin: 30px auto
}

.article-copyright {
  margin-top: 15px;
  margin-bottom: 48px;
  font-size: 13px;
  color: #ccc;
  text-align: center;
  letter-spacing: 1px;
  line-height: 16px
}

.article-copyright a {
  text-decoration: none;
  color: #ccc;
  font-size: 13px
}

.article-support {
  position: relative;
  display: inline-block
}

.article-support .article-support-title {
  background: #fff;
  font-size: 14px;
  text-align: center;
  color: #888;
  margin-bottom: 20px
}

.article-support .article-support-img {
  width: 380px;
  box-shadow: 0 0 6px rgba(14, 22, 30, 0.3);
  margin-bottom: 12px;
  position: absolute;
  left: 0;
  bottom: 58px;
  background-color: #fff;
  z-index: 99;
  display: none;
  opacity: 0;
  padding: 0 6px
}

.article-support .article-support-img:before {
  position: absolute;
  content: ' ';
  background-color: #fff;
  width: 14px;
  height: 14px;
  bottom: -7px;
  z-index: -98;
  left: 20px;
  transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  box-shadow: 1px 3px 5px #ddd
}

@media screen and (max-width: 767px) {
  .article-support .article-support-img {
    width: 100%;
    left: 0;
    margin-left: 0
  }
}

.article-support .article-support-img .article-support-img-title {
  text-align: center;
  font-weight: 600
}

.article-support .article-support-img .article-support-zhifubao {
  float: left;
  width: 50%;
  padding: 12px 6px 0
}

.article-support .article-support-img .article-support-wechat {
  float: left;
  width: 50%;
  padding: 12px 6px 0
}

.article-support .article-support-img img {
  width: 100%;
  display: inline-block
}

.article-support .article-support-button {
  text-align: center;
  font-size: 16px
}

.article-support .article-support-button a {
  padding: 6px 16px;
  display: inline-block;
  color: #fff;
  border-radius: 3px;
  border: none
}

.article-share {
  overflow: hidden;
  display: inline-block;
  float: right
}

.article-share .article-share-title {
  margin-top: 2px;
  margin-right: 8px;
  float: left
}

.article-share .bdsharebuttonbox a {
  margin-right: 6px;
  font-size: 24px;
  color: #aaa
}

.article-like {
  margin: 40px auto 60px
}

.article-like .favorite {
  margin: 0 auto;
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #fff;
  width: 80px;
  height: 80px;
  border-radius: 80px;
  font-size: 20px
}

.article-like .favorite i {
  font-size: 28px
}

.article-advertisement {
  margin-bottom: 18px
}

.article-advertisement a img {
  display: block;
  width: 100%;
  height: 100%
}

#post-link {
  overflow: hidden;
  border-radius: 2px;
  background: #fff;
  margin-bottom: 30px
}

#post-link a:nth-child(2) {
  float: right
}

#post-link a {
  text-decoration: none;
  color: #000
}

#post-link .post-link-next {
  text-align: right
}

#post-link .post-link-previous,
#post-link .post-link-next {
  padding: 12px 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  text-align: center
}

@media screen and (max-width: 767px) {

  #post-link .post-link-previous,
  #post-link .post-link-next {
    text-align: center
  }
}

#post-link .post-link-previous:hover,
#post-link .post-link-next:hover {
  background: #fafafa
}

.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 2px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05)
}

.panel-title {
  padding: 6px 12px
}

.panel-content {
  padding: 12px
}

.panel-warning {
  border-color: #faebcc
}

.panel-warning .panel-title {
  background-color: #fcf8e3;
  border-bottom: 1px solid #faebcc;
  color: #8a6d3b
}

.panel-forbid {
  border-color: #ebccd1
}

.panel-forbid .panel-title {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1
}

.panel-notice {
  border-color: #337ab7
}

.panel-notice .panel-title {
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7
}

.panel-geek {
  border-color: #111
}

.panel-geek .panel-title {
  color: #fff;
  background-color: #222;
  border-color: #111
}

.page-common {
  padding: 25px 30px;
  overflow: hidden
}

@media screen and (max-width: 767px) {
  .page-common {
    padding: 12px
  }
}

.page-common img {
  max-width: 100%;
  display: block;
  height: 100%;
  margin: 12px auto
}

.page-common blockquote {
  padding-left: 18px;
  border-left: 3px solid #ddd;
  font-size: 15px
}

.page-common blockquote p {
  font-size: 15px
}

.page-common a {
  color: #38B7EA;
  text-decoration: none
}

.page-common p {
  font-size: 16px;
  line-height: 1.8;
  word-break: break-all;
  margin: 0 0 20px
}

.page-common ul li,
.page-common ol li {
  margin-bottom: 12px
}

.page-common h2,
.page-common h3 {
  font-size: 18px;
  margin-bottom: 15px;
  margin-top: 32px;
  padding-left: 9px;
  border-left: 5px solid #333
}

.page-common pre {
  background-color: #f0f0f0;
  padding: 12px;
  font-size: 15px
}

.page-common code {
  background: #f3f3f3;
  border-radius: 2px;
  font-family: "Courier New"
}

.page-common img,
.page-common video {
  display: block;
  max-width: 100%;
  margin: 12px auto;
  height: auto
}

.page-common iframe {
  display: block;
  max-width: 100%;
  margin: 12px auto
}

.page-common embed {
  display: block;
  max-width: 100%;
  margin: 12px auto
}

.page-common .wp-caption {
  width: 100% !important
}

.page-common .wp-caption img {
  width: 100%;
  height: 100%
}

.page-common .wp-caption-text {
  text-align: center;
  color: #aaa
}

.page-common .wp-video {
  margin: 30px auto
}

.page-common .page-title {
  font-size: 18px;
  margin-top: 0
}

.page-common .linkcat h2 {
  border: none;
  font-size: 15px;
  padding: 0
}

.no-page .no-page-title {
  font-size: 26px;
  text-align: center
}

@media screen and (max-width: 767px) {
  .no-page .no-page-title {
    font-size: 19px
  }
}

.no-page img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto
}

.page-about {
  background: #fff
}

.page-friends {
  background: #fff
}

.page-friends h2 {
  margin-top: 0;
  font-size: 18px
}

.page-friends li {
  list-style: none
}

.page-friends .blogroll li {
  display: inline-block;
  width: 24%;
  overflow: hidden;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap
}

@media screen and (max-width: 767px) {
  .page-friends .blogroll li {
    width: 49%
  }
}

.page-friends .blogroll li a {
  text-decoration: none;
  color: #333
}

.page-friends .blogroll li img {
  float: left;
  margin: 2px 5px 0 0;
  width: 18px;
  height: 18px
}

.page-friends ul {
  padding: 0;
  margin: 0
}

.page-tags {
  background: #fff
}

.page-tags h3 {
  margin-top: 0
}

.page-tags a {
  text-decoration: none;
  background-color: #fff;
  display: inline-block;
  padding: 6px 12px;
  margin-right: 10px;
  margin-bottom: 10px;
  color: #777;
  font-size: 14px !important;
  border: 1px solid #f0f0f0;
  transition: all .1s;
  border-radius: 100px
}

.page-tags a:hover {
  background-color: #ff1677;
  border: 1px solid #fff;
  color: #fff
}

.page-contact {
  background: #fff
}

.page-contact h3 {
  margin-top: 0
}

.category-feature-header {
  background: #fff
}

.category-feature-header .archive-header-title {
  color: #171717
}

.page-category-img {
  height: 0;
  padding-bottom: 260px;
  width: 100%;
  position: relative;
  text-align: center
}

@media (max-width: 575px) {
  .page-category-img {
    padding-bottom: 140px
  }
}

.page-category-img .page-category-info {
  position: absolute;
  z-index: 100;
  top: 50%;
  width: 100%;
  word-break: break-all;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  color: #fff
}

.page-category-img .page-category-info .page-category-title {
  font-size: 13px;
  margin-bottom: 10px;
  border: 1px solid #fff;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 20px
}

.page-category-img .page-category-info .page-category-description {
  font-size: 48px
}

@media (max-width: 575px) {
  .page-category-img .page-category-info .page-category-description {
    font-size: 19px
  }
}

.page-category-img .page-category-info .page-category-number {
  font-size: 16px
}

.category-child {
  background: #fff
}

.category-child ul li a {
  padding: 6px 22px;
  border: 1px solid #DBDBDB;
  margin: 0 10px 2px 0;
  border-radius: 20px;
  color: #171717
}

.category-child ul li a:hover {
  background: #171717;
  color: #fff;
  border: 1px solid #171717
}

.category-child ul li a.active {
  border: 1px solid #171717;
  background: #171717;
  color: #fff
}

.category-child .btn-category-child {
  cursor: pointer
}

.category-child .btn-category-child i {
  font-size: 12px
}

.category-child .category-child-all {
  overflow: hidden;
  overflow-y: scroll;
  height: 180px;
  border-top: 2px solid #eee
}

.category-child .category-child-all li a {
  margin-bottom: 12px
}

.category-nav li {
  display: inline-block
}

.category-nav li a {
  background: #fff;
  display: inline-block;
  padding: 7px 22px;
  border-radius: 20px;
  color: #171717;
  margin: 0 5px 10px 0
}

.category-nav li a:hover {
  color: #fff;
  background: #171717
}

.category-nav li a.active {
  background: #171717;
  color: #fff
}

.layout-type-wrap-animate.layout-type-wrap .btn-layout-type {
  background: #fff;
  color: #999;
  box-shadow: 0 2px 5px 0 rgba(146, 146, 146, 0.1)
}

.layout-type-wrap-animate.layout-type-wrap .layout-type {
  display: block !important
}

.layout-type-wrap {
  right: 15px;
  top: 0;
  z-index: 10
}

.layout-type-wrap .btn-layout-type {
  color: #bbb;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px
}

.layout-type-wrap .layout-type {
  display: none;
  width: 54px;
  right: 0;
  top: 38px;
  background: #fff;
  box-shadow: 0 2px 5px 0 rgba(146, 146, 146, 0.1);
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  border-top-right-radius: 0
}

.layout-type-wrap .layout-type li {
  margin-bottom: 5px;
  cursor: pointer;
  background-color: #ececec;
  color: #aaa;
  padding: 12px 12px;
  border-radius: 4px;
  text-align: center
}

.layout-type-wrap .layout-type li.active {
  background: #171717;
  color: #fff
}

.page .comments {
  padding: 0;
  background: #fff;
  margin-bottom: 0
}

.comments {
  padding: 25px 30px;
  background: #fff;
  margin-bottom: 10px
}

@media screen and (max-width: 767px) {
  .comments {
    padding: 12px
  }
}

.comments .logged-in-as a {
  text-decoration: none;
  color: #666
}

.comments #respond .comment-notes {
  display: none
}

.comments #respond input {
  position: relative;
  border-radius: 3px;
  border: 1px solid #ddd;
  padding: 5px 12px
}

.comments #respond .comment-input+.comment-input {
  padding-left: 15px
}

@media (max-width: 767px) {
  .comments #respond .comment-input+.comment-input {
    padding-left: 0
  }
}

.comments #respond .comment-input {
  margin-bottom: 15px
}

.comments #respond .comment-input input {
  display: block;
  width: 100%
}

.comments #respond textarea {
  max-width: 100%;
  min-width: 100%;
  border-radius: 3px;
  border: 1px solid #ddd;
  height: 150px;
  padding: 8px 20px
}

.comments #respond .form-submit input {
  border: 1px solid transparent;
  padding: 6px 16px;
  color: #fff;
  border-radius: 100px
}

.comments #respond .form-submit input:hover {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05))
}

.comments #respond .comment-form-url,
.comments #respond .comment-form-email,
.comments #respond .comment-form-user {
  position: relative
}

.comments .comment-reply-title {
  font-weight: 100;
  font-size: 15px
}

.comments .comment-reply-title a {
  color: #38B7EA;
  text-decoration: none;
  font-size: 15px
}

.comments .comments-title {
  margin-bottom: 12px;
  color: #999
}

.comments .comments-list {
  list-style: none;
  padding: 0;
  margin: 0
}

.comments .comments-list .comment {
  word-wrap: break-word;
  word-break: break-all;
  margin-bottom: 23px;
  padding-bottom: 23px;
  border-bottom: 1px solid #f9f9f9;
  position: relative
}

.comments .comments-list .comment .children {
  list-style: none;
  padding: 10px;
  margin: 15px 0 15px 55px;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05)
}

.comments .comments-list .comment .children .comment-avatar {
  width: 38px;
  height: 38px
}

.comments .comments-list .comment .children .comment-body {
  margin-left: 42px
}

.comments .comments-list .comment .comment-avatar {
  position: absolute;
  left: 0;
  top: 0;
  width: 48px;
  height: 48px
}

.comments .comments-list .comment .comment-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 48px
}

.comments .comments-list .comment .comment-body {
  margin-left: 58px
}

.comments .comments-list .comment .comment-body p {
  margin: 6px 0 12px;
  line-height: 25px
}

.comments .comments-list .comment .comment-body p a {
  text-decoration: none;
  color: #38B7EA
}

.comments .comments-list .comment .comment-body .comment-meta .comment-date {
  text-decoration: none;
  color: #999;
  font-size: 14px;
  font-family: "Microsoft YaHei", "WenQuanYi Micro Hei"
}

.comments .comments-list .comment .comment-body .comment-meta .comment-action {
  position: absolute;
  right: 0
}

.comments .comments-list .comment .comment-body .comment-meta .comment-reply-link {
  text-decoration: none;
  color: #ccc;
  font-size: 13px
}

.comments .comments-list .comment .comment-body .comment-meta .comment-edit-link {
  text-decoration: none;
  color: #ccc;
  font-size: 13px
}

.friend-link {
  background: #fff;
  border-radius: 3px
}

.friend-link li {
  margin-right: 15px;
  list-style: none;
  display: inline-block
}

.friend-link li a {
  color: #999
}

#wp_paging_w37 {
  display: none
}


.footer-theme img {
  width: 250px;
  padding-right: 20px;
  border-right: 2px #fff solid;
}

.footer_about {
  display: inline-grid;
  position: absolute;
  margin-left: 20px;
  color: #fff;
}

.footer_about span {
  height: 22px;
  line-height: 22px;
}

.footer_about span a {
  color: #818181;
  margin-right: 28px;
}

.footer_about span a:hover {
  color: #38b7ea;
}


.ceshi_qq {
  background-image: url(../images/artist.png);
}

.wp_articlecontent img {
  cursor: pointer;
  height: auto !important;
}

.wp_search .search {
  display: none;
}

.search input {
  color: #bababa;
  border: none;
  background: none;
  height: 60px;
  line-height: 60px;
  font-size: 16px;
  width: 100% !important;
  padding-right: 15px;
  padding-left: 15px;
}

.wp_search table {
  width: 100%;
}


.wp_search table tbody tr td:first-child input {
  height: 60px;
  border: none;
  color: #8e8e8e;
  outline: none;
  font-size: 16px;
}

.widget-profile-elegant .widget-profile-user p {
  text-decoration: none;
  color: #aaa;
  font-size: 14px;
  font-weight: normal;
}


.wp_artfuns .wp_art_adjoin a {
  color: #2d2d2d;
}

.prev {
  padding-left: 10px;
  display: block;
  float: left;
  height: 30px;
  line-height: 30px;
  color: #2d2d2d;
}

.wp_artfuns .wp_art_adjoin .prev:hover {
  color: #0099cc;
}

.next {
  padding-left: 10px;
  display: block;
  float: left;
  height: 30px;
  line-height: 30px;
  color: #2d2d2d;
}

.px-3 .next {
  padding-left: 0px;
  display: block;
  float: right;
  height: 40px;
  line-height: 20px;
  color: #2d2d2d;
}

.wp_artfuns .wp_art_adjoin .next:hover {
  color: #0099cc;
}

.prev-title {
  width: calc(100% - 80px);
  height: 36px;
  line-height: 30px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.prev-title:hover a {
  color: #0099cc;
}

.next-title {
  width: calc(100% - 80px);
  height: 30px;
  line-height: 30px;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.next-title:hover a {
  color: #0099cc;
}

@media (max-width: 575px) {
  .wp_artfuns .wp_art_adjoin {
    width: 100%;
    font-size: 14px;
    display: inline-block;
    position: relative;
  }

  .wp_artfuns .wp_art_adjoin a {
    color: #767676;
  }

  .prev {
    padding-left: 10px;
    display: block;
    float: left;
    height: 30px;
    line-height: 30px;
    color: #767676;
  }

  .next {
    padding-left: 10px;
    display: block;
    float: left;
    height: 30px;
    line-height: 30px;
    color: #767676;
  }

  .prev-title {
    width: calc(100% - 80px);
    height: 30px;
    line-height: 30px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .next-title {
    width: calc(100% - 80px);
    height: 30px;
    line-height: 30px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .wp_articlecontent img {
    cursor: pointer;
    height: auto !important;
    width: 100% !important;
  }
}

video {
  background: none;
}

.post {
  margin-left: 3px;
  float: none;
  margin-bottom: 15px;
  background: none;
  position: relative;
  height: auto;
}

.post span.topNum {
  width: 17px;
  height: 25px;
  border-radius: 50% 0px 0px 50%;
  text-align: center;
  line-height: 25px;
  background: rgb(240, 240, 240);
  color: #999;
  position: absolute;
  top: 0;
  left: -17px;
}

.post:nth-child(2) .topNum {
  background: #bb840d;
  color: #fff;
}

.post .entry {
  height: 120px;
  overflow: hidden;
  margin-bottom: 5px;
  border-radius: 0px 5px 5px 5px;
  position: relative;
}

.post .entry img {
  width: 100%;
  height: auto;
}

.post h5 {
  font-weight: normal;
  font-size: 14px;
  padding: 5px 10px 5px 10px;
}

.post h5 a {
  color: #999;
}

.post .postmetadata {
  margin: 0;
  padding: 0;
  padding-left: 10px;
  display: none;
  font-size: 12px;
  color: #aaa;
  position: relative;
  height: 20px;
  line-height: 20px;
}

.wp_hot_photos_list .photo_item {
  float: left;
  width: 235px;
  border: none;
  margin: 0 17px 27px 0;
  position: relative;
  overflow: visible;
}