/** These styles override whats in Bootstrap **/
/** Basic Elements **/
body {
  color: var(--text-dark);
  background-color: var(--text-light);
  font-family: var(--font-sans-serif);
}
kbd {
  color: var(--text-light);
  background-color: var(--text-dark);
}
pre, code, kbd, samp {
  font-family: var(--font-monospace);
}
caption {
  color: var(--secondary);
}
code {
  color: var(--pink);
}
a {
  color: var(--dark);
  text-decoration: none;
}
a:hover {
  color: var(--black);
}
hr {
  margin-top: var(--space-3);
  margin-bottom: var(--space-3);
}
/** END Basic Elements **/

/** Quote **/
.blockquote-footer {
  color: var(--secondary);
}
/** END Quote **/

/** Image **/
.img-thumbnail {
  background-color: var(--white);
  border: 1px solid var(--border);
}
/** END Image **/

/** Figure **/
.figure-caption {
  color: var(--secondary);
}
/** END Figure **/

/** Table **/
.table-primary, .table-secondary, .table-success, .table-info, .table-warning, .table-danger  {
  color: var(--text-dark);
}
.table-dark {
  color: var(--text-light);
}
.table th {
  border-top: none;
}
/** END Table **/

/** Tabs **/
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
  color: var(--dark);
  border-color: transparent;
  background-color: transparent;
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
  border: 1px solid transparent;
}
/** END Tabs **/

/** Form **/
.form-control, input[type="text"], input[type="email"], textarea {
  color: var(--control-text);
  background-color: var(--white);
  border: 1px solid var(--control-border);
  height: calc(var(--input-line-height) + var(--input-padding-y) * 2 + var(--input-height-border));
  padding: var(--input-padding-y) var(--input-padding-x);
  line-height: var(--line-height);
  font-size: var(--font-size);
}
.form-control-sm {
  height: calc(var(--input-line-height) + var(--input-padding-y) + var(--input-height-border));
  padding: var(--input-padding-y) calc(var(--input-padding-x) / 2);
  font-size: var(--font-size-sm);
  line-height: var(--line-height);
}
.form-control-lg {
  height: calc(var(--input-line-height) + calc(var(--input-padding-y) * 1.4) + var(--input-height-border));
  padding: calc(var(--input-padding-y) * 2) calc(var(--input-padding-y) * 3);
  font-size: var(--font-size-lg);
  line-height: var(--line-height);
}
.form-control:focus, input[type="text"]:focus, input[type="email"]:focus, textarea:focus {
  color: var(--control-text);
  background-color: var(--control-focus);
  border-color: var(--control-focus-border);
  box-shadow: none;
}
.form-control:disabled, .form-control[readonly] {
  background-color: var(--control-disabled);
}
.custom-select {
  border-color: var(--control-border);
  height: calc(var(--input-line-height) + calc(var(--input-padding-y) * 2) + var(--input-height-border));
}
.custom-select-sm {
  height: calc(var(--input-line-height) + var(--input-padding-y) + var(--input-height-border));
  padding-top: var(--input-padding-y);
  padding-bottom: var(--input-padding-y);
  padding-left: calc(var(--input-padding-x) / 2);
  font-size: var(--font-size-sm) }
.custom-select-lg {
  height: calc(var(--input-line-height) + calc(var(--input-padding-y) * 1.4) + var(--input-height-border));
  padding-top: calc(var(--input-padding-y) * 2);
  padding-bottom: calc(var(--input-padding-y) * 2);
  padding-left: calc(var(--input-padding-x) * 3);
  font-size: var(--font-size-lg); }
.custom-select:focus {
  border-color: var(--control-focus-border);
  box-shadow: var(--select-shadow)
}
.form-check-input {
  background-color: var(--text-light);
}
.form-check-input:focus {
  border-color: var(--control-focus-border);
}
.form-check-input:checked {
  background-color: var(--primary);
  border-color: var(--primary);
}
.form-check-input[type="checkbox"]:indeterminate {
  background-color: var(--primary);
  border-color: var(--primary);
}
.valid-feedback {
  color: var(--success);
}
.valid-tooltip {
  color: var(--text-light);
}
.was-validated .form-control:valid, .form-control.is-valid {
  border-color: var(--success);
}
.was-validated .form-control:valid:focus, .form-control.is-valid:focus {
  border-color: var(--success);
}
.was-validated .form-check-input:valid:checked, .form-check-input.is-valid:checked {
  background-color: var(--success);
}
.was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label {
  color: var(--success);
}
.invalid-feedback {
  color: var(--danger);
}
.invalid-tooltip {
  color: var(--text-light);
}
.was-validated .form-control:invalid, .form-control.is-invalid {
  border-color: var(--danger);
}
.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {
  border-color: var(--danger);
}
.was-validated .form-check-input:invalid, .form-check-input.is-invalid {
  border-color: var(--danger);
}
.was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked {
  background-color: var(--danger);
}
.was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label {
  color: var(--danger);
}
/** END Form **/

