/* Add here all your CSS customizations */

div .doc-details h5 {
    margin: 0;
}


.doc-details span.signature {
    font-size: medium;
    font-weight: normal;
}


.doc-details span.type-signature {
    font-size: medium;
}


Prism css start
========================== **/
pre[class*="language-"] code {
    font-size: 14px;
}

pre[class*="language-"] [class*="language-"],
pre[class*="language-"] .language-markup {
    background-color: transparent;
    display: block;
    padding: 10px 15px;
}

pre.line-numbers {
    position: relative;
    padding-left: 3.8em;
    counter-reset: linenumber;
}

    pre.line-numbers > code {
        position: relative;
    }

.line-numbers .line-numbers-rows {
    position: absolute;
    pointer-events: none;
    top: 0;
    font-size: 100%;
    left: -3.8em;
    width: 3em;
    /* works for line-numbers below 1000 lines */
    letter-spacing: -1px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.line-numbers-rows > span {
    pointer-events: none;
    display: block;
    counter-increment: linenumber;
}

    .line-numbers-rows > span:before {
        content: counter(linenumber);
        display: block;
        padding-right: 0.8em;
        text-align: right;
    }

div.code-toolbar {
    position: relative;
}

    div.code-toolbar > .toolbar {
        position: absolute;
        top: 0.3em;
        right: 0.2em;
        transition: opacity 0.3s ease-in-out;
        opacity: 0;
    }

    div.code-toolbar:hover > .toolbar {
        opacity: 5;
        color: red;
    }

    div.code-toolbar > .toolbar .toolbar-item {
        display: inline-block;
    }

    div.code-toolbar > .toolbar a {
        cursor: pointer;
    }

    div.code-toolbar > .toolbar button {
        border: 0;
        font: inherit;
        line-height: normal;
        overflow: visible;
    }

    div.code-toolbar > .toolbar a,
    div.code-toolbar > .toolbar button,
    div.code-toolbar > .toolbar span {
        color: white;
        font-size: 0.8em;
        padding: 0 0.5em;
        background: #0088CC;
        box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.2);
        border-radius: 0.5em;
    }

        div.code-toolbar > .toolbar a:focus,
        div.code-toolbar > .toolbar a:hover,
        div.code-toolbar > .toolbar button:focus,
        div.code-toolbar > .toolbar button:hover,
        div.code-toolbar > .toolbar span:focus,
        div.code-toolbar > .toolbar span:hover {
            color: inherit;
            text-decoration: none;
        }

/** index images */
@media (min-width: 0px) and (max-width: 575.98px) {
    #copyright-text {
        display: none;
    }

    #home-dashboard {
        width: 360px;
        margin-top: 20px !important;
    }

    #company-wide {
        width: 360px;
        margin-top: 20px !important;
    }
}
@media (min-width: 576px) and (max-width: 767.98px) {

    #home-dashboard {
        width: 400px;
        margin-top: 20px !important;
    }
    #copyright-text {
        display: none;
    }
    #company-wide {
        width: 420px;
        margin-top: 20px !important;
    }
}
@media (min-width: 768px) and (max-width: 991.98px) {

    #home-dashboard {
        width: 400px;
        margin-top: 20px !important;
    }
    #copyright-text {
        display: none;
    }
    #company-wide {
        width: 420px;
        margin-top: 20px !important;
    }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    #home-dashboard {
        width: 400px;
        margin-top: 20px !important;
    }
    #copyright-text {
        display: none;
    }
    #company-wide {
        width: 580px;
        margin-top: 20px !important;
    }
}
@media (min-width: 1200px) {
    #copyright-text {
        display: inherit;
    }

    #home-dashboard {
        width: 540px;
        margin-top: 170px !important;
    }

    #company-wide {
        width: 700px;
        margin-top: 20px !important;
    }
}


@media (min-width: 0px) and (max-width: 575.98px) {
    .db-image {
        width: 400px;
        height: 288px;
    }
}


@media (min-width: 576px) {
    .db-image {
        width: 428px;
        height: 288px;
    }
}


/** new */
.blinking-cursor {
    color: white;
    -webkit-animation: 1s blink step-end infinite;
    -moz-animation: 1s blink step-end infinite;
    -ms-animation: 1s blink step-end infinite;
    -o-animation: 1s blink step-end infinite;
    animation: 1s blink step-end infinite;
}

@keyframes

"blink" {
    from, to

{
    color: transparent;
}

50% {
    color: white;
}

}

@-moz-keyframes blink {
    from, to {
        color: transparent;
    }

    50% {
        color: white;
    }
}

@-webkit-keyframes

"blink" {
    from, to

{
    color: transparent;
}

50% {
    color: white;
}

}

@-ms-keyframes

"blink" {
    from, to

{
    color: transparent;
}

50% {
    color: white;
}

}

@-o-keyframes

"blink" {
    from, to

{
    color: transparent;
}

50% {
    color: white;
}

}


.fw-100 {
    font-weight: 100 !important;
}

.fw-200 {
    font-weight: 200 !important;
}

