/*--- MENU LATERAL ---*/
@media (max-width: 767px) {

    nav#menu-lateral {
        position: absolute;
        overflow: hidden;
        top: 0;
        left: 240px;
        width: 240px;
        height: 100%;
        -webkit-box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
        -moz-box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
        box-shadow: inset -1.5em 0 1.5em -0.75em rgba(0, 0, 0, 0.25);
        background: #333333;
        color: #FFFFFF;
        z-index: 50;
    }

    #page-wrap {
        z-index: 1;
        position: relative;
    }

    .js-advanced.js-menu #page-wrap, .js-advanced.js-menu #footer-wrap {
        -webkit-transform: translate3d(240px, 0, 0);
        -moz-transform: translate3d(240px, 0, 0);
        -ms-transform: translate3d(240px, 0, 0);
        -o-transform: translate3d(240px, 0, 0);
        transform: translate3d(240px, 0, 0);
    }

    .js-advanced.js-menu, .js-advanced.js-menu body {
        overflow: hidden;
    }

    .js-advanced #menu-lateral {
        overflow-y: scroll;
        left: 0;
        -webkit-transform: translate3d(-240px, 0, 0);
        -moz-transform: translate3d(-240px, 0, 0);
        -ms-transform: translate3d(-240px, 0, 0);
        -o-transform: translate3d(-240px, 0, 0);
        transform: translate3d(-240px, 0, 0);
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .js-advanced.js-menu #menu-lateral .block {
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
        opacity: 1;
        -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);
    }

    .js-advanced #menu-lateral .block {
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
        opacity: 0.7;
        -webkit-transition: opacity 300ms 100ms, -webkit-transform 500ms ease;
        -webkit-transition-delay: ease, 0s;
        -moz-transition: opacity 300ms 100ms ease, -moz-transform 500ms ease;
        -o-transition: opacity 300ms 100ms ease, -o-transform 500ms ease;
        transition: opacity 300ms 100ms ease, transform 500ms ease;
        -webkit-transform-origin: 100% 50%;
        -moz-transform-origin: 100% 50%;
        -ms-transform-origin: 100% 50%;
        -o-transform-origin: 100% 50%;
        transform-origin: 100% 50%;
        -webkit-transform: translate3d(70%, 0, 0) scaleX(0.9) scaleY(0.9);
        -moz-transform: translate3d(70%, 0, 0) scaleX(0.9) scaleY(0.9);
        -ms-transform: translate3d(70%, 0, 0) scaleX(0.9) scaleY(0.9);
        -o-transform: translate3d(70%, 0, 0) scaleX(0.9) scaleY(0.9);
        transform: translate3d(70%, 0, 0) scaleX(0.9) scaleY(0.9);
    }

    #menu-lateral .block {
        position: relative;
        padding: 0;
        z-index: 51;
    }

    #menu-lateral ul, #menu-lateral ul.open {
        float: none;
        position: relative;
        display: block;
        visibility: visible;
        list-style: none;
        padding: 0;
        margin: 0;
        background-color: transparent;
        box-shadow: none;
        border: 0;
    }

    #menu-lateral li {
        display: block;
        position: relative;
        float: none;
        border-right: none;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
        border-bottom: 0;
    }

    #menu-lateral li.lateral-divider-item {
        padding: 0.5em 1.429em;
        display: block;
        font-size: 16px;
        line-height: 1.286em;
        font-weight: bold;
        outline: none;
        text-decoration: none;
        text-align: center;
        background-color: #555555;
    }

    #menu-lateral li.lateral-place.place-active {
        background-color: rgba(0, 255, 0, 0.20);
    }

    #menu-lateral li a {
        padding: 0.857em 1.429em;
        display: block;
        color: #CCC;
        font-size: 14px;
        line-height: 1.286em;
        font-weight: bold;
        outline: none;
        text-decoration: none;
        text-align: left;
    }

    #menu-lateral li.lateral-place a {
        font-size: 13px;
    }

    #menu-lateral li a:focus, #menu-lateral li a:hover {
        color: white;
        background: rgba(255, 255, 255, 0.1);
        text-decoration: none;
    }

}