/** Button **/
.btn, .ThemeButton, input[type="submit"]:not(.btn) {
  color: var(--text-dark);
  padding: var(--input-padding-y) var(--input-padding-x);
  font-weight: bold;
}
.btn-group-sm > .btn, .btn-sm {
  padding: var(--input-padding-y-sm) var(--input-padding-x);
}
.btn:hover, .btn, .ThemeButton:hover {
  color: var(--text-dark);
}
.btn:focus {
  box-shadow: none;
}
.btn > a { 
  color: inherit;
}
.btn-group-lg > .btn,.btn-lg {
  padding: var(--input-btn-padding-y-lg) var(--input-btn-padding-x-lg);
}

/** btn-primary **/
.btn-primary, .btn-primary:disabled, .btn-primary.disabled {
  color: var(--text-light);
  background-color: var(--primary);
  border-color: var(--primary);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus {
  color: var(--text-light);
  background-color: var(--primary-hover);
  border-color: var(--primary-hover-border);
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
  background-color: var(--primary-hover-border);
  border-color: var(--primary-active-border);
}

.btn-outline-primary {
  color:var(--primary);
  background-color: transparent;
  border-color:var(--primary);
}
.btn-outline-primary:hover, .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
  color: var(--text-light);
  background-color:var(--primary);
  border-color:var(--primary);
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
  color:var(--primary);
}
/** END btn-primary **/

/** btn-secondary **/
.btn-secondary, .btn-secondary:disabled, .btn-secondary.disabled {
  color: var(--text-light);
  background-color: var(--secondary);
  border-color: var(--secondary);
}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary.focus  {
  color: var(--text-light);
  background-color: var(--secondary-hover);
  border-color: var(--secondary-hover-border);
}
.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
  color: var(--text-light);
  background-color: var(--secondary-hover-border);
  border-color: var (--secondary-active-border);
}

.btn-outline-secondary {
  color: var(--secondary);
  background-color: transparent;
  border-color: var(--secondary);
}
.btn-outline-secondary:hover, .btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
.show > .btn-outline-secondary.dropdown-toggle  {
  color: var(--text-light);
  background-color: var(--secondary);
  border-color: var(--secondary);
}
.btn-outline-secondary:disabled, .btn-outline-secondary.disabled {
  color: var(--secondary);
}
/** END btn-secondary **/

/** btn-success **/
.btn-success, .btn-success:disabled, .btn-success.disabled {
  color: var(--text-light);
  background-color: var(--success);
  border-color: var(--success);
}
.btn-success:hover, .btn-success:focus, .btn-success.focus {
  color: var(--text-light);
  background-color: var(--success-hover);
  border-color: var(--success-hover-border);
}
.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
  color: var(--text-light);
  background-color: var(--success-hover-border);
  border-color: var(--success-active-border);
}

.btn-outline-success {
  color: var(--success);
  background-color: transparent;
  border-color: var(--success);
}
.btn-outline-success:hover, .btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active,
.show > .btn-outline-success.dropdown-toggle  {
  color: var(--text-light);
  background-color: var(--success);
  border-color: var(--success);
}
.btn-outline-success:disabled, .btn-outline-success.disabled {
  color: var(--success);
}
/** END btn-success **/

/** btn-info **/
.btn-info, .btn-info:disabled, .btn-info.disabled {
  color: var(--text-light);
  background-color: var(--info);
  border-color: var(--info);
}
.btn-info:hover, .btn-info:focus, .btn-info.focus {
  color: var(--text-light);
  background-color: var(--info-hover);
  border-color: var(--info-hover-border);
}
.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active,
.show > .btn-info.dropdown-toggle {
  color: var(--text-light);
  background-color: var(--info-hover-border);
  border-color: var(--info-active-border);
}

.btn-outline-info {
  color: var(--info);
  background-color: transparent;
  border-color: var(--info);
}
.btn-outline-info:hover, .btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active,
.show > .btn-outline-info.dropdown-toggle  {
  color: var(--text-light);
  background-color: var(--info);
  border-color: var(--info);
}
.btn-outline-info:disabled, .btn-outline-info.disabled {
  color: var(--info);
}
/** END btn-info **/

/** btn-warning **/
.btn-warning, .btn-warning:disabled, .btn-warning.disabled {
  color: var(--text-dark);
  background-color: var(--warning);
  border-color: var(--warning);
}
.btn-warning:hover, .btn-warning:focus, .btn-warning.focus {
  color: var(--text-dark);
  background-color: var(--warning-hover);
  border-color: var(--warning-hover-border);
}
.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active,
.show > .btn-warning.dropdown-toggle {
  color: var(--text-dark);
  background-color: var(--warning-hover-border);
  border-color: var(--warning-active-border);
}
.btn-outline-warning {
  color: var(--warning);
  background-color: transparent;
  border-color: var(--warning);
}
.btn-outline-warning:hover, .btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active,
.show > .btn-outline-warning.dropdown-toggle {
  color: var(--text-dark);
  background-color: var(--warning);
  border-color: var(--warning);
}
.btn-outline-warning:disabled, .btn-outline-warning.disabled {
  color: var(--warning);
}
/** END btn-warning **/

