.topbar .logo,
.topbar ul,
.sidebar .logo,
#loginPage .login .logo {
  *zoom: 1
}

.topbar .logo:before,
.topbar ul:before,
.sidebar .logo:before,
#loginPage .login .logo:before,
.topbar .logo:after,
.topbar ul:after,
.sidebar .logo:after,
#loginPage .login .logo:after {
  content: " ";
  display: table
}

.topbar .logo:after,
.topbar ul:after,
.sidebar .logo:after,
#loginPage .login .logo:after {
  clear: both
}

.bg-gradient {
  position: relative;
  background: #FF9D6D !important;
  background: -webkit-linear-gradient(legacy-direction(-270deg), #FF9D6D 0%, #FE616F 100%) !important;
  background: linear-gradient(-270deg, #FF9D6D 0%, #FE616F 100%) !important
}

.adminNav {
  box-shadow: 0px 2px 3px 1px rgba(62, 57, 107, .10);
  z-index: 1;
}

body,
html {
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

html {
  min-height: 100vh
}

body {
  background: #eaeaea;
  color: #37474f;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  letter-spacing: 0;
  line-height: 1.47;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  min-height: 100vh
}

@media screen and (max-width: 768px) {
  body {
    padding-left: 0
  }
}

body,
input,
select,
textarea {
  -webkit-transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  -ms-transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  transition: all .2s cubic-bezier(0.42, 0, 0.58, 1)
}

a {
  -webkit-transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  -ms-transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  transition: all .2s cubic-bezier(0.42, 0, 0.58, 1);
  cursor: pointer;
  color: #37474f;
  text-decoration: none
}

a:hover {
  color: #2962FF;
  border-color: #2962FF;
  text-decoration: none !important;
  outline: none !important
}

a:active,
a:focus {
  outline: none !important;
  text-decoration: none !important
}

strong,
b {
  font-weight: 600
}

em,
i {
  font-style: italic
}

p {
  font-family: system-ui, -apple-system, system-ui, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 15px;
  font-weight: normal;
  letter-spacing: 0.025em
}

p:last-child {
  margin-bottom: 0
}

p a {
  padding-bottom: 2px;
  border-bottom: 1px dashed #76838f
}

abbr[title] {
  border-bottom: none !important;
  cursor: inherit !important;
  text-decoration: none !important
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a {
  color: inherit;
  text-decoration: none
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small {
  color: inherit
}

/*
h1 span,
h2 span,
h3 span,
h4 span,
h5 span {
  color: #2962FF
}*/

h1.add-line,
h2.add-line,
h3.add-line,
h4.add-line,
h5.add-line {
  position: relative;
  padding-bottom: 1.5rem
}

h1.add-line:after,
h2.add-line:after,
h3.add-line:after,
h4.add-line:after,
h5.add-line:after {
  display: block;
  position: absolute;
  content: " ";
  bottom: .5rem;
  height: 3px;
  width: 75px;
  background: #37474f;
  opacity: .75;
  filter: alpha(opacity=75)
}

h1.add-line.secondary-line:after,
h2.add-line.secondary-line:after,
h3.add-line.secondary-line:after,
h4.add-line.secondary-line:after,
h5.add-line.secondary-line:after {
  background: #d93025
}

h1.add-line.primary-line:after,
h2.add-line.primary-line:after,
h3.add-line.primary-line:after,
h4.add-line.primary-line:after,
h5.add-line.primary-line:after {
  background: #2962FF
}

small {
  font-size: 85%
}

figure {
  display: block;
  border: 1px solid #E5F5FE;
  padding: 0.75rem 0.75rem 0;
  text-align: center;
  margin-bottom: 2rem
}

figure img {
  max-width: 100%
}

figure figcaption {
  display: block;
  padding: 0.25rem 0.75rem;
  font-size: 85%;
  font-style: italic;
  color: #4c626d
}

section {
  position: relative
}

section.text-center div[class*='col-']:first-child:last-child {
  margin: 0 auto;
  float: none
}

main {
  height: calc(100vh - 115px);
  overflow-y: auto;
}

.logo {
  height: 40px;
}

.logo-emblem {
  height: 40px;
}

.logo-emblem img {
  height: 100%;
  width: auto;
}

.logo-full {
  color: #000;
  font-size: 18px;
  font-weight: 600;
}


.navbar-dark .navbar-nav .active > .nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show > .nav-link {
  color: #d43a76 !important;
  font-size: 14px !important;
}

.navbar-dark .navbar-nav .nav-link:hover {
  color: #d83f7d !important;
}

.navbar-dark .navbar-nav .nav-link, .navbar-dark .navbar-nav .nav-link:active, .navbar-dark .navbar-nav .nav-link:focus {
  color: #232f3e !important;
  font-size: 14px !important;
}
.navbar-dark .navbar-nav .nav-link:focus
{
  color: #d43a76 !important;
}
.dropdown-item {
  font-size: 14px;
  padding: 4px 11px;
  color: #2c2c2c;
  font-weight: 400;
}

.dropdown-item i.mdi-checkbox-multiple-blank-circle-outline {
  width: 23px;
  float: left;
}

.dropdown-toggle::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: .255em;
  vertical-align: .255em;
  content: "";
  border-top: .3em solid;
  border-right: .3em solid #26202005;
  border-bottom: 0;
  border-left: .3em solid transparent;
  color: #b7b5b5;
  top: 21px;
  position: absolute;
}

.navbar-expand-lg .navbar-nav .nav-link {
  padding-right: 14px;
  padding-left: 10px;
}

.navbar-expand-lg .dropdown-menu {
  border-radius: 3px;
  padding: 10px 0;
}

.navbar-expand-lg .navbar-nav {
  margin: auto;
}

.row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex
}

.navbar-expand-lg {

  width: 100%;
}

.row > [class*='col-'] {
  display: flex;
  flex-direction: column
}

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

.btn {
  border-color: rgba(0, 0, 0, 0.1)
}

img,
.img-responsive {
  max-width: 100%
}

.btn.btn-default {
  background-color: #F5F7FA;
  font-size: 15px
}

.btn.btn-primary {
  color: white !important
}

.input-group-addon {
  background: #F5F7FA;
  border-color: rgba(0, 0, 0, 0.1)
}

.nav-pills > li {
  border: 1px solid transparent;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  z-index: 1
}

.nav-pills > li a {
  display: block;
  padding: 5px 15px;
  border: 1px solid transparent
}

.nav-pills > li a .badge {
  min-width: 0;
  height: auto;
  line-height: inherit;
  background: white;
  color: #2962FF;
  padding: 2px 5px;
  border: none
}

.nav-pills > li:hover {
  border-color: #2962FF
}

.nav-pills > li.active {
  border-color: #2962FF;
  background: #2962FF;
  color: white
}

.nav-pills > li.active a {
  color: white
}

.nav-pills.nav-stacked {
  display: block
}

.nav-pills.nav-stacked li {
  display: block
}

.nav-pills.nav-stacked li a {
  display: block
}

.color-dark {
  color: #F4F6F8
}

.color-white {
  color: white !important;
}

.color-grey,
.color-gray {
  color: #666
}

.color-textColor {
  color: #37474f !important
}

.color-red {
  color: #DD6777 !important
}

.color-primary {
  color: #2962FF !important
}

.color-green {
  color: #6FC080 !important
}

.color-blue {
  color: #6EC7E6 !important
}

.color-yellow {
  color: #FFCE44 !important
}

.color-ltorange {
  color: #e9827b !important
}

.has-overlay:before {
  position: absolute;
  content: '';
  background: #F4F6F8;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: .65;
  filter: alpha(opacity=65)
}

.has-overlay > div:not(.bg-image-holder) {
  z-index: 1;
  color: white
}

.has-overlay > div:not(.bg-image-holder) h1,
.has-overlay > div:not(.bg-image-holder) h2,
.has-overlay > div:not(.bg-image-holder) h3,
.has-overlay > div:not(.bg-image-holder) h4,
.has-overlay > div:not(.bg-image-holder) h5,
.has-overlay > div:not(.bg-image-holder) h6,
.has-overlay > div:not(.bg-image-holder) a,
.has-overlay > div:not(.bg-image-holder) .lead {
  color: white
}

.has-shadow {
  -webkit-box-shadow: 0 10px 45px 0 rgba(7, 61, 125, 0.1);
  -moz-box-shadow: 0 10px 45px 0 rgba(7, 61, 125, 0.1);
  box-shadow: 0 10px 45px 0 rgba(7, 61, 125, 0.1)
}

.has-shadow-long {
  -webkit-box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1);
  -moz-box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1);
  box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1)
}

