/*
            /$$
    /$$    /$$$$
   | $$   |_  $$    /$$$$$$$
 /$$$$$$$$  | $$   /$$_____/
|__  $$__/  | $$  |  $$$$$$
   | $$     | $$   \____  $$
   |__/    /$$$$$$ /$$$$$$$/
          |______/|_______/
================================
        Keep calm and get rich.
                    Is the best.

---------------------------------------------
Theme Name: LightHouse
Theme URI: https://www.nicetheme.cn/
Author: nicetheme
Author URI: https://www.nicetheme.cn/
Description: This is a shortcut theme for collecting resources: books, movies, music, and more. A heart-warming movie, a beautiful melody, a book worth reading, or an amazing website are worth recording. Cause it's like a lighthouse, a known direction of the brightness at dark nights.
Version: 1.1.0
License URI: LICENSE
Text Domain: lighthouse
*/

/*--------------------------------------------------------------
## reset style
--------------------------------------------------------------*/
html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/*--------------------------------------------------------------
## body 
--------------------------------------------------------------*/

body {
  width: 100%;
  min-height: 100vh;
  background: #fff;
  margin: 0;
  vertical-align: baseline;
  word-wrap: break-word;
  color: #283149;
}




body,
input,
button,
select,
optgroup,
option,
textarea,
blockquote,
dd,
dl,
figure,
form,
pre,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", PingFang SC, Lantinghei SC, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

@media (min-width: 1200px) {

  h6,
  .h6 {
    font-size: 1.125rem;
  }
}

em,
i {
  font-style: normal
}

p {
  color: #0d131b;
  margin: 0;
  white-space: normal;
  word-break: break-all;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-bottom: 0;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.5;
  margin: 0;
}

iframe {
  background-color: #FFFFFF;
  vertical-align: middle;
}

a {
  color: #283149;
  text-decoration: none;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
  cursor: pointer;
}

a:link,
a:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
  color: #f73859;
}

img {
  max-width: 100%;
  height: auto;
}

a img {
  border: 0 none;
}

fieldset {
  margin: 0;
  padding: 0;
}