/** btn-danger **/
.btn-danger, .btn-danger:disabled, .btn-danger.disabled {
  color: var(--text-light);
  background-color: var(--danger);
  border-color: var(--danger);
}
.btn-danger:hover, .btn-danger:focus, .btn-danger.focus {
  color: var(--text-light);
  background-color: var(--danger-hover);
  border-color: var(--danger-hover-border);
}
.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle {
  color: var(--text-light);
  background-color: var(--danger-hover-border);
  border-color: var(--danger-active-border);
}

.btn-outline-danger {
  color: var(--danger);
  background-color: transparent;
  border-color: var(--danger);
}
.btn-outline-danger:hover, .btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active,
.show > .btn-outline-danger.dropdown-toggle  {
  color: var(--text-light);
  background-color: var(--danger);
  border-color: var(--danger);
}
.btn-outline-danger:disabled, .btn-outline-danger.disabled {
  color: var(--danger);
}
/** END btn-danger **/

/** btn-light **/
.btn-light, .btn-light:disabled, .btn-light.disabled {
  color: var(--text-dark);
  background-color: var(--light);
  border-color: var(--light);
}
.btn-light:hover, .btn-light:focus, .btn-light.focus {
  color: var(--text-dark);
  background-color: var(--light-hover);
  border-color: var(--light-hover-border);
}
.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active,
.show > .btn-light.dropdown-toggle {
  color: var(--text-dark);
  background-color: var(--light-hover-border);
  border-color: var(--light-active-border);
}

.btn-outline-light {
  color: var(--light);
  background-color: transparent;
  border-color: var(--light);
}
.btn-outline-light:hover, .btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active,
.show > .btn-outline-light.dropdown-toggle {
  color: var(--text-dark);
  background-color: var(--light);
  border-color: var(--light);
}
.btn-outline-light:disabled, .btn-outline-light.disabled {
  color: var(--light);
}
/** END btn-light **/

/** btn-white **/
.btn-white, .btn-white:disabled, .btn-white.disabled {
  color: var(--text-dark);
  background-color: var(--white);
  border-color: var(--white);
}
.btn-white:hover, .btn-white:focus, .btn-white.focus {
  color: var(--text-dark);
  background-color: var(--white);
  border-color: var(--white);
}
.btn-white:not(:disabled):not(.disabled):active, .btn-white:not(:disabled):not(.disabled).active,
.show > .btn-white.dropdown-toggle {
  color: var(--text-dark);
  background-color: var(--white);
  border-color: var(--white);
}
/** END btn-white **/

/** btn-dark **/
.btn-dark, .btn-dark:disabled, .btn-dark.disabled, .ThemeButton:not(.btn):not(.as-link), input[type="submit"]:not(.btn):not(.as-link) {
  color: var(--text-light);
  background-color: var(--dark);
  border-color: var(--dark);
}
.btn-dark:hover, .btn-dark:focus, .btn-dark.focus, .ThemeButton:not(.btn):not(.as-link):hover, input[type="submit"]:not(.btn):not(.as-link):hover {
  color: var(--text-light);
  background-color: var(--dark-hover);
  border-color: var(--dark-hover);
}
.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active,
.show > .btn-dark.dropdown-toggle {
  color: var(--text-light);
  background-color: var(--dark-hover-border);
  border-color: var(--dark-active-border);
}

.btn-outline-dark {
  color: var(--dark);
  background-color: transparent;
  border-color: var(--dark);
}
.btn-outline-dark:hover {
  color: var(--text-light);
  background-color: var(--dark);
  border-color: var(--dark);
}
.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active,
.show > .btn-outline-dark.dropdown-toggle  {
  color: var(--text-light);
  background-color: var(--dark);
  border-color: var(--dark);
}
.btn-outline-dark:disabled, .btn-outline-dark.disabled {
  color: var(--dark);
}
/** END btn-dark **/
/** END Button **/

/** Badge **/
.badge-primary { color: var(--white); background-color: var(--primary); }
.badge-secondary { color: var(--white); background-color: var(--secondary); }
.badge-success { color: var(--white); background-color: var(--success); }
.badge-danger { color: var(--white); background-color: var(--danger); }
.badge-warning { color: var(--text-dark); background-color: var(--warning); }
.badge-info { color: var(--white); background-color: var(--info); }
.badge-light { color: var(--text-dark); background-color: var(--light); }
.badge-dark { color: var(--white);  background-color: var(--dark); }
/** END Badge **/