.text-light {
  color: #76838f !important
}

.text-primary {
  color: #2962FF !important
}

.vh-10 {
  height: 10vh
}

.vh-20 {
  height: 20vh
}

.vh-30 {
  height: 30vh
}

.vh-40 {
  height: 40vh
}

.vh-50 {
  height: 50vh
}

.vh-60 {
  height: 60vh
}

.vh-70 {
  height: 70vh
}

.vh-80 {
  height: 80vh
}

.vh-90 {
  height: 90vh
}

.vh-100 {
  height: 100vh
}

.auto-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative
}

.auto-height > [class*='col-'],
.auto-height > .col {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative
}

.auto-height > [class*='col-'] .box,
.auto-height > .col .box {
  height: 100%
}

.ptb-1 {
  padding-top: 25px !important;
  padding-bottom: 25px !important
}

.ptb-2 {
  padding-top: 50px !important;
  padding-bottom: 50px !important
}

.ptb-3 {
  padding-top: 75px !important;
  padding-bottom: 75px !important
}

.pt-6 {
  padding-top: 4rem
}

.pt-7 {
  padding-top: 5rem
}

.pt-8 {
  padding-top: 6rem
}

.pt-9 {
  padding-top: 7rem
}

.pt-10 {
  padding-top: 8rem
}

.pb-6 {
  padding-bottom: 4rem
}

.pb-7 {
  padding-bottom: 5rem
}

.pb-8 {
  padding-bottom: 6rem
}

.pb-9 {
  padding-bottom: 7rem
}

.pb-10 {
  padding-bottom: 8rem
}

.pl-6 {
  padding-left: 4rem
}

.pl-7 {
  padding-left: 5rem
}

.pl-8 {
  padding-left: 6rem
}

.pl-9 {
  padding-left: 7rem
}

.pl-10 {
  padding-left: 8rem
}

.pr-6 {
  padding-right: 4rem
}

.pr-7 {
  padding-right: 5rem
}

.pr-8 {
  padding-right: 6rem
}

.pr-9 {
  padding-right: 7rem
}

.pr-10 {
  padding-right: 8rem
}

.mtb-1 {
  margin-top: 25px !important;
  margin-bottom: 25px !important
}

.mtb-2 {
  margin-top: 50px !important;
  margin-bottom: 50px !important
}

.mtb-3 {
  margin-top: 75px !important;
  margin-bottom: 75px !important
}

.mt-6 {
  margin-top: 4rem
}

.mt-7 {
  margin-top: 5rem
}

.mt-8 {
  margin-top: 6rem
}

.mt-9 {
  margin-top: 7rem
}

.mt-10 {
  margin-top: 8rem
}

