@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");

:root {
   --primary: #393185;
   --second: #6777ef;
   --popp: "Poppins", sans-serif;
}

body {
   background-color: #fafafa;
   font-size: 15px;
   font-weight: 400;
   font-family: "Poppins", sans-serif;
   color: #666;
}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-weight: 700;
   font-family: "Nunito", "Segoe UI", arial;
}
p,
ul:not(.list-unstyled),
ol {
   line-height: 28px;
}

.btn {
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   padding: 0.3rem 0.8rem;
   letter-spacing: 0.5px;
   transition: 0.2s;
   -webkit-transition: 0.2s;
   -moz-transition: 0.2s;
   -ms-transition: 0.2s;
   -o-transition: 0.2s;
}

.btn2 {
   font-weight: 400;
   font-size: 14px;
   line-height: 24px;
   padding: 0.3rem 0.8rem;
   letter-spacing: 0.7px;
   border-radius: 4px;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   -ms-border-radius: 4px;
   -o-border-radius: 4px;
}

.btn_custom:hover {
   border: 1px solid #000;
   transform: translateY(3px) scaleX(1.02);
   -webkit-transform: translateY(3px) scaleX(1.02);
   -moz-transform: translateY(3px) scaleX(1.02);
   -ms-transform: translateY(3px) scaleX(1.02);
   -o-transform: translateY(3px) scaleX(1.02);
}

.align-left {
   text-align: left;
}
.align-center {
   text-align: center;
}
.align-right {
   text-align: right;
}
.align-justify {
   text-align: justify;
}
.no-resize {
   resize: none;
}

.col-red {
   color: #f44336 !important;
}
.col-pink {
   color: #e91e63 !important;
}
.col-purple {
   color: #9c27b0 !important;
}
.col-deep-purple {
   color: #673ab7 !important;
}
.col-indigo {
   color: #6777ef !important;
}
.col-blue {
   color: #2196f3 !important;
}
.col-light-blue {
   color: #03a9f4 !important;
}
.col-cyan {
   color: #29c0b1 !important;
}
.col-teal {
   color: #009688 !important;
}
.col-green {
   color: #4caf50 !important;
}
.col-light-green {
   color: #8bc34a !important;
}
.col-lime {
   color: #cddc39 !important;
}
.col-yellow {
   color: #ffe821 !important;
}
.col-amber {
   color: #ffc107 !important;
}
.col-orange {
   color: #ff9800 !important;
}
.col-deep-orange {
   color: #ff5722 !important;
}
.col-brown {
   color: #795548 !important;
}
.col-grey {
   color: #9e9e9e !important;
}
.col-blue-grey {
   color: #607d8b !important;
}
.col-black {
   color: #000 !important;
}
.col-white {
   color: #fff !important;
}
.col-dark-gray {
   color: #888 !important;
}

.btn:focus,
.btn:active,
.btn:active:focus,
.custom-select:focus {
   box-shadow: none !important;
   outline: none;
}
a {
   color: #6777ef;
   font-weight: 500;
   transition: all 0.5s;
   -webkit-transition: all 0.5s;
   -o-transition: all 0.5s;
}
a:not(.btn-social-icon):not(.btn-social):not(.page-link) .ion,
a:not(.btn-social-icon):not(.btn-social):not(.page-link) .fas,
a:not(.btn-social-icon):not(.btn-social):not(.page-link) .far,
a:not(.btn-social-icon):not(.btn-social):not(.page-link) .fal,
a:not(.btn-social-icon):not(.btn-social):not(.page-link) .fab {
   margin-left: 4px;
}
.bg-primary {
   background-color: #6777ef !important;
}
.bg-secondary {
   background-color: #cdd3d8 !important;
}
.bg-success {
   background-color: #54ca68 !important;
}
.bg-info {
   background-color: #3abaf4 !important;
}
.bg-warning {
   background-color: #ffa426 !important;
}
.bg-danger {
   background-color: #fc544b !important;
}
.bg-light {
   background-color: #e3eaef !important;
}
.bg-dark {
   background-color: #191d21 !important;
}
.text-primary,
.text-primary-all *,
.text-primary-all *:before,
.text-primary-all *:after {
   color: #6777ef !important;
}

.text-danger,
.text-danger-all *,
.text-danger-all *:before,
.text-danger-all *:after {
   color: #fc544b !important;
}
.text-light,
.text-light-all *,
.text-light-all *:before,
.text-light-all *:after {
   color: #e3eaef !important;
}
.text-white,
.text-white-all *,
.text-white-all *:before,
.text-white-all *:after {
   color: #fff !important;
}
.text-dark,
.text-dark-all *,
.text-dark-all *:before,
.text-dark-all *:after {
   color: #191d21 !important;
}

.lead {
   line-height: 34px;
}
@media (max-width: 575.98px) {
   .lead {
      font-size: 17px;
      line-height: 30px;
   }
}

.shadow {
   box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.1);
}
.text-muted {
   color: #98a6ad !important;
}
.form-control,
.input-group-text,
.custom-select,
.custom-file-label {
   background-color: #fdfdff;
   border-color: #e4e6fc;
}
.form-control:focus,
.input-group-text:focus,
.custom-select:focus,
.custom-file-label:focus {
   background-color: #fefeff;
   border-color: #95a0f4;
}
.input-group-text,
select.form-control:not([size]):not([multiple]),
.form-control:not(.form-control-sm):not(.form-control-lg) {
   font-size: 14px;
   padding: 10px 15px;
   height: 38px;
}
textarea.form-control {
   height: 64px !important;
}
.custom-control {
   line-height: 1.6rem;
}
.custom-file,
.custom-file-label,
.custom-select,
.custom-file-label:after,
.form-control[type="color"],
select.form-control:not([size]):not([multiple]) {
   height: calc(2.25rem + 6px);
}
.form-control.creditcard {
   background-position: 98%;
   background-repeat: no-repeat;
   background-size: 40px;
   padding-right: 60px;
}
.form-control.creditcard.visa {
   background-image: url("../img/cards/visa.png");
}
.form-control.creditcard.americanexpress {
   background-image: url("../img/cards/americanexpress.png");
}
.form-control.creditcard.dinersclub {
   background-image: url("../img/cards/dinersclub.png");
}
.form-control.creditcard.discover {
   background-image: url("../img/cards/discover.png");
}
.form-control.creditcard.jcb {
   background-image: url("../img/cards/jcb.png");
}
.form-control.creditcard.mastercard {
   background-image: url("../img/cards/mastercard.png");
}
.form-control.creditcard.visa {
   background-image: url("../img/cards/visa.png");
}

.form-group {
   margin-bottom: 25px;
}

.form-group .control-label,
.form-group > label {
   font-weight: 500;
   color: #34395e;
   font-size: 15px;
   letter-spacing: 0.5px;
   font-family: var(--popp);
}
.form-group.floating-addon {
   position: relative;
}
.form-group.floating-addon .input-group-prepend {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   z-index: 5;
}
.form-group.floating-addon:not(.floating-addon-not-append) .input-group-append {
   position: absolute;
   top: 0;
   left: 0;
   z-index: 5;
   left: initial;
   right: 0;
}
.form-group.floating-addon .input-group-prepend .input-group-text,
.form-group.floating-addon .input-group-append .input-group-text {
   border-color: transparent;
   background-color: transparent;
   font-size: 20px;
}
.form-group.floating-addon .form-control {
   border-radius: 3px;
   padding-left: 40px;
}
.form-group.floating-addon .form-control + .form-control {
   border-radius: 0 3px 3px 0;
   padding-left: 15px;
}
.input-group-append [class*="btn-outline-"] {
   background-color: #fdfdff;
}
.form-text {
   font-size: 12px;
   line-height: 22px;
}
.custom-radio .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-input:checked ~ .custom-control-label::before {
   background-color: #6777ef !important;
}

.list-unstyled-border li {
   border-bottom: 1px solid #f9f9f9;
   padding-bottom: 15px;
   margin-bottom: 10px;
}
.list-unstyled-border li .custom-checkbox {
   margin-right: 15px;
}
.list-unstyled-border li:last-child {
   margin-bottom: 0;
   padding-bottom: 0;
   border-bottom: none;
}
.list-unstyled-noborder li:last-child {
   border-bottom: none;
}
.list-group-item.active {
   background-color: #6777ef;
}
.list-group-item.disabled {
   color: #c9d7e0;
}
.list-group-item-primary {
   background-color: #6777ef;
   color: #fff;
}
.list-group-item-secondary {
   background-color: #cdd3d8;
   color: #fff;
}
.list-group-item-success {
   background-color: #54ca68;
   color: #fff;
}
.list-group-item-danger {
   background-color: #fc544b;
   color: #fff;
}
.list-group-item-warning {
   background-color: #ffa426;
   color: #fff;
}
.list-group-item-info {
   background-color: #3abaf4;
   color: #fff;
}
.list-group-item-light {
   background-color: #e3eaef;
   color: #191d21;
}
.list-group-item-dark {
   background-color: #191d21;
   color: #fff;
}

.width-per-0 {
   width: 0%;
}

.width-per-14 {
   width: 15%;
}
.width-per-28 {
   width: 28%;
}

.width-per-42 {
   width: 42%;
}

.width-per-57 {
   width: 57%;
}

.width-per-71 {
   width: 71%;
}

.width-per-85 {
   width: 85%;
}


.width-per-100 {
   width: 100%;
}

.progress.progress-xs {
   height: 5px;
}

.alert {
   color: #fff;
   border: none;
   padding: 15px 20px;
}
.alert .alert-title {
   font-size: 18px;
   font-weight: 700;
   margin-bottom: 5px;
}
.alert code {
   background-color: #fff;
   border-radius: 3px;
   padding: 1px 4px;
}
.alert p {
   margin-bottom: 0;
}
.alert.alert-has-icon {
   display: flex;
}
.alert.alert-has-icon .alert-icon {
   margin-top: 4px;
   width: 30px;
}
.alert.alert-has-icon .alert-icon .ion,
.alert.alert-has-icon .alert-icon .fas,
.alert.alert-has-icon .alert-icon .far,
.alert.alert-has-icon .alert-icon .fab,
.alert.alert-has-icon .alert-icon .fal {
   font-size: 20px;
}
.alert.alert-has-icon .alert-body {
   flex: 1;
}
.alert:not(.alert-light) a {
   color: #fff;
}
.alert.alert-primary {
   background-color: #6777ef;
}
.alert.alert-secondary {
   background-color: #cdd3d8;
}
.alert.alert-success {
   background-color: #54ca68;
}
.alert.alert-info {
   background-color: #3abaf4;
}
.alert.alert-warning {
   background-color: #ffa426;
}
.alert.alert-danger {
   background-color: #fc544b;
}
.alert.alert-light {
   background-color: #e3eaef;
   color: #191d21;
}
.alert.alert-dark {
   background-color: #191d21;
}
.card {
   background-color: #fff;
   border-radius: 10px;
   border: none;
   position: relative;
   margin-bottom: 30px;
   box-shadow: 0 0.3rem 2rem rgba(90, 97, 105, 0.08), 0 0.9rem 1.4rem rgba(90, 97, 105, 0.1),
      0 0.2rem 0.5rem rgba(90, 97, 105, 0.08), 0 0.1rem 0.18rem rgba(90, 97, 105, 0.1);
}
.card .card-header,
.card .card-body,
.card .card-footer {
   background-color: transparent;
   padding: 20px 25px;
}
.card .navbar {
   position: static;
}

