.sidr {

    background: #333;

    color: #9a9da2;

    display: block;

    position: fixed;

    top: 0;

    height: 100%;

    z-index: 999;

    width: 320px;

    overflow-x: hidden;

    overflow-y: auto;

    scrollbar-width: none;

    -ms-overflow-style: none;

}



.sidr::-webkit-scrollbar {

    width: 0;

    height: 0;

}



.sidr .sidr-inner {

    padding: 0 0 15px;

}



.sidr.right {

    left: auto;

    right: -320px;

}



.sidr.left {

    left: -320px;

    right: auto;

}



.sidr {

    padding-left: 15px;

    padding-right: 15px;

}



.sidr .widget-title {

    color: #fff;

}



.switch input {

    position: absolute;

    opacity: 0;

}



.switch {

    cursor: pointer;

    display: inline-block;

    font-size: 20px;

    height: 1em;

    width: 2em;

    margin: auto;

    background: #fff;

    border-radius: 1em;

}



.switch div {

    height: 1em;

    width: 1em;

    border-radius: 1em;

    background: #E91E63;

    border: 1px solid #fff;

    -webkit-transition: all 300ms;

    -moz-transition: all 300ms;

    transition: all 300ms;

}



.sidr-open .switch input + div {

    -webkit-transform: translate3d(100%, 0, 0);

    -moz-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

}



.sidr-close-holder {

    text-align: right;

    font-size: 16px;

    text-transform: uppercase;

}



.sidr-close-holder i {

    margin-left: 5px;

    font-size: 40px;

    vertical-align: middle;

}



@media only screen and (min-width: 992px) {

    body.sidr-open:before {

        content: "";

        left: 0;

        top: 0;

        z-index: 102;

        width: 100%;

        height: 100%;

        position: fixed;

        cursor: pointer;

        -webkit-transition: visibility 0s, opacity 0.4s linear;

        transition: visibility 0s, opacity 0.4s linear;

        visibility: visible;

        opacity: 1;

        background-color: rgba(51, 51, 51, 0.94);

    }

}