.mb-6 {
  margin-bottom: 4rem
}

.mb-7 {
  margin-bottom: 5rem
}

.mb-8 {
  margin-bottom: 6rem
}

.mb-9 {
  margin-bottom: 7rem
}

.mb-10 {
  margin-bottom: 8rem
}

.ml-6 {
  margin-left: 4rem
}

.ml-7 {
  margin-left: 5rem
}

.ml-8 {
  margin-left: 6rem
}

.ml-9 {
  margin-left: 7rem
}

.ml-10 {
  margin-left: 8rem
}

.mr-6 {
  margin-right: 4rem
}

.mr-7 {
  margin-right: 5rem
}

.mr-8 {
  margin-right: 6rem
}

.mr-9 {
  margin-right: 7rem
}

.mr-10 {
  margin-right: 8rem
}

.align-bottom {
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: center;
  justify-content: flex-end;
  align-self: center;
  align-self: center
}

.align-center,
.align-middle {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  align-self: center
}

.align-bottom,
.aligh-center,
.align-middle {
  height: 100%
}

.align-bottom img,
.aligh-center img,
.align-middle img {
  -webkit-align-self: center;
  align-self: center
}

.position-relative {
  position: relative !important
}

.position-absolute {
  position: absolute !important
}

.position-static {
  position: static !important
}

.position-fixed {
  position: fixed !important
}

.position-inherit {
  position: inherit !important
}

.position-initial {
  position: initial !important
}

.font-small {
  font-size: 13px
}

.font-2x {
  font-size: 30px !important
}

.font-3x {
  font-size: 45px !important
}

.font-4x {
  font-size: 60px !important
}

.font-5x {
  font-size: 75px !important
}

.font-13 {
  font-size: 1.3rem;
  font-size: 13px
}

.font-14 {
  font-size: 1.4rem;
  font-size: 14px
}

.font-15 {
  font-size: 1.5rem;
  font-size: 15px
}

.font-16 {
  font-size: 1.6rem;
  font-size: 16px
}

.font-17 {
  font-size: 1.7rem;
  font-size: 17px
}

.font-18 {
  font-size: 1.8rem;
  font-size: 18px
}

.font-19 {
  font-size: 1.9rem;
  font-size: 19px
}

.font-20 {
  font-size: 2rem;
  font-size: 20px
}

.font-weight-light {
  font-weight: 300 !important
}

.font-weight-normal {
  font-weight: 400 !important
}

.font-weight-bold {
  font-weight: bold !important
}

.font-style-italic {
  font-style: italic !important
}

.font-style-normal {
  font-style: normal !important
}

.font-style-oblique {
  font-style: oblique !important
}

hr {
  width: 100%;
  border-color: rgba(0, 0, 0, 0.1);
  margin: 8px 0
}

hr.hr-primary {
  border-color: #2962FF
}

hr.hr-short {
  width: 65px
}

hr.hr-center {
  margin-left: auto;
  margin-right: auto
}

.image,
.card {
  max-width: 100%;
  border: none;
  padding: 0;
  width: auto;
  height: auto
}

.image .img,
.image img,
.card .img,
.card img {
  position: relative;
  max-width: 100%;
  z-index: 1
}

.image-rounded,
.card-rounded {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  border-radius: 5px;
  overflow: hidden
}

.image-circle,
.card-circle {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden
}

.image-shadow,
.card-shadow {
  -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15)
}

.image-shadow-narrow,
.card-shadow-narrow {
  -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.06);
  -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.06);
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.06)
}

.image-shadow-wide,
.card-shadow-wide {
  -webkit-box-shadow: 0 23px 40px rgba(0, 0, 0, 0.17);
  -moz-box-shadow: 0 23px 40px rgba(0, 0, 0, 0.17);
  box-shadow: 0 23px 40px rgba(0, 0, 0, 0.17)
}

.image-shadow-floating,
.card-shadow-floating {
  position: relative;
  overflow: visible
}

.image-shadow-floating:before,
.image-shadow-floating:after,
.card-shadow-floating:before,
.card-shadow-floating:after {
  position: absolute;
  content: "";
  bottom: 15px;
  left: 15px;
  top: 80%;
  width: 45%;
  background: rgba(0, 0, 0, 0.35);
  z-index: 0;
  -webkit-box-shadow: 0 15px 15px rgba(0, 0, 0, 0.35);
  -moz-box-shadow: 0 15px 15px rgba(0, 0, 0, 0.35);
  box-shadow: 0 15px 15px rgba(0, 0, 0, 0.35);
  -moz-transform: rotate(-6deg);
  -o-transform: rotate(-6deg);
  -ms-transform: rotate(-6deg);
  -webkit-transform: rotate(-6deg);
  transform: rotate(-6deg)
}

.image-shadow-floating:after,
.card-shadow-floating:after {
  -moz-transform: rotate(6deg);
  -o-transform: rotate(6deg);
  -ms-transform: rotate(6deg);
  -webkit-transform: rotate(6deg);
  transform: rotate(6deg);
  right: 15px;
  left: auto
}

.image-shadow-floating.image-rounded,
.image-shadow-floating.card-rounded,
.card-shadow-floating.image-rounded,
.card-shadow-floating.card-rounded {
  overflow: visible
}

.image-shadow-lifted,
.card-shadow-lifted {
  position: relative;
  overflow: visible
}

.image-shadow-lifted:before,
.image-shadow-lifted:after,
.card-shadow-lifted:before,
.card-shadow-lifted:after {
  position: absolute;
  content: "";
  box-shadow: 0 10px 25px 20px rgba(0, 0, 0, 0.25);
  top: 40px;
  left: 15px;
  bottom: 37.5px;
  width: 15%;
  z-index: 0;
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  -webkit-transform: rotate(-3deg);
  transform: rotate(-3deg)
}