/** Dropdown **/
.dropdown-menu {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
  border: none;
  color: var(--secondary);
  margin: 0;
}
.dropdown-item:focus, .dropdown-item:hover, .dropdown-item:active  {
  background-color: var(--dropdown-hover);
}
/** END Dropdown **/

/** Input Group **/
.input-group-text {
  color: var(--control-text);
  background-color: var(--control-disabled);
  border: 1px solid var(--control-border);
}
.input-group-sm > .input-group-prepend > .btn,.input-group-sm > .input-group-append > .btn {
  height: var(--input-height-sm);
}
.input-group-sm>.custom-select, .input-group-sm>.form-control:not(textarea) {
  height: var(--input-height-sm);
}
/** END Input Group **/

/** Navigation **/
.breadcrumb {
  background-color: unset;
  padding: 0;
}
/** END Navigation **/

/** Card **/
.card {
  border-color: var(--card-border);
}
.card-header, .card-footer {
  background-color: var(--card-header-bg);
  border-bottom-color: var(--card-border);
}
.card, .panel {
  box-shadow: 0 0.21429rem 0.64286rem rgba(52, 58, 64, 0.2); 
}
/** END Card **/

/** Modal **/
.modal-header {
  border-bottom: none;
}
.modal-footer {
  border-top: none;
}
/** END Modal **/

/** Progress **/
.progress-bar {
  background-color: var(--success);
}
/** END Progress **/

/** Background **/
.bg-primary     { background-color: var(--primary) !important; }
.bg-secondary   { background-color: var(--secondary) !important; }
.bg-success     { background-color: var(--success) !important; }
.bg-info        { background-color: var(--info) !important; }
.bg-warning     { background-color: var(--warning) !important; }
.bg-danger      { background-color: var(--danger) !important; }
.bg-light       { background-color: var(--light) !important; }
.bg-dark        { background-color: var(--dark) !important; }
.bg-body        { background-color: var(--text-light) !important; }
.bg-white       { background-color: var(--white) !important; }
.bg-gray        { background-color: var(--border); }
.bg-accent      { background-color: var(--accent); }
.bg-muted       { background-color: var(--muted) !important; }
.bg-transparent { background-color: transparent !important; }
.bg-gradient    { background-image: var(--gradient) !important; }
/** END Background **/

/** Border **/
.border-primary   { border-color: var(--primary) !important; }
.border-secondary { border-color: var(--secondary) !important; }
.border-success   { border-color: var(--success) !important; }
.border-info      { border-color: var(--info) !important; }
.border-warning   { border-color: var(--warning) !important; }
.border-danger    { border-color: var(--danger) !important; }
.border-light     { border-color: var(--light) !important; }
.border-dark      { border-color: var(--dark) !important; }
.border-white     { border-color: var(--text-light) !important; }
.border-gray      { border-color: #dee2e6; }
.border-form      { border-color: var(--control-border) !important; }
/** END Border **/

/** Display **/
.clearfix {
  clear: both;
}
/** END Display **/

/** Text **/
.text-primary {
  color: var(--primary) !important;
}
.text-black {
  color: var(--black);
}
a.text-primary:hover, a.text-primary:focus {
  color: var(--primary-dark) !important;
}
.text-muted {
  color: var(--muted) !important;
}
/** END Text **/

/** Align **/
.align-sub {
  vertical-align: sub;
}
/** END Align **/

/** Container **/
@media (min-width: 1400px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1300px;
  }
}
@media (min-width: 1700px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1500px; } }
/** END Container **/

/** Margin **/
.m-0 { margin: 0 !important; }
.mt-0, .my-0 { margin-top: 0 !important; }
.mr-0, .mx-0 { margin-right: 0 !important; }
.mb-0, .my-0 { margin-bottom: 0 !important; }
.ml-0, .mx-0 { margin-left: 0 !important; }

.m-1 { margin: var(--space-1) !important; }
.mt-1, .my-1 { margin-top: var(--space-1) !important; }
.mr-1, .mx-1 { margin-right: var(--space-1)!important; }
.mb-1, .my-1 { margin-bottom: var(--space-1) !important; }
.ml-1, .mx-1 { margin-left: var(--space-1) !important; }

.-m-1 { margin: calc(-1 * var(--space-1)) !important; }
.-mt-1, .-my-1 { margin-top: calc(-1 * var(--space-1)) !important; }
.-mr-1, .-mx-1 { margin-right: calc(-1 * var(--space-1)) !important; }
.-mb-1, .-my-1 { margin-bottom: calc(-1 * var(--space-1)) !important; }
.-ml-1, .-mx-1 { margin-left: calc(-1 * var(--space-1)) !important; }

