.toggle-sidebar {
    color: var(--secondary-color);
    margin-left:30px;
}

.toggle-sidebar:hover {
    color: var(--accent-color);
}

.dropdown-toggle {
    color: var(--accent-color);
}

    .dropdown-toggle:hover {
        color: var(--accent-light-color);
        background-color: transparent !important;
    }

.jarvis-sidebar {
    display: block !important;
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    width: 100%
}

    .jarvis-sidebar > *:nth-child(1), .jarvis-sidebar > *:nth-child(2), .jarvis-sidebar > *:nth-child(3) {
        border-bottom: 2px solid var(--accent-color)
    }

    .jarvis-sidebar .bottom-menu {
        display: none
    }

nav.main-menu > ul > li.active-menu-item {
    padding-top: 0 !important;
}

@media(min-width:1024px) {
    .jarvis-sidebar {
        border-right: 3px solid var(--accent-color)
    }

        .jarvis-sidebar .main-menu {
            -webkit-box-flex: 3;
            -ms-flex-positive: 3;
            flex-grow: 3
        }

        .jarvis-sidebar .bottom-menu {
            display: block
        }

        .jarvis-sidebar .main-menu ul li:nth-child(even) {
            border-left: 1px solid var(--accent-color)
        }

        .jarvis-sidebar .main-menu ul li:nth-child(1), .jarvis-sidebar .main-menu ul li:nth-child(2), .jarvis-sidebar .main-menu ul li:nth-child(3), .jarvis-sidebar .main-menu ul li:nth-child(4) {
            border-bottom: 1px solid var(--accent-color)
        }
}

.jarvis-sidebar .snap-shot {
    color: var(--primary-color);
    padding: 0 0 26px 0;
}

    .jarvis-sidebar .snap-shot .title {
        font-size: 20px;
        margin-bottom: 13px;
        text-align: center;
        background: var(--accent-color);
        padding: 6px;
    }

    .jarvis-sidebar .snap-shot .items {
        display: block;
        clear: both;
        text-align: center;
        justify-content: center
    }

        .jarvis-sidebar .snap-shot .items .item {
            display: inline-block;
            text-align: center
        }

            .jarvis-sidebar .snap-shot .items .item .circle {
                background: var(--secondary-color);
                border: 3px solid var(--secondary-color);
                display: inline-block;
                height: 39px;
                line-height: 30px;
                margin: 6.5px;
                text-align: center;
                width: 90%;
                box-shadow: inset 0px 0px 0px 3px white;
                box-sizing: border-box;
            }
                .jarvis-sidebar .snap-shot .items .item .circle .price {
                    white-space: nowrap;
                }

                .jarvis-sidebar .snap-shot .items .item .circle .price .value {
                    font-size: 12px;
                    font-weight: 700
                }

                .jarvis-sidebar .snap-shot .items .item .circle .price .currency {
                    font-size: 8px;
                    font-weight: 700;
                    vertical-align: middle;
                }

        .jarvis-sidebar .snap-shot .items .item-title {
            font-size: 12px;
            white-space: nowrap;
            color: var(--text-color);
        }

@media(min-width:640px) {
    .jarvis-sidebar .snap-shot .items {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

        .jarvis-sidebar .snap-shot .items .item .circle {
            border-radius: 50%;
            height: 110px;
            line-height: 106px;
            width: 110px
        }

            .jarvis-sidebar .snap-shot .items .item .circle .price .value {
                font-size: 12px
            }

            .jarvis-sidebar .snap-shot .items .item .circle .price .currency {
                font-size: 12px
            }

    .jarvis-sidebar .main-menu ul li {
        border-right: 1px solid var(--accent-color);
        border-bottom: 1px solid var(--accent-color);
        width: 16.6%;
    }
}

.jarvis-sidebar .brand {
    padding: 26px 52px;
    text-align: center
}

    .jarvis-sidebar .brand img {
        display: inline-block;
        height: auto;
        max-width: 300px;
        width: 100%
    }

.jarvis-sidebar .main-menu {
    color: var(--accent-color)
}

    .jarvis-sidebar .main-menu ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        list-style: none;
        margin: 0;
        padding: 0
    }

        .jarvis-sidebar .main-menu ul li {
            width: 33.33333%
        }

            .jarvis-sidebar .main-menu ul li a {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -ms-flex-direction: column;
                flex-direction: column;
                -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                justify-content: space-between;
                height: 100%;
                padding: 13px 10px 0;
                text-align: center
            }

                .jarvis-sidebar .main-menu ul li a:hover {
                    background: #eee;
                    text-decoration: none
                }

            .jarvis-sidebar .main-menu ul li.active a {
                background: var(--accent-color) !important;
                color: white;
            }

            .jarvis-sidebar .main-menu ul li a .text {
                display: block;
                font-size: 12px;
                line-height: 16px;
                text-align: center
            }

            .jarvis-sidebar .main-menu ul li a .icon img {
                display: inline-block;
                height: auto;
                width: 90%
            }


@media(max-width:639px) {
    .jarvis-sidebar .main-menu ul li {
        border-bottom: 1px solid var(--accent-color);
        border-right: 1px solid var(--accent-color);
    }
}

@media(min-width:640px) {
    .jarvis-sidebar .main-menu ul li {
        width: 16.6%
    }
}

@media(min-width:640px) and (max-width:1023px) {
    .jarvis-sidebar .main-menu ul li:nth-child(2), .jarvis-sidebar .main-menu ul li:nth-child(3), .jarvis-sidebar .main-menu ul li:nth-child(4), .jarvis-sidebar .main-menu ul li:nth-child(5), .jarvis-sidebar .main-menu ul li:nth-child(6), .jarvis-sidebar .main-menu ul li:nth-child(7) {
        border-left: 1px solid var(--accent-color)
    }
}

@media(min-width:1024px) {
    .jarvis-sidebar .main-menu ul li {
        width: 50%
    }

        .jarvis-sidebar .main-menu ul li:nth-child(even) {
            border-left: 1px solid var(--accent-color)
        }

        .jarvis-sidebar .main-menu ul li:nth-child(1), .jarvis-sidebar .main-menu ul li:nth-child(2), .jarvis-sidebar .main-menu ul li:nth-child(3), .jarvis-sidebar .main-menu ul li:nth-child(4) {
            border-bottom: 1px solid var(--accent-color)
        }
}

.jarvis-sidebar .bottom-menu ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0
}

    .jarvis-sidebar .bottom-menu ul li {
        width: 50%
    }

        .jarvis-sidebar .bottom-menu ul li:nth-child(2) {
            border-left: 1px solid #fff
        }

        .jarvis-sidebar .bottom-menu ul li a {
            background: var(--accent-color);
            color: #fff;
            display: block;
            height: 39px;
            line-height: 39px;
            text-align: center;
            text-decoration: none
        }

            .jarvis-sidebar .bottom-menu ul li a .icon {
                margin-right: 5px
            }

                .jarvis-sidebar .bottom-menu ul li a .icon img {
                    height: auto;
                    position: relative;
                    top: -2px;
                    width: 16px
                }

            .jarvis-sidebar .bottom-menu ul li a:hover {
                background: var(--accent-light-color)
            }
