*,
*:before,
*:after {
    margin: 0;
    box-sizing: border-box;
}

.menu {
    position: absolute;
    width: 100%;
    z-index: 3;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.0) 3%, rgba(6, 0, 44, 0.9) 100%);
}

body.overflow {
    overflow-y: hidden;
}

.menu-franquia-desktop {
    display: none;
}

nav {
    font-style: normal;
    font-size: 0.9em;
    font-weight: normal;
    letter-spacing: 2px;
}

.navbar .nav-link {
    color: #fff;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
    color: rgb(208, 255, 0);
    text-decoration: none;
}

.navbar .navbar-brand {
    color: #fff;
}


/* Change navbar styling on scroll */

.navbar.sticky {
    background: rgba(9, 0, 59, 0.911);
    box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.1);
    color: black;
    transition: cubic-bezier(0.23, 1, 0.320, 1) 0.3s;
}

.sticky {
    z-index: 4;
    transform: translate(0, -80px);
}

.navbar.sticky .nav-link:hover,
.navbar.sticky .nav-link:focus {
    color: rgb(208, 255, 0);
    text-decoration: none;
}

.logo {
    margin-top: 10px;
    height: 62px;
    padding: 1px;
}

.logo:hover {
    padding: 0px;
    margin-left: -1px;
}

.navbar>a {
    margin-left: 4vw;
}

header {
    width: 100%;
}

.sticky ul li {
    padding: 15px;
}

.inView {
    transform: translate(0, 0) !important;
}

.icon-menu::after {
    content: "\ea50";
    font-family: 'icomoon';
    line-height: 1.5;
    font-size: 0.9em;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    transform: rotate(90deg);
    transition: all 0.2s linear;
}

.icon-menu:hover {
    color: #d0ff00;
    cursor: pointer;
}

.navbar-expand-lg .navbar-nav {
    -ms-flex-direction: row;
    flex-direction: row;
}

.collapse:not(.show) {
    display: flex;
}