.m-2 { margin: var(--space-2) !important; }
.mt-2, .my-2 { margin-top: var(--space-2) !important; }
.mr-2, .mx-2 { margin-right: var(--space-2) !important; }
.mb-2, .my-2 { margin-bottom: var(--space-2) !important; }
.ml-2, .mx-2 { margin-left: var(--space-2) !important;}

.-m-2 { margin: calc(-1 * var(--space-2)) !important; }
.-mt-2, .-my-2 { margin-top: calc(-1 * var(--space-2)) !important; }
.-mr-2, .-mx-2 { margin-right: calc(-1 * var(--space-2)) !important; }
.-mb-2, .-my-2 { margin-bottom: calc(-1 * var(--space-2)) !important; }
.-ml-2, .-mx-2 { margin-left: calc(-1 * var(--space-2)) !important; }

.m-3 { margin: var(--space-3) !important; }
.mt-3, .my-3 { margin-top: var(--space-3) !important; }
.mr-3, .mx-3 { margin-right: var(--space-3) !important; }
.mb-3, .my-3 { margin-bottom: var(--space-3) !important; }
.ml-3, .mx-3 { margin-left: var(--space-3) !important; }

.-m-3 { margin: calc(-1 * var(--space-3)) !important; }
.-mt-3, .-my-3 { margin-top: calc(-1 * var(--space-3)) !important; }
.-mr-3, .-mx-3 { margin-right: calc(-1 * var(--space-3))!important; }
.-mb-3, .-my-3 { margin-bottom: calc(-1 * var(--space-3)) !important; }
.-ml-3, .-mx-3 { margin-left: calc(-1 * var(--space-3)) !important; }

.m-4 { margin: var(--space-4) !important; }
.mt-4, .my-4 { margin-top: var(--space-4) !important; }
.mr-4, .mx-4 { margin-right: var(--space-4) !important; }
.mb-4, .my-4 { margin-bottom: var(--space-4) !important; }
.ml-4, .mx-4 { margin-left: var(--space-4) !important; }

.-m-4 { margin: calc(-1 * var(--space-4)) !important; }
.-mt-4, .-my-4 { margin-top: calc(-1 * var(--space-4)) !important; }
.-mr-4, .-mx-4 { margin-right: calc(-1 * var(--space-4)) !important; }
.-mb-4, .-my-4 { margin-bottom: calc(-1 * var(--space-4)) !important; }
.-ml-4, .-mx-4 { margin-left: calc(-1 * var(--space-4)) !important; }

.m-5 { margin: var(--space-5) !important; }
.mt-5, .my-5 { margin-top: var(--space-5) !important; }
.mr-5, .mx-5 { margin-right: var(--space-5) !important; }
.mb-5, .my-5 { margin-bottom: var(--space-5) !important; }
.ml-5, .mx-5 { margin-left: var(--space-5) !important; }

.-m-5 { margin: calc(-1 * var(--space-5)) !important; }
.-mt-5, .-my-5 { margin-top: calc(-1 * var(--space-5)) !important; }
.-mr-5, .-mx-5 { margin-right: calc(-1 * var(--space-5)) !important; }
.-mb-5, .-my-5 { margin-bottom: calc(-1 * var(--space-5)) !important; }
.-ml-5, .-mx-5 { margin-left: calc(-1 * var(--space-5)) !important; }

.m-6 { margin: var(--space-6) !important; }
.mt-6, .my-6{ margin-top: var(--space-6) !important; }
.mr-6 .mx-6{ margin-right: var(--space-6) !important; }
.mb-6 .my-6{ margin-bottom: var(--space-6) !important; }
.ml-6 .mx-6{ margin-left: var(--space-6) !important; }
/** END Margin **/

/** Padding **/

.p-1 { padding: var(--space-1) !important; }
.pt-1, .py-1 { padding-top: var(--space-1) !important; }
.pr-1, .px-1 { padding-right: var(--space-1) !important; }
.pb-1, .py-1 { padding-bottom: var(--space-1) !important; }
.pl-1, .px-1 { padding-left: var(--space-1) !important; }

.p-2 { padding: var(--space-2) !important; }
.pt-2, .py-2 { padding-top: var(--space-2) !important; }
.pr-2, .px-2 { padding-right: var(--space-2) !important; }
.pb-2, .py-2 { padding-bottom: var(--space-2) !important; }
.pl-2, .px-2 { padding-left: var(--space-2) !important; }

.p-3 { padding: var(--space-3) !important; }
.pt-3, .py-3 { padding-top: var(--space-3) !important; }
.pr-3, .px-3 { padding-right: var(--space-3) !important; }
.pb-3, .py-3 { padding-bottom: var(--space-3) !important; }
.pl-3, .px-3 { padding-left: var(--space-3) !important; }

.p-4 { padding: var(--space-4) !important; }
.pt-4, .py-4 { padding-top: var(--space-4) !important; }
.pr-4, .px-4 { padding-right: var(--space-4) !important; }
.pb-4, .py-4 { padding-bottom: var(--space-4) !important; }
.pl-4, .px-4 { padding-left: var(--space-4) !important; }