.fw-300 {
    font-weight: 300 !important;
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.fw-600 {
    font-weight: 600 !important;
}

.fw-700 {
    font-weight: 700 !important;
}

.fw-800 {
    font-weight: 800 !important;
}

.fw-900 {
    font-weight: 900 !important;
}

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

.code-font {
    font-family: Andale Mono,AndaleMono,monospace;
}

.title-font {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
}

.body-font {
    font-family: "Lexend Deca", sans-serif;
    font-weight: 300;
    font-optical-sizing: auto;
}

.pb-6 {
    padding-bottom: 3.5rem;
}

.box-shadow-rb {
    box-shadow: 5px 5px 8px #00000085;
}

@media (min-width: 768px) {
    .box-shadow-md-rb {
        box-shadow: 5px 5px 8px #00000085;
    }
}

@media (min-width: 768px) {
    .box-shadow-md-lb {
        box-shadow: -5px 5px 8px #00000085;
    }
}

@media (min-width: 992px) {
    .box-shadow-lg-rb {
        box-shadow: 5px 5px 8px #00000085;
    }
}

@media (min-width: 992px) {
    .box-shadow-lg-rt {
        box-shadow: 5px -5px 8px #00000085;
    }
}

@media (min-width: 992px) {
    .box-shadow-lg-lb {
        box-shadow: -5px 5px 8px #00000085;
    }
}

@media (min-width: 992px) {
    .box-shadow-lg-lt {
        box-shadow: -5px -5px 8px #00000085;
    }
}

.benefits-box {
    color: white;
    background-color: #0088CC;
    width: fit-content;
    margin: 0 auto;
    flex: 1;
}

.button-margin-left {
    margin-left: 2.2rem
}

.index-shift {
    position: relative;
    top: -70px;
}

.custom-pricing {
    font-size: 28px;
    margin: 7.5px 0px;
}

.demo-button {
    width: 300px;
    height: 56px;
    border-radius: 4px;
    font-size: 16px;
    text-transform: none;
    margin-top: 24px;
    padding-top: 9px !important;
    color: #0088CC;
    background-color: white;
    border-color: #0088CC;
}

.price-discount {
    display: inline-block;
    font-size: 10px;
    line-height: 2;
    color: #0088CC;
    padding: 2px 9px;
    background-color: #80d4ff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    white-space: nowrap;
    font-weight: 700;
    position: relative;
    z-index: 1;
}

.yearly-price > .price-discount {
    top: -1px;
    margin-left: 10px;
}

.dot {
    height: 7px;
    width: 7px;
    background-color: #f6f6f6;
    border-radius: 50%;
    display: inline-block;
    margin-right: 4px;
}

.old-price {
    margin-top: 5px;
    padding-left: 10px;
    text-decoration: line-through;
}

#monthly-yearly-change > .yearly-price {
    width: 220px !important;
}

.price-table.monthly .yearly {
    display: none;
}

.price-table.yearly .monthly {
    display: none;
}

.price-label {
    text-transform: lowercase !important;
}

#monthly-yearly-change {
    min-width: 200px;
    padding: 15px 20px;
}

    #monthly-yearly-change a {
        font-weight: 500;
        color: #d6dfe3;
        text-decoration: none;
        position: relative;
        font-size: 14px !important;
        text-transform: capitalize;
        cursor: pointer;
    }

        #monthly-yearly-change a.active {
            color: #4a5052;
        }

        #monthly-yearly-change a:first-child {
            padding-right: 50px;
        }

        #monthly-yearly-change a:last-child {
            padding-left: 50px;
        }

        #monthly-yearly-change a:first-child::after {
            content: '';
            position: absolute;
            height: 21px;
            width: 50px;
            background: #dae4e6;
            top: 50%;
            transform: translateY(-50%);
            right: -25px;
            border-radius: 40px;
        }

        #monthly-yearly-change a:last-child::after {
            content: '';
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background: #50e3c2;
            width: 18px;
            height: 18px;
            left: -28px;
            border-radius: 40px;
            -webkit-transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
        }

        #monthly-yearly-change a:last-child.active::after {
            left: 0;
            -webkit-transition: all 0.2s ease-in-out;
            -moz-transition: all 0.2s ease-in-out;
            -o-transition: all 0.2s ease-in-out;
            -ms-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
        }

    #monthly-yearly-change.style-two {
        padding: 4px;
        width: 420px;
        background: #212529;
        margin-bottom: 30px;
        border-radius: 4px;
        position: relative;
    }

        #monthly-yearly-change.style-two a {
            width: 160px;
            display: inline-block;
            text-align: center;
            padding: 7px 0 !important;
            z-index: 1;
            position: static;
            text-transform: capitalize;
        }

            #monthly-yearly-change.style-two a:last-child::after {
                display: none;
            }

            #monthly-yearly-change.style-two a:first-child::after {
                display: none;
            }

            #monthly-yearly-change.style-two a.active {
                color: #212529;
            }

            #monthly-yearly-change.style-two a .change-box-text {
                position: relative;
                z-index: 1;
            }

            #monthly-yearly-change.style-two a:first-child .change-box {
                content: '';
                position: absolute;
                background: #fff;
                border-radius: 4px;
                bottom: 3px;
                top: 3px;
                z-index: 0;
                transform: translateY(0%);
                width: 285px;
                right: 3px;
                -webkit-transition: all 0.2s ease-in-out;
                -moz-transition: all 0.2s ease-in-out;
                -o-transition: all 0.2s ease-in-out;
                -ms-transition: all 0.2s ease-in-out;
                transition: all 0.2s ease-in-out;
            }

            #monthly-yearly-change.style-two a.active:first-child .change-box {
                left: 3px;
                right: auto;
                width: 160px;
                -webkit-transition: all 0.2s ease-in-out;
                -moz-transition: all 0.2s ease-in-out;
                -o-transition: all 0.2s ease-in-out;
                -ms-transition: all 0.2s ease-in-out;
                transition: all 0.2s ease-in-out;
            }


.dashboard-image {
    max-width: 510px;
    padding: .5rem 0;
    display: block;
    margin-left: auto;
    margin-right: auto;

    @media (max-width: 767.98px) {
        width: 100%;
        height: auto;
    }

    @media (min-width: 992px) {
        max-height: 260px;
        width: auto;
        float: right;
    }
}