@media (max-width: 767px) {
    nav ul {
        list-style: none;
        padding: 0;
        margin: 0;
        display: block;
    }
    nav ul li,
    nav ol li {
        padding: 0 1.2vw;
    }
    .burger {
        width: 45px;
        height: 25px;
        position: relative;
        top: -5px;
        left: -5px;
        z-index: 10;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }
    .burger span {
        position: absolute;
        height: 40px;
        width: 40px;
        margin-top: 6px;
        margin-bottom: 6px;
        top: 15px;
        left: 8px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        margin-top: 3px;
    }
    .burger span,
    .burger span::before,
    .burger span::after {
        display: block;
        width: 28px;
        height: 2px;
        background-color: #c5c5c5;
        background-color: #ffffffb2;
        outline: 1px solid transparent;
        -webkit-transition-property: background-color, -webkit-transform;
        -moz-transition-property: background-color, -moz-transform;
        -o-transition-property: background-color, -o-transform;
        transition-property: background-color, transform;
        -webkit-transition-duration: 0.2s;
        -moz-transition-duration: 0.2s;
        -o-transition-duration: 0.2s;
        transition-duration: 0.2s;
    }
    .burger span::before,
    .burger span::after {
        position: absolute;
        content: "";
    }
    .burger span::before {
        top: -7px;
    }
    .burger span::after {
        top: 7px;
    }
    .burger.clicked span {
        background-color: transparent;
    }
    .burger.clicked span::before {
        -webkit-transform: translateY(9px) rotate(45deg);
        -moz-transform: translateY(9px) rotate(45deg);
        -ms-transform: translateY(9px) rotate(45deg);
        -o-transform: translateY(9px) rotate(45deg);
        transform: translateY(9px) rotate(45deg);
    }
    .burger.clicked span::after {
        -webkit-transform: translateY(-9px) rotate(-45deg);
        -moz-transform: translateY(-9px) rotate(-45deg);
        -ms-transform: translateY(-9px) rotate(-45deg);
        -o-transform: translateY(-9px) rotate(-45deg);
        transform: translateY(-9px) rotate(-45deg);
    }
    .burger.clicked span::before {
        top: -10px;
    }
    .burger:hover {
        cursor: pointer;
    }
    .burger-menu {
        background-color: #1c0b66;
        position: fixed;
        z-index: 9;
        top: 0;
        left: 0;
        height: 100vh;
        width: 80%;
        max-width: 380px;
        padding: 80px 40px 40px 50px;
        overflow-y: auto;
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(-100%);
        -webkit-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86), background-color 2s;
        -moz-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86), background-color 2s;
        -o-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86), background-color 2s;
        transition: opacity 3s, transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86), background-color 2s;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .burger-menu::-webkit-scrollbar {
        display: none;
    }
    .show {
        overflow-y: scroll;
    }
    nav ul.main li {
        -webkit-transform: translateX(40px);
        -moz-transform: translateX(40px);
        -ms-transform: translateX(40px);
        -o-transform: translateX(40px);
        transform: translateX(40px);
        opacity: 0;
        -webkit-transition: all 0.2s ease;
        -moz-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        transition: all 0.2s ease;
        padding: 45px 25px 0 10px;
    }
    .menu .logo {
        position: absolute;
        display: block;
        margin: auto;
        height: 30px;
        top: 0;
        left: 0;
        right: 0;
        z-index: 3;
        margin-top: 15px;
        transition: ease-in-out 0.5s;
    }
    .sticky.menu .logo {
        height: 25px;
    }
    .logo:hover {
        padding: 0;
    }
    .burger-menu.show {
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        -o-transform: translateX(0px);
        transform: translateX(0px);
    }
    nav .show ul li:nth-child(1) {
        transition-delay: 0.2s;
    }
    nav .show ul li:nth-child(2) {
        transition-delay: 0.3s;
    }
    nav .show ul li:nth-child(3) {
        transition-delay: 0.4s;
    }
    nav .show ul li:nth-child(4) {
        transition-delay: 0.5s;
    }
    nav .show ul li:nth-child(5),
    nav .show ul li:nth-child(6) {
        /* REFERENTE À FRANQUIA QUE POSSUI DOIS LI's*/
        transition-delay: 0.6s;
    }
    .burger.clicked span:before,
    .burger.clicked span:after {
        background-color: #ffffff;
    }
    nav ul.main li a,
    .icon-menu {
        color: #ffffff;
        font-family: "Asap", sans-serif;
        text-decoration: none;
        font-weight: 700;
        letter-spacing: 4px;
        font-size: 1.4em;
        padding: 0;
        line-height: 1.4em;
        text-transform: uppercase;
        display: flex;
        -webkit-transition: all 0.2s ease;
        -moz-transition: all 0.2s ease;
        -o-transition: all 0.2s ease;
        transition: all 0.2s ease;
    }
    .sub ul.items {
        overflow: hidden;
    }
    .sub ul.items li {
        position: relative;
        float: none;
        width: 100%;
        transition-delay: initial;
        padding: 0;
    }
    .sub.active ul.items li a {
        height: initial;
        opacity: 1;
        padding-top: 15px;
        line-height: 1.5em;
        cursor: pointer;
    }
    .icon-menu {
        display: block;
        position: relative;
    }
    .icon-menu::after {
        left: 90px;
        top: 4px;
        z-index: -1;
    }
    .icon-menu.active::after {
        transform: rotate(180deg);
        line-height: 0.9;
    }
    .icon-menu .click {
        display: inline-block;
        padding: 2px 25px;
        padding-left: 0;
        z-index: 10;
    }
    .sub ul.items li a {
        display: block;
        height: 0;
        opacity: 0;
        text-decoration: none;
        text-align: left;
        cursor: default;
        font-family: "Asap", sans-serif;
        font-weight: 300;
        color: #ffffff;
        letter-spacing: 1px;
        padding-right: 0;
        font-size: 1.1rem;
        position: relative;
        padding-left: 30px;
        -webkit-transition: all 0.25s ease;
        -moz-transition: all 0.25s ease;
        -o-transition: all 0.25s ease;
        transition: all 0.25s ease;
    }
    nav.show .about,
    nav.show .social,
    nav.show {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }
    nav .show ul li {
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        -o-transform: translateX(0px);
        transform: translateX(0px);
        opacity: 1;
    }
    /*  OVERLAY
  ========================================== */
    .overlay {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 3;
        width: 100%;
        height: 100vh;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        background-color: #0a0533;
        opacity: 0;
        visibility: hidden;
    }
    .overlay.show {
        opacity: 0.6;
        visibility: visible;
    }
    nav ul.main {
        list-style-type: none;
    }
    nav ul.main li:last-of-type {
        margin-bottom: 0px;
    }
    nav ul.main li a span {
        color: #d0ff00;
    }
    nav ul.main li a:hover {
        color: #d0ff00;
    }
    nav ul.sub li {
        padding: 10px;
        margin: 10px auto;
        padding-bottom: 10px;
    }
    ul.sub a::before {
        content: " ";
        width: 5px;
        height: 3px;
        background-color: #ffffff;
        position: absolute;
        z-index: 10;
        top: 16px;
        margin-left: -11px;
    }
    .sub {
        position: relative;
    }
    .sub ul.items li a:hover {
        color: #d0ff00;
    }
}


