.side-bar .menu-container {
    position: absolute;
    width: 255px;
}

.side-bar .searchBar {
    margin: 25px 15px 10px;
    width: 205px;
    padding: 4px 5px;
    border: 1px solid #ccc;
    border-radius: 2px;
}

    .side-bar .searchBar i {
        color: #cccccc;
    }

    .side-bar .searchBar input {
        border: 0;
        padding: 0;
        width: 165px;
        margin-left: 5px;
    }

        .side-bar .searchBar input:focus {
            outline: 0;
        }

.collapsed-sidebar .searchBar {
    width: 13px;
}

    .collapsed-sidebar .searchBar input {
        display: none;
    }

.side-bar {
    width: 255px;
    height: calc(100% - 56px);
    position: absolute;
    top: 59px;
    left: 0;
    z-index: 999;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: #ffffff;
    border: solid 0 #979797;
    border-right: 1px solid #e0e0e0;
    transition: width 250ms ease-out;
}

    .side-bar .searchBar .fa {
        cursor: pointer;
    }

        .side-bar .searchBar .fa:hover {
            color: #283747;
        }

.side-bar .searchBar .fa-times-circle {
    font-size: 17px;
    vertical-align: middle;
}

    .side-bar nav > .menuItem {
        position: relative;
        width: 255px;
        display: block;
        overflow: hidden;
        box-sizing: border-box;
        text-align: left;
        padding: 20px 24px 16px 20px;
        opacity: 0.54;
        background-color: #ffffff;
        border: solid 0 #979797;
        transition: opacity 200ms ease;
        -webkit-transition: opacity 200ms ease;
    }

        .side-bar nav > .menuItem p {
            display: inline-block;
            max-width: 150px;
            line-height: 1.54;
            color: #283747;
            text-decoration: none;
            font-family: Roboto;
            font-size: 13px;
            font-weight: 500;
            font-style: normal;
            font-stretch: normal;
            text-rendering: optimizeSpeed;
            -webkit-font-smoothing: antialiased;
        }

        .side-bar nav > .menuItem:hover,
        .side-bar nav > .menuItem:active {
            cursor: pointer;
            background-color: #fafafa;
            opacity: 0.87;
        }

.breadcrumb-item:hover {
    cursor: pointer;
    opacity: 0.87;
}

.side-bar .breadcrumbs-container {
    padding: 19px 5px 0px 26px;
    height: auto;
}

.breadcrumbs-container .breadcrumb-item {
    display: inline-block;
    line-height: 1.54;
    height: 20px;
    color: #283747;
    opacity: 0.54;
    margin-bottom: 10px;
    text-decoration: none;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.54;
}

.breadcrumb-item::after {
    content: '';
    background-image: url(/Images/sidebar_icons.svg);
    background-position: 12px -20px;
    width: 5px;
    height: 20px;
    margin-left: 5px;
    float: right;
    display: inline-block;
    vertical-align: middle;
}

.breadcrumb-item.last-breadcrumb {
    pointer-events: none;
    opacity: 0.87;
}

    .breadcrumb-item.last-breadcrumb::after {
        display: none;
    }

.side-bar .menu-drawer {
    animation-duration: 265ms;
    animation-timing-function: ease-in-out;
    -webkit-animation-duration: 265ms;
    -moz-animation-duration: 265ms;
    -o-animation-duration: 265ms;
    -webkit-animation-timing-function: ease-in-out;
    -moz-animation-timing-function: ease-in-out;
    -o-animation-timing-function: ease-in-out;
    perspective: 1000px;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    will-change: transform;
    transform: initial;
    -webkit-transform: initial;
    -o-transform: initial;
    -moz-transform: initial;
    -ms-transform: initial;
}

.slideRight {
    animation-name: slideRight;
    -webkit-animation-name: slideRight;
    -moz-animation-name: slideRight;
    -o-animation-name: slideRight;
}

.slideLeft {
    animation-name: slideLeft;
    -webkit-animation-name: slideLeft;
    -moz-animation-name: slideLeft;
    -o-animation-name: slideLeft;
}

.text-transition {
    animation-name: text-transition-animation;
    -webkit-animation-name: text-transition-animation;
    -moz-animation-name: text-transition-animation;
    -o-animation-name: text-transition-animation;
    animation-duration: 120ms;
    animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
    -webkit-animation-duration: 120ms;
    -moz-animation-duration: 120ms;
    -o-animation-duration: 120ms;
    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
    -moz-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
    -o-animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
    perspective: 1000px;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    will-change: transform;
    transform: initial;
    -webkit-transform: initial;
    -o-transform: initial;
    -moz-transform: initial;
    -ms-transform: initial;
}

@keyframes slideRight {
    0% {
        transform-origin: 0 0;
        transform: translate3d(-100%,0,0);
        -webkit-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        -webkit-transform: translate3d(-100%,0,0);
        -moz-transform: translate3d(-100%,0,0);
        -o-transform: translate3d(-100%,0,0);
        -ms-transform: translate3d(-100%,0,0);
    }

    50% {
        opacity: 0.35;
    }

    100% {
        transform-origin: 0 0;
        transform: translate3d(0,0,0);
        -webkit-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        -webkit-transform: translate3d(0,0,0);
        -moz-transform: translate3d(0,0,0);
        -o-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
    }
}

@keyframes slideLeft {
    0% {
        transform-origin: 0 0;
        transform: translate3d(100%,0,0);
        -webkit-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        -webkit-transform: translate3d(100%,0,0);
        -moz-transform: translate3d(100%,0,0);
        -o-transform: translate3d(100%,0,0);
        -ms-transform: translate3d(100%,0,0);
    }

    50% {
        opacity: 0.35;
    }

    100% {
        transform-origin: 0 0;
        transform: translate3d(0,0,0);
        -webkit-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
        -webkit-transform: translate3d(0,0,0);
        -moz-transform: translate3d(0,0,0);
        -o-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
    }
}

@keyframes text-transition-animation {
    0% {
        opacity: 0.15;
    }

    50% {
        opacity: 0.35;
    }

    100% {
        opacity: 0.54;
    }
}

nav .menuItem .menu-icon {
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 20px;
}

    nav .menuItem .menu-icon::before {
        display: none;
    }

nav .menuItem .right-arrow-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: 12px -20px;
    width: 5px;
    height: 20px;
    float: right;
    display: inline-block;
}

nav.collapsed-menu-sidebar .menuItem {
    width: 56px;
    padding: 20px 0px 16px 20px;
    text-align: center;
    line-height: 1.69;
}

nav.collapsed-menu-sidebar p.menu-item-title {
    position: absolute;
    overflow: hidden;
    display: block;
    width: 46px;
    left: 6px;
    font-size: 10px;
    text-overflow: ellipsis;
    word-wrap: break-word;
    white-space: nowrap;
}

.collapsed-menu-sidebar .menuItem i.right-arrow-icon {
    display: none;
}

.affiliates-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -2px;
}

.cms-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -42px;
}

.casino-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -22px;
}

.igcadmin-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -62px;
}

.payments-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -82px;
}

.reports-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -102px;
}

.igc-insights-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -222px;
}

.riskfraud-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -122px;
}

.sports-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -142px;
}

.support-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -162px;
}

.supportdesk-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -182px;
}

.updatedtesting-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -202px;
}

.bonus-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -242px;
}

.giglogic-icon {
    background-image: url(/Images/sidebar_icons.svg);
    background-position: -2px -262px;
}

.two-liner-menu-icon {
    margin-top: -20px;
}