.image-shadow-lifted:after,
.card-shadow-lifted:after {
  right: 15px;
  left: auto;
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  -webkit-transform: rotate(3deg);
  transform: rotate(3deg)
}

.image-shadow-lifted.image-rounded,
.image-shadow-lifted.card-rounded,
.card-shadow-lifted.image-rounded,
.card-shadow-lifted.card-rounded {
  overflow: visible
}

.image-shadow-layer,
.card-shadow-layer {
  position: relative;
  -webkit-box-shadow: 0 2.5rem 2.5rem -2rem rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2.5rem 2.5rem -2rem rgba(0, 0, 0, 0.2);
  box-shadow: 0 2.5rem 2.5rem -2rem rgba(0, 0, 0, 0.2)
}

.ratio-16-9 {
  padding-top: 56.25%
}

.ratio-4-3 {
  padding-top: 75%
}

@media (max-width: 768px) {
  .hidden-md-down {
    display: none
  }
}

@media (min-width: 992px) {
  .hidden-md-up {
    display: none
  }
}

.image.image-rounded img {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  border-radius: 5px
}

.card-shadow,
.card-shadow-narrow,
.card-shadow-wide,
.card-shadow-floating,
.card-shadow-lifted,
.card-shadow-layer {
  background: white;
  border: 1px solid rgba(0, 0, 0, 0.1)
}

.card-shadow .card-block,
.card-shadow-narrow .card-block,
.card-shadow-wide .card-block,
.card-shadow-floating .card-block,
.card-shadow-lifted .card-block,
.card-shadow-layer .card-block {
  position: relative;
  background: white;
  z-index: 1
}

.delay-025s {
  -moz-animation-delay: .25s;
  -webkit-animation-delay: .25s;
  animation-delay: .25s
}

.delay-05s {
  -moz-animation-delay: .5s;
  -webkit-animation-delay: .5s;
  animation-delay: .5s
}

.delay-075s {
  -moz-animation-delay: .75s;
  -webkit-animation-delay: .75s;
  animation-delay: .75s
}

.delay-1s {
  -moz-animation-delay: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s
}

.delay-125s {
  -moz-animation-delay: 1.25s;
  -webkit-animation-delay: 1.25s;
  animation-delay: 1.25s
}

.delay-15s {
  -moz-animation-delay: 1.5s;
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s
}

.delay-175s {
  -moz-animation-delay: 1.75s;
  -webkit-animation-delay: 1.75s;
  animation-delay: 1.75s
}

.delay-2s {
  -moz-animation-delay: 2s;
  -webkit-animation-delay: 2s;
  animation-delay: 2s
}

.delay-225s {
  -moz-animation-delay: 2.25s;
  -webkit-animation-delay: 2.25s;
  animation-delay: 2.25s
}

.delay-25s {
  -moz-animation-delay: 2.5s;
  -webkit-animation-delay: 2.5s;
  animation-delay: 2.5s
}

.delay-275s {
  -moz-animation-delay: 2.75s;
  -webkit-animation-delay: 2.75s;
  animation-delay: 2.75s
}

.delay-3s {
  -moz-animation-delay: 3s;
  -webkit-animation-delay: 3s;
  animation-delay: 3s
}

.delay-325s {
  -moz-animation-delay: 3.25s;
  -webkit-animation-delay: 3.25s;
  animation-delay: 3.25s
}

.delay-35s {
  -moz-animation-delay: 3.5s;
  -webkit-animation-delay: 3.5s;
  animation-delay: 3.5s
}

.delay-375s {
  -moz-animation-delay: 3.75s;
  -webkit-animation-delay: 3.75s;
  animation-delay: 3.75s
}

.delay-4s {
  -moz-animation-delay: 4s;
  -webkit-animation-delay: 4s;
  animation-delay: 4s
}

.delay-5s {
  -moz-animation-delay: 5s;
  -webkit-animation-delay: 5s;
  animation-delay: 5s
}

@media only screen and (max-width: 767px) {
  [class^="delay-"] {
    -moz-animation-delay: 0s;
    -webkit-animation-delay: 0s;
    animation-delay: 0s
  }
}

.hidden-xs-up {
  display: none !important
}

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

@media (min-width: 480px) {
  .hidden-sm-up {
    display: none !important
  }
}

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

@media (min-width: 768px) {
  .hidden-md-up {
    display: none !important
  }
}

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

@media (min-width: 992px) {
  .hidden-lg-up {
    display: none !important
  }
}

@media (max-width: 1199px) {
  .hidden-lg-down {
    display: none !important
  }
}

@media (min-width: 1200px) {
  .hidden-xl-up {
    display: none !important
  }
}

@media (max-width: 1599px) {
  .hidden-xl-down {
    display: none !important
  }
}

@media (min-width: 1600px) {
  .hidden-xxl-up {
    display: none !important
  }
}

.hidden-xxl-down {
  display: none !important
}

.loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  line-height: 100%;
  text-align: center;
  background: #F5F7FA;
  z-index: 100
}

.loading .loading-center {
  width: 100%;
  display: block;
  height: 300px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%)
}

.loading img {
  max-height: 100%
}

.topbar {
  background: #fff;
  height: 50px;
  line-height: 50px;
  left: 0;
  z-index: 10;
  position: relative;
  width: 100%;
  margin: 0;
  color: #222;
  border-bottom: 1px solid #efefef;
  /*box-shadow: -22px 2px 18px 0 rgba(25, 42, 70, .07);*/
}