.p-5 { padding: var(--space-5) !important; }
.pt-5, .py-5 { padding-top: var(--space-5) !important; }
.pr-5, .px-5 { padding-right: var(--space-5) !important; }
.pb-5, .py-5 { padding-bottom: var(--space-5) !important; }
.pl-5, .px-5 { padding-left: var(--space-5) !important; }

.p-6 { padding: var(--space-6) !important; }
.pt-6, .py-6 { padding-top: var(--space-6) !important; }
.pr-6, .px-6 { padding-right: var(--space-6) !important; }
.pb-6, .py-6 { padding-bottom: var(--space-6) !important; }
.pl-6, .px-6 { padding-left: var(--space-6) !important; }

@media (min-width: 576px) {
  .p-sm-0 { padding:0 !important; }
  .pt-sm-0, .py-sm-0 { padding-top:0 !important; }
  .pr-sm-0, .px-sm-0 { padding-right:0 !important; }
  .pb-sm-0, .py-sm-0 { padding-bottom:0 !important; }
  .pl-sm-0, .px-sm-0 { padding-left:0 !important; }

  .p-sm-1 { padding: var(--space-1) !important; }
  .pt-sm-1, .py-sm-1 { padding-top: var(--space-1) !important; }
  .pr-sm-1, .px-sm-1 { padding-right: var(--space-1) !important; }
  .pb-sm-1, .py-sm-1 { padding-bottom: var(--space-1) !important; }
  .pl-sm-1, .px-sm-1 { padding-left: var(--space-1) !important; }

  .p-sm-2 { padding: var(--space-2) !important; }
  .pt-sm-2, .py-sm-2 { padding-top: var(--space-2) !important; }
  .pr-sm-2, .px-sm-2 { padding-right: var(--space-2) !important; }
  .pb-sm-2, .py-sm-2 { padding-bottom: var(--space-2) !important; }
  .pl-sm-2, .px-sm-2 { padding-left: var(--space-2) !important; }

  .p-sm-3 { padding: var(--space-3) !important; }
  .pt-sm-3, .py-sm-3 { padding-top: var(--space-3) !important; }
  .pr-sm-3, .px-sm-3 { padding-right: var(--space-3) !important; }
  .pb-sm-3, .py-sm-3 { padding-bottom: var(--space-3) !important; }
  .pl-sm-3, .px-sm-3 { padding-left: var(--space-3) !important; }

  .p-sm-4 { padding: var(--space-4) !important; }
  .pt-sm-4, .py-sm-4 { padding-top: var(--space-4) !important; }
  .pr-sm-4, .px-sm-4 { padding-right: var(--space-4) !important; }
  .pb-sm-4, .py-sm-4 { padding-bottom: var(--space-4) !important; }
  .pl-sm-4, .px-sm-4 { padding-left: var(--space-4) !important; }

  .p-sm-5 { padding: var(--space-5) !important; }
  .pt-sm-5, .py-sm-5 { padding-top: var(--space-5) !important; }
  .pr-sm-5, .px-sm-5 { padding-right: var(--space-5) !important; }
  .pb-sm-5, .py-sm-5 { padding-bottom: var(--space-5) !important; }
  .pl-sm-5, .px-sm-5 { padding-left: var(--space-5) !important; }
}

@media (min-width: 768px ) {
  .p-md-0 { padding:0 !important; }
  .pt-md-0, .py-md-0 { padding-top:0 !important; }
  .pr-md-0, .px-md-0 { padding-right:0 !important; }
  .pb-md-0, .py-md-0 { padding-bottom:0 !important; }
  .pl-md-0, .px-md-0 { padding-left:0 !important; }

  .p-md-1 { padding: var(--space-1) !important; }
  .pt-md-1, .py-md-1 { padding-top: var(--space-1) !important; }
  .pr-md-1, .px-md-1 { padding-right: var(--space-1) !important; }
  .pb-md-1, .py-md-1 { padding-bottom: var(--space-1) !important; }
  .pl-md-1, .px-md-1 { padding-left: var(--space-1) !important; }

  .p-md-2 { padding: var(--space-2) !important; }
  .pt-md-2, .py-md-2 { padding-top: var(--space-2) !important; }
  .pr-md-2, .px-md-2 { padding-right: var(--space-2) !important; }
  .pb-md-2, .py-md-2 { padding-bottom: var(--space-2) !important; }
  .pl-md-2, .px-md-2 { padding-left: var(--space-2) !important; }

  .p-md-3 { padding: var(--space-3) !important; }
  .pt-md-3, .py-md-3 { padding-top: var(--space-3) !important; }
  .pr-md-3, .px-md-3 { padding-right: var(--space-3) !important; }
  .pb-md-3, .py-md-3 { padding-bottom: var(--space-3) !important; }
  .pl-md-3, .px-md-3 { padding-left: var(--space-3) !important; }

  .p-md-4 { padding: var(--space-4) !important; }
  .pt-md-4, .py-md-4 { padding-top: var(--space-4) !important; }
  .pr-md-4, .px-md-4 { padding-right: var(--space-4) !important; }
  .pb-md-4, .py-md-4 { padding-bottom: var(--space-4) !important; }
  .pl-md-4, .px-md-4 { padding-left: var(--space-4) !important; }

  .p-md-5 { padding: var(--space-5) !important; }
  .pt-md-5, .py-md-5 { padding-top: var(--space-5) !important; }
  .pr-md-5, .px-md-5 { padding-right: var(--space-5) !important; }
  .pb-md-5, .py-md-5 { padding-bottom: var(--space-5) !important; }
  .pl-md-5, .px-md-5 { padding-left: var(--space-5) !important; }

}