.card .card-body .section-title {
   margin: 30px 0 10px 0;
   font-size: 16px;
}
.card .card-body .section-title:before {
   margin-top: 8px;
}
.card .card-body .section-title + .section-lead {
   margin-top: -5px;
}
.card .card-body p {
   font-weight: 500;
   color: #212529;
}
.card .card-header {
   border-bottom-color: #f9f9f9;
   line-height: 30px;
   -ms-grid-row-align: center;
   align-self: center;
   width: 100%;
   padding: 10px 25px;
   display: flex;
   align-items: center;
}
.card .card-header .btn {
   margin-top: 1px;
   padding: 2px 15px;
}
.card .card-header .btn:not(.note-btn) {
   border-radius: 30px;
}
.card .card-header .btn:hover {
   box-shadow: none;
}
.card .card-header .form-control {
   height: 31px;
   font-size: 13px;
   border-radius: 30px;
}
.card .card-header .form-control + .input-group-btn .btn {
   margin-top: -1px;
}
.card .card-header h4 {
   font-size: 17px;
   line-height: 28px;
   padding-right: 10px;
   margin-bottom: 0;
   color: #212529;
}
.card .card-header h4 + .card-header-action,
.card .card-header h4 + .card-header-form {
   margin-left: auto;
}
.card .card-header h4 + .card-header-action .btn,
.card .card-header h4 + .card-header-form .btn {
   font-size: 12px;
   border-radius: 30px !important;
   padding-left: 13px !important;
   padding-right: 13px !important;
}
.card .card-header h4 + .card-header-action .btn.active,
.card .card-header h4 + .card-header-form .btn.active {
   box-shadow: 0 2px 6px #acb5f6;
   background-color: #6777ef;
   color: #fff;
}
.card .card-header h4 + .card-header-action .dropdown,
.card .card-header h4 + .card-header-form .dropdown {
   display: inline;
}
.card .card-header h4 + .card-header-action .btn-group .btn,
.card .card-header h4 + .card-header-form .btn-group .btn {
   border-radius: 0 !important;
}
.card .card-header h4 + .card-header-action .btn-group .btn:first-child,
.card .card-header h4 + .card-header-form .btn-group .btn:first-child {
   border-radius: 30px 0 0 30px !important;
}
.card .card-header h4 + .card-header-action .btn-group .btn:last-child,
.card .card-header h4 + .card-header-form .btn-group .btn:last-child {
   border-radius: 0 30px 30px 0 !important;
}
.card .card-header h4 + .card-header-action .input-group .form-control,
.card .card-header h4 + .card-header-form .input-group .form-control {
   border-radius: 30px 0 0 30px !important;
}
.card .card-header h4 + .card-header-action .input-group .form-control + .input-group-btn .btn,
.card .card-header h4 + .card-header-form .input-group .form-control + .input-group-btn .btn {
   border-radius: 0 30px 30px 0 !important;
}
.card .card-header h4 + .card-header-action .input-group .input-group-btn + .form-control,
.card .card-header h4 + .card-header-form .input-group .input-group-btn + .form-control {
   border-radius: 0 30px 30px 0 !important;
}
.card .card-header h4 + .card-header-action .input-group .input-group-btn .btn,
.card .card-header h4 + .card-header-form .input-group .input-group-btn .btn {
   margin-top: -1px;
   border-radius: 30px 0 0 30px !important;
}
.card .card-footer {
   background-color: transparent;
   border: none;
}
.card.card-mt {
   margin-top: 30px;
}

.card.card-primary {
   border-top: 2px solid #6777ef;
}
.card.card-secondary {
   border-top: 2px solid #34395e;
}
.card.card-success {
   border-top: 2px solid #54ca68;
}
.card.card-danger {
   border-top: 2px solid #fc544b;
}
.card.card-warning {
   border-top: 2px solid #ffa426;
}
.card.card-info {
   border-top: 2px solid #3abaf4;
}
.card.card-dark {
   border-top: 2px solid #191d21;
}
.card.bg-primary,
.card.bg-danger,
.card.bg-success,
.card.bg-info,
.card.bg-dark,
.card.bg-warning {
   color: #fff;
}
.card.bg-primary .card-header,
.card.bg-danger .card-header,
.card.bg-success .card-header,
.card.bg-info .card-header,
.card.bg-dark .card-header,
.card.bg-warning .card-header {
   color: #fff;
   opacity: 0.9;
}
.card .card-type-3 .card-circle {
   display: inline-flex;
   text-align: center;
   border-radius: 50%;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   height: 45px;
   width: 45px;
   box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(76, 175, 80, 0.4);
}
.card .card-type-3 .card-circle i {
   font-size: 15px;
}
.card .card-statistic-4 {
   position: relative;
   color: #000000;
   padding: 15px 10px;
   border-radius: 3px;
   overflow: hidden;
}

.card .card-statistic-4 .card-icon {
   text-align: center;
   line-height: 50px;
   margin-left: 15px;
   color: #000;
   position: absolute;
   right: -5px;
   top: 20px;
   opacity: 0.1;
}
.card .card-statistic-4 .banner-img img {
   max-width: 100%;
   float: right;
}
@media (max-width: 575.98px) {
   .card.card-large-icons {
      display: inline-block;
   }
   .card.card-large-icons .card-icon {
      width: 100%;
      height: 200px;
   }
   .col-xs-6 {
      -ms-flex: 0 0 50%;
      -webkit-box-flex: 0;
      flex: 0 0 50%;
      max-width: 50%;
   }
}
@media (max-width: 767.98px) {
   .card .card-header {
      height: auto;
      flex-wrap: wrap;
   }
   .card .card-header h4 + .card-header-action,
   .card .card-header h4 + .card-header-form {
      flex-grow: 0;
      width: 100%;
      margin-top: 10px;
   }
}
@media (min-width: 768px) and (max-width: 991.98px) {
   .card.card-sm-6 .card-chart canvas {
      height: 85px !important;
   }
   .card.card-hero .card-header {
      padding: 25px;
   }
}
.table td,
.table:not(.table-bordered) th {
   border-top: none;
}
.table:not(.table-sm):not(.table-md):not(.dataTable) td,
.table:not(.table-sm):not(.table-md):not(.dataTable) th {
   padding: 0 10px;
   height: 60px;
   vertical-align: middle;
}
.table:not(.table-sm) thead th {
   border-bottom: none;
   background-color: rgba(0, 0, 0, 0.04);
   color: #666;
   padding-top: 15px;
   padding-bottom: 15px;
}
.table.table-md th,
.table.table-md td {
   padding: 10px 15px;
}
.table.table-bordered td,
.table.table-bordered th {
   border-color: #f6f6f6;
}
.table .team-member {
   position: relative;
   width: 30px;
   white-space: nowrap;
   border-radius: 1000px;
   vertical-align: bottom;
   display: inline-block;
}
.table .team-member img {
   width: 100%;
   max-width: 100%;
   height: auto;
   border: 0;
   border-radius: 1000px;
}
.table .team-member-sm {
   width: 32px;
   -webkit-transition: all 0.25s ease;
   -o-transition: all 0.25s ease;
   -moz-transition: all 0.25s ease;
   transition: all 0.25s ease;
}
.table .team-member-sm:hover {
   webkit-transform: translateY(-4px) scale(1.02);
   -moz-transform: translateY(-4px) scale(1.02);
   -ms-transform: translateY(-4px) scale(1.02);
   -o-transform: translateY(-4px) scale(1.02);
   transform: translateY(-4px) scale(1.02);
   -webkit-box-shadow: 0 14px 24px rgba(75, 70, 124, 0.2);
   box-shadow: 0 14px 24px rgba(75, 70, 124, 0.2);
   z-index: 999;
}
.table .order-list li img {
   border: 2px solid #ffffff;
   box-shadow: 4px 3px 6px 0 rgba(0, 0, 0, 0.2);
}
.table .order-list li + li {
   margin-left: -14px;
   background: transparent;
}
.table .order-list li .badge {
   background: rgba(228, 222, 222, 0.8);
   color: #6b6f82;
   margin-bottom: 6px;
}
.table-links {
   color: #34395e;
   font-size: 12px;
   margin-top: 5px;
   opacity: 0;
   transition: all 0.3s;
}
.table-links a {
   color: #666;
}
table tr:hover .table-links {
   opacity: 1;
}
.table-striped tbody tr:nth-of-type(odd) {
   background-color: rgba(0, 0, 0, 0.02);
}
@media (max-width: 575.98px) {
   .table-responsive table {
      min-width: 800px;
   }
}
.tooltip {
   font-size: 12px;
}
.tooltip-inner {
   padding: 7px 13px;
}
.nav-tabs .nav-item .nav-link {
   color: #6777ef;
}
.nav-tabs .nav-item .nav-link.active {
   color: #000;
}
.tab-content > .tab-pane {
   padding: 10px 0;
   line-height: 24px;
}
.tab-bordered .tab-pane {
   padding: 15px;
   border: 1px solid #ededed;
   margin-top: -1px;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
   color: #fff;
   background-color: #6777ef;
}
.nav-pills .nav-item .nav-link {
   color: #6777ef;
   padding-left: 15px !important;
   padding-right: 15px !important;
}
.nav-pills .nav-item .nav-link:hover {
   background-color: #f6f7fe;
}
.nav-pills .nav-item .nav-link.active {
   box-shadow: 0 2px 6px #acb5f6;
   color: #fff;
   background-color: #6777ef;
}
.nav-pills .nav-item .nav-link .badge {
   padding: 5px 8px;
   margin-left: 5px;
}
.nav .nav-item .nav-link .ion,
.nav .nav-item .nav-link .fas,
.nav .nav-item .nav-link .far,
.nav .nav-item .nav-link .fab,
.nav .nav-item .nav-link .fal {
   margin-right: 3px;
   font-size: 12px;
}
.sticky {
   position: fixed !important;
   top: 0;
}

.buttons .btn {
   margin: 0 8px 10px 0;
}
.btn:focus {
   box-shadow: none !important;
   outline: none;
}
.btn:active {
   box-shadow: none !important;
   outline: none;
}
.btn:active:focus {
   box-shadow: none !important;
   outline: none;
}

.btn.btn-icon-split i,
.dropdown-item.has-icon i {
   text-align: center;
   width: 15px;
   font-size: 15px;

   margin-right: 8px;
}

.btn:not(.btn-social):not(.btn-social-icon):active,
.btn:not(.btn-social):not(.btn-social-icon):focus,
.btn:not(.btn-social):not(.btn-social-icon):hover {
   border-color: transparent !important;
   background-color: #fff;
}
.btn > i {
   margin-left: 0 !important;
}
.btn.btn-lg {
   padding: 0.55rem 1.5rem;
   font-size: 12px;
}