.topbar .logo {
  width: 170px;
  height: 50px;
  overflow: hidden;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 15px;
  letter-spacing: 0.05em;
  float: left;
}

.topbar .logo a {
  display: block
}

.topbar .logo .logo-emblem {
  display: block;
  width: 50px;
  height: 50px;
  line-height: 50px;
  color: white;
  text-align: center;
  float: left;
  /*box-shadow: 1px 0 20px rgba(0, 0, 0, 0.08);*/
}

.topbar .logo .logo-emblem img {
  max-width: 36px;
  max-height: 36px
}

.topbar .logo .logo-full {
  display: block;
  height: 50px;
  line-height: 50px;
  float: left;
  width: 120px
}

.topbar [class^="col-md-"] {
  padding: 0;
  position: relative
}

.topbar a {
  color: #222;
  font-size: 14px;
}

.menu-dashboard {
  display: inline-block;
  line-height: 65px;
  vertical-align: middle;
  width: 50px;
  text-align: center;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear;
  padding: 0 0px 0 0px;
  font-size: 18px;
  /*border-left: 1px solid #6890fe;*/
}

.topbar .menu-toggle {
  position: absolute;
  left: 211px;
  padding: 0 0px 0 0px;
  top: 0;
  width: 50px;
  text-align: center;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear;
}

.topbar .menu-toggle i {
  display: inline-block;
  text-align: center;
  font-size: 20px
}

.topbar ul {
  padding: 0 0 0 25px;
  margin: 0;
  height: 50px;
  line-height: 50px;
  float: right;
}

.topbar ul li {
  list-style-type: none;
  display: block;
  float: left;
  position: relative
}

.topbar ul li > .dropdown-toggle {
  min-width: 65px
}

.topbar ul li > .dropdown-toggle:after {
  display: none
}

.topbar ul li.mobile-menu-toggle {
  display: none
}

.topbar ul li #mobileMenu {
  display: block;
  width: 54px;
  height: 54px;
  line-height: 54px;
  padding: 0;
  text-align: center
}

.topbar ul li #mobileMenu .closed {
  display: block
}

.topbar ul li #mobileMenu .open {
  display: none
}

.topbar ul li #mobileMenu.active {
  color: #2962FF
}

.topbar ul li #mobileMenu.active .closed {
  display: none
}

.topbar ul li #mobileMenu.active .open {
  display: block
}

.topbar ul li .dropdown-menu {
  height: auto;
  left: auto;
  border: none;
  padding: 0;
  margin: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: 0 2px 5px 0 rgba(62, 57, 107, 0.1);
  -moz-box-shadow: 0 2px 5px 0 rgba(62, 57, 107, 0.1);
  box-shadow: 0 2px 5px 0 rgba(62, 57, 107, 0.1);
  -o-border-radius: 0;
}

.topbar ul li .dropdown-menu li {
  display: block;
  width: 100%;
  padding: 0
}

.topbar ul li .dropdown-menu li a {
  display: block;
  font-size: 14px;
  color: #37474f;
  line-height: 1.47;
  padding: 8px 15px;
  background: #fff
}

.topbar ul li .dropdown-menu li a i {
  margin-right: 3px
}

.topbar ul li .dropdown-menu li a:hover {
  background-color: #f1f1f1 !important;
}

.topbar ul li .dropdown-menu li:last-child a {
  border: none
}

.topbar ul li .btn {
  position: relative;
  border: none;
  background: transparent;
  width: 65px;
  height: 50px;
  line-height: 50px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  float: left;
}

.topbar ul li .btn:hover {
  background: transparent;
  color: #787878
}

.topbar ul li .btn i {
  font-size: 20px;
  position: relative;
}

@media screen and (min-width: 768px) {
  .topbar ul li .btn {
    padding: 0 5px
  }
}

@media screen and (max-width: 767px) {
  .topbar ul li .btn {
    height: 54px;
    line-height: 54px;
    padding: 0 5px;
    width: 100%
  }
}

.topbar ul li.notification {
  font-size: 15px
}

.topbar ul li.notification .btn .notification-count {
  color: #ffffff !important;
  background-color: #E91E63 !important;
  font-weight: 400;
  border: 0;
  font-size: 9px;
  height: 21px !important;
  width: 21px;
  line-height: 22px !important;
  border-radius: 50% !important;
  position: absolute;
  font-style: normal;
  top: -8px;
  left: 13px;
  transition: .4s;
  z-index: 999;
}

.topbar ul li.notification .dropdown-menu {
  max-height: 500px;
  width: 400px;
  overflow: auto;
  left: auto !important
}

.topbar ul li.notification .dropdown-menu a {
  display: block;
  position: relative;
  padding: 15px 15px 15px 84px;
  line-height: 1.4
}

.topbar ul li.notification .dropdown-menu a .avatar {
  position: absolute;
  left: 15px;
  top: 15px;
  width: 54px;
  height: 54px;
  overflow: hidden;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%
}

.topbar ul li.notification .dropdown-menu a .avatar img {
  width: 100%
}

.topbar ul li.notification .dropdown-menu a .name,
.topbar ul li.notification .dropdown-menu a .message,
.topbar ul li.notification .dropdown-menu a .time {
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden
}

.topbar ul li.notification .dropdown-menu a .message {
  color: #76838f;
  font-weight: normal
}

.topbar ul li.notification .dropdown-menu a .time {
  position: absolute;
  right: 15px;
  top: 15px;
  color: #76838f;
  font-size: 13px
}

.topbar ul li.notification .dropdown-menu a.all-notifications {
  display: block;
  border: none;
  text-align: center;
  font-weight: bold;
  padding: 15px
}

.topbar ul li.notification .dropdown-menu a.all-notifications i {
  display: inline-block;
  margin-left: 5px
}