/*************************************************************************************************************************************/


/*                                   **************** BOOTSTRAP MENU **********************                                          */


/*************************************************************************************************************************************/


/*  */

@media (min-width:768px) {
    .navbar.sticky .logo {
        height: 40px;
        margin-top: 0;
    }
    .burger,
    #home {
        display: none;
    }
    .burger-menu {
        display: flex;
        flex-grow: 1;
        flex-basis: auto;
    }
    .menu-item {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        white-space: nowrap;
    }
    .menu-item a,
    .menu-item .menu-hover {
        display: flex;
        flex-direction: column;
        align-items: center;
        color: rgb(255, 255, 255);
        text-decoration: none;
        text-transform: uppercase;
        height: 100%;
        width: 100%;
        cursor: pointer;
    }
    .sub-menu .menu-item a {
        display: inline-block;
        overflow-wrap: break-word;
        word-break: keep-all;
        font-size: 0.95em;
    }
    .menu-item .sub-menu {
        position: absolute;
        top: 100%;
        width: 100%;
        transform-origin: center top;
        transform: rotateX(90deg);
        transition: transform 0.2s linear 0s;
        z-index: 2;
        background-color: rgb(245, 245, 245);
        color: rgb(7, 0, 46);
        min-width: 160px;
        box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 16px 0px;
        padding: 0px;
        left: -35%;
        letter-spacing: 1px;
    }
    .menu-hover:hover .sub-menu {
        transform: rotateX(0deg);
    }
    .menu-item .sub-menu a {
        font-weight: normal;
        color: rgb(8, 5, 44);
        text-align: center;
        font-family: 'BentonSansCond', "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
        text-transform: uppercase;
        margin: 0px;
        padding: 15px;
        white-space: normal;
    }
    .menu-item .sub-menu li:hover {
        background-color: rgb(51, 7, 172);
        transition: all 0.2s ease-in-out 0s;
    }
    .menu-item .sub-menu li:hover a {
        color: rgb(255, 255, 255);
    }
    .icon-menu::after {
        right: 0;
        transform: rotate(180deg);
        line-height: 1;
    }
    .navbar-nav {
        margin-right: 5%;
        margin-top: 2%;
    }
    .navbar.sticky .navbar-nav {
        margin-right: 2%;
        margin-top: 0;
    }
    .navbar-nav .menu-item {
        padding: 0;
    }
    .navbar-nav .menu-item .nav-link {
        padding-left: 1rem;
        padding-right: 0.5rem;
    }
    .navbar-expand-lg .navbar-nav .menu-hover {
        padding-right: 0.9rem;
    }
    .menu-item a {
        font-size: 0.9rem;
    }
    .menu-franquia-mobile {
        display: none;
    }
    .menu-franquia-desktop {
        display: block;
    }
}

@media (min-width: 992px) {
    nav {
        letter-spacing: 3px;
    }
    .menu-item .sub-menu {
        left: -15%;
    }
    .nav-link::after {
        right: 8px;
    }
    .navbar-nav li a {
        margin-left: 0.5vw;
    }
    .navbar-nav .menu-item {
        padding: 0 12px;
    }
    .navbar>a {
        margin-left: 7vw;
    }
}


/*  */


/*  */


/*  */


/*  */


/*  */


/*  */

.menu-item .sub-menu .menu-item a::before {
    content: "";
}