.btn-action {
   color: #fff !important;
   line-height: 25px;
   font-size: 12px;
   min-width: 35px;
   min-height: 35px;
}
.btn-secondary,
.btn-secondary.disabled {
   box-shadow: 0 2px 6px #e1e5e8;
   background-color: #cdd3d8;
   border-color: #cdd3d8;
   color: #fff;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary.disabled:hover,
.btn-secondary.disabled:focus,
.btn-secondary.disabled:active {
   background-color: #bfc6cd !important;
   color: #fff !important;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active,
.btn-outline-secondary.disabled:hover,
.btn-outline-secondary.disabled:focus,
.btn-outline-secondary.disabled:active {
   background-color: #cdd3d8 !important;
   color: #fff !important;
}
.btn-success,
.btn-success.disabled {
   box-shadow: 0 2px 6px #8edc9c;
   background-color: #54ca68;
   border-color: #54ca68;
   color: #fff;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.disabled:hover,
.btn-success.disabled:focus,
.btn-success.disabled:active {
   background-color: #41c457 !important;
   color: #fff !important;
}
.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active,
.btn-outline-success.disabled:hover,
.btn-outline-success.disabled:focus,
.btn-outline-success.disabled:active {
   background-color: #54ca68 !important;
   color: #fff !important;
}
.btn-danger,
.btn-danger.disabled {
   box-shadow: 0 2px 6px #fd9b96;
   background-color: #fc544b;
   border-color: #fc544b;
   color: #fff;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.disabled:hover,
.btn-danger.disabled:focus,
.btn-danger.disabled:active {
   background-color: #fb160a !important;
}
.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger:active,
.btn-outline-danger.disabled:hover,
.btn-outline-danger.disabled:focus,
.btn-outline-danger.disabled:active {
   background-color: #fb160a !important;
   color: #fff !important;
}
.btn-dark,
.btn-dark.disabled {
   box-shadow: 0 2px 6px #728394;
   background-color: #191d21;
   border-color: #191d21;
   color: #fff;
}
.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active,
.btn-dark.disabled:hover,
.btn-dark.disabled:focus,
.btn-dark.disabled:active {
   background-color: #000 !important;
}
.btn-outline-dark:hover,
.btn-outline-dark:focus,
.btn-outline-dark:active,
.btn-outline-dark.disabled:hover,
.btn-outline-dark.disabled:focus,
.btn-outline-dark.disabled:active {
   background-color: #000 !important;
   color: #fff !important;
}
.btn-light,
.btn-light.disabled {
   box-shadow: 0 2px 6px #e6ecf1;
   background-color: #e3eaef;
   border-color: #e3eaef;
   color: #191d21;
}
.btn-light:hover,
.btn-light:focus,
.btn-light:active,
.btn-light.disabled:hover,
.btn-light.disabled:focus,
.btn-light.disabled:active {
   background-color: #c3d2dc !important;
}
.btn-info,
.btn-info.disabled {
   box-shadow: 0 2px 6px #82d3f8;
   background-color: #3abaf4;
   border-color: #3abaf4;
   color: #fff;
}
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.disabled:hover,
.btn-info.disabled:focus,
.btn-info.disabled:active {
   background-color: #0da8ee !important;
}

.btn-primary,
.btn-primary.disabled {
   box-shadow: 0 2px 6px #acb5f6;
   background-color: #6777ef;
   border-color: #6777ef;
}
.btn-primary:focus,
.btn-primary.disabled:focus {
   background-color: #394eea !important;
}
.btn-primary:focus:active,
.btn-primary.disabled:focus:active {
   background-color: #394eea !important;
}
.btn-primary:active,
.btn-primary:hover,
.btn-primary.disabled:active,
.btn-primary.disabled:hover {
   background-color: #394eea !important;
}
.btn-outline-primary,
.btn-outline-primary.disabled {
   border-color: #6777ef;
   color: #6777ef;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.disabled:hover,
.btn-outline-primary.disabled:focus,
.btn-outline-primary.disabled:active {
   background-color: #6777ef !important;
   color: #fff;
}
.btn-outline-white,
.btn-outline-white.disabled {
   border-color: #fff;
   color: #fff;
}
.btn-outline-white:hover,
.btn-outline-white:focus,
.btn-outline-white:active,
.btn-outline-white.disabled:hover,
.btn-outline-white.disabled:focus,
.btn-outline-white.disabled:active {
   background-color: #fff;
   color: #6777ef;
}
.btn-round {
   border-radius: 30px;
   padding-left: 34px;
   padding-right: 34px;
}
.btn-social-icon,
.btn-social {
   border: none;
   border-radius: 3px;
}
.btn-social-icon {
   color: #fff !important;
   padding-left: 18px;
   padding-right: 18px;
}
.btn-social-icon > :first-child {
   font-size: 16px;
}
.btn-social {
   padding: 12px 12px 12px 50px;
   color: #fff !important;
   font-weight: 500;
}
.btn-social > :first-child {
   width: 55px;
   line-height: 50px;
   border-right: none;
}
.btn-reddit {
   color: #000 !important;
}
.btn-group .btn.active {
   background-color: #6777ef;
   color: #fff;
}

.popover {
   box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.1);
   border-color: transparent;
}
.popover .manual-arrow {
   position: absolute;
   bottom: -15px;
   font-size: 26px;
   left: 50%;
   -webkit-transform: translateX(-50%);
   transform: translateX(-50%);
   color: #fff;
}
.bs-popover-auto[x-placement^="left"] .arrow::before,
.bs-popover-left .arrow::before {
   border-left-color: #f2f2f2;
}
.bs-popover-auto[x-placement^="bottom"] .arrow::before,
.bs-popover-bottom .arrow::before {
   border-bottom-color: #f2f2f2;
}
.bs-popover-auto[x-placement^="top"] .arrow::before,
.bs-popover-top .arrow::before {
   border-top-color: #f2f2f2;
}
.bs-popover-auto[x-placement^="right"] .arrow::before,
.bs-popover-right .arrow::before {
   border-right-color: #f2f2f2;
}
.popover .popover-header {
   background-color: transparent;
   border: none;
   padding-bottom: 0;
   padding-top: 10px;
}
.popover .popover-body {
   padding: 15px;
   line-height: 24px;
}
.sm-gutters {
   margin-left: -5px;
   margin-right: -5px;
}
.sm-gutters > .col,
.sm-gutters > [class*="col-"] {
   padding-left: 5px;
   padding-right: 5px;
}
.navbar {
   height: 70px;
   left: 250px;
   right: 0px;
   position: absolute;
   z-index: 890;
   background-color: transparent;
   height: 70px;
   left: 250px;
   right: 0;
   position: absolute;
   z-index: 890;
   background-color: transparent;
}
.navbar.active {
   background-color: #6777ef;
   box-shadow: rgba(103, 119, 239, 0.2) rgba(0, 0, 0, 0.1);
}
.navbar-bg {
   content: " ";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 70px;
   z-index: -1;
}
.navbar {
   align-items: center;
}
.navbar .navbar-brand {
   color: #fff;
   text-transform: uppercase;
   letter-spacing: 3px;
   font-weight: 700;
}
.navbar .form-inline .form-control {
   background-color: #fff;
   border-color: transparent;
   padding-left: 20px;
   padding-right: 0;
   margin-right: -6px;
   min-height: 46px;
   font-weight: 500;
   border-radius: 3px 0 0 3px;
   transition: all 1s;
}
.navbar .form-inline .form-control:focus,
.navbar .form-inline .form-control:focus + .btn {
   position: relative;
   z-index: 9001;
}
.navbar .form-inline .form-control:focus + .btn + .search-backdrop {
   opacity: 0.6;
   visibility: visible;
}
.navbar .form-inline .form-control:focus + .btn + .search-backdrop + .search-result {
   opacity: 1;
   visibility: visible;
   top: 80px;
}
.navbar .form-inline .btn {
   border-radius: 0 3px 3px 0;
   background-color: #fff;
   padding: 9px 15px 9px 15px;
   border-color: transparent;
}
.navbar .form-inline .search-element .form-control {
   border-radius: 5px 0 0 5px;
}
.navbar .form-inline .search-element .btn {
   border-radius: 0px 5px 5px 0px;
}
.navbar .form-inline .search-backdrop {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 9000;
   background-color: #000;
   opacity: 0;
   visibility: hidden;
   transition: all 0.5s;
}
.navbar .form-inline .search-result {
   position: absolute;
   z-index: 9002;
   top: 100px;
   background-color: #fff;
   border-radius: 3px;
   width: 450px;
   opacity: 0;
   visibility: hidden;
   transition: all 0.5s;
}
.navbar .form-inline .search-result:before {
   position: absolute;
   top: -26px;
   left: 34px;
   content: "\f0d8";
   font-weight: 600;
   font-family: "Font Awesome 5 Free";
   color: #fff;
   font-size: 30px;
}
.navbar .form-inline .search-result .search-header {
   padding: 13px 18px 2px 18px;
   text-transform: uppercase;
   letter-spacing: 1.3px;
   font-weight: 600;
   font-size: 10px;
   color: #bcc1c6;
}
.navbar .form-inline .search-result .search-item {
   display: flex;
}
.navbar .form-inline .search-result .search-item a {
   display: block;
   padding: 13px 18px;
   text-decoration: none;
   color: #34395e;
   font-weight: 600;
   display: flex;
   align-items: center;
}
.navbar .form-inline .search-result .search-item a:hover {
   background-color: #fbfbff;
}
.navbar .form-inline .search-result .search-item a:not(.search-close) {
   width: 100%;
}
.navbar .form-inline .search-result .search-item a i {
   margin-left: 0 !important;
}
.navbar .form-inline .search-result .search-item .search-icon {
   width: 35px;
   height: 35px;
   line-height: 35px;
   text-align: center;
   border-radius: 50%;
}
.navbar .active .nav-link {
   color: #fff;
   font-weight: 700;
}
.navbar .navbar-text {
   color: #fff;
}
.navbar .nav-link {
   color: #f2f2f2;
   padding-left: 12px !important;
   padding-right: 12px !important;
   height: 100%;
}
.navbar .nav-link.nav-link-lg div {
   margin-top: 3px;
}
.navbar .nav-link.nav-link-lg i {
   margin-left: 0 !important;
   font-size: 18px;
   line-height: 32px;
}
.navbar .nav-link.nav-link-lg .feather {
   width: 20px;
   height: 20px;
   stroke: currentColor;
   stroke-width: 2;
   stroke-linecap: round;
   stroke-linejoin: round;
   fill: none;
   color: #ffffff;
}
.navbar .nav-link.nav-link-user {
   color: #fff;
   padding-top: 4px;
   padding-bottom: 4px;
   font-weight: 600;
   padding-right: 12px !important;
}
.navbar .nav-link.nav-link-user img {
   width: 32px;
}
.navbar .nav-link.nav-link-user:after {
   content: none;
}

.navbar .nav-link.nav-link-img {
   padding-top: 4px;
   padding-bottom: 4px;
   border-radius: 50%;
   overflow: hidden;
}
.navbar .nav-link.nav-link-img .flag-icon {
   box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.1);
   border-radius: 50%;
   line-height: 18px;
   height: 22px;
   width: 22px;
   background-size: cover;
}
.navbar .dropdown-list-toggle .message-toggle .headerBadge1 {
   position: absolute;
   top: 4px;
   right: 0px;
   font-weight: 300;
   padding: 3px 6px;
   background: #6677ef;
   border-radius: 10px;
}
.navbar .dropdown-list-toggle .notification-toggle .headerBadge2 {
   position: absolute;
   top: 5px;
   right: 0px;
   font-weight: 300;
   padding: 2px 5px;
   background: #67be7e;
   border-radius: 5px;
}
.remove-caret:after {
   display: none;
}
.navbar .nav-link:hover {
   color: #fff;
}
.navbar .nav-link.disabled {
   color: #fff;
   opacity: 0.6;
}
.nav-collapse {
   display: flex;
}
@media (max-width: 575.98px) {
   body.search-show .navbar .form-inline .search-element {
      display: block;
   }
   .navbar .form-inline .search-element {
      position: absolute;
      top: 10px;
      left: 10px;
      right: 10px;
      z-index: 892;
      display: none;
   }
   .navbar .form-inline .search-element .form-control {
      float: left;
      border-radius: 3px 0 0 3px;
      width: calc(100% - 43px) !important;
   }
   .navbar .form-inline .search-element .btn {
      margin-top: 1px;
      border-radius: 0 3px 3px 0;
   }
   .navbar .form-inline .search-result {
      width: 100%;
   }
   .navbar .form-inline .search-backdrop {
      display: none;
   }
   .navbar .nav-link.nav-link-lg div {
      display: none;
   }
   .navbar .nav-link {
      padding-left: 8px !important;
      padding-right: 8px !important;
   }
}
@media (min-width: 576px) and (max-width: 767.98px) {
   .navbar .form-inline .search-element {
      display: block;
   }
}
@media (min-width: 768px) and (max-width: 991.98px) {
   .collapse {
      position: relative;
   }
   .collapse .navbar-nav {
      position: absolute;
   }
}
@media (max-width: 1024px) {
   .nav-collapse {
      position: relative;
   }
   .nav-collapse .navbar-nav {
      box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
      position: absolute;
      top: 40px;
      left: 0;
      width: 200px;
      display: none;
   }
   .nav-collapse .navbar-nav.show {
      display: block;
   }
   .nav-collapse .navbar-nav .nav-item:first-child {
      border-radius: 3px 3px 0 0;
   }
   .nav-collapse .navbar-nav .nav-item:last-child {
      border-radius: 0 0 3px 3px;
   }
   .nav-collapse .navbar-nav .nav-item .nav-link {
      background-color: #fff;
      color: #6c757d;
   }
   .nav-collapse .navbar-nav .nav-item .nav-link:hover {
      background-color: #fcfcfd;
      color: #6777ef;
   }
   .nav-collapse .navbar-nav .nav-item:focus > a,
   .nav-collapse .navbar-nav .nav-item.active > a {
      background-color: #6777ef;
      color: #fff;
   }
   .navbar {
      left: 5px;
      right: 0;
   }
   .navbar .dropdown-menu {
      position: absolute;
   }
   .navbar .navbar-nav {
      flex-direction: row;
   }
   .navbar-expand-lg .navbar-nav .dropdown-menu-right {
      right: 0;
      left: auto;
   }
}
.app-dropdown {
   width: 280px !important;
}

@media (max-width: 619px) {
   .navbar .form-inline .search-element {
      display: none;
   }
}
/* .dropdown-item.has-icon i {
   margin-top: -1px;
   font-size: 13px;
} */
.dropdown-menu {
   box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
   border: none;
   width: 200px;
}
.dropdown-menu.show {
   display: block !important;
}
.dropdown-menu a {
   font-size: 13px;
}
.dropdown-menu .dropdown-title {
   text-transform: uppercase;
   font-size: 10px;
   letter-spacing: 1.5px;
   font-weight: 700;
   color: #191d21 !important;
   padding: 10px 20px;
   line-height: 20px;
   color: #98a6ad;
}
.dropdown-menu.dropdown-menu-sm a {
   font-size: 14px;
   letter-spacing: normal;
   padding: 10px 20px;
   color: #6c757d;
}

a.dropdown-item:focus,
a.dropdown-item:active,
a.dropdown-item.active {
   background-color: #e9e9e9;
   color: #666666 !important;
}
.dropdown-divider {
   border-top-color: #f9f9f9;
}
.dropdown-list {
   width: 300px;
   padding: 0;
}
.dropdown-list .dropdown-item {
   display: inline-block;
   width: 100%;
   padding-top: 15px;
   padding-bottom: 15px;
   font-size: 13px;
   border-bottom: 1px solid #f9f9f9;
}
.dropdown-list .dropdown-item.dropdown-item-header:hover {
   background-color: transparent;
}
.dropdown-list .dropdown-item .time {
   margin-top: 10px;
   font-weight: 600;
   text-transform: uppercase;
   font-size: 10px;
   letter-spacing: 0.5px;
}
.dropdown-list .dropdown-item .dropdown-item-avatar {
   float: left;
   width: 50px;
   text-align: right;
   position: relative;
}
.dropdown-list .dropdown-item .dropdown-item-avatar img {
   width: 100%;
}
.dropdown-list .dropdown-item .dropdown-item-avatar .is-online {
   position: absolute;
   bottom: 0;
   right: 0;
}
.dropdown-list .dropdown-item .dropdown-item-desc {
   line-height: 24px;
   white-space: normal;
   color: #34395e;
   margin-left: 60px;
}
.dropdown-list .dropdown-item .dropdown-item-desc b {
   font-weight: 600;
   color: #666;
}
.dropdown-list .dropdown-item .dropdown-item-desc p {
   margin-bottom: 0;
}
.dropdown-list .dropdown-item .dropdown-msg-item-desc {
   margin-left: 13px;
   display: inline-grid;
}
.dropdown-list .dropdown-item:focus {
   background-color: #e9e9e9;
}
.dropdown-list .dropdown-item:focus .dropdown-item-desc {
   color: #666 !important;
}
.dropdown-list .dropdown-item:focus .dropdown-item-desc b {
   color: #666 !important;
}
.dropdown-list .dropdown-item.dropdown-item-unread:active .dropdown-item-desc {
   color: #6c757d;
}
.dropdown-list .dropdown-item.dropdown-item-unread:active .dropdown-item-desc b {
   color: #6c757d;
}
.dropdown-list .dropdown-item:active .dropdown-item-desc {
   color: #fff;
}
.dropdown-list .dropdown-item:active .dropdown-item-desc b {
   color: #fff;
}
.dropdown-list .dropdown-item.dropdown-item-unread {
   background-color: #fbfbfb;
   border-bottom-color: #f2f2f2;
}
.dropdown-list .dropdown-item.dropdown-item-unread:focus .dropdown-item-desc {
   color: #6c757d !important;
}
.dropdown-list .dropdown-item.dropdown-item-unread:focus .dropdown-item-desc b {
   color: #6c757d !important;
}
.dropdown-list .dropdown-footer,
.dropdown-list .dropdown-header {
   letter-spacing: 0.5px;
   font-weight: 600;
   padding: 10px 15px 10px 15px;
}
.dropdown-list .dropdown-footer a,
.dropdown-list .dropdown-header a {
   font-weight: 600;
}
.dropdown-list .dropdown-list-content {
   /* height: 250px; */
   overflow: hidden;
}
.dropdown-list .dropdown-list-content:not(.is-end):after {
   content: " ";
   position: absolute;
   bottom: 46px;
   left: 0;
   width: 100%;
   height: 60px;
}
.dropdown-list .dropdown-list-icons .dropdown-item {
   display: flex;
}
.dropdown-list .dropdown-list-icons .dropdown-item .dropdown-item-icon {
   flex-shrink: 0;
   border-radius: 50%;
   width: 40px;
   height: 40px;
   line-height: 42px;
   text-align: center;
}
.dropdown-list .dropdown-list-icons .dropdown-item .dropdown-item-icon i {
   margin: 0;
}
.dropdown-list .dropdown-list-icons .dropdown-item .dropdown-item-desc {
   margin-left: 15px;
   line-height: 20px;
}
.dropdown-list .dropdown-list-icons .dropdown-item .dropdown-item-desc .time {
   margin: 0;
   font-size: 10px;
   color: #aaa;
   float: left;
   width: 100%;
   line-height: 20px;
}
.dropdown-list .dropdown-list-message .dropdown-item {
   display: flex;
   padding-top: 4px;
   border-bottom: 1px solid #eee;
   padding-bottom: 0px;
}
.dropdown-list .dropdown-list-message .dropdown-item .dropdown-item-icon {
   flex-shrink: 0;
   border-radius: 50%;
   width: 40px;
   height: 40px;
   line-height: 42px;
   text-align: center;
}
.dropdown-list .dropdown-list-message .dropdown-item .dropdown-item-icon i {
   margin: 0;
}
.dropdown-list .dropdown-list-message .dropdown-item .dropdown-item-desc {
   margin-left: 15px;
   line-height: 20px;
   width: 100%;
}
.dropdown-list .dropdown-list-message .dropdown-item .dropdown-item-desc .time {
   margin: 0;
   font-size: 10px;
   color: #aaa;
   float: left;
   width: 100%;
   line-height: 20px;
}
.dropdown-list .dropdown-list-message .dropdown-item .dropdown-item-desc .messege-text {
   text-transform: none;
   font-size: 12px;
   color: #6d6c6c;
}
.dropdown-list .dropdown-list-message .dropdown-item .dropdown-item-desc .message-user {
   font-size: 14px;
   font-weight: 600;
   color: #39393c;
}
.dropdown-flag .dropdown-item {
   font-weight: 600;
}
.dropdown-flag .dropdown-item .flag-icon {
   width: 20px;
   height: 13px;
   margin-right: 7px;
   margin-top: -6px;
}
.dropdown-flag .dropdown-item.active {
   background-color: #6777ef;
   color: #fff;
}
@media (max-width: 479px) {
   .dropdown-list-toggle:first-child .dropdown-list {
      right: -100px;
   }
   .dropdown-list-toggle:nth-child(2) .dropdown-list {
      right: -60px;
   }
}
.tab-content.no-padding > .tab-pane {
   padding: 0;
}
.tab-content > .tab-pane {
   line-height: 28px;
}

.jumbotron {
   background-color: #e3eaef;
}
.carousel .carousel-caption p {
   font-size: 13px;
   line-height: 24px;
}

@font-face {
   font-family: "Nunito";
   font-style: normal;
   font-weight: 400;
   src: url("../fonts/nunito-v9-latin-regular.eot");
   src: local("Nunito Regular"), local("Nunito-Regular"),
      url("../fonts/nunito-v9-latin-regulard41d.eot?#iefix") format("embedded-opentype"),
      url("../fonts/nunito-v9-latin-regular.woff2") format("woff2"), url("../fonts/nunito-v9-latin-regular.woff") format("woff"),
      url("../fonts/nunito-v9-latin-regular.ttf") format("truetype"),
      url("../fonts/nunito-v9-latin-regular.svg#Nunito") format("svg");
}
@font-face {
   font-family: "Nunito";
   font-style: normal;
   font-weight: 600;
   src: url("../fonts/nunito-v9-latin-600.eot");
   src: local("Nunito SemiBold"), local("Nunito-SemiBold"),
      url("../fonts/nunito-v9-latin-600d41d.eot?#iefix") format("embedded-opentype"),
      url("../fonts/nunito-v9-latin-600.woff2") format("woff2"), url("../fonts/nunito-v9-latin-600.woff") format("woff"),
      url("../fonts/nunito-v9-latin-600.ttf") format("truetype"), url("../fonts/nunito-v9-latin-600.svg#Nunito") format("svg");
}
@font-face {
   font-family: "Nunito";
   font-style: normal;
   font-weight: 700;
   src: url("../fonts/nunito-v9-latin-700.eot");
   src: local("Nunito Bold"), local("Nunito-Bold"), url("../fonts/nunito-v9-latin-700d41d.eot?#iefix") format("embedded-opentype"),
      url("../fonts/nunito-v9-latin-700.woff2") format("woff2"), url("../fonts/nunito-v9-latin-700.woff") format("woff"),
      url("../fonts/nunito-v9-latin-700.ttf") format("truetype"), url("../fonts/nunito-v9-latin-700.svg#Nunito") format("svg");
}
@font-face {
   font-family: "Nunito";
   font-style: normal;
   font-weight: 800;
   src: url("../fonts/nunito-v9-latin-800.eot");
   src: local("Nunito ExtraBold"), local("Nunito-ExtraBold"),
      url("../fonts/nunito-v9-latin-800d41d.eot?#iefix") format("embedded-opentype"),
      url("../fonts/nunito-v9-latin-800.woff2") format("woff2"), url("../fonts/nunito-v9-latin-800.woff") format("woff"),
      url("../fonts/nunito-v9-latin-800.ttf") format("truetype"), url("../fonts/nunito-v9-latin-800.svg#Nunito") format("svg");
}

/* :root {
   --primary: color(primary);
   --secondary: color(fontdark);
   --success: color(success);
   --info: color(info);
   --warning: color(warning);
   --danger: color(danger);
   --light: color(light);
   --dark: color(dark);
} */

a.bb {
   text-decoration: none;
   border-bottom: 1px solid #6777ef;
   padding-bottom: 1px;
}
.form-divider {
   display: inline-block;
   width: 100%;
   margin: 10px 0;
   font-size: 16px;
   font-weight: 600;
}
.ui-sortable-handle,
.sort-handler {
   cursor: move;
}
.text-job {
   font-size: 10px;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-weight: 700;
   color: #34395e;
}
.text-time {
   font-size: 12px;
   color: #666;
   font-weight: 500;
   margin-bottom: 10px;
}
.bullet,
.slash {
   display: inline;
   margin: 0 4px;
}
.bullet:after {
   content: "\2022";
}
.slash:after {
   content: "/";
}
.login-brand {
   margin: 20px 0;
   margin-bottom: 40px;
   font-size: 24px;
   text-transform: uppercase;
   letter-spacing: 4px;
   color: #666;
   text-align: center;
}

.budget-price {
   display: inline-block;
   width: 100%;
   display: flex;
   align-items: center;
   margin-bottom: 3px;
}
.budget-price .budget-price-square {
   width: 15px;
   height: 3px;
   background-color: #f9f9f9;
}
.budget-price .budget-price-label {
   font-size: 12px;
   font-weight: 600;
   margin-left: 5px;
}
.gradient-bottom {
   position: relative;
}
.gradient-bottom:after {
   content: " ";
   position: absolute;
   bottom: 41px;
   left: 0;
   width: 100%;
   background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.8));
   height: 60px;
}
.text-small {
   font-size: 12px;
   line-height: 20px;
}
.text-title {
   font-size: 14px;
   color: #34395e;
   font-weight: 600;
}
.img-shadow {
   box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.1);
}
.colors {
   display: flex;
   flex-wrap: wrap;
   margin: 0 -5px;
}
.colors .color {
   border-radius: 3px;
   width: calc((100% / 4) - 10px);
   padding: 10px;
   height: 60px;
   line-height: 40px;
   text-align: center;
   margin: 5px;
}