.topbar ul li.notification.show .dropdown-toggle {
  /* background: #5c87ff; */
  /* color: white */
}

.topbar ul li.user-account {
  float: right;
  font-size: 15px;
  line-height: 1.4em;
  position: relative;
}

.topbar ul li.user-account .dropdown-toggle {
  border: none;
  background: transparent;
  font-size: 15px;
  height: 50px;
  line-height: 1.4em;
  position: relative;
  padding: 0;
  padding-left: 15px;
  padding-right: 10px;
  text-align: right;
  display: table;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

.topbar ul li.user-account .dropdown-toggle .avatar {
  height: 33px;
  width: 33px;
  overflow: hidden;
  display: block;
  vertical-align: middle;
  position: absolute;
  right: 15px;
  top: 8px;
  border-radius: 50%;
}

.topbar ul li.user-account .dropdown-toggle .avatar img {
  max-width: 100%
}

.topbar ul li.user-account .dropdown-toggle .user-content {
  display: table-cell;
  vertical-align: middle;
  line-height: 1.2
}

.topbar ul li.user-account .dropdown-toggle .user-content .user-name {
  display: block;
  font-size: 15px
}

.topbar ul li.user-account .dropdown-toggle .user-content .user-plan {
  display: block;
  font-size: 13px
}


/* .topbar ul li.user-account .dropdown-toggle:hover {
    background: #5c87ff
} */

.topbar ul li.user-account .dropdown-menu {
  right: 0
}

.topbar ul li.user-account .dropdown-menu:before {
  top: -14px;
  position: absolute;
  right: 20px;
  left: auto;
}

.topbar ul li a {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0
}

.topbar ul li a:hover {
  color: #777
}

.topbar ul li a.active {
  background: #5c87ff
}

.topbar .text-right > ul > li {
  float: right
}

.navbar-toggler {
  padding: 5px;
  font-size: 13px;
  line-height: 1;
  background-color: #d03570;
  border-radius: .25rem;
}

@media screen and (max-width: 767px) {
  .topbar {
    height: 54px;
    line-height: 54px;
    bottom: 0;
    top: auto;
    left: 0;
    width: 100%;
    padding: 0 !important;
  }

  .topbar ul {
    height: 54px;
    line-height: 54px;
    padding: 0;
    width: 140px;
  }

  .topbar ul .dropdown-toggle {
    height: 54px !important;
    line-height: 54px !important
  }

  .topbar ul li {
    width: 40px
  }

  .topbar ul li.prdp {
    width: 60px
  }

  .topbar ul li a {
    width: 100%;
    padding: 0
  }


  .topbar ul li.mobile-menu-toggle {
    display: block
  }

  .topbar ul li.mobile-menu-toggle .menu-toggle {
    width: 100%;
    height: 54px;
    line-height: 54px;
    padding: 0;
    display: block
  }

  .topbar ul li.user-account .dropdown-toggle {
    padding-left: 0;
    padding-right: 0;
    display: block;
    text-align: center;
  }

  .topbar ul li.user-account .dropdown-toggle .avatar {
    position: relative;
    width: 40px;
    height: 40px;
    overflow: hidden;
    right: unset;
    display: inline-block;
    vertical-align: top;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    border-radius: 20px
  }

  .topbar ul li.user-account .dropdown-toggle .avatar img {
    display: block
  }

  .topbar ul li.user-account .dropdown-toggle .user-content {
    display: none
  }

  .topbar ul li.user-account .dropdown-toggle .user-content .user-name {
    display: none
  }

  .topbar ul li.user-account .dropdown-toggle .user-content .user-plan {
    display: none
  }

  .topbar ul li.notification ul.dropdown-menu {
    position: fixed;
    left: 0;
    width: 95vmin;
    top: 55px
  }
}

.sidebar {
  display: block;
  width: 100%;
  position: fixed;
  left: 0;
  top: 0px;
  /*bottom: 0;*/
  overflow-y: auto;
  background: white;
  z-index: 10;
  font-size: 14px;
  box-shadow: 1px 0 20px rgba(0, 0, 0, 0.08);
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease
}

.sidebar span,
.sidebar div,
.sidebar ul,
.sidebar li,
.sidebar a,
.sidebar i {
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.sidebar .logo {
  display: block;
  width: 100%;
  height: 55px;
  overflow: hidden;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 15px;
  letter-spacing: 0.05em;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1)
}

.sidebar .logo a {
  display: block
}

.sidebar .logo .logo-emblem {
  display: block;
  width: 50px;
  height: 55px;
  line-height: 55px;
  color: #2962FF;
  text-align: center;
  float: left
}

.sidebar .logo .logo-emblem img {
  max-width: 36px;
  max-height: 36px
}

.sidebar .logo .logo-full {
  display: block;
  height: 55px;
  line-height: 55px;
  float: left;
  width: 170px
}

.sidebar .logo .logo-full span {
  font-weight: 500;
  font-size: 12px;
}

.sidebar > ul {
  margin: 0;
  padding: 0;
  margin: 0;
  padding: 0;
  /*height: calc(100vh - 65px);*/
  overflow-y: auto;
  overflow-x: hidden;
}

.sidebar > ul > li {
  white-space: nowrap;
  position: relative;
  float: left;
}

.sidebar > ul > li.spacer {
  display: block;
  height: 14px
}

.sidebar > ul > li.profile {
  display: block;
  padding: 10px 15px;
  position: relative;
  padding-left: 65px;
  height: 65px
}

.sidebar > ul > li.profile span {
  display: block;
  margin: 0;
  padding: 0;
  line-height: 1.3
}

.sidebar > ul > li.profile span.profile-image {
  position: absolute;
  width: 65px;
  height: 65px;
  left: 0;
  top: 0;
  padding: 15px
}

.sidebar > ul > li.profile span.profile-image img {
  display: block;
  width: 35px;
  height: 35px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden
}

.sidebar > ul > li.profile span.profile-name {
  font-weight: 500;
  padding-top: 3px
}

.sidebar > ul > li.profile span.profile-info {
  font-weight: normal;
  color: #76838f
}

.sidebar > ul > li.button-container {
  padding: 0 15px
}

.sidebar > ul > li.title {
  padding: 0;
  text-transform: uppercase;
  font-size: 12px;
  color: #76838f;
  position: relative;
  width: auto;
  height: 44px;
  line-height: 44px;
  padding-left: 20px;
  border-top: 1px solid #f7f7f7;
}

.sidebar > ul > li.title i {
  display: inline-block;
  width: 65px;
  height: 50px;
  line-height: 50px;
  z-index: 3px;
  position: relative;
  font-size: 10px;
  text-align: center;
  color: #76838f
}

.sidebar > ul > li.nav-item > a {
  display: block;
  padding: 0;
  position: relative;
  line-height: 42px;
  color: #37474f;
  overflow: hidden;
  font-size: 13.5px;
}

.sidebar > ul > li.nav-item > a i {
  display: inline-block;
  width: 50px;
  height: 38px;
  line-height: 38px;
  z-index: 3;
  position: relative;
  text-align: center;
  font-size: 16px
}

.sidebar > ul > li.nav-item > a i.mdi-chevron-down {
  color: #76838f;
  position: absolute;
  right: -13px;
  top: 4px;
  font-size: 15px;
  width: 50px;
  height: 38px;
  -moz-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg)
}