button,
input.ie6 {
  overflow: visible;
  padding: 0;
  outline: none;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

input,
input:focus,
input[type="text"],
input[type="text"]:focus,
select,
textarea {
  -webkit-appearance: none;
  outline: none !important;
  box-shadow: none !important;
}

input[type=checkbox] {
  -webkit-appearance: checkbox !important;
}

input[type=radio] {
  -webkit-appearance: radio !important;
}

select {
  background-color: #f5f6fa
}

button,
button:focus {
  outline: none;
  box-shadow: none;
}

select,
textarea {
  height: 40px;
  border: 1px solid #f2f2f5;
  width: 100%;
  font-size: 15px;
  padding: 0 16px;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 3px;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

textarea {
  height: auto;
  padding: 8px 16px;
  resize: none;
}

input:focus,
textarea:focus {
  border-color: #e0e0e0;
  background-color: #fff;
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  opacity: .9;
}

table {
  border-spacing: 0;
}

td,
th,
caption {
  padding: 0;
}

blockquote {
  position: relative;
  padding: 0 0 0 80px;
  margin: 40px 0;
  border: 0;
}

blockquote p {
  line-height: 1.6;
  color: #283149;
}

blockquote::before {
  content: "\201C";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 80px;
  height: 60px;
  font-size: 70px;
  line-height: 60px;
  color: #283149;
  font-family: sans-serif;
  text-align: center;
  z-index: 1;
}

blockquote cite,
blockquote small {
  display: block;
  margin-top: 15px;
  font-size: 14px;
  font-weight: normal;
  font-style: normal;
  opacity: 0.7;
}

blockquote cite::before {
  position: relative;
  bottom: 3px;
  display: inline-block;
  width: 20px;
  height: 1px;
  margin-right: 10px;
  background: #222831;
  content: "";
}

@media (min-width:768px) and (max-width:991.98px) {
  blockquote {
    padding: 0 0 0 40px;
  }

  blockquote::before {
    width: 30px;
    height: 30px;
    font-size: 50px;
    line-height: 40px;
  }

  blockquote p {
    font-size: 14px !important;
    margin-bottom: 10px !important;
  }

}

@media (max-width:767px) {
  blockquote {
    padding: 0 0 0 40px;
  }

  blockquote::before {
    width: 30px;
    height: 30px;
    font-size: 50px;
    line-height: 40px;
  }

  blockquote p {
    font-size: 16px !important;
  }

}

hr {
  margin: 1.5rem 0;
  border-top: 1px solid rgb(246, 246, 251);
}

.hr-short {}

.hr-short::before {
  content: "";
  display: block;
  width: 110px;
  margin: 1.75rem 0;
  height: 2px;
  background-color: #f2f2f5;
}

table {
  border-collapse: collapse;
  margin: 0 0 1rem;
  word-break: normal;
}

th,
td {
  border: 1px solid #f2f2f5;
  padding: 8px 12px;
}

iframe,
embed {
  border: 0;
  display: block;
  overflow: hidden;
  width: 100%;
}

figure {
  margin: 0;
}

pre {
  overflow-y: auto;
  background-color: #fdfbfb;
  border: 0;
  border-radius: 3px;
  padding: 1.25rem;
  margin: 1.5rem 0;
}

/* Alignments */
.alignleft {
  /*rtl:ignore*/
  float: left;
  /*rtl:ignore*/
  margin-right: 1rem;
}

@media only screen and (min-width: 768px) {
  .alignleft {
    /*rtl:ignore*/
    margin-right: calc(2 * 1rem);
  }
}

.alignright {
  /*rtl:ignore*/
  float: right;
  /*rtl:ignore*/
  margin-left: 1rem;
}

@media only screen and (min-width: 768px) {
  .alignright {
    /*rtl:ignore*/
    margin-left: calc(2 * 1rem);
  }
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/*--------------------------------------------------------------
## font
--------------------------------------------------------------*/
@font-face {
  font-family: nicetheme;
  src: url('font/Rubik-Regular.ttf') format("truetype");
}

.font-theme {
  font-family: nicetheme, "SF Pro SC", "SF Pro Text", Arial, sans-serif;
}

/*--------------------------------------------------------------
## Grid
--------------------------------------------------------------*/
.padding {
  padding: 2rem;
}

.row-md {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}

.row-md [class*="col-"],
.row-md .col {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.row-md .card,
.row-md .block {
  margin-bottom: 1.5rem;
}

.row-sm {
  margin-left: -0.5rem;
  margin-right: -0.5rem;
}

.row-sm [class*="col-"],
.row-sm .col {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.row-sm .card,
.row-sm .block {}

.row-xs {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}

.row-xs [class*="col-"],
.row-xs .col {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.row-xs .card,
.row-xs .block {
  margin-bottom: 0.5rem;
}

@media (min-width: 1680px) {
  #content .container-fluid {
    max-width: 1650px;
  }

  .col-xxl-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }

  .col-xxl-5 {
    flex: 0 0 20%;
    max-width: 20%;
  }

  .col-xxl-8 {
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }

  .col-xxl-10 {
    flex: 0 0 10%;
    max-width: 10%;
  }
}

@media (max-width: 991.98px) {
  .padding {
    padding: 1.5rem;
  }

  .row {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
  }

  .row [class*="col-"],
  .row .col {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}

@media (max-width: 767.98px) {
  .padding {
    padding: 1rem;
  }
}

/*
Size
*/
.w-8 {
  width: 8px !important;
  height: 8px !important;
}

.w-12 {
  width: 12px !important;
  height: 12px !important;
}

.w-16 {
  width: 16px !important;
  height: 16px !important;
}

.w-20 {
  width: 20px !important;
  height: 20px !important;
  font-size: 0.6em;
}

.w-24 {
  width: 24px !important;
  height: 24px !important;
  font-size: 0.7em;
}

.w-28 {
  width: 28px !important;
  height: 28px !important;
  font-size: 0.8em;
}

.w-32 {
  width: 32px !important;
  height: 32px !important;
  font-size: 0.85em;
}

.w-36 {
  width: 36px !important;
  height: 36px !important;
  font-size: 0.875em;
}

.w-40 {
  width: 40px !important;
  height: 40px !important;
}

.w-48 {
  width: 48px !important;
  height: 48px !important;
}

.w-56 {
  width: 56px !important;
  height: 56px !important;
}

.w-64 {
  width: 64px !important;
  height: 64px !important;
}

.w-72 {
  width: 72px !important;
  height: 72px !important;
}

.w-80 {
  width: 80px;
}

.w-96 {
  width: 96px;
}

.w-128 {
  width: 128px;
}

.w-xs {
  width: 90px;
}

.w-sm {
  width: 120px;
}

.w {
  width: 190px;
}

.w-md {
  width: 240px;
}

.w-lg {
  width: 280px;
}

.w-xl {
  width: 320px;
}

.w-auto {
  width: auto;
}

.h-auto {
  height: auto;
}

.hv {
  height: 100vh;
}

.h-v {
  min-height: 100vh;
}

.h-v-50 {
  min-height: 50vh;
}

.h-v-75 {
  min-height: 75vh;
}

@media (max-width:1199.98px) {
  .w-auto-lg {
    width: auto !important;
  }

  .w-100-lg {
    width: 100% !important;
  }

}

@media (max-width:991.98px) {
  .w-auto-md {
    width: auto !important;
  }

  .w-100-md {
    width: 100% !important;
  }

}

@media (max-width:767.98px) {
  .w-auto-sm {
    width: auto !important;
  }

  .w-100-sm {
    width: 100% !important;
  }

}

@media (max-width:575.98px) {
  .w-auto-xs {
    width: auto !important;
  }

  .w-100-xs {
    width: 100% !important;
  }

}

/*--------------------------------------------------------------
    title Font Size style
--------------------------------------------------------------*/
@media (max-width:767.98px) {

  h1,
  .h1 {
    font-size: 1.75rem;
  }

  h2,
  .h2 {
    font-size: 1.375rem;
  }

  h3,
  .h3 {
    font-size: 1.25rem;
  }


  .h6,
  h6 {
    font-size: 1rem;
    line-height: 1.25;
  }
}

@media (min-width:768px) and (max-width:991.98px) {

  h1,
  .h1 {
    font-size: 1.75rem;
  }

  h2,
  .h2 {
    font-size: 1.375rem;
  }

  h3,
  .h3 {
    font-size: 1.25rem;
  }

}

.h4 .small,
.h4 small,
.h5 .small,
.h5 small,
.h6 .small,
.h6 small,
h4 .small,
h4 small,
h5 .small,
h5 small,
h6 .small,
h6 small {
  font-size: 85%;
}

/*--------------------------------------------------------------
    Font Size style
--------------------------------------------------------------*/
.text-xs {
  font-size: 0.75rem !important;
}

.text-sm {
  font-size: 0.875rem !important;
}

.text-md {
  font-size: 0.9375rem !important;
}

.text-lg {
  font-size: 1.125rem !important;
}

.text-xl {
  font-size: 1.375rem !important;
}

.text-64 {
  font-size: 4rem !important;
}

.list-title.text-md {
  max-height: 42px;
}

@media (max-width:767.98px) {
  .text-lg {
    font-size: 1rem !important;
  }

  .text-xl {
    font-size: 1.25rem !important;
  }

}


/*--------------------------------------------------------------
## Font line height style
--------------------------------------------------------------*/
.text-height-xs {
  line-height: 1 !important
}

.text-height-sm {
  line-height: 1.2 !important
}

.text-height-md {
  line-height: 1.4 !important
}

.text-height-lg {
  line-height: 1.6 !important
}

.text-height-xl {
  line-height: 2 !important
}

/*--------------------------------------------------------------
## icon rest
--------------------------------------------------------------*/
.iconfont {
  line-height: 1;
  display: inline-block;
  vertical-align: middle;
}

.text-lg.iconfont,
.text-xl.iconfont {
  vertical-align: -0.09em;
}

/*--------------------------------------------------------------
## color style
--------------------------------------------------------------*/
.text-primary {
  color: #f73859 !important;
}

.text-secondary {
  color: #5d6977 !important;
}

.text-muted {
  color: #969fb7 !important;
}

.text-light {
  color: #f4f6fb !important;
}

.text-danger {
  color: #e83050 !important;
}

a.text-primary:hover {
  color: #283149 !important;
}

/*--------------------------------------------------------------
## Buttons
--------------------------------------------------------------*/
.btn {
  border-radius: 6px;
  white-space: normal;
  padding: .5rem 1rem;
  font-size: .875rem;
}

.btn:focus,
.btn.focus,
.btn:not(:disabled):not(.disabled):active:focus,
.btn:not(:disabled):not(.disabled).active:focus,
.show>.btn.dropdown-toggle:focus {
  box-shadow: none !important;
}

.btn-primary {
  background-color: #f73859;
  border-color: #f73859;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active {
  background-color: #283149;
  border-color: #283149;
}

.btn-secondary {
  color: #f4f6fb;
  background-color: #454b58;
  border-color: #454b58;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: #283149;
  border-color: #283149;
}

.btn-dark {
  background-color: #283149;
  border-color: #283149;
}

.btn-dark:hover,
.btn-dark:focus,
.btn-dark:not(:disabled):not(.disabled):active,
.btn-dark:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: #151d27;
  border-color: #151d27;
}

.btn-light {
  color: #454b58;
  background-color: #f4f6fb;
  border-color: #f4f6fb;
}

.btn-light:hover,
.btn-light:focus,
.btn-light:not(:disabled):not(.disabled):active,
.btn-light:not(:disabled):not(.disabled).active {
  color: #283149;
  background-color: #f4f6fb;
  border-color: #f4f6fb;
}


.btn-danger,
.btn-like.current {
  color: #fff;
  background-color: #f7094c;
  border-color: #f7094c;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:not(:disabled):not(.disabled):active,
.btn-danger:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: #f7094c;
  border-color: #f7094c;
}


.btn-link {
  color: #0d131b;
  text-decoration: none;

}

.btn-link:hover,
.btn-link:focus,
.btn-link:not(:disabled):not(.disabled):active,
.btn-link:not(:disabled):not(.disabled).active {
  color: #151d27;
  text-decoration: none;
}

.btn-outline-secondary {
  color: #5d6977;
  background-color: transparent;
  background-image: none;
  border-color: #5d6977;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:not(:disabled):not(.disabled):active,
.btn-outline-secondary:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: #283149;
  border-color: #283149;
}

.btn-outline-light {
  color: #0d131b;
  background-color: #FFF;
  background-image: none;
  border-color: #f4f6fb;
}

.btn-outline-light:hover,
.btn-outline-light:focus,
.btn-outline-light:not(:disabled):not(.disabled):active,
.btn-outline-light:not(:disabled):not(.disabled).active {
  color: #283149;
  background-color: #FFF;
  border-color: #f4f6fb;
}

.btn-outline-light.disabled,
.btn-outline-light:disabled {
  border-color: transparent;
  color: #969fb7;
}

.btn-rounded {
  border-radius: 4rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

.btn-arrow {
  position: relative;
}

.btn-arrow span {
  display: inline-block;
  position: relative;
  -webkit-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
  will-change: transform;
}

.btn-arrow:hover span,
.btn-arrow:focus span {}

.btn-arrow span {
  padding-left: .125rem;
  padding-right: .75rem;
}

.btn-sm.btn-arrow span {
  padding-left: .125rem;
  padding-right: .75rem;
}

.btn-arrow i {
  position: absolute;
  width: 1.25em;
  right: -.25rem;
  top: 50%;
  opacity: .6;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: all 200ms ease-out;
  -o-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
  will-change: right, opacity;
}

.btn-arrow:hover i,
.btn-arrow:focus i {
  opacity: 1;
  right: -.5rem;
}

.btn-cuurent {
  -webkit-box-shadow: 0px 0px 20px 2px rgba(2, 10, 18, 0.05);
  -moz-box-shadow: 0px 0px 20px 2px rgba(2, 10, 18, 0.05);
  box-shadow: 0px 0px 20px 2px rgba(2, 10, 18, 0.05);
}

/*--------------------------------------------------------------
## btn style
--------------------------------------------------------------*/
.btn-group-sm>.btn,
.btn-sm {
  font-size: .75rem;
  padding: .375rem .875rem;
}

.rounded-lg {
  border-radius: 6px;
}

/*--------------------------------------------------------------
## btn icon style
--------------------------------------------------------------*/
.btn-icon {
  text-align: center;
  width: 2.125rem;
  height: 2.125rem;
  padding: 0 !important;
  position: relative;
}

.btn-icon span {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.btn-icon.btn-sm {
  width: 1.75rem;
  height: 1.75rem;
}

.btn-icon.btn-md {
  width: 2.5rem;
  height: 2.5rem;
}

.btn-icon.btn-lg {
  width: 3.375rem;
  height: 3.375rem;
}

.btn-icon.btn-xl {
  width: 3.5rem;
  height: 3.5rem;
}

.btn-icon.btn-rounded:not(.btn-xl) {
  -webkit-transition: all .3s ease 0s;
  -o-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
}

.btn-icon.btn-rounded:not(.btn-xl):hover {
  -webkit-transform: rotate(30deg);
  -ms-transform: rotate(30deg);
  transform: rotate(30deg);
}

/*--------------------------------------------------------------
## btn others style
--------------------------------------------------------------*/
.btn-qq {
  background-color: #3d93e0 !important;
  border-color: #3d93e0 !important;
  color: #fff !important;
}

.btn-weibo {
  background-color: #e24040 !important;
  border-color: #e24040 !important;
  color: #fff !important;
  ;
}

.btn-weixin {
  background-color: #20b767 !important;
  border-color: #20b767 !important;
  color: #fff !important;

}

.btn-alipay {
  background-color: #0AE !important;

  border-color: #0AE !important;

  color: #fff !important;

}

.btn-youku {
  background-color: #1f82fc !important;

  border-color: #1f82fc !important;

  color: #fff !important;

}

.btn-toutiao {
  background-color: #ed4040 !important;

  border-color: #ed4040 !important;

  color: #fff !important;

}

.btn-youtube {
  background-color: #ff0400 !important;

  border-color: #ff0400 !important;

  color: #fff !important;
  ;
}

.btn-twitter {
  background-color: #1da1f2 !important;

  border-color: #1da1f2 !important;

  color: #fff !important;

}

.btn-facebook {
  background-color: #365899 !important;

  border-color: #365899 !important;

  color: #fff !important;

}

.btn-bilibili {
  background-color: #fb7299 !important;

  border-color: #fb7299 !important;

  color: #fff !important;

}

.btn-ins {
  background-color: #ed4956 !important;

  border-color: #ed4956 !important;

  color: #fff !important;

}

.btn-tumblr {
  background-color: #36465d !important;

  border-color: #36465d !important;

  color: #fff !important;

}

.btn-qq:hover,
.btn-weibo:hover,
.btn-weixin:hover,
.btn-twitter:hover,
.btn-facebook:hover,
.btn-ins:hover,
.btn-tumblr:hover,
.btn-download:hover {
  opacity: .8;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

/*--------------------------------------------------------------
## background style
--------------------------------------------------------------*/
.bg-dark {
  background-color: #283149 !important;
}

.bg-secondary {
  background-color: #5d6977 !important;
}

.bg-light {
  background-color: #f4f6fb !important;
}

.bg-white-overlay {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.35);
}

.bg-dark-overlay {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.33);
}

/*--------------------------------------------------------------
badge
--------------------------------------------------------------*/
.badge {
  border-radius: 2px;
  font-weight: normal;
  padding: .35em .4em;
}

.badge-primary {
  background-color: #f73859;
}

.badge-pill {
  padding-right: .6em;
  padding-left: .6em;
  border-radius: 10rem;
}

.badge-sm {
  padding: 0.25rem 0.35rem;
}

.badge-md {
  padding: 0.5rem 0.75rem;
}

.badge-outline-primary {
  color: #f73859;
  border: #f73859 solid 1px;
}

.badge-light {
  color: #0d131b;
  background-color: #f4f6fb;
}

.badge-light[href]:hover,
.badge-light[href]:focus {
  color: #283149;
  text-decoration: none;
  background-color: #f4f6fb;
}

.badge-dark {
  color: #fff;
  background-color: #283149;
}

.badge-echo {
  position: relative;
  border-bottom-left-radius: 0;
}

.badge-echo::after {
  content: '';
  position: absolute;
  border-width: 0 0 4px 8px;
  border-style: solid;
  left: 0;
  top: 100%;
}

@media (max-width: 767.98px) {
  .badge-echo::after {
    border-width: 0 0 2px 6px;
  }
}

.badge-primary.badge-echo::after {
  border-color: transparent #f73859;
}

.badge-dark.badge-echo::after {
  border-color: transparent #283149;
}

.badge-danger.badge-echo::after {
  border-color: transparent #dc3545;
}

/*--------------------------------------------------------------
## border
--------------------------------------------------------------*/
.border-primary {
  border-color: #f73859 !important;
}

.border-light {
  border-color: #f4f6fb !important;
}

.border-muted {
  border-color: #ebeef7 !important;
}

.border-2 {
  border-width: 2px !important;
}

.border-3 {
  border-width: 3px !important;
}

.border-title,
.border-single-title {
  position: relative;
}

.border-single-title::after {
  position: absolute;
  top: 50%;
  width: 30px;
  height: 1px;
  border-top: 1px solid;
  content: '';
  border-color: inherit;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
  left: 100%;
}

.border-title::before,
.border-title::after {
  position: absolute;
  top: 50%;
  width: 20px;
  height: 1px;
  border-top: 1px solid;
  content: '';
  border-color: inherit;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

.border-title::before {
  left: -35px;
}

.border-title::after {
  right: -35px;
}

.border-hover:hover .border-title::before {
  left: -25px;
}

.border-hover:hover .border-title::after {
  right: -25px;
}

/*--------------------------------------------------------------
## input-group
--------------------------------------------------------------*/

.form-group label {
  font-size: .875rem;
}

.form-control {
  font-size: .875rem;
  color: #969fb7;
  border: 1px solid #f4f6fb;
  border-radius: 6px;
  background-color: #f4f6fb;
}

textarea.form-control {
  box-sizing: border-box;
  resize: none;
}

.form-control:focus {
  color: #0d131b;
  border-color: #f4f6fb;
  background-color: #f4f6fb;
  box-shadow: none;
}

.form-control::-webkit-input-placeholder {
  color: #969fb7;
  opacity: 1
}

.form-control::-moz-placeholder {
  color: #969fb7;
  opacity: 1
}

.form-control:-ms-input-placeholder {
  color: #969fb7;
  opacity: 1
}

.form-control::-ms-input-placeholder {
  color: #969fb7;
  opacity: 1
}

.form-control::placeholder {
  color: #969fb7;
  opacity: 1
}

.form-control:focus::placeholder {
  color: #0d131b;
  opacity: 1
}

.form-control:disabled,
.form-control[readonly] {
  background-color: #f4f6fb;
  opacity: 1;
  color: #0d131b
}

.form-control-plaintext {
  color: #969fb7;
  border-width: 0;
}

.form-control-lg {
  font-size: .9375rem;
  height: calc(1.5em + 1.25rem + 2px);
  padding: .5rem 1rem;
}

/*
Switch
*/
.ui-switch {
  cursor: pointer;
  position: relative;
  display: inline-block;
  width: 21px;
  height: 12px;
  border-radius: 30px;
  background-color: #fff;
  margin: 0;
}

.ui-switch input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}

.ui-switch input:checked+i:before {

  background-color: #ebeef7;
}

.ui-switch input:checked+i:after {
  margin-left: 10px;
  background-color: #404b69;
}

.ui-switch i {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
}

.ui-switch i:before {
  content: "";
  position: absolute;
  top: -1px;
  bottom: -1px;
  left: -2px;
  right: -1px;
  border: 1px solid #ebeef7;
  background-color: #f4f6fb;
  border-radius: 30px;
  transition: all 0.2s;
}

@media (prefers-reduced-motion: reduce) {
  .ui-switch i:before {
    transition: none;
  }
}

.ui-switch i:after {
  content: "";
  position: absolute;
  background-color: #969fb7;
  width: 10px;
  top: 1px;
  bottom: 1px;
  border-radius: 50%;
  transition: margin 0.3s;
}

@media (prefers-reduced-motion: reduce) {
  .ui-switch i:after {
    transition: none;
  }
}

.ui-switch-md {
  width: 32px;
  height: 20px;
}

.ui-switch-md input:checked+i:after {
  margin-left: 13px;
}

.ui-switch-md i:after {
  width: 18px;
}

.ui-switch-lg {
  width: 40px;
  height: 24px;
}

.ui-switch-lg input:checked+i:after {
  margin-left: 17px;
}

.ui-switch-lg i:after {
  width: 22px;
}

/*--------------------------------------------------------------
## dropdown
--------------------------------------------------------------*/
.dropdown-menu {
  border: solid 1px #f4f6fb;
  box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
  animation: dropdown-effect .3s ease-out;
  border-radius: 6px;
}

@keyframes dropdown-effect {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

/*--------------------------------------------------------------
## Avatar
--------------------------------------------------------------*/
.flex-avatar {
  position: relative;
  line-height: 1;
  border-radius: 500px;
  white-space: nowrap;
  font-weight: bold;
  border-radius: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  border-radius: 50%;
}

.flex-avatar img {
  border-radius: inherit;
  width: 100%;
}

.flex-avatar.w-32 .avatar-status {
  margin: 0px;
}

.flex-avatar.w-48 .avatar-status {
  margin: 2px;
}

.flex-avatar.w-56 .avatar-status {
  margin: 3px;
}

.flex-avatar.w-64 .avatar-status {
  margin: 4px;
}

.flex-avatar.w-96 .avatar-status {
  margin: 0;
}

.flex-avatar.w-128 .avatar-status {
  margin: 14px;
}

/*--------------------------------------------------------------
## Media
--------------------------------------------------------------*/
.media {
  position: relative;
  display: block;
  padding: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  border-radius: inherit;
}

.media:after {
  content: '';
  display: block;
  padding-top: 100%;
}

.media:not(:first-child):not(:last-child):not(:only-child) {
  border-radius: 0;
}

.media-circle .media {
  border-radius: 500px;
}

.media-circle .media .media-content:before {
  width: 50%;
  left: 25%;
}

.media-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1rem 1rem;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #fff;
}

.media-overlay.overlay-top {
  bottom: auto;
}

.media-overlay.overlay-bottom {
  top: auto;
}

.media-action {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.media-action.active {
  opacity: 1;
}

.media-action.media-action-overlay {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  color: #fff;
  padding: 0 5%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  border-radius: inherit;
}

.media-action.media-action-overlay .btn {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  color: inherit;
}

.list-item:hover .media-action,
.list-item:active .media-action,
.media:hover .media-action,
.media:active .media-action,
.active>.media .media-action {
  opacity: 1;
  pointer-events: initial;
}

.media iframe,
.media-content {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  border: 0;
  border-radius: inherit;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-color: rgba(120, 120, 120, 0.1);
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.media-content:before {
  content: '';
  position: absolute;
  height: 10%;
  width: 90%;
  left: 5%;
  bottom: 0;
  background: inherit;
  background-position-y: 100%;
  filter: blur(10px);
  z-index: -1;
}

.circle .media-content:before {
  width: 40%;
  left: 30%;
}

.media-21x9:after {
  padding-top: 42.857143%;
}

.media-16x9:after {
  padding-top: 56.25%;
}

.media-4x3:after {
  padding-top: 75%;
}


.media-2x3:after {
  padding-top: 150%;
}

.media-10x14:after {
  padding-top: 140.5%;
}

.media-3x4:after {
  padding-top: 133.33333%;
}

.media-1x2:after {
  padding-top: 200%;
}

.media-2x1:after {
  padding-top: 50%;
}

.media-3x1:after {
  padding-top: 33%;
}

.media-4x1:after {
  padding-top: 25%;
}

.media-1-4:after {
  padding-top: 25vh;
  min-height: 10rem;
}

.media-1-3:after {
  padding-top: 33vh;
  min-height: 12.5rem;
}

.media-1-2:after {
  padding-top: 50vh;
  min-height: 15rem;
}

/*--------------------------------------------------------------
## Card
--------------------------------------------------------------*/
.card,
.block {
  border-width: 0;
  box-shadow: none;
  margin-bottom: 0;
  border-radius: 3px;
  background-color: #fff;
}

.card-header,
.card-footer {
  background-color: transparent;
  border: 0;
  background-clip: padding-box;
  z-index: 1;
  padding: 1.25rem 1.25rem 0;
}

.card-footer {
  padding: 0 1.25rem 1.25rem
}

.card-body p:last-child {
  margin-bottom: 0;
}

.card-hide-body .card-body {
  display: none;
}

.block-fold:before,
.block-fold:after,
.card-fold:before,
.card-fold:after {
  content: '';
  display: block;
  background-color: inherit;
  box-shadow: inherit;
  border-radius: inherit;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  position: absolute;
  width: 90%;
  left: 5%;
  height: 0.35rem;
  bottom: -0.35rem;
  opacity: 0.6;
  transition: all .1s;
}

.block-fold:before,
.card-fold:before {
  width: 80%;
  left: 10%;
  bottom: -0.7rem;
  opacity: 0.3;
}

.block-fold:hover:before,
.block-fold:active:before,
.card-fold:hover:before,
.card-fold:active:before {
  opacity: 0.5;
}

.block-fold:hover:after,
.block-fold:active:after,
.card-fold:hover:after,
.card-fold:active:after {
  opacity: 0.8;
}

@media (max-width:576px) {

  .card,
  .block {
    margin-bottom: 0;
  }

}

/*--------------------------------------------------------------
List
--------------------------------------------------------------*/
.list {
  padding-left: 0;
  padding-right: 0;
}

.list-item {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
}

.list-item.block .media {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.list-item.block .list-content {
  padding: 1rem;
}

.list-content {
  padding: .75rem 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  -ms-flex-pack: center;
  justify-content: center;
}

.list-body {
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
}

.list-footer {
  margin-top: 0.5rem;
}

@media (max-width: 767.98px) {
  .list-footer {
    margin-top: 0.375rem;
  }
}

.list-footer .text-muted a {
  color: inherit
}

.list-title {
  line-height: 1.4285714286;
  font-weight: 500;
  display: block;
  color: inherit;
}

.list-overlay .media,
.list-hover-overlay .media {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: inherit;
}

.list-overlay .media:after,
.list-hover-overlay .media:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0;
  border-radius: inherit;
  background-color: rgba(0, 0, 0, 0.25);
}

.list-overlay .list-content,
.list-hover-overlay .list-content {
  position: relative;
  padding: 1rem;
  z-index: 1;
}

.list-overlay .list-body,
.list-hover-overlay .list-body {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
}

.list-overlay .list-body .list-title,
.list-hover-overlay .list-body .list-title {
  margin-top: auto;
}

.list-hover-overlay:hover .media,
.list-hover-overlay:active .media,
.list-hover-overlay.active .media {
  display: block;
}

.list-hover-overlay .media {
  display: none;
}

.list-overlay,
.list-overlay-content,
.list-hover-overlay:hover,
.list-hover-overlay:active,
.list-hover-overlay.active {
  color: #fff !important;
}

.list-overlay a:hover,
.list-overlay a:active,
.list-overlay-content a:hover,
.list-overlay-content a:active,
.list-hover-overlay:hover a:hover,
.list-hover-overlay:hover a:active,
.list-hover-overlay:active a:hover,
.list-hover-overlay:active a:active,
.list-hover-overlay.active a:hover,
.list-hover-overlay.active a:active {
  color: #fff;
}

.list-overlay .text-muted:not(i),
.list-overlay-content .text-muted:not(i),
.list-hover-overlay:hover .text-muted:not(i),
.list-hover-overlay:active .text-muted:not(i),
.list-hover-overlay.active .text-muted:not(i) {
  color: rgba(255, 255, 255, 0.5) !important;
}

.list-hover .media {
  color: #ffffff;
}

.list-hover .list-body {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.list-hover:hover,
.list-hover.active {
  background-color: #14bae4 !important;
}

.list-hover:hover a:not(.dropdown-item),
.list-hover:hover a:not(.dropdown-item):hover,
.list-hover:hover a:not(.dropdown-item):active,
.list-hover.active a:not(.dropdown-item),
.list-hover.active a:not(.dropdown-item):hover,
.list-hover.active a:not(.dropdown-item):active {
  color: #ffffff;
}

.list-hover:hover .text-muted:not(i),
.list-hover.active .text-muted:not(i) {
  color: rgba(255, 255, 255, 0.5) !important;
}

.list-hover:hover .media:after,
.list-hover.active .media:after {
  position: relative;
  z-index: 1;
  border-radius: inherit;
  background-color: #14bae4;
  background: linear-gradient(180deg, rgba(20, 186, 228, 0.5), #14bae4);
}

.list-hover .media-action-overlay {
  background-color: transparent !important;
}

.list-overlay-content {
  color: #fff;
}

.list-overlay-content a:hover {
  color: #fff;
}

.list-overlay-content .media:after {
  background-color: rgba(0, 0, 0, 0.25);
  border-radius: inherit;
  position: relative;
  z-index: 1;
}

.list-overlay-content .list-content {
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1rem;
}


.list-row .list-item {
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 4px;
}

.list-row .list-item>* {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}

.list-row .list-item .media {
  min-width: 3rem;
  border-radius: inherit;
  padding: 0;
}

.list-row .list-item .list-content {
  padding: 0 .375rem 0 .75rem;
  text-align: inherit !important;
}

.list-row .show-row {
  display: block !important;
}

.list-row .hide-row {
  display: none !important;
}

.list-bordered .list-item {
  border-top: 1px solid rgba(160, 175, 185, 0.05);
}

.list-bordered .list-item:first-child {
  border-top: none;
}


.list-grouped>div>.list-item {
  border-radius: 4px;
}

.list-grouped>div>.list-item .list-content {
  padding-bottom: 0;
}

.list-subtitle p,
.list-subtitle a {
  opacity: .5
}

@media (min-width: 576px) {
  .list-grouped {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
  }

  .list-grouped>div {
    display: -ms-flexbox;
    display: flex;
  }

  .list-grouped>div>.list-item {
    -ms-flex-item-align: stretch;
    align-self: stretch;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
  }

  .list-grouped>div>.list-item .list-content {
    padding-left: .5rem;
    padding-right: .5rem;
  }

  .list-grouped.no-gutters>div:not(:first-child):not(:last-child):not(:only-child) {
    border-radius: 0;
  }

  .list-grouped.no-gutters>div:first-child {
    border-radius: 0.25rem 0 0 0.25rem;
  }

  .list-grouped.no-gutters>div:first-child .media {
    border-radius: inherit;
  }

  .list-grouped.no-gutters>div:last-child {
    border-radius: 0 0.25rem 0.25rem 0;
  }

  .list-grouped.no-gutters>div:last-child .media {
    border-radius: inherit;
  }

  .list-grouped.no-gutters>div .list-item {
    border-radius: inherit;
  }
}

.list-dots {
  list-style-type: circle;
  margin: 0 0 0 1.25rem;
}

/*--------------------------------------------------------------
## Font line clamp style
--------------------------------------------------------------*/
.h-1x {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.h-2x {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.h-3x {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.h-4x {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.text-sm .h-1x {
  height: 1.25rem;
}

.text-sm .h-2x {
  max-height: 2.5rem;
}

.text-sm .h-3x {
  max-height: 3.75rem;
}

.text-sm .h-4x {
  max-height: 5rem;
}

/*--------------------------------------------------------------
## nav brand
--------------------------------------------------------------*/
.navbar-brand {
  padding: 0;
  -webkit-transition-duration: 500ms;
  -o-transition-duration: 500ms;
  transition-duration: 500ms;
  max-width: 160px;
  margin: 0;
}

.navbar-brand .logo {
  max-height: 50px;
}

.navbar-brand .logo-large {
  max-height: 50px;
}


.logo-light.hide,
.logo-dark {
  display: none;
}


.logo-light.active,
.logo-dark.active {
  display: block
}


@media (max-width: 767.98px) {
  .navbar-brand .logo-large {
    max-width: 110px;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .navbar-brand .logo-large {
    max-width: 120px;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .navbar-brand .logo-large {
    max-width: 140px;
    -webkit-transition-duration: 500ms;
    -o-transition-duration: 500ms;
    transition-duration: 500ms;
  }
}

.navbar-brand .logo-small {
  display: none;
}

/*-------------------------------------------------------------- 
## Main Navigation 
--------------------------------------------------------------*/

.main-menu li {
  position: relative;
  margin: 0 1rem 0 0;
}

.main-menu li a {
  display: block;
  font-size: .9375rem;
  transition: all 0.5s ease-out 0s;
  padding: .375rem 0;
}


.main-menu:hover li a {
  opacity: .6
}

.main-menu li a:hover {
  opacity: 1
}

.main-menu>li.menu-item-has-children>a {
  padding-right: .75rem;
}

.main-menu>li.current-menu-item>a,
.main-menu>li.current>a {
  color: #f73859;
}

.main-menu>li>a {
  position: relative;
}


/* Submenu */
.main-menu li ul {
  position: absolute;
  width: 200px;
  top: 100%;
  left: 0;
  padding: .75rem .9375rem;
  background-color: #ffff;
  border-radius: 6px;
  border: solid 1px #f4f6fb;
  box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
  opacity: 0;
  visibility: hidden;
  -webkit-transform-origin: 0 0 0;
  transform-origin: 0 0 0;
  transition: all 0.3s ease-out 0s;
  z-index: 99;
}

.main-menu li:hover>ul {
  opacity: 1;
  visibility: visible;
}

.main-menu li ul li a {
  font-size: .875rem;
  padding: .25rem 0;
}

.main-menu li ul li ul {
  left: 190px;
  top: 0;
  width: 200px;
}

.main-menu li ul li {
  display: block;
  border-bottom: none;
  border-left: none;
  transition: all 0.3s ease 0s;
}

/*---------------------------------------------------
## mobile menu icon widget
--------------------------------------------------------------*/
.main-menu .menu-icon {
  position: absolute;
  display: inline-block;
  right: 0;
  top: 50%;
  -webkit-transform: translate(25%, -50%);
  -ms-transform: translate(25%, -50%);
  transform: translate(25%, -50%);
  opacity: .3;
}

.main-menu .menu-icon i {
  display: block;
}

.main-menu .menu-icon i {
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

.main-menu>li.menu-item-has-children:hover>a .menu-icon i {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
}

.main-menu li ul>li.menu-item-has-children a .menu-icon i {
  transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
}

.main-menu li ul>li.menu-item-has-children:hover a .menu-icon i {
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
}

/*--------------------------------------------------------------
## navbar-scroll
--------------------------------------------------------------*/
.navbar-scroll {
  width: 100%;
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}


/*--------------------------------------------------------------
post content
--------------------------------------------------------------*/
.post-info .info-title {
  display: inline-block;
  width: 70px;
  margin: 0 .75rem 0 0;
  text-align: justify;
  text-align-last: justify;
}

.post-content p,
.post-content figure {
  margin-bottom: 1.25rem;
  font-size: 1rem;
  line-height: 1.8;
  word-wrap: break-word;
}

.post-content a:not(.btn) {
  color: #f73859;
  text-decoration: underline;
}

.post-content img {
  max-width: 100%;
  height: auto;
}

.post-content h1,
.post-content h2,
.post-content h3,
.post-content h4,
.post-content h5,
.post-content h6 {
  margin-top: 1.75rem;
  margin-bottom: 1.25rem;
}

.post-content h1 {
  font-size: 1.625rem;
}

.post-content h2 {
  font-size: 1.25rem;
  border-left: 3px solid #f73859;
  padding-left: 15px;
}

.post-content h3 {
  position: relative;
  font-size: 1.125rem;
  padding-left: 20px;
}

.post-content h3:before {
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  height: 8px;
  width: 8px;
  border-radius: 20px;
  background-color: #f73859;
}

.post-content h4 {
  font-size: 1rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid #f2f2f5;
}

.post-content h5,
.post-content h6 {
  font-size: .875rem;
}

.post-content h2.quote {
  font-size: 1.25rem;
  color: #2d3757;
  padding-bottom: 1rem;
  border-bottom: solid 1px #f0f4f7;
}

.post-content ul {
  list-style: disc;
}

.post-content ol {
  list-style: decimal;
}

.post-content ul,
.post-content ol {
  margin: 0 0 20px 45px;
  font-size: .875rem;
}

.post-content ul li,
.post-content ol li {
  margin: 15px 0;
}

.post-content .btn[class*=btn-] {
  text-transform: none;
}



/*--------------------------------------------------------------
## Pagination (WordPress CSS classes)
--------------------------------------------------------------*/

.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  width: 1px;
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  word-wrap: normal !important;
}

.pagination {
  position: relative;
  text-align: center;
  display: block;
  margin: 2.25rem 0;
}

.pagination .nav-links {
  display: inline-block;
  padding: .75rem 1.5rem;
  background-color: #f4f6fb;
  border-radius: 6px;
}

.pagination .page-numbers {
  display: none;
  color: #2d3757;
  margin: 0 1rem 0 0;
  font-family: nicetheme, "SF Pro SC", "SF Pro Text", Arial, sans-serif;
  font-size: 1rem;
}

.pagination .page-numbers:last-child {
  margin: 0;
}

.pagination .page-numbers:hover,
.pagination .current.page-numbers {
  color: #283149;
}

.pagination .current,
.pagination .prev,
.pagination .next {
  display: inline-block;
}


@media (min-width:768px) {
  .pagination {
    margin-top: 2.75rem;
  }

  .pagination .page-numbers,
  .pagination .post-page-numbers {
    display: inline-block;
  }
}

@media (max-width:767.98px) {
  .pagination {
    margin: 2.75rem 0 1.5rem;
  }
}


/*--------------------------------------------------------------
## comments
--------------------------------------------------------------*/
.post-comment {
  position: relative;
}

.post-comment .commentlist .emoji,
.post-comment .comment-list .emoji {
  height: 1.5em !important;
  width: 1.5em !important;
  vertical-align: -0.4em !important;
}

.post-comment .comment-list .children {
  margin-left: 65px;
}

.post-comment .comment-list .children .flex-avatar {
  width: 36px !important;
  height: 36px !important;
}

@media (max-width: 767.98px) {
  .post-comment .comment-respond .flex-avatar {
    margin: 8px 0 0;
  }

  .post-comment .comment-respond .flex-avatar,
  .post-comment .comment-list .flex-avatar {
    width: 32px !important;
    height: 32px !important;
  }

  .post-comment .comment-list .children .flex-avatar {
    width: 28px !important;
    height: 28px !important;
  }

  .post-comment .comment-list .children {
    margin-left: 4px;
  }

}

/*--------------------------------------------------------------
## comment smilies animation
--------------------------------------------------------------*/
.comment-form-body {
  position: relative;
}

.comment-form-body .comment-form-smilies {
  position: absolute;
  top: 100%;
  left: 25px;
  width: 275px;
  padding: 1rem;
  border-radius: 12px;
  background: #fff;
  pointer-events: none;
  z-index: 999;
}

.comment-form-body .comment-form-smilies.fadeup {
  opacity: 0;
  visibility: hidden;
  display: block;
  -webkit-transform-origin: 0 0 0;
  transform-origin: 0 0 0;
  transition: all 0.3s ease-out 0s;
  -webkit-transform: translateY(15px);
  transform: translateY(15px);
  -webkit-box-shadow: 0 0 25px 5px rgba(28, 31, 36, 0.1);
  -ms-box-shadow: 0 0 25px 5px rgba(28, 31, 36, 0.1);
  box-shadow: 0 0 25px 5px rgba(28, 31, 36, 0.1);
}

.comment-form-body.active .comment-form-smilies.fadeup {
  pointer-events: initial;
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0px);
  transform: translateY(0px);
}


.comment-form-body .comment-form-smilies.zoom {
  opacity: 0;
  visibility: hidden;
  display: block;
  transform: scale(1.2);
  transition: .3s;
  z-index: 9;
  top: 110%;
}

.comment-form-body.active .comment-form-smilies.zoom {
  pointer-events: initial;
  transition: .2s ease-in;
  opacity: 1;
  visibility: visible;
  transform: scale(1)
}

.comment-form-smilies .add-smily img {
  height: 1.5em !important;
  max-height: 1.5em !important;
  width: 1.5em !important;
}

@media (max-width: 767.98px) {
  .comment-form-body .comment-form-smilies {
    left: 10px;
    right: 10px;
    width: auto;
  }

  .comment-form-body.active .comment-form-smilies.fadeup {
    margin: 5px 0 0;
  }
}

/*--------------------------------------------------------------
## reset animation
--------------------------------------------------------------*/
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 20%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

/*--------------------------------------------------------------
## return to top
--------------------------------------------------------------*/
#widget-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: none;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/*--------------------------------------------------------------
Modal 
--------------------------------------------------------------*/
.modal.fade .modal-left,
.modal.fade .modal-right,
.modal.fade .modal-top,
.modal.fade .modal-bottom {
  position: fixed;
  z-index: 1055;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
  max-width: 100%;
}

.modal.fade .modal-left {
  right: auto !important;
  transform: translate3d(-100%, 0, 0);
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.modal.fade .modal-right {
  left: auto !important;
  transform: translate3d(100%, 0, 0);
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.modal.fade .modal-top {
  bottom: auto !important;
  transform: translate3d(0, -100%, 0);
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.modal.fade .modal-bottom {
  top: auto !important;
  transform: translate3d(0, 100%, 0);
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.modal.fade.show .modal-left,
.modal.fade.show .modal-right,
.modal.fade.show .modal-top,
.modal.fade.show .modal-bottom {
  transform: translate3d(0, 0, 0);
}

.modal.fade.inactive {
  bottom: auto;
  overflow: visible;
}

.modal-open-aside {
  overflow: visible;
}

.modal-header,
.modal-content,
.modal-footer {
  border: none;
}

.modal-dialog>* {
  pointer-events: auto;
}

.modal-header {
  margin-top: -1px;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}

.modal-footer {
  margin-top: auto;
  border-bottom-left-radius: inherit;
  border-tbottomop-right-radius: inherit;
}

.modal .close {
  float: none;
}

/*--------------------------------------------------------------
Modal animation 
--------------------------------------------------------------*/
.modal .modal-dialog {
  transform: translate(0, 0);
}

.modal .fade-right {
  animation: fadeInLeft 0.5s;
  animation-direction: reverse;
}

.modal .fade-left {
  animation: fadeInRight 0.5s;
  animation-direction: reverse;
}

.modal .fade-up {
  animation: fadeInDown 0.5s;
  animation-direction: reverse;
}

.modal .fade-down {
  animation: fadeInUp 0.5s;
  animation-direction: reverse;
}

.modal.show .fade-right {
  animation: fadeInRight 0.5s;
}

.modal.show .fade-left {
  animation: fadeInLeft 0.5s;
}

.modal.show .fade-up {
  animation: fadeInUp 0.5s;
}

.modal.show .fade-down {
  animation: fadeInDown 0.5s;
}




/*--------------------------------------------------------------
Aside 
--------------------------------------------------------------*/
.aside {
  opacity: 1 !important;
  display: -ms-flexbox !important;
  display: flex !important;
  position: relative;
  z-index: 1000;
}

.aside.show {
  width: 100% !important;
  top: 0;
  bottom: 0;
}

.aside.show>* {
  left: 0;
  transform: translate3d(0, 0, 0);
}

.aside>* {
  transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.aside>.modal-dialog {
  margin: 0;
  max-width: inherit;
  pointer-events: inherit;
}

/*--------------------------------------------------------------
Layout
--------------------------------------------------------------*/
.layout,
.layout-row,
.layout-column {
  display: -ms-flexbox;
  display: flex;
}

.layout-row {
  -ms-flex-direction: row;
  flex-direction: row;
}

.layout-row>.flex-fill {
  min-width: 0;
}

.layout-column {
  -ms-flex-direction: column;
  flex-direction: column;
}

.layout-column>.flex-fill {
  min-height: 0;
}


.page-header {
  z-index: 999;
  transition: background-color 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.page-header.sticky~* .page-sidenav.sticky,
.page-header~* .fixed-content {
  top: 3.75rem;
  height: calc(100vh - 3.75rem);
}

.page-header:not(.sticky).scroll-up {
  position: fixed;
  left: 0;
  right: 0;
}

/*--------------------------------------------------------------
 site aside
--------------------------------------------------------------*/

.site-aside {
  position: fixed;
  top: 0;
  left: 0;
  width: 220px;
  height: 100vh;
  z-index: 999;
  opacity: 1;
  visibility: visible;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}

.site-logo {
  position: relative;
  overflow: hidden;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  padding: 1.25rem 1.25rem;
}

@media (max-width: 991.98px) {
  .site-logo {
    display: none;
  }
}

.site-menu {
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow-y: hidden;
}

.site-menu.hover:hover,
.site-menu.hover:focus,
.site-menu.hover:active {
  overflow: visible;
  overflow-y: auto;
}


.site-main {
  position: relative;
  width: 100%;
  -webkit-transition-duration: 500ms;
  -o-transition-duration: 500ms;
  transition-duration: 500ms;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

@media (max-width: 991.98px) {

  .site-aside {
    opacity: 0;
    visibility: hidden;
    width: 100%;
    pointer-events: none;
  }

  .site-aside.in {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 1001;
  }

  .site-aside .aside-inner {
    width: 80%;
    top: 0;
    bottom: 0;
    left: 0;
    position: absolute;
    -webkit-transition: .4s ease-in-out;
    -moz-transition: .4s ease-in-out;
    -ms-transition: .4s ease-in-out;
    -o-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
    transform: translate3d(-100%, 0, 0);
  }

  .site-aside.in .aside-inner {
    transform: translate3d(0, 0, 0);
  }

  .site-aside .aside-overlay {
    visibility: hidden;
    pointer-events: none;

  }

  .site-aside.in .aside-overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(8, 15, 25, 0.3);
    visibility: visible;
    pointer-events: initial;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .site-aside .aside-inner {
    width: 270px;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .site-logo {
    padding: 1.125rem 1.25rem;
  }

  .site-aside {
    display: block;
    width: 180px;
  }

  .site-main {
    margin-left: 180px;
  }
}

@media (min-width: 1200px) {
  .site-aside {
    width: 220px;
  }

  .site-main {
    margin-left: 220px;
  }
}

/*--------------------------------------------------------------
Nav
--------------------------------------------------------------*/
.aside-inner {
  margin: 0;
  pointer-events: inherit;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
}

.aside-inner ul {
  padding-left: 0;
  padding-right: 0;
  list-style: none;
}

.aside-inner ul a {
  color: inherit;
}

@media (min-width: 992px) {
  .menu-collasped-active .folded {
    width: 5rem;
  }


  .menu-collasped-active .site-main {
    margin-left: 5rem;
  }

  .menu-collasped-active .folded .nav-fold {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }

  .menu-collasped-active .folded .aside-menu ul>li>a .nav-text,
  .menu-collasped-active .folded .aside-menu ul>li>a .menu-icon {
    display: none;
  }

  .menu-collasped-active .folded .aside-menu ul>li>a .nav-icon {
    margin: 0 auto;
    position: relative;
    width: 2.75rem;
    height: 2.75rem;
  }

  .menu-collasped-active .folded .aside-menu>ul>li.current-menu-parent>a:before,
  .menu-collasped-active .folded .aside-menu>ul>li.current-menu-item>a:before,
  .menu-collasped-active .folded .aside-menu>ul>li.in>a:before {
    display: none;
  }

  .menu-collasped-active .folded .site-logo {
    padding: 1.125rem 1rem;
  }

  .menu-collasped-active .folded .navbar-brand {
    margin: 0 auto;
  }

  .menu-collasped-active .folded .navbar-brand .logo-large {
    display: none;
    width: 0;
  }

  .menu-collasped-active .folded .navbar-brand .logo-large.logo-dark {
    display: none;
  }

  .menu-collasped-active .folded .navbar-brand .logo-small {
    display: block;
    max-height: 48px;
  }

  .menu-collasped-active .folded .navbar-brand .logo-small.logo-dark {
    display: none;
  }

  .sidemenu-hover-active .folded {
    width: 220px;
  }

  .sidemenu-hover-active .folded .aside-menu li.active>.sub-menu {
    display: block !important;
  }

  .sidemenu-hover-active .folded .aside-menu ul>li>a .nav-text,
  .sidemenu-hover-active .folded .aside-menu ul>li>a .menu-icon,
  .sidemenu-hover-active .folded .aside-menu>ul>li.current-menu-parent>a:before,
  .sidemenu-hover-active .folded .aside-menu>ul>li.current-menu-item>a:before,
  .sidemenu-hover-active .folded .aside-menu>ul>li.in>a:before {
    display: block;
  }

  .sidemenu-hover-active .folded .aside-menu ul>li>a .nav-icon {
    width: 2.5rem;
    height: 2.5rem;
  }

  .sidemenu-hover-active .folded .site-logo {
    padding: 1.25rem;
  }

  .sidemenu-hover-active .folded .navbar-brand {
    margin: 0;
  }

  .sidemenu-hover-active .folded .navbar-brand .logo-large {
    display: block;
    width: auto;
  }

  .sidemenu-hover-active .folded .navbar-brand .logo-small {
    display: none;
  }

  .sidemenu-hover-active .folded .navbar-brand .logo-large.logo-dark,
  .sidemenu-hover-active .folded .navbar-brand .logo-small.logo-dark {
    display: none;
  }

  .sidemenu-hover-active .folded .aside-footer {
    display: block;
    width: auto;
  }

}

/*--------------------------------------------------------------
 position
--------------------------------------------------------------*/


.fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}

.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 99;
}

.sticky.sticky-bottom {
  top: auto;
  bottom: -1px;
}

@media (min-width: 992px) {
  .page-container {
    max-width: 1140px;
    margin: 0 auto;
  }

  .page-sidenav {
    display: block !important;
  }
}

@media (max-width: 991.98px) {
  .layout-row {
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .page-sidenav {
    width: 100% !important;
    height: 100% !important;
    top: 0 !important;
    position: fixed;
    z-index: 1050 !important;
    display: none;
    opactiy: 0;
  }

  .page-sidenav {
    background: transparent !important;
  }

  .page-sidenav>* {
    position: fixed;
    height: 100%;
    transition: 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);
    transform: translate3d(-100%, 0, 0);
    width: 17.5rem;
  }

  .page-sidenav.show>div {
    transform: translate3d(0, 0, 0);
  }
}

@media print {

  .page-sidenav,
  .page-header {
    display: none !important;
  }
}

/*--------------------------------------------------------------
links card
--------------------------------------------------------------*/

.list-card {
  border-bottom: 1px solid #f4f6fb;
  padding: 2rem 0;
}

.list-card:last-child {
  border-bottom-width: 0;
}

@media (max-width: 767.98px) {
  .card-banner .row {
    margin-left: -0.25rem;
    margin-right: -0.25rem;
  }

  .card-banner .row [class*="col-"],
  .card-banner .row .col {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
  }

  .list-card {
    padding: 1.25rem 0;
  }

}


/*--------------------------------------------------------------
hover item
--------------------------------------------------------------*/
.hover-item {
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

.list-row .hover-item:hover {
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
  -webkit-box-shadow: 0px 5px 30px 0px rgba(0, 9, 27, 0.1);
  -ms-box-shadow: 0px 5px 30px 0px rgba(0, 9, 27, 0.1);
  box-shadow: 0px 5px 30px 0px rgba(0, 9, 27, 0.1);
  transform: translateY(-6px);
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
}

.list-row .hover-item:hover .media {
  border-radius: 4px 0 0 4px;
}

.list-row .hover-item .list-action {
  opacity: .3;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

.list-row .hover-item:hover .list-action {
  opacity: 1;
  position: relative;
  transform: translateX(5px);
  -webkit-transform: translateX(5px);
  -moz-transform: translateX(5px);
}

.list-grouped .hover-item:hover {
  transform: translateY(-6px);
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
}

/*--------------------------------------------------------------
navbar 
--------------------------------------------------------------*/
.navbar-menu {
  -ms-flex-direction: row;
  flex-direction: row;
  margin-left: auto;
  -ms-align-items: center;
  align-items: center;
}

.navbar-menu .ui-switch {
  top: 2px;
}

.aside-menu ul li {
  margin: 0;
}

.aside-menu ul li:first-child {
  margin: 0;
}

.aside-menu ul li a {
  position: relative;
  font-size: .9375rem;
  padding: 0 .75rem;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  opacity: .6;
}

.aside-menu>ul>li.current-menu-parent>a:before,
.aside-menu>ul>li.current-menu-item>a:before,
.aside-menu>ul>li.in>a:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 3px;
  height: 100%;
  top: 0;
  background-color: #f73859
}

.aside-menu ul li.current-website-ancestor>a,
.aside-menu ul li.current-music-ancestor>a,
.aside-menu ul li.current-bookmovie-ancestor>a,
.aside-menu ul li.current-post-ancestor>a,
.aside-menu ul li.current-menu-parent>a,
.aside-menu ul li.current-menu-item>a,
.aside-menu ul li.in>a {
  color: #f73859;
  opacity: 1;
}

.aside-menu ul li a:hover {
  opacity: 1;
}


.aside-menu ul li ul {
  margin: .25rem 0;
}

.aside-menu .sub-menu {
  display: none;
  position: relative;
}

.aside-menu li.current-menu-ancestor .sub-menu,
.aside-menu li.current-menu-parent .sub-menu {
  display: block;
}

.aside-menu .sub-menu li {
  position: relative;
  margin: 0;
}

.aside-menu .sub-menu li a {
  font-size: 0.875rem;
  padding-left: 3.25rem;
}

.aside-menu .nav-text {
  margin: 0 .5rem;
  padding: .625rem 0;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  transition: opacity .15s ease-in-out;
  white-space: nowrap;
}

.aside-menu .sub-menu li .nav-text {
  padding: 0.375rem 0;
}

.aside-menu .nav-icon {
  font-size: 1.375rem;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  opacity: 0.65;
}

.aside-menu .sub-menu li .nav-icon {
  width: 1.75rem;
  height: 1.75rem;
  font-size: 1.25rem;
}

.aside-menu .nav-icon.no-fade {
  opacity: 1;
}

.aside-menu .nav-icon i {
  line-height: 1;
  max-width: 25px;
  max-height: 25px;
}

.aside-menu .nav-icon i svg,
.aside-menu .nav-icon i img {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}


.aside-menu .menu-icon {
  position: absolute;
  display: inline-block;
  right: 1rem;
  top: 50%;
  -webkit-transform: translate(-0%, -50%);
  -ms-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  opacity: .3;
}

.aside-menu .menu-icon i {
  display: block;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -ms-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;

}

.aside-menu li.in>a .menu-icon i,
.aside-menu .sub-menu>li.menu-item-has-children.in a .menu-icon i {
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
}


/**--------------------------------------------------------------
upload images
--------------------------------------------------------------**/
.fileuploader {

  background-color: rgb(244, 246, 251);
  border-radius: 6px;
  padding: 0rem;
}

@media (min-width: 920px) {
  .fileuploader {
    /* max-width: 420px; */
  }
}

.file-upload-input {
  position: absolute;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  outline: none;
  opacity: 0;
  cursor: pointer;
}

.fileuploader-theme-dragdrop .fileuploader-input {
  display: block;
  padding: 3rem 0;
  background: #fff;
  border: 2px dashed #ebeef7;
  border-radius: 6px;
  text-align: center;
}

.fileuploader-theme-dragdrop .fileuploader-input .fileuploader-icon-main {
  display: block;
  font-size: 56px;
  margin: 0 auto;
  margin-bottom: 26px;
}

.fileuploader-theme-dragdrop .fileuploader-input h3 {
  margin: 0;
  margin-bottom: 8px;
  padding: 0;
  background: none;
  border: none;
  font-size: 18px;
  font-weight: bold;
  color: #5B5B7B;
  white-space: normal;
  box-shadow: none;
}

.fileuploader-theme-dragdrop .fileuploader-input p {
  margin: 0;
  padding: 0;
  color: #90a0bc;
  margin-bottom: 12px;
}

/* dragging state */
.fileuploader-theme-dragdrop .fileuploader-input .fileuploader-input-inner>* {
  -webkit-transition: 500ms cubic-bezier(0.17, 0.67, 0, 1.01);
  transition: 500ms cubic-bezier(0.17, 0.67, 0, 1.01);
}

.fileuploader-theme-dragdrop .fileuploader-input.fileuploader-dragging .fileuploader-input-inner>* {
  transform: translateY(18px);
  opacity: 0;
}

.fileuploader-theme-dragdrop .fileuploader-input.fileuploader-dragging .fileuploader-icon-main {
  transform: translateY(30px) scale(1.2);
  opacity: 0.6;
}

.fileuploader-theme-dragdrop .fileuploader-input.fileuploader-dragging .fileuploader-input-caption {
  transform: translateY(30px);
  opacity: 0.6;
}

.fileuploader-items .fileuploader-items-list {
  display: block;
  padding: 0;
  list-style: none;
}

.fileuploader-items .fileuploader-item {
  position: relative;
  margin: 0;
  padding: 1rem;
  border-bottom: 1px solid #ebeef1;
  animation-duration: .6s;
}

.fileuploader-items .fileuploader-item:last-child {
  border-bottom: 0;
}

/**--------------------------------------------------------------
## tool post 
--------------------------------------------------------------**/
@media (max-width: 767.98px) {
  .post.other .post-image {
    position: relative;
  }

  .post.other .post-actions {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    padding: 1.5rem 0
  }
}

/**--------------------------------------------------------------
##Search
--------------------------------------------------------------**/
.input-search {
  display: inline-block;
  position: relative;
  width: auto;
}

.btn-search-icon {
  position: relative;
  cursor: pointer;
}

.input-search .form-control {
  position: absolute;
  left: 40px;
  top: 0;
  width: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all .35s ease-in-out;
  transition: all .35s ease-in-out;
}

.search-opened .input-search {
  width: 200px;
}

.search-opened .input-search .form-control {
  width: 200px;
  opacity: 1;
  visibility: visible;
}


/**--------------------------------------------------------------
search form wrapper
--------------------------------------------------------------**/

.search-form-wrapper {
  position: fixed;
  width: 100%;
  top: 0;
  right: 0;
  padding: 5rem 0;
  min-height: 33.333vh;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  z-index: 9999;
  -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 9, 27, 0.08);
  -ms-box-shadow: 0px 0px 30px 0px rgba(0, 9, 27, 0.08);
  box-shadow: 0px 0px 30px 0px rgba(0, 9, 27, 0.08);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}


.search-form-wrapper .search-wrapper {
  position: relative;
}

.search-form-wrapper .search-action {
  position: absolute;
  right: 2rem;
  top: 2rem;
  display: none;
}

.search-form-wrapper.in {
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

.search-form-wrapper.in .search-action {
  display: block;
}

@media (max-width: 767.98px) {
  .search-form-wrapper {
    /* min-height: 50vh; */
    padding: 1.25rem 0;
  }

  .search-form-wrapper .search-action {

    right: auto;
    top: auto;
    left: 50%;
    bottom: 0;
    -webkit-transform: translate(-50%, 125%);
    -ms-transform: translate(-50%, 125%);
    transform: translate(-50%, 125%);
  }
}

.search-form-wrapper .search-field {
  position: relative;
}

.search-form-wrapper .search-submit {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
}

.search-form-wrapper .search-select {
  position: relative;
}

.search-form-wrapper .search-select select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

}

.search-form-wrapper .search-select select::-ms-expand {
  display: none;
}

.search-form-wrapper .select-arrow {
  position: absolute;
  top: 50%;
  right: 15px;
  width: 0;
  height: 0;
  pointer-events: none;
  border-style: solid;
  border-width: 4px 4px 0 4px;
  border-color: #969fb7 transparent transparent transparent;
  -webkit-transform: translate(0%, -50%);
  -ms-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.search-form-wrapper .search-select select:hover~.select-arrow,
.search-form-wrapper .search-select select:focus~.select-arrow {
  border-top-color: #283149;
}

.search-form-wrapper .search-select select:disabled~.select-arrow {
  border-top-color: #969fb7;
}

.search-form-wrapper .search-submit i {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.search-form-wrapper:hover .search-submit i,
.search-form-wrapper:active .search-submit i {
  transform: rotate(90deg);
}

/**--------------------------------------------------------------
##tips
--------------------------------------------------------------**/

.nice-tips-nopd .nice-tips-content {
  border-radius: 10px;
  overflow: hidden;
}


.modal-open::before {
  content: '';
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background-color: #000;
  opacity: .2;
}

/*--------------------------------------------------------------
## night mode
--------------------------------------------------------------*/
.nice-night-mode {
  background-color: #232931;
}

/*--------------------------------------------------------------
## night mode text
--------------------------------------------------------------*/
.nice-night-mode,
.nice-night-mode a:not(.btn) {
  color: #ffffff;
}

.nice-night-mode a:not(.btn):hover,
.nice-night-mode .navbar-toggler:hover {
  color: #f73859;
}

.nice-night-mode p,
.nice-night-mode .navbar-toggler {
  color: #6a758e;
}

.nice-night-mode .text-dark {
  color: #4f565f !important;
}

.nice-night-mode .text-secondary {
  color: #3a414a !important;
}


/*--------------------------------------------------------------
## night mode content
--------------------------------------------------------------*/

.nice-night-mode .post-content h4 {
  border-color: #1e222b
}

/*--------------------------------------------------------------
## night mode backgroud
--------------------------------------------------------------*/
.nice-night-mode .bg-light {
  background-color: #1e232b !important;
}

.nice-night-mode .bg-white {
  background-color: #232931 !important;
}

.nice-night-mode .bg-dark {
  background-color: #1b1e23 !important;
}

.nice-night-mode .bg-secondary {
  background-color: #20252b !important;
}

/*--------------------------------------------------------------
## night mode botton
--------------------------------------------------------------*/

.nice-night-mode .btn-secondary {
  color: #a8b1c3;
  background-color: #1e222a;
  border-color: #1e222a;
}

.nice-night-mode .btn-secondary:hover,
.nice-night-mode .btn-secondary:focus,
.nice-night-mode .btn-secondary:not(:disabled):not(.disabled):active,
.nice-night-mode .btn-secondary:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: #1e222a;
  border-color: #1e222a;
}

.nice-night-mode .btn-outline-secondary {
  color: #a8b1c3;
  background-color: transparent;
  border-color: #1f2227;
}

.nice-night-mode .btn-outline-secondary:hover,
.nice-night-mode .btn-outline-secondary:focus,
.nice-night-mode .btn-outline-secondary:not(:disabled):not(.disabled):active,
.nice-night-mode .btn-outline-secondary:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: transparent;
  border-color: #1b1e23;
}

.nice-night-mode .btn-light {
  color: #6a758e;
  background-color: #1e232b;
  border-color: #1e232b;
}

.nice-night-mode .btn-light:hover,
.nice-night-mode .btn-light:focus,
.nice-night-mode .btn-light:not(:disabled):not(.disabled):active,
.nice-night-mode .btn-light:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: #1e232b;
  border-color: #1e232b;
}

.nice-night-mode .btn-link {
  color: #6a758e;
}

.nice-night-mode .btn-link:hover,
.nice-night-mode .btn-link:focus,
.nice-night-mode .btn-link:not(:disabled):not(.disabled):active,
.nice-night-mode .btn-link:not(:disabled):not(.disabled).active {
  color: #fff;
}


.nice-night-mode .btn-outline-light {
  color: #6a758e;
  background-color: transparent;
  border-color: #1e232b;
}

.nice-night-mode .btn-outline-light:hover,
.nice-night-mode .btn-outline-light:focus,
.nice-night-mode .btn-outline-light:not(:disabled):not(.disabled):active,
.nice-night-mode .btn-outline-light:not(:disabled):not(.disabled).active {
  color: #fff;
  background-color: transparent;
  border-color: #1e232b;
}

.nice-night-mode .btn-outline-light.btn-nostyle {
  background-color: transparent !important;
  border-color: transparent !important;
  color: #6a758e !important;
}

.nice-night-mode .btn-like.current {
  color: #fff;
  background-color: #f73859;
  border-color: #f73859;
}

/*--------------------------------------------------------------
## night mode input-group
--------------------------------------------------------------*/

.nice-night-mode .form-control {

  color: #6a758e;
  border: 1px solid #1e232b;
  background-color: #1e232b;
}

.nice-night-mode .form-control:focus {
  color: #fff;
  border-color: #1e232b;
  background-color: #1e232b;
}

.nice-night-mode .form-control:focus::placeholder {
  color: #fff;
}

.nice-night-mode .form-control:disabled,
.nice-night-mode .form-control[readonly] {
  background-color: #1e232b;
  color: #fff
}

/*--------------------------------------------------------------
## night mode border
--------------------------------------------------------------*/

.nice-night-mode .list-border .list-item>*:last-child {
  border-color: #282b30
}

.nice-night-mode .border-light {
  border-color: #2b3038 !important;
}

.nice-night-mode .border-muted {
  border-color: #232731 !important;
}

/*--------------------------------------------------------------
## night mode popur
--------------------------------------------------------------*/
.nice-night-mode .nice-tips-overlay {
  background-color: rgba(64, 68, 74, 0.1);
}

.nice-night-mode .nice-tips-content {
  background: #232831;
  border-color: #232831;
  box-shadow: none;
}

/*--------------------------------------------------------------
## night mobile menu
--------------------------------------------------------------*/

.nice-night-mode .main-menu li ul {
  background-color: #1b1e23;
  border-color: #1b1e23;
  box-shadow: none;
}

/*--------------------------------------------------------------
## night pagination
--------------------------------------------------------------*/
.nice-night-mode .pagination .nav-links {
  background-color: #1e232b
}

.nice-night-mode .pagination .page-numbers {
  color: #6a758e;
}

.nice-night-mode .pagination .current.page-numbers {
  color: #fff;
}


/*---------------------------------------------------
## night card
--------------------------------------------------------------*/

.nice-night-mode .list-card {
  border-bottom-color: #2b3038;
}

/*--------------------------------------------------------------
## nice-night-mode dropdown
--------------------------------------------------------------*/
.nice-night-mode .dropdown-menu {
  border: solid 1px #1b1e23;
  background-color: #1b1e23;
  box-shadow: none;
}

/*--------------------------------------------------------------
## nice-night-mode  Switch
--------------------------------------------------------------*/
.nice-night-mode .ui-switch {
  background-color: #2b3038;
}

.nice-night-mode .ui-switch input:checked+i:before {
  background-color: #2b3038;
}

.nice-night-mode .ui-switch input:checked+i:after {
  margin-left: 10px;
  background-color: #f73859;
}

.nice-night-mode .ui-switch i:before {
  border-color: #2b3038;
  background-color: #2b3038;
}

.nice-night-mode .ui-switch i:after {
  background-color: #969fb7;
}

/*--------------------------------------------------------------
## nice-night-mode menu 
--------------------------------------------------------------*/
.nice-night-mode .aside-menu ul li a,
.nice-night-mode .aside-menu li a {
  color: #6a758e;
}

.nice-night-mode .aside-menu ul li.current-menu-item>a,
.nice-night-mode .aside-menu ul li.in>a {
  color: #f73859;
}

/**--------------------------------------------------------------
nice-night-mode upload images
--------------------------------------------------------------**/
.nice-night-mode .fileuploader {
  background-color: rgb(30, 34, 42);
}

.nice-night-mode .fileuploader-theme-dragdrop .fileuploader-input {
  background: #222930;
  border-color: #2b3038;
}

.nice-night-mode .fileuploader-items .fileuploader-item {
  border-color: #1e222a;
}

/**--------------------------------------------------------------
nice-night-mode upload images
--------------------------------------------------------------**/

.nice-night-mode .page-sidenav {
  background: transparent !important;
}

/**--------------------------------------------------------------
nice-night-mode search 
--------------------------------------------------------------**/

.nice-night-mode .search-form-wrapper {
  background-color: #1b1e23;
}

/**--------------------------------------------------------------
nice-night-mode logo 
--------------------------------------------------------------**/
.nice-night-mode .menu-collasped-active .folded .navbar-brand .logo-small.logo-dark,
.nice-night-mode .sidemenu-hover-active .folded .navbar-brand .logo-large.logo-dark,
.nice-night-mode .sidemenu-hover-deactive .folded .navbar-brand .logo-small.logo-dark {
  display: block;
}

.nice-night-mode .menu-collasped-active .folded .navbar-brand .logo-small.logo-light,
.nice-night-mode .sidemenu-hover-active .folded .navbar-brand .logo-small.logo-dark,
.nice-night-mode .sidemenu-hover-active .folded .navbar-brand .logo-large.logo-light {
  display: none;
}