:root {
    --bs-body-color: #0a0a0a;
    --bs-body-bg: #f8f9fa;
    --bs-primary: #227BAF;
    /* --bs-primary-rgb: var(--bs-primary); */
    /* --bs-primary: #0098ca; */
    /* --bs-heading-color: var(--bs-primary); */
    --bs-secondary: #84bd00;
    --bs-link-color-rgb: var(--bs-primary);
    /* --bs-border-radius: 0; */
    --bs-border-color: #adb5bd;
    --bs-icon-color: #afb1c1;
}

.border {
    --bs-border-color: #ced4da;
}

.btn-primary {
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
}

    .btn-primary:hover {
        --bs-btn-hover-bg: #03607f;
    }

.btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    background-color: var(--bs-body-bg);
}

    .btn-outline-primary:hover {
        background-color: var(--bs-primary);
        border-color: var(--bs-primary);
    }

.btn-lg {
    --bs-btn-padding-y: 1.25rem;
    --bs-btn-padding-x: 3.75rem;
    --bs-btn-font-size: 1.25rem;
}


.breadcrumb {
    --bs-breadcrumb-item-padding-x: 1rem;
    --bs-breadcrumb-margin-bottom: 0;
}

    .breadcrumb a {
        text-decoration: none;
        white-space: nowrap !important;
    }

.breadcrumb-item + .breadcrumb-item:before {
    content: "";
    width: 10px;
    height: 10px;
    background: no-repeat url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" fill="currentColor" class="bi bi-chevron-compact-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M6.776 1.553a.5.5 0 0 1 .671.223l3 6a.5.5 0 0 1 0 .448l-3 6a.5.5 0 1 1-.894-.448L9.44 8 6.553 2.224a.5.5 0 0 1 .223-.671"/></svg>');
    transform: translateY(8px);
    padding-right: 1.5rem;
}

.card {
    --bs-card-bg: #fff;
    --bs-card-border-radius: 0;
}

.dropdown-toggle:after {
    border: 0;
    vertical-align: 0;
    width: 10px;
    height: 10px;
    background: no-repeat url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" fill="%23afb2b6" class="bi bi-chevron-down" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708"/></svg>');
}

.dropdown-menu {
    --bs-dropdown-bg: #fff;
}

@media only screen and (min-width: 992px) {
    .offcanvas-header {
        display: flex !important;
        justify-content: center;
    }

        .offcanvas-header .btn-close {
            display: none;
        }
}


.nav {
    --bs-nav-link-color: var(--bs-gray-600);
}

.table {
    --bs-table-bg: transparent;
}

.cursor-pointer {
    cursor: pointer;
}

.max-login {
    max-width: 400px;
}

.icon-button {
    width: 50px;
    height: 50px;
    padding: 0;
    border: 1px solid var(--bs-gray-400);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* @media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
} */

html,
body {
    max-width: 100vw;
    overflow-x: hidden;
    height: 100%;
}



.bg-logo {
    position: relative;
    overflow: hidden;
}


    .bg-logo::before,
    .bg-logo::after {
        content: "";
        background-image: url('../img/bg-logo.png');
        position: absolute;
        display: block;
        background-repeat: no-repeat;
        background-size: cover;
        z-index: -1;
    }

    .bg-logo::before {
        width: 1002px;
        height: 740px;
        left: 0;
        top: 0;
        transform: translate(-40%, -50%)
    }

    .bg-logo::after {
        width: 1500px;
        height: 1000px;
        right: 0;
        bottom: 0;
        transform: translate(35%, 40%);
    }

.max-text {
    max-width: 860px;
}

.mobile-screenshot {
    max-width: 400px;
    position: relative;
}

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

/*

body {
  color: var(--foreground);
  background: var(--background);
  font-family: Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

@media (prefers-color-scheme: dark) {
  html {
    color-scheme: dark;
  }
} */