.sidebar > ul > li.nav-item > a .menu-title {
  position: relative;
  top: 0px
}

.sidebar > ul > li.nav-item > a.active, .sidebar > ul > li.nav-item > a.active:hover {
  background: #00bcd3;
  color: #ffffff;
}

.sidebar > ul > li.nav-item > a:not(.collapsed):not(.nav-single) i.mdi-chevron-down {
  -moz-transform: rotate(0);
  -o-transform: rotate(0);
  -ms-transform: rotate(0);
  -webkit-transform: rotate(0);
  transform: rotate(0)
}

.sidebar > ul > li.nav-item > a:hover {
  background: #f7f7f7;
  color: #000;
}

.sidebar > ul > li.nav-item ul.sub-menu {
  display: block;
  position: relative;
  padding-left: 0
}

.sidebar > ul > li.nav-item ul.sub-menu li {
  list-style-type: square;
  color: #76838f;
  list-style-type: none;
}

.sidebar > ul > li.nav-item ul.sub-menu li a {
  padding: 0;
  position: relative;
  line-height: 15px;
  color: #5a6991;
  padding-left: 10px;
  height: 36px;
  line-height: 36px;
  font-size: 13px;
}

.sidebar > ul > li.nav-item ul.sub-menu li a.active {
  background-color: #f1f1f1 !important;
}

.sidebar > ul > li.nav-item ul.sub-menu li a i {
  display: inline-block;
  width: 50px;
  height: 36px;
  line-height: 36px;
  z-index: 3;
  position: relative;
  text-align: center;
  font-size: 13px
}

.sidebar > ul > li.nav-item ul.sub-menu li a:hover {
  color: #4d4d4d !important;
  background: #f7f7f7
}

.sidebar.sidebar-dark {
  background: #1C2A36;
  color: #76838f
}

.sidebar.sidebar-dark .logo {
  border-color: #37474f
}

.sidebar.sidebar-dark .logo .logo-full {
  color: #76838f
}

.sidebar.sidebar-dark ul li.nav-item a {
  color: #76838f
}

.sidebar.sidebar-dark ul li.nav-item a:hover,
.sidebar.sidebar-dark ul li.nav-item a:not(.collapsed):not(.nav-single) {
  background: #131e26;
  color: #76838f
}

.sidebar.sidebar-dark ul li.nav-item .collapse {
  background: #131e26;
  color: #76838f
}

.sidebar.sidebar-dark ul li.nav-item .collapse a:hover {
  color: white
}

.sidebar-open .topbar {
  padding-left: 0px
}

.sidebar-open .sidebar {
  width: 100%;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease
}

.sidebar-open .sidebar::-webkit-scrollbar-thumb {
  background: #ccc;
}

.sidebar-open main {
  padding-left: 240px;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease
}