@media (min-width: 992px) {
  .p-lg-0 { padding:0 !important; }
  .pt-lg-0, .py-lg-0 { padding-top:0 !important; }
  .pr-lg-0, .px-lg-0 { padding-right:0 !important; }
  .pb-lg-0, .py-lg-0 { padding-bottom:0 !important; }
  .pl-lg-0, .px-lg-0 { padding-left:0 !important; }

  .p-lg-1 { padding: var(--space-1) !important; }
  .pt-lg-1, .py-lg-1 { padding-top: var(--space-1) !important; }
  .pr-lg-1, .px-lg-1 { padding-right: var(--space-1) !important; }
  .pb-lg-1, .py-lg-1 { padding-bottom: var(--space-1) !important; }
  .pl-lg-1, .px-lg-1 { padding-left: var(--space-1) !important; }

  .p-lg-2 { padding: var(--space-2) !important; }
  .pt-lg-2, .py-lg-2 { padding-top: var(--space-2) !important; }
  .pr-lg-2, .px-lg-2 { padding-right: var(--space-2) !important; }
  .pb-lg-2, .py-lg-2 { padding-bottom: var(--space-2) !important; }
  .pl-lg-2, .px-lg-2 { padding-left: var(--space-2) !important; }

  .p-lg-3 { padding: var(--space-3) !important; }
  .pt-lg-3, .py-lg-3 { padding-top: var(--space-3) !important; }
  .pr-lg-3, .px-lg-3 { padding-right: var(--space-3) !important; }
  .pb-lg-3, .py-lg-3 { padding-bottom: var(--space-3) !important; }
  .pl-lg-3, .px-lg-3 { padding-left: var(--space-3) !important; }

  .p-lg-4 { padding: var(--space-4) !important; }
  .pt-lg-4, .py-lg-4 { padding-top: var(--space-4) !important; }
  .pr-lg-4, .px-lg-4 { padding-right: var(--space-4) !important; }
  .pb-lg-4, .py-lg-4 { padding-bottom: var(--space-4) !important; }
  .pl-lg-4, .px-lg-4 { padding-left: var(--space-4) !important; }

  .p-lg-5 { padding: var(--space-5) !important; }
  .pt-lg-5, .py-lg-5 { padding-top: var(--space-5) !important; }
  .pr-lg-5, .px-lg-5 { padding-right: var(--space-5) !important; }
  .pb-lg-5, .py-lg-5 { padding-bottom: var(--space-5) !important; }
  .pl-lg-5, .px-lg-5 { padding-left: var(--space-5) !important; }

}

@media (min-width: 1200px) { 
  .p-xl-0 { padding:0 !important; }
  .pt-xl-0, .py-xl-0 { padding-top:0 !important; }
  .pr-xl-0, .px-xl-0 { padding-right:0 !important; }
  .pb-xl-0, .py-xl-0 { padding-bottom:0 !important; }
  .pl-xl-0, .px-xl-0 { padding-left:0 !important; }

  .p-xl-1 { padding: var(--space-1) !important; }
  .pt-xl-1, .py-xl-1 { padding-top: var(--space-1) !important; }
  .pr-xl-1, .px-xl-1 { padding-right: var(--space-1) !important; }
  .pb-xl-1, .py-xl-1 { padding-bottom: var(--space-1) !important; }
  .pl-xl-1, .px-xl-1 { padding-left: var(--space-1) !important; }

  .p-xl-2 { padding: var(--space-2) !important; }
  .pt-xl-2, .py-xl-2 { padding-top: var(--space-2) !important; }
  .pr-xl-2, .px-xl-2 { padding-right: var(--space-2) !important; }
  .pb-xl-2, .py-xl-2 { padding-bottom: var(--space-2) !important; }
  .pl-xl-2, .px-xl-2 { padding-left: var(--space-2) !important; }

  .p-xl-3 { padding: var(--space-3) !important; }
  .pt-xl-3, .py-xl-3 { padding-top: var(--space-3) !important; }
  .pr-xl-3, .px-xl-3 { padding-right: var(--space-3) !important; }
  .pb-xl-3, .py-xl-3 { padding-bottom: var(--space-3) !important; }
  .pl-xl-3, .px-xl-3 { padding-left: var(--space-3) !important; }

  .p-xl-4 { padding: var(--space-4) !important; }
  .pt-xl-4, .py-xl-4 { padding-top: var(--space-4) !important; }
  .pr-xl-4, .px-xl-4 { padding-right: var(--space-4) !important; }
  .pb-xl-4, .py-xl-4 { padding-bottom: var(--space-4) !important; }
  .pl-xl-4, .px-xl-4 { padding-left: var(--space-4) !important; }

  .p-xl-5 { padding: var(--space-5) !important; }
  .pt-xl-5, .py-xl-5 { padding-top: var(--space-5) !important; }
  .pr-xl-5, .px-xl-5 { padding-right: var(--space-5) !important; }
  .pb-xl-5, .py-xl-5 { padding-bottom: var(--space-5) !important; }
  .pl-xl-5, .px-xl-5 { padding-left: var(--space-5) !important; }
}

