:root {
    --widthLine: 13px;
    --heightLine: 4px;
    --widthContent: 40px;
    --heightContent: 40px;
    --btnDistance: 12px;
    --scaleX: 1.14;
    --hamburg-bgcolor: white;
}

/* MENU EXPANSIVO */

.marginBottom {
    margin-bottom: 1.2em;
}

.contentMenuSecoes {
    position: relative;
}

    .contentMenuSecoes .navbarMenu {
        width: 100%;
        height: 60px;
    }


    .contentMenuSecoes .btnMenu {
        position: absolute;
        width: var(--widthContent);
        height: var(--heightContent);
        top: 10px;
        right: 0;
        cursor: pointer;
    }

    .contentMenuSecoes .btnInfo {
        position: absolute;
        top: 20px;
        right: 50px;
        cursor: pointer;
        color: white;
    }

    .contentMenuSecoes .boxMenu {
        position: absolute;
        height: 100%;
        padding: 25px 10px;
        font-size: .9rem;
        overflow: hidden;
        z-index: 1000;
        background-color: rgba(255,255,255, 1);
        opacity: 0;
        visibility: hidden;
        transition: opacity .2s linear;
    }
        .contentMenuSecoes .boxMenu.active {
            position: relative;
            visibility: visible;
            opacity: 1;
            transition: opacity .3s linear;
        }



        .contentMenuSecoes .boxMenu ul {
            list-style: none;
        }


            .contentMenuSecoes .boxMenu ul li b a {
                color: #607d8b;
            }

            .contentMenuSecoes .boxMenu ul li b a:hover {
                color: #ffc107;
                /*font-weight: bolder;*/
            }

            .contentMenuSecoes .boxMenu ul li a {
                text-decoration: none;
                color: #78909c;
            }

                .contentMenuSecoes .boxMenu ul li a:hover {
                    color: #ffc107;
                    /*font-weight: bold;*/
                }






    /* BOTÃO HAMBURGUER COM EFEITO */
    .contentMenuSecoes .btnMenu-left {
        background-color: var(--hamburg-bgcolor);
        position: absolute;
        width: var(--widthLine);
        height: var(--heightLine);
        top: 20px;
        left: 0px;
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
    }

        .contentMenuSecoes .btnMenu-left:before {
            background-color: var(--hamburg-bgcolor);
            position: absolute;
            width: var(--widthLine);
            height: var(--heightLine);
            content: "";
            top: -10px;
            -webkit-transition-duration: 0.5s;
            transition-duration: 0.5s;
        }

        .contentMenuSecoes .btnMenu-left:after {
            background-color: var(--hamburg-bgcolor);
            position: absolute;
            width: var(--widthLine);
            height: var(--heightLine);
            content: "";
            top: 10px;
            -webkit-transition-duration: 0.5s;
            transition-duration: 0.5s;
        }

    .contentMenuSecoes .btnMenu-right {
        background-color: var(--hamburg-bgcolor);
        position: absolute;
        width: var(--widthLine);
        height: var(--heightLine);
        top: 20px;
        left: var(--btnDistance);
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
    }

        .contentMenuSecoes .btnMenu-right:before {
            background-color: var(--hamburg-bgcolor);
            position: absolute;
            width: var(--widthLine);
            height: var(--heightLine);
            content: "";
            top: -10px;
            -webkit-transition-duration: 0.5s;
            transition-duration: 0.5s;
        }

        .contentMenuSecoes .btnMenu-right:after {
            background-color: var(--hamburg-bgcolor);
            position: absolute;
            width: var(--widthLine);
            height: var(--heightLine);
            content: "";
            top: 10px;
            -webkit-transition-duration: 0.5s;
            transition-duration: 0.5s;
        }

    .contentMenuSecoes .active .btnMenu-left {
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
        background: transparent;
    }

        .contentMenuSecoes .active .btnMenu-left:before {
            -webkit-transform: rotateZ(45deg) scaleX(var(--scaleX)) translate(4px, 4px);
            transform: rotateZ(45deg) scaleX(var(--scaleX)) translate(4px, 4px);
        }

        .contentMenuSecoes .active .btnMenu-left:after {
            -webkit-transform: rotateZ(-45deg) scaleX(var(--scaleX)) translate(4px, -4px);
            transform: rotateZ(-45deg) scaleX(var(--scaleX)) translate(4px, -4px);
        }

    .contentMenuSecoes .active .btnMenu-right {
        -webkit-transition-duration: 0.5s;
        transition-duration: 0.5s;
        background: transparent;
    }

        .contentMenuSecoes .active .btnMenu-right:before {
            -webkit-transform: rotateZ(-45deg) scaleX(var(--scaleX)) translate(-4px, 4px);
            transform: rotateZ(-45deg) scaleX(var(--scaleX)) translate(-4px, 4px);
        }

        .contentMenuSecoes .active .btnMenu-right:after {
            -webkit-transform: rotateZ(45deg) scaleX(var(--scaleX)) translate(-4px, -4px);
            transform: rotateZ(45deg) scaleX(var(--scaleX)) translate(-4px, -4px);
        }