.bg-whitesmoke {
   background-color: #f7f9f9 !important;
}
.ion {
   font-size: 15px;
}
.fas,
.far,
.fab,
.fal {
   font-size: 13px;
}
#visitorMap {
   height: 400px;
}
#visitorMap2,
#visitorMap3 {
   height: 350px;
}
#visitorMap4 {
   height: 190px;
}
.sidebar-gone-show {
   display: none !important;
}
pre {
   border-radius: 3px;
}
.pe-none {
   pointer-events: none;
}
.contact-map {
   width: 100%;
   height: 100%;
   min-height: 400px;
}
/* .shadow-primary {
   box-shadow: 0 2px 6px #acb5f6;
}
.shadow-secondary {
   box-shadow: 0 2px 6px #e1e5e8;
}
.shadow-success {
   box-shadow: 0 2px 6px #8edc9c;
}
.shadow-warning {
   box-shadow: 0 2px 6px #ffc473;
}
.shadow-danger {
   box-shadow: 0 2px 6px #fd9b96;
}
.shadow-info {
   box-shadow: 0 2px 6px #82d3f8;
}
.shadow-light {
   box-shadow: 0 2px 6px #e6ecf1;
}
.shadow-dark {
   box-shadow: 0 2px 6px #728394;
} */
.is-online {
   width: 10px;
   height: 10px;
   background-color: #54ca68;
   border-radius: 50%;
   display: inline-block;
}
.gutters-xs {
   margin-right: -0.25rem;
   margin-left: -0.25rem;
}
.gutters-xs > .col,
.gutters-xs > [class*="col-"] {
   padding-right: 0.25rem;
   padding-left: 0.25rem;
}

