﻿.sidebarHeader {
    background: #f3f3f3;
    padding: 40px 20px 30px;
    text-align: center;
}

    .sidebarHeader .userImg {
        margin-bottom: 15px;
    }

        .sidebarHeader .userImg img {
            height: 60px;
            border: 1px solid #999;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -ms-border-radius: 50%;
            -o-border-radius: 50%;
            border-radius: 50%;
        }

    .sidebarHeader .userDetails {
        font-size: 16px;
        color: #1339b7;
    }

        .sidebarHeader .userDetails span {
            display: block;
            font-size: 13px;
            color: #444;
        }

.sidebarBody {
    padding: 20px 0;
}

    .sidebarBody nav a {
        display: block;
        background: #fff;
        padding: 12px 20px;
        -webkit-transition: all ease 250ms;
        -moz-transition: all ease 250ms;
        -o-transition: all ease 250ms;
        -ms-transition: all ease 250ms;
        transition: all ease 250ms;
        color: #666;
    }

        .sidebarBody nav a .fa {
            width: 40px;
            text-align: center;
            margin-right: 10px;
            font-size: 28px;
            vertical-align: middle;
        }

        .sidebarBody nav a.active {
            background: #f3f3f3;
        }


.sidebarLeft {
    display: block;
    min-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    border: none;
    background-color: #fff;
    width: 0;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 1035;
    -webkit-transform: translate3d(-280px, 0, 0);
    -moz-transform: translate3d(-280px, 0, 0);
    -ms-transform: translate3d(-280px, 0, 0);
    -o-transform: translate3d(-280px, 0, 0);
    transform: translate3d(-280px, 0, 0);
    -webkit-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    -moz-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    -o-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    -ms-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    -webkit-box-shadow: 2px 0px 15px rgba(0,0,0,0.35);
    -moz-box-shadow: 2px 0px 15px rgba(0,0,0,0.35);
    -ms-box-shadow: 2px 0px 15px rgba(0,0,0,0.35);
    -o-box-shadow: 2px 0px 15px rgba(0,0,0,0.35);
    box-shadow: 2px 0px 15px rgba(0,0,0,0.35);
}

    .sidebarLeft.open {
        min-width: 280px;
        width: 280px;
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

.sidebar-overlay {
    visibility: hidden;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    background: #000;
    z-index: 1034;
    -webkit-transition: visibility 0 linear 0.4s,opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    -moz-transition: visibility 0 linear 0.4s,opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    transition: visibility 0 linear 0.4s,opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
}

    .sidebar-overlay.active {
        opacity: 0.5;
        visibility: visible;
        -webkit-transition-delay: 0;
        -moz-transition-delay: 0;
        transition-delay: 0;
    }

.sideBar {
    position: fixed;
    overflow: auto;
    height: 100%;
    width: 80%;
    max-width: 340px;
    background: #f3f3f3;
    top: 0px;
    right: -100%;
    z-index: 1035;
    -webkit-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    -moz-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    -o-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    -ms-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
    -webkit-box-shadow: -2px 0px 2px rgba(0,0,0,0.1);
    -moz-box-shadow: -2px 0px 2px rgba(0,0,0,0.1);
    -ms-box-shadow: -2px 0px 2px rgba(0,0,0,0.1);
    -o-box-shadow: -2px 0px 2px rgba(0,0,0,0.1);
    box-shadow: -2px 0px 2px rgba(0,0,0,0.1);
}

    .sideBar .sideBarWrap {
        padding: 10px;
    }

    .sideBar.open {
        right: 0;
    }

::-webkit-scrollbar {
    display: none;
}

.nav-item {    
   max-width: 50%;
}

.title-head {
        text-align: center;
    font-size: 20px;
    color: #1339b7;
    padding-top: 5px;
    /*padding-bottom: 10px;*/
}