@media screen and (max-width: 767px) {
  .sidebar-open .topbar {
    padding-left: 0
  }

  .topbar ul li.user-account {
    background: rgba(5255, 255, 255, .2);
  }
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) {
  width: 100%
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) .down-arrow {
  height: 0;
  width: 0;
  overflow: hidden;
  padding: 0;
  margin: 0
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul {
  padding: 0;
  margin: 0
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li {
  position: relative
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.profile {
  height: 65px
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.profile .profile-name,
.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.profile .profile-info {
  overflow: hidden;
  display: none
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.title i {
  margin: 0;
  display: block
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.title .menu-title {
  opacity: 0;
  filter: alpha(opacity=0);
  width: 0;
  display: none;
  overflow: hidden;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.nav-item a {
  padding: 0;
  line-height: 50px;
  line-height: 42px;
  height: 42px;
  text-align: center;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.nav-item a i {
  margin: 0;
  display: block
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.nav-item a i.mdi-chevron-down {
  /*right: -100px;*/
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  transition: all 0.5s linear
}

.sidebar-closed:not(.horizontal) .sidebar:not(:hover) > ul > li.nav-item a .menu-title {
  opacity: 0;
  filter: alpha(opacity=0);
  width: 0;
  display: none;
  overflow: hidden;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -ms-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear;
  -webkit-transition: all .2s linear;
  -moz-transition: all .2s linear;
  -ms-transition: all .2s linear;
  -o-transition: all .2s linear;
  transition: all .2s linear
}

.offcanvas-toggle.active {
  background: #DD6777 !important;
  color: white !important
}

.offcanvas-menu {
  display: block;
  width: 240px;
  height: calc(100vh - $navSize);
  position: fixed;
  right: -100%;
  top: 0;
  bottom: 0;
  overflow-y: auto;
  background: white;
  z-index: 20;
  font-size: 14px;
  box-shadow: -1px 0 20px rgba(0, 0, 0, 0.08);
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease
}

.offcanvas-menu.open {
  right: 0
}

.offcanvas-menu .offcanvas-button a.btn {
  border: 1px solid rgba(0, 0, 0, 0.1);
  height: 50px;
  line-height: 50px;
  padding: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0
}

.offcanvas-menu .offcanvas-button a.btn:hover {
  background: #DD6777;
  color: white
}

.offcanvas-menu .offcanvas-title {
  font-size: 18px;
  padding: 21px 15px;
  font-weight: 500;
  margin: 0;
  height: 65px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  color: #000000;
}

@media screen and (max-width: 767px) {
  .offcanvas-menu {
    top: 0;
    bottom: 54px
  }
}

.breadcrumb {
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  list-style: none;
  background-color: #e9ecef;
  border-radius: 0.35rem
}

.breadcrumb::after {
  display: block;
  clear: both;
  content: ""
}

.breadcrumb-item {
  float: left
}

.breadcrumb-item + .breadcrumb-item::before {
  display: inline-block;
  padding-right: 3px;
  padding-left: 3px;
  color: #868e96;
  content: "/"
}

.breadcrumb-item + .breadcrumb-item:hover::before {
  text-decoration: underline;
  text-decoration: none
}

.breadcrumb-item.active {
  color: #868e96
}

@media (max-width: 767px) {
  #loginPage {
    padding: 0;
    height: 100vh
  }

  #loginPage:before {
    left: 0;
    width: 100%;
    background-position: center center
  }

  #loginPage .page-container {
    height: 100vh
  }

  #loginPage .login {
    background: rgba(255, 255, 255, 0.99);
    width: 100%;
    height: auto;
    padding: 15px;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1);
    -moz-box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1);
    box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1)
  }

  #loginPage .login .login-container {
    height: auto
  }

  #loginPage .login .login-container .login-form {
    top: 0;
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
}

#error {
  min-height: calc(100vh - 180px);
  height: 80vh
}

#error .error-box {
  max-width: 800px;
  text-align: center;
  padding: 30px 30px 60px;
  margin: 0 auto;
  background: white;
  -webkit-box-shadow: 0 10px 45px 0 rgba(7, 61, 125, 0.1);
  -moz-box-shadow: 0 10px 45px 0 rgba(7, 61, 125, 0.1);
  box-shadow: 0 10px 45px 0 rgba(7, 61, 125, 0.1);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%)
}

#error .error-box .error-image {
  display: block;
  text-align: center;
  margin-bottom: 2rem
}

#error .error-box .error-image img {
  max-width: 100%
}

#error .error-box h1 {
  font-size: 2rem
}

main {
  /*padding-top: 55px;*/
  /*padding-left: 50px;*/
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease
}

.storepage_HigthScroll {
  max-height: calc(100vh - 127px);
  overflow-y: auto;
  padding: 0px 10px 10px;
}

.page-breadcrumb {
  padding: 15px 0px 5px;
  background-color: #fff;
  border-bottom: 1px solid #e8ebf1;
  border-radius: 4px 4px 0 0;
}

.page-breadcrumb h1,
.page-breadcrumb h2,
.page-breadcrumb h3,
.page-breadcrumb h4,
.page-breadcrumb h5 {
  margin: 0 0 5px
}

.page-breadcrumb .page-title {
  font-size: 16px;
  margin: 0 0 2px
}

.page-breadcrumb .breadcrumb {
  background: transparent;
  padding: 0;
  margin: 0;
  font-size: 13px
}

.modal-content {
  border: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1);
  -moz-box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1);
  box-shadow: 0 14px 24px rgba(62, 57, 107, 0.1)
}

.grid-demo {
  padding-top: 1rem;
  padding-bottom: 1rem;
  background-color: rgba(86, 61, 124, 0.15);
  border: 1px solid rgba(86, 61, 124, 0.2)
}

@media (max-width: 767px) {
  main {
    padding: 0 0 54px !important;
    height: calc(100vh - 10px);
  }

  .sidebar-open .sidebar {
    position: fixed;
    width: calc(100% - 30px);
    height: calc(100vh - 140px);
    bottom: 50px;
    top: auto;
    left: 10px;
    overflow-y: auto;
    -webkit-transition: 0.2s all ease;
    -moz-transition: 0.2s all ease;
    -ms-transition: 0.2s all ease;
    -o-transition: 0.2s all ease;
    transition: 0.2s all ease
  }

  .sidebar-closed .sidebar:not(:hover),
  .sidebar-closed .sidebar {
    height: 0;
    width: calc(100% - 30px);
    bottom: 0;
    top: auto;
    left: 15px;
    -webkit-transition: 0.2s all ease;
    -moz-transition: 0.2s all ease;
    -ms-transition: 0.2s all ease;
    -o-transition: 0.2s all ease;
    transition: 0.2s all ease
  }

  .hidden-xs {
    display: none !important
  }
}