@media (max-width: 575.98px) {
   .fc-overflow {
      width: 100%;
      overflow: auto;
   }
   .fc-overflow #myEvent {
      width: 800px;
   }
}
.section {
   position: relative;
   z-index: 1;
}
.section > *:first-child {
   margin-top: -7px;
}

.section .section-title {
   font-size: 18px;
   color: #191d21;
   font-weight: 600;
   position: relative;
   margin: 30px 0 25px 0;
}
.section .section-title + .section-lead {
   margin-top: -20px;
}
.main-wrapper-1 .section .section-header {
   margin-left: -30px;
   margin-right: -30px;
   margin-top: -10px;
   border-radius: 0;
   border-top: 1px solid #f9f9f9;
   padding-left: 35px;
   padding-right: 35px;
}
@media (max-width: 575.98px) {
   .section .section-title {
      font-size: 14px;
   }
   
   .navbar .navbar-nav > li a.dropdown-item {
       padding:0;
       line-height: 0;
       text-align: end;
       width: 310px;
   }
   
   div.dataTables_wrapper div.dataTables_paginate ul.pagination {
       justify-content: start;
   }
}

.main-sidebar {
   box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.1);
   position: fixed;
   top: 0;
   height: 100%;
   width: 250px;
   background-color: #fff;
   z-index: 880;
   left: 0;
}
.main-sidebar,
.navbar,
.main-content,
.main-footer {
   transition: all 0.5s;
}
body.sidebar-gone .main-sidebar {
   left: -250px;
}
.sidebar-mini .hide-sidebar-mini {
   display: none !important;
}
.sidebar-mini .main-sidebar {
   width: 65px;
   overflow: initial !important;
   position: absolute;
   box-shadow: none;
}
.sidebar-mini .main-sidebar:after {
   box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.1);
   content: " ";
   position: fixed;
   background-color: #fff;
   width: 65px;
   height: 100%;
   left: 0;
   top: 0;
   z-index: -1;
   opacity: 0;
   animation-name: mini-sidebar;
   animation-duration: 1.5s;
   animation-fill-mode: forwards;
}
@keyframes mini-sidebar {
   from {
      opacity: 0;
   }
   to {
      opacity: 1;
   }
}
.sidebar-mini .main-sidebar .logo-name {
   display: none;
}
.sidebar-mini .main-sidebar .sidebar-user {
   margin: 0;
   height: 70px;
   padding: 15px;
}
.sidebar-mini .main-sidebar .sidebar-user .sidebar-user-picture img {
   width: 35px;
}
.sidebar-mini .main-sidebar .sidebar-user .sidebar-user-details .user-name,
.sidebar-mini .main-sidebar .sidebar-user .sidebar-user-details .user-role {
   display: none;
}
.sidebar-mini .main-sidebar .sidebar-brand-sm {
   display: block;
}
.sidebar-mini .main-sidebar .sidebar-menu > li {
   padding: 10px;
}
.sidebar-mini .main-sidebar .sidebar-menu > li.menu-header {
   padding: 0;
   font-size: 0;
   height: 2px;
}
.sidebar-mini .main-sidebar .sidebar-menu > li > a {
   border-radius: 3px;
   height: 45px;
   padding: 0;
   justify-content: center;
}
.sidebar-mini .main-sidebar .sidebar-menu > li > a .ion,
.sidebar-mini .main-sidebar .sidebar-menu > li > a .fas,
.sidebar-mini .main-sidebar .sidebar-menu > li > a .far,
.sidebar-mini .main-sidebar .sidebar-menu > li > a .fab,
.sidebar-mini .main-sidebar .sidebar-menu > li > a .fal {
   margin: 0;
   font-size: 20px;
}
.sidebar-mini .main-sidebar .sidebar-menu > li > a span {
   display: none;
}
.sidebar-mini .main-sidebar .sidebar-menu > li > a .badge {
   padding: 5px;
   position: absolute;
   top: 4px;
   right: 4px;
   font-size: 10px;
}
.sidebar-mini .main-sidebar .sidebar-menu > li > a.has-dropdown:after {
   content: initial;
}
.sidebar-mini .main-sidebar .sidebar-menu > li.active > a {
   box-shadow: 0 4px 8px #acb5f6;
   background-color: #6777ef;
   color: #fff;
}
.sidebar-mini .main-sidebar .sidebar-menu > li ul.dropdown-menu {
   position: absolute;
   background-color: #fff;
   left: 65px;
   top: 10px;
   width: 200px;
   display: none;
   box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
}
.sidebar-mini .main-sidebar .sidebar-menu > li ul.dropdown-menu li > a:focus,
.sidebar-mini .main-sidebar .sidebar-menu > li ul.dropdown-menu li.active > a,
.sidebar-mini .main-sidebar .sidebar-menu > li ul.dropdown-menu li.active > a:hover {
   color: #6777ef;
}
.sidebar-mini .main-sidebar .sidebar-menu > li ul.dropdown-menu li a {
   height: 40px;
   background-color: #fff;
}
.sidebar-mini .main-sidebar .sidebar-menu > li ul.dropdown-menu li a.has-dropdown:after {
   content: "";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   position: absolute;
   top: 50%;
   right: 20px;
   -webkit-transform: translate(0, -50%);
   transform: translate(0, -50%);
   font-size: 14px;
}
.sidebar-mini .main-sidebar .sidebar-menu li:hover > ul.dropdown-menu {
   display: block !important;
}
.sidebar-mini .main-sidebar .sidebar-menu li:hover > ul.dropdown-menu li:hover > a {
   background-color: #fcfcfd;
}
.sidebar-mini .main-sidebar .sidebar-menu li:hover > ul.dropdown-menu li .dropdown-menu {
   left: 200px;
   padding: 0;
}
.sidebar-mini .main-sidebar .sidebar-menu .menu-toggle:before {
   content: "";
}
.sidebar-mini .main-sidebar .sidebar-menu .menu-toggle:after {
   content: "";
}
.sidebar-mini .navbar {
   left: 65px;
}
.sidebar-mini .main-content,
.sidebar-mini .main-footer {
   padding-left: 90px;
}
.sidebar-mini .main-sidebar .sidebar-menu li a .feather {
   margin-right: 0px;
}
.loader {
   position: fixed;
   left: 0px;
   top: 0px;
   width: 100%;
   height: 100%;
   z-index: 9999;
   background: url("../img/loading.gif") 50% 50% no-repeat #f9f9f9;
   opacity: 1;
}
.user-img-radious-style {
   border-radius: 50%;
   box-shadow: 4px 3px 6px 0 rgba(0, 0, 0, 0.2);
}
.shadow-style {
   -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
   box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
body.layout-2 .navbar-bg {
   z-index: 889;
   height: 70px;
}
body.layout-2 .navbar {
   left: 0;
   z-index: 890;
}
body.layout-2 .main-wrapper {
   display: flex;
   flex-wrap: wrap;
   padding: 0 50px;
}
body.layout-2 .main-sidebar,
body.layout-2 .main-content,
body.layout-2 .main-footer {
   flex-shrink: 0;
   flex-grow: 0;
}
body.layout-2 .main-sidebar {
   background-color: transparent;
   box-shadow: none;
   position: static;
   margin-top: 100px;
   width: 200px;
}
body.layout-2 .main-sidebar .sidebar-menu li.menu-header {
   padding: 0;
}
body.layout-2 .main-sidebar .sidebar-menu li a {
   padding: 0;
}
body.layout-2 .main-sidebar .sidebar-menu li a i {
   width: 10px;
}
body.layout-2 .main-sidebar .sidebar-menu li a.has-dropdown:after {
   right: 0;
}
body.layout-2 .main-sidebar .sidebar-menu li a:hover {
   color: #6777ef;
   background-color: transparent;
}
body.layout-2 .main-sidebar .sidebar-menu li ul.dropdown-menu li a {
   padding-left: 34px;
}
body.layout-2 .main-content {
   padding-top: 107px;
   padding-left: 30px;
   padding-right: 0;
   width: calc(100% - 200px);
}
body.layout-2 .main-footer {
   margin-left: 230px;
   width: calc(100% - 230px);
   padding-left: 0;
   padding-right: 0;
}
body.layout-3 .navbar {
   left: 0;
   right: 0;
}
body.layout-3 .navbar.navbar-secondary {
   box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.1);
   background-color: #fff;
   top: 70px;
   padding: 0;
   z-index: 889;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item.active > .nav-link {
   color: #6777ef;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item.active > .nav-link:before {
   left: 35px;
   right: 0;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item:first-child .nav-link {
   margin-left: 0;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item:last-child .nav-link {
   margin-right: 0;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item > .nav-link {
   color: #868e96;
   font-size: 13px;
   letter-spacing: 0.3px;
   height: 70px;
   padding: 0;
   padding-left: 0 !important;
   padding-right: 0 !important;
   margin-left: 15px;
   margin-right: 15px;
   position: relative;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item > .nav-link.has-dropdown {
   margin-right: 35px;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item > .nav-link.has-dropdown:after {
   content: "";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   position: absolute;
   top: 50%;
   right: 20px;
   -webkit-transform: translate(0, -50%);
   transform: translate(0, -50%);
   font-size: 14px;
   right: -20px;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item > .nav-link:before {
   content: " ";
   position: absolute;
   left: initial;
   right: initial;
   bottom: 0;
   height: 2px;
   background-color: #6777ef;
   transition: all 0.5s;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item > .nav-link span {
   line-height: 74px;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item > .nav-link i {
   width: 30px;
   font-size: 16px;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item > .nav-link:hover {
   color: #191d21 !important;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item .dropdown-menu {
   padding: 0;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item .dropdown-menu .nav-item .nav-link {
   color: #6c757d;
   font-weight: 600;
   letter-spacing: 0.3px;
   padding: 7px !important;
   padding-left: 20px !important;
   padding-right: 20px !important;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item .dropdown-menu .nav-item .nav-link.has-dropdown:after {
   content: "";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   position: absolute;
   top: 50%;
   right: 20px;
   -webkit-transform: translate(0, -50%);
   transform: translate(0, -50%);
   font-size: 14px;
   right: 15px;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item .dropdown-menu .nav-item:hover > .nav-link {
   background-color: #fcfcfd;
   color: #191d21;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item .dropdown-menu .nav-item:hover > .dropdown-menu {
   display: block !important;
   top: -5px;
   left: 200px;
}
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item .dropdown-menu .nav-item.active > .nav-link,
body.layout-3 .navbar.navbar-secondary .navbar-nav > .nav-item .dropdown-menu .nav-item .nav-link:focus {
   background-color: #6777ef;
   color: #fff;
}
body.layout-3 .main-content {
   padding-left: 0;
   padding-right: 0;
   padding-top: 170px;
}
body.layout-3 .main-footer {
   padding-left: 0;
   padding-right: 0;
}
.main-sidebar .sidebar-brand {
   display: inline-block;
   width: 100%;
   text-align: center;
   height: 70px;
   line-height: 70px;
   border-bottom: 1px solid #eee;
   /* background-color: #0f172b; */
}
.main-sidebar .sidebar-brand.sidebar-brand-sm {
   display: none;
}
.main-sidebar .sidebar-brand a {
   text-decoration: none;
   /* text-transform: uppercase; */
   letter-spacing: 3px;
   font-weight: 700;
   font-size: 23px;
   vertical-align: bottom;
   color: #000;
}
.main-sidebar .sidebar-brand a .header-logo {
   height: 50px;
}
.main-sidebar .sidebar-brand a .logo-name {
   vertical-align: middle;
   font-size: 20px;
}
.main-sidebar .sidebar-user {
   display: inline-block;
   width: 100%;
   padding: 10px;
   text-align: center;
}
.main-sidebar .sidebar-user .sidebar-user-picture {
   margin-right: 10px;
}
.main-sidebar .sidebar-user .sidebar-user-picture img {
   width: 75px;
   border-radius: 50%;
}
.main-sidebar .sidebar-user .sidebar-user-details .user-name {
   white-space: nowrap;
   -o-text-overflow: ellipsis;
   text-overflow: ellipsis;
   overflow: hidden;
   margin-top: 7px;
   margin-bottom: 3px;
   font-weight: 600;
   color: #505c66;
}
.main-sidebar .sidebar-user .sidebar-user-details .user-role {
   font-weight: 400;
   color: #868e96;
   font-size: 10px;
   letter-spacing: 0.5px;
}
.main-sidebar .sidebar-menu {
   padding: 0;
   margin: 0;
}
.main-sidebar .sidebar-menu li {
   display: block;
}
.main-sidebar .sidebar-menu li.menu-header {
   padding: 3px 15px;
   color: #868e96;
   font-size: 10px;
   text-transform: uppercase;
   letter-spacing: 1.3px;
   font-weight: 600;
}
.main-sidebar .sidebar-menu li.menu-header:not(:first-child) {
   margin-top: 10px;
}
.main-sidebar .sidebar-menu li .menu-toggle:before,
.main-sidebar .sidebar-menu li .menu-toggle:after {
   position: absolute;
   font-size: 20px;
   right: 17px;
   transition: all 0.3s;
}

.main-sidebar .sidebar-menu li .menu-toggle:before {
   content: "+";
   transform: scale(1);
}
.main-sidebar .sidebar-menu li .menu-toggle:after {
   content: "-";
   font-size: 24px;
   transform: scale(0);
}
.main-sidebar .sidebar-menu li .menu-toggle.toggled:before {
   transform: scale(0);
}
.main-sidebar .sidebar-menu li .menu-toggle.toggled:after {
   transform: scale(1);
}
.main-sidebar .sidebar-menu li a {
   position: relative;
   display: flex;
   align-items: center;
   height: 50px;
   padding: 0 20px;
   width: 100%;
   letter-spacing: 0.3px;
   color: #60686f;
   font-weight: 500;
   text-decoration: none;
}
.main-sidebar .sidebar-menu li a .badge {
   float: right;
   padding: 5px 10px;
   margin-top: 2px;
}
.main-sidebar .sidebar-menu li a i {
   width: 28px;
   font-size: 15px;
   margin-right: 10px;
   text-align: center;
}
.main-sidebar .sidebar-menu li a .feather {
   height: 20px;
   width: 20px;
   margin-right: 10px;
   text-align: center;
   fill: rgba(75, 75, 90, 0.12);
}
.main-sidebar .sidebar-menu li a span {
   margin-top: 3px;
   width: 100%;
}
.main-sidebar .sidebar-menu li a:hover {
   background-color: #f2f5f8;
}
.main-sidebar .sidebar-menu li.active a {
   font-weight: 500;
   background-color: #fcfcfd;
}
.main-sidebar .sidebar-menu li.active ul.dropdown-menu {
   background-color: #fcfcfd;
}
.main-sidebar .sidebar-menu li.active > ul.dropdown-menu {
   display: block;
}
.main-sidebar .sidebar-menu li.active > ul.dropdown-menu li a:hover {
   background-color: #fcfcfd;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu {
   padding: 0;
   margin: 0;
   display: none;
   position: static;
   float: none;
   width: 100%;
   box-shadow: none;
   background-color: transparent;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu li a {
   color: #60686f;
   height: 35px;
   padding-left: 50px;
   font-weight: 400;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu li a:hover {
   color: #6777ef;
   background-color: inherit;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu li a:hover:before {
   color: #6777ef;
   font-weight: 600;
   left: 35px;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu li a:before {
   content: "\f105";
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   font-size: 12px;
   position: absolute;
   transition: 0.5s;
   left: 30px;
   color: #868e96;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu li.active > a {
   color: #6777ef;
   font-weight: 600;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu li.active > a:before {
   color: #6777ef;
   font-weight: 600;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu li a i {
   margin-top: 1px;
   text-align: center;
}
.main-sidebar .sidebar-menu li ul.dropdown-menu li ul.dropdown-menu {
   padding-left: 10px;
}
.main-content {
   padding-left: 280px;
   padding-right: 30px;
   padding-top: 130px;
   width: 100%;
   position: relative;
}
.main-footer {
   padding: 20px 30px 20px 280px;
   margin-top: 40px;
   color: #666;
   border-top: 1px solid #e3eaef;
   display: inline-block;
   background: #ffffff;
   font-weight: 500;
   font-size: 14px;
   width: 100%;
}
.main-footer .footer-left {
   float: left;
}
.main-footer .footer-right {
   float: right;
}
.simple-footer {
   text-align: center;
   margin-top: 40px;
   margin-bottom: 40px;
}
body:not(.sidebar-mini) .sidebar-style-1 .sidebar-menu li.active a {
   background-color: #6777ef;
   color: #fff;
}
body:not(.sidebar-mini) .sidebar-style-1 .sidebar-menu li.active ul.dropdown-menu li a {
   color: #e8ebfd;
}
body:not(.sidebar-mini) .sidebar-style-1 .sidebar-menu li.active ul.dropdown-menu li a:hover {
   background-color: #6777ef;
   color: #fff;
}
body:not(.sidebar-mini) .sidebar-style-1 .sidebar-menu li.active ul.dropdown-menu li.active a {
   color: #fff;
}
body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu > li.active > a {
   padding-left: 20px;
   position: relative;
   color: #6777ef;
}
body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu li.active ul.dropdown-menu li a {
   background-color: #fff;
}

.light-sidebar .main-sidebar .sidebar-menu li.active a {
   background-color: #f0f3ff;
}
.theme-setting {
   position: fixed;
   bottom: 20px;
   right: 20px;
   z-index: 2002;
}
.theme-setting .theme-setting-toggle {
   transition: all 0.5s;
   width: 50px;
   height: 50px;
   border-radius: 50%;
   background-color: #f73f52;
   color: #fff;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
   text-align: center;
   line-height: 60px;
   cursor: pointer;
}
.theme-setting .theme-setting-toggle i {
   font-size: 24px;
}
.theme-setting .theme-setting-options {
   transition: all 0.5s;
   transition-delay: 0.3s;
   z-index: -1;
   position: absolute;
   left: -220px;
   bottom: 0;
   height: 150px;
   width: 50px;
   background-color: #e8e6e6;
   box-shadow: 0 0 40px rgba(0, 0, 0, 0.05);
   border-radius: 12px;
   visibility: hidden;
   opacity: 0;
}
.theme-setting .theme-setting-options ul {
   padding: 0;
   margin: 0;
   width: 100%;
   display: inline-block;
   margin-left: 20px;
}
.theme-setting .theme-setting-options ul li {
   width: 20px;
   height: 20px;
   background-color: #000;
   margin-right: 10px;
   margin-top: 15px;
   border-radius: 3px;
   display: inline-block;
   cursor: pointer;
   opacity: 0;
   transition: all 0.5s;
}
.theme-setting .theme-setting-options ul li:hover {
   opacity: 0.8;
}
.theme-setting.active .theme-setting-toggle {
   margin: 5px;
   box-shadow: none;
   line-height: 50px;
   width: 40px;
   height: 40px;
   transform: rotate(90deg);
}
.theme-setting.active .theme-setting-options {
   visibility: visible;
   opacity: 1;
   width: 220px;
}
.theme-setting.active .theme-setting-options ul li {
   opacity: 1;
   transition-delay: 0.3s;
}
@media (max-width: 1024px) {
   .sidebar-gone-hide {
      display: none !important;
   }
   .sidebar-gone-show {
      display: block !important;
   }
   .main-sidebar {
      position: fixed !important;
      margin-top: 0 !important;
      z-index: 891;
   }
   body.layout-2 .main-wrapper,
   body.layout-3 .main-wrapper {
      width: 100%;
      padding: 0;
      display: block;
   }
   .main-content {
      padding-left: 30px;
      padding-right: 30px;
      width: 100% !important;
   }
   .main-footer {
      padding-left: 30px;
   }
   body.search-show {
      overflow: hidden;
   }
   body.search-show .navbar {
      z-index: 892;
   }
   body.sidebar-show {
      overflow: hidden;
   }
   body.search-show:before,
   body.sidebar-show:before {
      content: "";
      position: fixed;
      left: 0;
      right: 0;
      width: 100%;
      height: 100%;
      background-color: #000;
      opacity: 0;
      z-index: 891;
      -webkit-animation-name: fadeinbackdrop;
      animation-name: fadeinbackdrop;
      -webkit-animation-duration: 1s;
      animation-duration: 1s;
      -webkit-animation-fill-mode: forwards;
      animation-fill-mode: forwards;
   }
   @-webkit-keyframes fadeinbackdrop {
      to {
         opacity: 0.6;
      }
   }
   @keyframes fadeinbackdrop {
      to {
         opacity: 0.6;
      }
   }
}

.fadeIn {
   animation-name: fadeIn;
   -webkit-animation-name: fadeIn;
   animation-duration: 1.5s;
   -webkit-animation-duration: 1.5s;
   animation-timing-function: ease-in-out;
   -webkit-animation-timing-function: ease-in-out;
   visibility: visible !important;
}
@keyframes fadeIn {
   0% {
      transform: scale(0);
      opacity: 0;
   }
   60% {
      transform: scale(1.1);
   }
   80% {
      transform: scale(0.9);
      opacity: 1;
   }
   100% {
      transform: scale(1);
      opacity: 1;
   }
}
@-webkit-keyframes fadeIn {
   0% {
      -webkit-transform: scale(0);
      opacity: 0;
   }
   60% {
      -webkit-transform: scale(1.1);
   }
   80% {
      -webkit-transform: scale(0.9);
      opacity: 1;
   }
   100% {
      -webkit-transform: scale(1);
      opacity: 1;
   }
}

.bounce {
   animation-name: bounce;
   -webkit-animation-name: bounce;
   animation-duration: 1.6s;
   -webkit-animation-duration: 1.6s;
   animation-timing-function: ease;
   -webkit-animation-timing-function: ease;
   transform-origin: 50% 100%;
   -ms-transform-origin: 50% 100%;
   -webkit-transform-origin: 50% 100%;
}
@keyframes bounce {
   0% {
      transform: translateY(0%) scaleY(0.6);
   }
   60% {
      transform: translateY(-100%) scaleY(1.1);
   }
   70% {
      transform: translateY(0%) scaleY(0.95) scaleX(1.05);
   }
   80% {
      transform: translateY(0%) scaleY(1.05) scaleX(1);
   }
   90% {
      transform: translateY(0%) scaleY(0.95) scaleX(1);
   }
   100% {
      transform: translateY(0%) scaleY(1) scaleX(1);
   }
}
@-webkit-keyframes bounce {
   0% {
      -webkit-transform: translateY(0%) scaleY(0.6);
   }
   60% {
      -webkit-transform: translateY(-100%) scaleY(1.1);
   }
   70% {
      -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1.05);
   }
   80% {
      -webkit-transform: translateY(0%) scaleY(1.05) scaleX(1);
   }
   90% {
      -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1);
   }
   100% {
      -webkit-transform: translateY(0%) scaleY(1) scaleX(1);
   }
}
.pulse {
   animation-name: pulse;
   -webkit-animation-name: pulse;
   animation-duration: 1.5s;
   -webkit-animation-duration: 1.5s;
   animation-iteration-count: infinite;
   -webkit-animation-iteration-count: infinite;
}
@keyframes pulse {
   0% {
      transform: scale(0.9);
      opacity: 0.7;
   }
   50% {
      transform: scale(1);
      opacity: 1;
   }
   100% {
      transform: scale(0.9);
      opacity: 0.7;
   }
}
@-webkit-keyframes pulse {
   0% {
      -webkit-transform: scale(0.95);
      opacity: 0.7;
   }
   50% {
      -webkit-transform: scale(1);
      opacity: 1;
   }
   100% {
      -webkit-transform: scale(0.95);
      opacity: 0.7;
   }
}
.floating {
   animation-name: floating;
   -webkit-animation-name: floating;
   animation-duration: 1.5s;
   -webkit-animation-duration: 1.5s;
   animation-iteration-count: infinite;
   -webkit-animation-iteration-count: infinite;
}
@keyframes floating {
   0% {
      transform: translateY(0%);
   }
   50% {
      transform: translateY(8%);
   }
   100% {
      transform: translateY(0%);
   }
}
@-webkit-keyframes floating {
   0% {
      -webkit-transform: translateY(0%);
   }
   50% {
      -webkit-transform: translateY(8%);
   }
   100% {
      -webkit-transform: translateY(0%);
   }
}
.tossing {
   animation-name: tossing;
   -webkit-animation-name: tossing;
   animation-duration: 2.5s;
   -webkit-animation-duration: 2.5s;
   animation-iteration-count: infinite;
   -webkit-animation-iteration-count: infinite;
}
@keyframes tossing {
   0% {
      transform: rotate(-4deg);
   }
   50% {
      transform: rotate(4deg);
   }
   100% {
      transform: rotate(-4deg);
   }
}
@-webkit-keyframes tossing {
   0% {
      -webkit-transform: rotate(-4deg);
   }
   50% {
      -webkit-transform: rotate(4deg);
   }
   100% {
      -webkit-transform: rotate(-4deg);
   }
}
.pullUp {
   animation-name: pullUp;
   -webkit-animation-name: pullUp;
   animation-duration: 1.1s;
   -webkit-animation-duration: 1.1s;
   animation-timing-function: ease-out;
   -webkit-animation-timing-function: ease-out;
   transform-origin: 50% 100%;
   -ms-transform-origin: 50% 100%;
   -webkit-transform-origin: 50% 100%;
}
@keyframes pullUp {
   0% {
      transform: scaleY(0.1);
   }
   40% {
      transform: scaleY(1.02);
   }
   60% {
      transform: scaleY(0.98);
   }
   80% {
      transform: scaleY(1.01);
   }
   100% {
      transform: scaleY(0.98);
   }
   80% {
      transform: scaleY(1.01);
   }
   100% {
      transform: scaleY(1);
   }
}
@-webkit-keyframes pullUp {
   0% {
      -webkit-transform: scaleY(0.1);
   }
   40% {
      -webkit-transform: scaleY(1.02);
   }
   60% {
      -webkit-transform: scaleY(0.98);
   }
   80% {
      -webkit-transform: scaleY(1.01);
   }
   100% {
      -webkit-transform: scaleY(0.98);
   }
   80% {
      -webkit-transform: scaleY(1.01);
   }
   100% {
      -webkit-transform: scaleY(1);
   }
}
.pullDown {
   animation-name: pullDown;
   -webkit-animation-name: pullDown;
   animation-duration: 1.1s;
   -webkit-animation-duration: 1.1s;
   animation-timing-function: ease-out;
   -webkit-animation-timing-function: ease-out;
   transform-origin: 50% 0%;
   -ms-transform-origin: 50% 0%;
   -webkit-transform-origin: 50% 0%;
}
@keyframes pullDown {
   0% {
      transform: scaleY(0.1);
   }
   40% {
      transform: scaleY(1.02);
   }
   60% {
      transform: scaleY(0.98);
   }
   80% {
      transform: scaleY(1.01);
   }
   100% {
      transform: scaleY(0.98);
   }
   80% {
      transform: scaleY(1.01);
   }
   100% {
      transform: scaleY(1);
   }
}
@-webkit-keyframes pullDown {
   0% {
      -webkit-transform: scaleY(0.1);
   }
   40% {
      -webkit-transform: scaleY(1.02);
   }
   60% {
      -webkit-transform: scaleY(0.98);
   }
   80% {
      -webkit-transform: scaleY(1.01);
   }
   100% {
      -webkit-transform: scaleY(0.98);
   }
   80% {
      -webkit-transform: scaleY(1.01);
   }
   100% {
      -webkit-transform: scaleY(1);
   }
}

.bell {
   display: block;
   width: 40px;
   height: 40px;
   font-size: 40px;
   margin: 5px auto 0;
   color: #9e9e9e;
   -webkit-animation: ring 4s 0.7s ease-in-out infinite;
   -webkit-transform-origin: 50% 4px;
   -moz-animation: ring 4s 0.7s ease-in-out infinite;
   -moz-transform-origin: 50% 4px;
   animation: ring 4s 0.7s ease-in-out infinite;
   transform-origin: 50% 4px;
}
@-webkit-keyframes ring {
   0% {
      -webkit-transform: rotateZ(0);
   }
   1% {
      -webkit-transform: rotateZ(30deg);
   }
   3% {
      -webkit-transform: rotateZ(-28deg);
   }
   5% {
      -webkit-transform: rotateZ(34deg);
   }
   7% {
      -webkit-transform: rotateZ(-32deg);
   }
   9% {
      -webkit-transform: rotateZ(30deg);
   }
   11% {
      -webkit-transform: rotateZ(-28deg);
   }
   13% {
      -webkit-transform: rotateZ(26deg);
   }
   15% {
      -webkit-transform: rotateZ(-24deg);
   }
   17% {
      -webkit-transform: rotateZ(22deg);
   }
   19% {
      -webkit-transform: rotateZ(-20deg);
   }
   21% {
      -webkit-transform: rotateZ(18deg);
   }
   23% {
      -webkit-transform: rotateZ(-16deg);
   }
   25% {
      -webkit-transform: rotateZ(14deg);
   }
   27% {
      -webkit-transform: rotateZ(-12deg);
   }
   29% {
      -webkit-transform: rotateZ(10deg);
   }
   31% {
      -webkit-transform: rotateZ(-8deg);
   }
   33% {
      -webkit-transform: rotateZ(6deg);
   }
   35% {
      -webkit-transform: rotateZ(-4deg);
   }
   37% {
      -webkit-transform: rotateZ(2deg);
   }
   39% {
      -webkit-transform: rotateZ(-1deg);
   }
   41% {
      -webkit-transform: rotateZ(1deg);
   }
   43% {
      -webkit-transform: rotateZ(0);
   }
   100% {
      -webkit-transform: rotateZ(0);
   }
}
@-moz-keyframes ring {
   0% {
      -moz-transform: rotate(0);
   }
   1% {
      -moz-transform: rotate(30deg);
   }
   3% {
      -moz-transform: rotate(-28deg);
   }
   5% {
      -moz-transform: rotate(34deg);
   }
   7% {
      -moz-transform: rotate(-32deg);
   }
   9% {
      -moz-transform: rotate(30deg);
   }
   11% {
      -moz-transform: rotate(-28deg);
   }
   13% {
      -moz-transform: rotate(26deg);
   }
   15% {
      -moz-transform: rotate(-24deg);
   }
   17% {
      -moz-transform: rotate(22deg);
   }
   19% {
      -moz-transform: rotate(-20deg);
   }
   21% {
      -moz-transform: rotate(18deg);
   }
   23% {
      -moz-transform: rotate(-16deg);
   }
   25% {
      -moz-transform: rotate(14deg);
   }
   27% {
      -moz-transform: rotate(-12deg);
   }
   29% {
      -moz-transform: rotate(10deg);
   }
   31% {
      -moz-transform: rotate(-8deg);
   }
   33% {
      -moz-transform: rotate(6deg);
   }
   35% {
      -moz-transform: rotate(-4deg);
   }
   37% {
      -moz-transform: rotate(2deg);
   }
   39% {
      -moz-transform: rotate(-1deg);
   }
   41% {
      -moz-transform: rotate(1deg);
   }
   43% {
      -moz-transform: rotate(0);
   }
   100% {
      -moz-transform: rotate(0);
   }
}
@keyframes ring {
   0% {
      transform: rotate(0);
   }
   1% {
      transform: rotate(30deg);
   }
   3% {
      transform: rotate(-28deg);
   }
   5% {
      transform: rotate(34deg);
   }
   7% {
      transform: rotate(-32deg);
   }
   9% {
      transform: rotate(30deg);
   }
   11% {
      transform: rotate(-28deg);
   }
   13% {
      transform: rotate(26deg);
   }
   15% {
      transform: rotate(-24deg);
   }
   17% {
      transform: rotate(22deg);
   }
   19% {
      transform: rotate(-20deg);
   }
   21% {
      transform: rotate(18deg);
   }
   23% {
      transform: rotate(-16deg);
   }
   25% {
      transform: rotate(14deg);
   }
   27% {
      transform: rotate(-12deg);
   }
   29% {
      transform: rotate(10deg);
   }
   31% {
      transform: rotate(-8deg);
   }
   33% {
      transform: rotate(6deg);
   }
   35% {
      transform: rotate(-4deg);
   }
   37% {
      transform: rotate(2deg);
   }
   39% {
      transform: rotate(-1deg);
   }
   41% {
      transform: rotate(1deg);
   }
   43% {
      transform: rotate(0);
   }
   100% {
      transform: rotate(0);
   }
}

.theme-purple .btn-outline-primary:not([disabled]):not(.disabled):active,
.theme-purple .btn-outline-primary.active:not([disabled]):not(.disabled),
.theme-purple .show > .btn-outline-primary.dropdown-toggle,
.theme-cyan .btn-outline-primary:not([disabled]):not(.disabled):active,
.theme-cyan .btn-outline-primary.active:not([disabled]):not(.disabled),
.theme-cyan .show > .btn-outline-primary.dropdown-toggle,
.theme-green .btn-outline-primary:not([disabled]):not(.disabled):active,
.theme-green .btn-outline-primary.active:not([disabled]):not(.disabled),
.theme-green .show > .btn-outline-primary.dropdown-toggle,
.theme-red .btn-outline-primary:not([disabled]):not(.disabled):active,
.theme-red .btn-outline-primary.active:not([disabled]):not(.disabled),
.theme-red .show > .btn-outline-primary.dropdown-toggle,
.theme-orange .btn-outline-primary:not([disabled]):not(.disabled):active,
.theme-orange .btn-outline-primary.active:not([disabled]):not(.disabled),
.theme-orange .show > .btn-outline-primary.dropdown-toggle,
.theme-white .btn-outline-primary:not([disabled]):not(.disabled):active,
.theme-white .btn-outline-primary.active:not([disabled]):not(.disabled),
.theme-white .show > .btn-outline-primary.dropdown-toggle,
.theme-black .btn-outline-primary:not([disabled]):not(.disabled):active,
.theme-black .btn-outline-primary.active:not([disabled]):not(.disabled),
.theme-black .show > .btn-outline-primary.dropdown-toggle {
   color: #000;
   background-color: #6777ef;
   border-color: #6777ef;
}
.theme-white.sidebar-mini .main-sidebar .sidebar-menu > li ul.dropdown-menu li.active > a:hover {
   color: #6777ef;
}
.theme-white .bg-primary {
   background-color: #6777ef !important;
}
.theme-white .text-primary {
   color: #fff !important;
}
.theme-white a:hover {
   color: #6777ef;
}
.theme-white .btn-primary {
   background-color: var(--primary);
   border-color: transparent !important;
   color: #fff;
}
.theme-white .btn-primary:focus {
   background-color: #4f5ece !important;
}
.theme-white .btn-primary:focus:active {
   background-color: #4f5ece !important;
}
.theme-white .btn-primary:active {
   background-color: #4f5ece !important;
}
.theme-white .btn-primary:hover {
   background-color: #4f5ece !important;
   color: #fff;
}
.theme-white .btn-primary.disabled {
   background-color: #6777ef;
   border-color: #6777ef;
}
.theme-white .btn-primary:disabled {
   background-color: #6777ef;
   border-color: #6777ef;
}
.theme-white .btn-outline-primary {
   color: #6777ef;
   background-color: transparent;
   background-image: none;
   border-color: #6777ef;
}
.theme-white .btn-outline-primary:focus {
   background-color: #4f5ece !important;
   color: #fff;
}
.theme-white .btn-outline-primary:focus:active {
   background-color: #4f5ece !important;
   color: #fff;
}
.theme-white .btn-outline-primary:hover {
   color: #fff;
   background-color: #6777ef;
   border-color: #6777ef;
}
.theme-white .btn-outline-primary.disabled {
   color: #6777ef;
   background-color: transparent;
}
.theme-white .btn-outline-primary:disabled {
   color: #6777ef;
   background-color: transparent;
}
.theme-white .btn-link {
   font-weight: 400;
   color: #6777ef;
   background-color: transparent;
}
.theme-white .btn-link:hover {
   color: #6777ef;
}
.theme-white .dropdown-item.active {
   color: #fff;
   background-color: #e9e9e9;
}
.theme-white .nav-pills .nav-link.active {
   color: #fff;
   background-color: #6777ef;
}
.theme-white .nav-pills .show > .nav-link {
   color: #fff;
   background-color: #6777ef;
}
.theme-white .page-link {
   color: #6777ef;
   background-color: #fff;
   border: 1px solid #ededed;
}
.theme-white .page-link:focus {
   color: #6777ef;
}
.theme-white .page-link:hover {
   color: #6777ef;
   background-color: #eaeaea;
}
.theme-white .page-item .page-link {
   color: #6777ef;
}
.theme-white .page-item.active .page-link {
   color: #fff;
   background-color: #6777ef;
   border-color: #6777ef;
}
.theme-white .page-item.disabled .page-link {
   color: #6777ef;
}
.theme-white .progress-bar {
   color: #fff;
   background-color: #6777ef;
}
.theme-white .border-primary {
   border-color: #fff !important;
}
.theme-white .navbar {
   background-color: #fff;
   box-shadow: 15px 9px 25px 0 rgba(0, 0, 0, 0.1);
}
.theme-white .jqvmap-circle {
   background-color: #6777ef;
   border: 1px solid #000;
}
.theme-white .dropzone {
   border: 2px dashed #6777ef;
}
.theme-white .custom-control-input:checked ~ .custom-control-label::before {
   color: #fff;
   background-color: #6777ef;
}
.theme-white .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
   background-color: #6777ef;
}
.theme-white .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
   background-color: #6777ef;
}
.theme-white .custom-radio .custom-control-input:checked ~ .custom-control-label::before {
   background-color: #6777ef;
}
.theme-white .list-group-item.active {
   color: #fff;
   background-color: #6777ef;
   border-color: #6777ef;
}
.theme-white .navbar.active {
   background-color: #6777ef;
}
.theme-white .form-control:focus {
   border-color: #6777ef;
   box-shadow: 0px 2px 10px #6777ef22;
}
.theme-white .alert.alert-primary {
   background-color: #6777ef;
}
.theme-white .card.card-primary {
   border-top: 2px solid #6777ef;
}
.theme-white .fc button.fc-state-active {
   background-color: #6777ef;
   color: #fff;
}
.theme-white .weather ul li {
   border: 2px solid #6777ef;
   color: #6777ef;
}
.theme-white .card-chat .chat-content .chat-item.chat-right .chat-details .chat-text {
   background-color: #6777ef;
   color: #fff;
}
.theme-white .nav-tabs .nav-item .nav-link {
   color: #6777ef;
}
.theme-white .swal-button.swal-button--confirm {
   background-color: #6777ef;
}
.theme-white .btn-group .btn.active {
   background-color: #6777ef;
   color: #fff;
}
.theme-white .media .media-right {
   color: #6777ef;
}
.theme-white .selectric-items li.selected {
   background-color: #6777ef;
   color: #fff;
}
.theme-white .selectric-items li.highlighted {
   background-color: #6777ef;
   color: #fff;
}
.theme-white .accordion .accordion-header[aria-expanded="true"] {
   background-color: #6777ef;
   color: #fff;
}
.theme-white .bootstrap-tagsinput .tag {
   background-color: #6777ef;
}
.theme-white body:not(.sidebar-mini) .sidebar-style-2 .sidebar-menu > li.active > a:before {
   background-color: #6777ef;
}
.theme-white body.sidebar-mini .main-sidebar .sidebar-menu > li.active > a {
   box-shadow: 0 4px 8px #6777ef;
   background-color: #6777ef;
   color: #fff;
}
.theme-white body.sidebar-mini .main-sidebar .sidebar-menu > li ul.dropdown-menu li.active > a {
   color: #6777ef;
}
.theme-white .activities .activity:before {
   background-color: #6777ef;
}
.theme-white .settingSidebar .settingPanelToggle {
   background: #6777ef;
}
.theme-white .settingSidebar .settingPanelToggle i {
   color: #fff;
}
.theme-white .settingSidebar ul.choose-theme li.active div::after {
   color: #000;
}
.theme-white .sidebar-color .selectgroup-input:checked + .selectgroup-button {
   background-color: #6777ef;
}
.theme-white .navbar .nav-link .feather {
   color: #555556;
}
.theme-white .navbar .form-inline .form-control {
   background-color: #f0f3ff;
}
.theme-white .navbar .form-inline .form-control:focus {
   border-color: transparent;
}
.theme-white .navbar .form-inline .btn {
   background-color: #f0f3ff;
}
.theme-white .custom-switch-input:checked ~ .custom-switch-indicator {
   background: #6777ef;
}

.register_form .form-group {
   margin-bottom: 15px;
}

.register_form .form-group > label {
   font-size: 14px;
   margin-bottom: 0.2rem;
   font-family: "Poppins", sans-serif;
   font-weight: 500;
}

/* -------------- Add hotel page  ------------
*/

.card .card-body {
   padding-top: 20px;
   padding: 20px 25px;
}

.add_image_container .wrapper img {
   width: 100%;
   border-radius: 10px;
   overflow: hidden;
}

.wrapper {
   /* min-height: 100vh; */
   margin-block: 25px;
   margin-inline: 10px;
   display: flex;
   align-items: center;
   justify-content: center;
}
.upload {
   background-color: #fff;
   border-radius: 10px;
   box-shadow: 0px 2px 18px #ddd;
   width: 360px;
   /* min-height: 360px; */
   display: flex;
   align-items: center;
   justify-content: center;
   overflow: hidden;
}
.upload-info p {
   opacity: 0.8;
   font-weight: 600;
   margin-top: 10px;
   color: #222;
   font-size: 15px;
}
.upload-wrapper {
   text-align: center;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
}
.upload-img {
   max-height: 300px;
   overflow-y: scroll;
}
.upload-img::-webkit-scrollbar-track {
   box-shadow: inset 0 0 4px #ddd;
   border-radius: 6px;
}
.upload-img::-webkit-scrollbar-thumb {
   background-color: #0002;
}
.upload-img::-webkit-scrollbar {
   width: 5px;
}

.upload-area {
   padding: 10px 25px 5px;
   border: 2px dashed #ccc;
   border-radius: 8px;
   /* margin-top: 20px; */
   cursor: pointer;
   transition: var(--transition);
}
.upload-area:hover {
   background-color: rgba(176, 196, 246, 0.1);
}
.upload-area-img img {
   max-width: 80px;
}
.upload-area-text {
   font-weight: 600;
   color: #555;
}
.upload-area-text span {
   color: #6777ef;
}
.visually-hidden {
   visibility: hidden;
   opacity: 0;
}
.upload-img {
   width: 340px;
}
.uploaded-img {
   padding: 4px 0;
   position: relative;
}

/* remove image button */
.remove-btn {
   width: 25px;
   height: 25px;
   background-color: #fff;
   border: 1px solid #6777ef;
   border-radius: 50%;
   color: #6777ef;
   display: flex;
   align-items: center;
   justify-content: center;
   position: absolute;
   top: -5px;
   right: -8px;
   cursor: pointer;
   transition: 0.3s ease-in-out;
}
.remove-btn:hover {
   background-color: #6777ef;
   color: #fff;
}

/* ----------------- My Hotel Page View -------------- */
.table_view table tr th,
.table_view table tr td {
   border-left: 1px solid #eee;
   border-right: 1px solid #eee;
}

.table_view table tr :where(:first-of-type, :last-of-type, :nth-child(4)) {
   text-align: center;
}

/* ----------------- My Hotel Page  Detail View -------------- */

.card form .form_body {
   display: flex;
   flex-wrap: wrap;
   align-items: baseline;
   justify-content: space-between;
   padding: 15px 25px 5px;
}

.form_body .form-group2 {
   margin-bottom: 15px;
   width: calc(100% / 2 - 20px);
}


@media (max-width: 574px) {
    
    .main-content {
        padding-inline: 8px;
    }
   .form_body .form-group2 {
      margin-bottom: 15px;
      width: 100%;
   }

   .card .card-body {
      padding: 20px 15px;
   }

   .main-content {
      padding-top: 100px;
      padding-left: 10px;
      padding-right: 10px;
   }

   .addHotel_body .form_flex2 {
      width: 100%;
   }
}