@media (min-width: 1700px) {
  .p-xxl-0 { padding:0 !important; }
  .pt-xxl-0, .py-xxl-0 { padding-top:0 !important; }
  .pr-xxl-0, .px-xxl-0 { padding-right:0 !important; }
  .pb-xxl-0, .py-xxl-0 { padding-bottom:0 !important; }
  .pl-xxl-0, .px-xxl-0 { padding-left:0 !important; }

  .p-xxl-1 { padding: var(--space-1) !important; }
  .pt-xxl-1, .py-xxl-1 { padding-top: var(--space-1) !important; }
  .pr-xxl-1, .px-xxl-1 { padding-right: var(--space-1) !important; }
  .pb-xxl-1, .py-xxl-1 { padding-bottom: var(--space-1) !important; }
  .pl-xxl-1, .px-xxl-1 { padding-left: var(--space-1) !important; }

  .p-xxl-2 { padding: var(--space-2) !important; }
  .pt-xxl-2, .py-xxl-2 { padding-top: var(--space-2) !important; }
  .pr-xxl-2, .px-xxl-2 { padding-right: var(--space-2) !important; }
  .pb-xxl-2, .py-xxl-2 { padding-bottom: var(--space-2) !important; }
  .pl-xxl-2, .px-xxl-2 { padding-left: var(--space-2) !important; }

  .p-xxl-3 { padding: var(--space-3) !important; }
  .pt-xxl-3, .py-xxl-3 { padding-top: var(--space-3) !important; }
  .pr-xxl-3, .px-xxl-3 { padding-right: var(--space-3) !important; }
  .pb-xxl-3, .py-xxl-3 { padding-bottom: var(--space-2) !important; }
  .pl-xxl-3, .px-xxl-3 { padding-left: var(--space-2) !important; }

  .p-xxl-4 { padding: var(--space-4) !important; }
  .pt-xxl-4, .py-xxl-4 { padding-top: var(--space-4) !important; }
  .pr-xxl-4, .px-xxl-4 { padding-right: var(--space-4) !important; }
  .pb-xxl-4, .py-xxl-4 { padding-bottom: var(--space-4) !important; }
  .pl-xxl-4, .px-xxl-4 { padding-left: var(--space-4) !important; }

  .p-xxl-5 { padding: var(--space-5) !important; }
  .pt-xxl-5, .py-xxl-5 { padding-top: var(--space-5) !important; }
  .pr-xxl-5, .px-xxl-5 { padding-right: var(--space-5) !important; }
  .pb-xxl-5, .py-xxl-5 { padding-bottom: var(--space-5) !important; }
  .pl-xxl-5, .px-xxl-5 { padding-left: var(--space-5) !important; }

  .col-xxl-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-xxl-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-xxl-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-xxl-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-xxl-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-xxl-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-xxl-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-xxl-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-xxl-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-xxl-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-xxl-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-xxl-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}
/** END Padding **/

/** Previous Bootstrap **/
.well {
  border-radius: 0;
  border: none;
  box-shadow: none; 
}
.panel-heading:empty {
  display: none; 
}
.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 4px;
}
.panel-default {
  border-color: #ddd;
}
.panel-heading {
  padding: 10px 15px;
  background-color: var(--light);
  border-bottom: var(--border-width) solid var(--card-border);
  border-radius: calc(0.25rem - var(--border-width)) calc(0.25rem - var(--border-width)) 0 0;
}
.panel-body {
  padding: 15px;
}
.panel-default.panel-heading {
  color: #333;
  background-color: #f5f5f5;
  border-color: #ddd;
}
/** END Previous Bootstrap **/