/* Nav */
.main-navigation {position: fixed; z-index: 100000; right: 20px; top: 20px; outline: none; display: -webkit-box; display: -ms-flexbox; display: flex; }
.main-navigation .hamburger {z-index: 100000; right: 20px; top: 20px; outline: none; }
.main-navigation .hamburger span span.hamburger-inner, .main-navigation .hamburger span span.hamburger-inner::before, .main-navigation .hamburger span span.hamburger-inner::after {width: 32px; height: 2px;
    /* /////////////// color button */
    background: white;
}
/* Hamburger Button */
.hamburger {padding: 15px 15px; display: none; cursor: pointer; transition-property: opacity, filter; transition-duration: 0.15s; transition-timing-function: linear; font: inherit; color: inherit; text-transform: none; background-color: transparent; border: 0; margin: 0; overflow: visible; }
.hamburger-box {width: 40px; height: 24px; display: inline-block; position: relative; }
.hamburger-inner {display: block; top: 50%; margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {width: 40px; height: 4px; background-color: #000; border-radius: 4px; position: absolute; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease; }
.hamburger-inner::before, .hamburger-inner::after {content: ""; display: block; }
.hamburger-inner::before {top: -10px; }
.hamburger-inner::after {bottom: -10px; }
.hamburger--collapse-r .hamburger-inner {top: auto; bottom: 0; transition-duration: 0.13s; transition-delay: 0.13s; transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--collapse-r .hamburger-inner::after {top: -20px; transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; }
.hamburger--collapse-r .hamburger-inner::before {transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--collapse-r.is-active .hamburger-inner {transform: translate3d(0, -10px, 0) rotate(45deg); transition-delay: 0.22s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger--collapse-r.is-active .hamburger-inner::after {top: 0; opacity: 0; transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; }
.hamburger--collapse-r.is-active .hamburger-inner::before {top: 0; transform: rotate(90deg); transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); }
/* Slider Reverse */
.hamburger--slider-r .hamburger-inner {top: 2px; }
.hamburger--slider-r .hamburger-inner::before {top: 10px; transition-property: transform, opacity; transition-timing-function: ease; transition-duration: 0.15s; }
.hamburger--slider-r .hamburger-inner::after {top: 20px; }
.hamburger--slider-r.is-active .hamburger-inner {transform: translate3d(0, 10px, 0) rotate(-45deg); }
.hamburger--slider-r.is-active .hamburger-inner::before {transform: rotate(45deg) translate3d(5.71429px, -6px, 0); opacity: 0; }
.hamburger--slider-r.is-active .hamburger-inner::after {transform: translate3d(0, -20px, 0) rotate(90deg); }
/* Wrap Content*/
.wrapper {position: relative; z-index: 5; width: 100%; height: 100%; min-width: 100vw; min-height: 100vh; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; margin: 0; -webkit-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform-origin: 500% 0; transform-origin: 500% 0; }
.wrapper::after {content: ""; background: transparent; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; -webkit-transition: 0.3s ease-in-out, background 0.7s ease-in; transition: 0.3s ease-in-out, background 0.7s ease-in; }
/* Wrap Menu*/
.menu-wrapper {z-index: 1001; width: 100%; height: 100%; -webkit-transform: translate(100%, 0); transform: translate(100%, 0); position: fixed; overflow: hidden; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
.menu-wrapper .menu-mobile {position: absolute; left: 0; top: 0; z-index: 1000; display: block; height: 100%; padding-top: 120px;
    /* /////////////// color background */
    background-color: #10481F;
}
/* Menu Itens */
.menu-item {text-indent: 0; text-align: center; overflow: hidden }
.menu-item .side-menu-button, .menu-item button {overflow: hidden; position: relative; display: block; text-decoration: none; transition: 0.3s;
    /* ///////////// text menu options */
    font-weight: 800;
    font-size: 1.3rem;
    text-transform: uppercase;
    width: 80%;
    margin: 10px 10%;
    padding: 5px 0;
    text-align: right;
    font-family: 'rawline', sans-serif;
    color: #FFF;
    border: 0;
    background: transparent;
}

.menu-item ul.side-menu-dropdown {
    height: 100vh;
    width: 100%;
    position: fixed;
    right: 0;
    top: 0;
    background: #22b745;
    display: block;
    -webkit-transform: translate(100%, 0); transform: translate(100%, 0);
    transition: 0.3s ease-in-out;
    z-index: 1002;
    overflow-y: scroll;
}

.menu-item ul.side-menu-dropdown .side-menu-dropdown-wrapper {
    display: flex;
    flex-direction: column;
    padding: 80px 40px 80px 10px;
}

.menu-item ul.side-menu-dropdown .side-menu-dropdown-wrapper .side-menu-dropdown-item {
    margin: 0 0 30px 0;
}

.menu-item ul.side-menu-dropdown .side-menu-dropdown-wrapper .side-menu-dropdown-item a, .menu-item ul.side-menu-dropdown .side-menu-dropdown-wrapper .side-menu-dropdown-item .side-menu-dropdown-subitem a{
    text-decoration: none;
    color:  #fff;
    text-align: right;
    width: 90%;
    display: block;
    margin: 4px 20px 4px 0;
    font-size: 1.1rem;
    padding: 4px 10px 4px 0;
}
.menu-item ul.side-menu-dropdown .side-menu-dropdown-wrapper .side-menu-dropdown-item a {
    font-weight: 700;
}
.menu-item ul.side-menu-dropdown .side-menu-dropdown-wrapper .side-menu-dropdown-item .side-menu-dropdown-subitem a{
    font-weight: 400;
}

.menu-item ul.side-menu-dropdown--active {
    -webkit-transform: translate(5%, 0) !important; transform: translate(5%, 0) !important;
}

@media screen and (max-width: 1024px) {
    .menu-wrapper .menu-mobile { display: block !important; width: 95%; }
    .menu-wrapper .menu-mobile .menu-item a { font-size: 1.4rem; }
    .main-navigation {right: 5px; top: 9px; }
    .main-navigation .hamburger {right: 0; top: -2px; width: 60px; }
    .wrapper-sided {-webkit-transform: translate(-90%, 0); transform: translate(-90%, 0); }
    .menu-wrapper--active {-webkit-transform: translate(5%, 0); transform: translate(5%, 0); }
}