* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

::placeholder {
    color: var(--grey);
    opacity: 1;
    font-weight: 300;
}

:-ms-input-placeholder {
    color: var(--grey);
    opacity: 1;
    font-weight: 300;
}

::-ms-input-placeholder {
    color: var(--grey);
    opacity: 1;
    font-weight: 300;
}

body::-webkit-scrollbar {
    width: 10px; /* width of the entire scrollbar */
}

body::-webkit-scrollbar-track {
    background: var(--dark-blue-cloud); /* color of the tracking area */
}

body::-webkit-scrollbar-thumb {
    background-color: var(--light-blue-cloud); /* color of the scroll thumb */
    border-radius: 10px; /* roundness of the scroll thumb */
}

body {
    padding: 0px;
    margin: 0px;
    font-family: "Ubuntu", sans-serif !important;
    scroll-behavior: smooth;
    overflow-x: hidden;
}

ul {
    list-style: none;
}

h1,
h2,
h3,
h4 {
    margin: 0px;
    padding: 0px;
    font-weight: 900;
}



a {
    text-decoration: none !important;
}

.center {
    text-align: center;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.no-margin {
    margin: 0px;
}

.margin-auto {
    margin: auto;
}

.object-center {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

/* 
    ----- Styles that are being used for the hole content -----
*/


/* Spaces */

.space-of-10 {
    height: 10px;
    width: 100%;
}

.space-of-20 {
    height: 20px;
    width: 100%;
}

.space-of-25 {
    width: 100%;
    height: 25px;
}

.space-of-30 {
    height: 30px;
    width: 100%;
}

.space-of-50 {
    height: 50px;
    width: 100%;
}

.space-of-60 {
    width: 100%;
    height: 60px;
}

.space-of-75 {
    height: 75px;
    width: 100%;
}

.space-of-100 {
    height: 100px;
    width: 100%;
}

.space-of-150 {
    height: 150px;
    width: 100%;
}

.right-50-padding {
    padding-right: 50px;
}

.right-100-padding {
    padding-right: 100px;
}

.right-200-padding {
    padding-right: 200px;
}

.right-110-padding {
    padding-right: 110px;
}

.left-50-padding {
    padding-left: 50px;
}

.left-100-padding {
    padding-left: 100px;
}

.left-185-padding {
    padding-left: 185px;
}


.left-20-padding {
    padding-left: 20px;
}

.padding-20 {
    padding: 0px 20px;
}

.padding-90 {
    padding: 90px !important;
}


/* Mobile Spacing */

@media (max-width: 1024px) {
    .space-of-100 {
        height: 50px;
    }

    .space-of-150 {
        height: 100px;
    }

    .right-200-padding {
        padding: 0px;
    }

    .right-100-padding {
        padding-right: 0px;
    }
}



/*Fonts*/

.font-bungee {
    font-family: 'Bungee', cursive !important;
}

/* Defyning Colors */

:root {
    --blue-loja: #3463AA;
    --blue-mobi: #4D84F7;
    --dark-purple-lite: #5813BA;
    --light-purple-lite: #9F33DD;
    --orange-lite: #FF6E3C;
    --medium-orange-lite: #FF8760;
    --light-orange-lite: #fbe9e6;
    --main-blue-cloud: #0074FF;
    --dark-blue-cloud: #004798;
    --light-blue-cloud: #2CC3FF;
    --lighter-blue-cloud: #aee5ff;
    --orange-cont: #F2B950;
    --main-green: #00C853;
    --light-green: #BDECC4;
    --lighter-green: #e3f7e7;
    --white: #fff;
    --dark-grey: #666;
    --grey: #bdbdbd;
    --light-grey: #f1f1f1;
    --lighter-grey: #f5f5f5;
    --header-size: 80px;
    --yellow: #F7C14D;
    --light-yellow: #FFF4A7;
    --shock-blue: #200DFF;
    --loja-gradient: linear-gradient(45deg, #3463AA, #0074FF);
    --bank-gradient: linear-gradient(45deg, #004798, #00C853);
    --mobi-gradient: linear-gradient(45deg, #4D84F7, #0074FF);
    --lite-gradient: linear-gradient(45deg, #5813BA, #FF6E3C);
    --talk-gradient: linear-gradient(45deg, #2CC3FF, #004798);
    --cloud-gradient: linear-gradient(45deg, #0074FF, #2CC3FF 150%);
    --cont-gradient: linear-gradient(45deg, #3d66b6, #1b4577);
    --size-transition: height 0.1s ease-in-out;
    --all-transition: all 0.2s ease-in-out;
    --new-telephone: linear-gradient(116deg, #2CC3FF 0%, #00ff96 100%)
}

/* Coloring */

.gradient-loja {
    background-image: var(--loja-gradient);
}

.gradient-bank {
    background-image: var(--bank-gradient);
}

.gradient-mobi {
    background-image: var(--mobi-gradient);
}

.gradient-lite {
    background-image: var(--lite-gradient);
}

.gradient-talk {
    background-image: var(--talk-gradient);
}

.light-gradient-loja {
    background-color: #fff;
}

.light-gradient-bank {
    background-color: #fff;
}

.light-gradient-mobi {
    background-color: #fff;
}

.light-gradient-lite {
    background-color: #fff;
}

/* Font Styles */
.size-11 {
    font-size: 11px;
    line-height: 21px;
    font-weight: 300;
}

.size-14 {
    font-size: 14px;
    line-height: 21px;
    font-weight: 300;
}

.size-16 {
    font-size: 16px;
    line-height: 24px;
    font-weight: 300;
}

.size-18 {
    font-size: 18px;
    line-height: 28px;
    font-weight: 300;
}

.size-21 {
    font-size: 21px;
    line-height: 28px;
    font-weight: 300;
}

.size-24 {
    font-size: 24px;
    line-height: 35px;
    font-weight: 300;
}

.size-28 {
    font-size: 28px;
    line-height: 35px;
    font-weight: 300;
}

.size-30 {
    font-size: 30px;
    line-height: 35px;
    font-weight: 300;
}

.size-35 {
    font-size: 35px;
    line-height: 44px;
    font-weight: 300;
}

.size-36 {
    font-size: 36px;
    line-height: 44px;
    font-weight: 300;
}

.size-44 {
    font-size: 44px;
    line-height: 55px;
}

.size-48 {
    font-size: 48px;
    line-height: 55px;
}

.size-55 {
    font-size: 55px;
    line-height: 65px;
    font-weight: 300;
}

.no-bold {
    font-weight: normal;
}

.bold {
    font-weight: 900;
}

.ul-on-terms {
    list-style: circle;
    row-gap: 10px;
    color: var(--dark-grey);
    padding-left: 15px;
    display: grid;
    font-size: 16px;
    line-height: 24px;
}


.background-main-blue {
    background-color: var(--main-blue-cloud) !important;
}

.background-yellow {
    background-color: var(--yellow) !important;
}

.background-grey {
    background-color: var(--grey) !important;
}

.background-dark-grey {
    background-color: var(--dark-grey) !important;
}

.background-white {
    background-color: var(--white) !important;
}

.background-dark-blue {
    background-color: var(--dark-blue-cloud) !important;
}

.background-color-light-grey {
    background-color: var(--light-grey) !important;
}

.background-light-green {
    background-color: #00FF96;
}

.background-color-shock-blue {
    background-color: var(--shock-blue);
}

.color-dark-blue {
    color: var(--dark-blue-cloud);
}

.color-cont-purple {
    color: #4145AA;
}

.color-main-blue {
    color: var(--main-blue-cloud);
}

.color-shock-blue {
    color: var(--shock-blue);
}

.color-light-blue {
    color: var(--light-blue-cloud);
}

.color-grey {
    color: var(--dark-grey);
}

.color-light-green {
    color: var(--light-green);
}

.color-main-green {
    color: var(--main-green);
}

.color-white {
    color: var(--white);
}

.color-dark-purple {
    color: var(--dark-purple-lite);
}

.color-orange {
    color: var(--orange-lite);
}

.color-orange-cont {
    color: var(--orange-cont)
}

.color-light-orange {
    color: var(--light-orange-lite);
}

.color-yellow {
    color: var(--yellow);
}

.italic-styled {
    font-style: italic;
}

.font-weight-light {
    font-weight: 300 !important;
}


/*height*/

.height-100 {
    height: 100%;
}

.height-auto {
    height: auto;
}

/* CTA's */
.cta-green {
    padding: 25px 50px;
    background: var(--main-green);
    color: var(--white);
    font-size: 21px;
    font-weight: 700;
    display: inline-block;
    border-radius: 50px;
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2);
    transition: var(--all-transition);
    border: 2px solid #fff;
}

    .cta-green:hover {
        transform: scale(1.05);
    }

.cta-green-small {
    padding: 15px 30px;
    background: var(--main-green);
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    display: inline-block;
    border-radius: 50px;
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2);
    transition: var(--all-transition);
}

    .cta-green-small:hover {
        transform: scale(1.05);
    }

.cta-green-squared {
    padding: 20px 30px;
    background: var(--main-green);
    color: var(--white);
    font-size: 21px;
    font-weight: 700;
    display: inline-block;
    border-radius: 5px;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.2);
    transition: var(--all-transition);
}

    .cta-green-squared:hover {
        transform: scale(1.05);
    }



.cta-lined-green {
    padding: 15px 30px;
    background: none;
    color: var(--main-green);
    font-size: 16px;
    font-weight: 700;
    display: inline-block;
    border-radius: 5px;
    border: 2px solid var(--main-green);
    transition: var(--all-transition);
}

    .cta-lined-green:hover {
        transform: scale(1.05);
    }

.cta-white {
    padding: 25px 50px;
    background: var(--white);
    color: var(--main-green);
    font-size: 21px;
    font-weight: 700;
    display: inline-block;
    border-radius: 50px;
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2);
    transition: var(--all-transition);
}

    .cta-white:hover {
        transform: scale(1.05);
    }

.link-right-arrow {
    padding-right: 30px;
    background: url(../images/ImagesSiteNovaDecada/arrow-right-green.svg) no-repeat center right 10px;
    background-size: auto 80%;
    font-weight: 700;
    transition: var(--all-transition);
}

    .link-right-arrow:hover {
        background-position: center right;
    }

.link-bordered-light-green {
    height: 50px;
    padding: 0px 20px;
    line-height: 50px;
    vertical-align: middle;
    border: 1px solid var(--light-green);
    display: inline-block;
    background-size: 10px auto;
    border-radius: 10px;
    transition: var(--all-transition);
}

    .link-bordered-light-green:hover {
        background: var(--light-green);
        color: var(--main-blue-cloud);
    }

.link-on-title a {
    text-decoration: underline !important;
}

/* CSS Grid - Defyning the Grid */

.inner-page-content {
    padding-top: var(--header-size);
}

.container-width {
    margin: auto;
    width: 70vw;
}

.grid-column {
    display: grid;
    grid-auto-flow: column;
}

.divided-on-2 {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 50% 50%;
}

.divided-on-60-40 {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 60% 40%;
}

.divided-on-1-2 {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 1fr 2fr;
}

.divided-on-2-vertically {
    height: 100%;
    display: grid;
    grid-auto-flow: row;
}

.divided-on-3 {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(3, 1fr);
}

.divided-on-4 {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(4, 1fr);
}

.divided-on-5-list {
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 10px;
    grid-template-columns: repeat(5, 1fr);
}

.divided-on-7-list {
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 10px;
    grid-template-columns: repeat(7, 1fr);
}

.divided-on-8 {
    display: grid;
    grid-column-gap: 10px;
    grid-template-columns: repeat(4, 1fr);
}



@media(max-width: 1224px) {
    .divided-on-1-2 {
        grid-template-columns: 1fr;
        grid-auto-flow: initial;
        grid-row-gap: 20px;
    }
}

@media(max-width: 1024px) {
    .divided-on-8 {
        grid-template-columns: repeat(2, 1fr);
    }
}

.center {
    text-align: center;
}

.center-align {
    display: grid;
    align-content: center;
}

.space-around-align {
    display: grid;
    align-content: space-around;
}

.bottom-align {
    display: grid;
    align-content: end;
}

.justify-end {
    display: grid;
    justify-content: end;
}

.justify-center {
    display: grid;
    justify-content: center;
}

.justify-start {
    display: grid;
    justify-content: start;
}

.vertically-centered {
    display: grid;
    align-content: center;
}

.hide-on-big-screen {
    display: none;
}

.img-full-width {
    width: 100%;
    height: auto;
}



@media (max-width: 1450px) {
    .container-width {
        width: 90vw;
    }

    .content-left-workus {
        padding-left: 5vw !important;
    }

    .items-right-workus {
        padding-right: 5vw !important;
    }

    .megamenu {
        width: 90vw !important;
    }

    .small-screen-50-space {
        height: 50px;
    }

    .small-screen-30-space {
        height: 30px !important;
    }

    .hide-on-big-screen {
        display: block;
    }

    .hand-written-references {
        margin-left: 0px !important;
    }
}



/*Bring it up bring it down*/

@media(max-width: 1024px) {

    .bring-it-down {
        order: 2;
        /*margin: auto;*/
    }

    /*
    .bring-it-up {
        text-align: start !important;
    }

        .bring-it-up p {
            order: 1;
            text-align: start;
        }
        */
}

/* Estilos Animação - Ecossistema de gestão */



#lottie {
    width: 200px;
    background-color: transparent;
    height: 60px;
    display: block;
    overflow: hidden;
    transform: translate3d(0,0,0);
    text-align: center;
    opacity: 1;
    margin-left: -5px;
}

/* Navbar Top */

.wrap-navbar {
    height: auto;
    background-color: var(--white);
    width: 100%;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.3);
    position: fixed;
    z-index: 100;
    display: block;
}

    .wrap-navbar .wrap-navbar-inner {
        height: 100%;
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: 30% 70%;
        align-content: center;
    }

.navbar-brand-cloud {
    height: var(--header-size);
    display: grid;
    align-content: center;
    transition: var(--size-transition);
}

    .navbar-brand-cloud a img {
        height: 40px;
    }

.nav {
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 20px;
    align-content: center;
    justify-content: end;
}

    .nav li {
        height: var(--header-size);
        display: inline-block;
        display: grid;
        align-content: center;
        transition: var(--size-transition);
    }

        .nav li a {
            display: inline-block;
            vertical-align: middle;
            font-size: 16px;
            font-weight: 700;
            color: var(--main-blue-cloud);
            height: var(--header-size);
            line-height: var(--header-size);
            transition: all .1s ease-in-out;
            cursor: pointer;
        }

            .nav li a:hover {
                border-bottom: 3px solid var(--main-blue-cloud);
            }

.nav-is-active {
    border-bottom: 3px solid var(--main-blue-cloud);
}

.dropdown-nav {
    padding-right: 15px;
    background: url(../images/ImagesSiteNovaDecada/dropdown-arrow-nav.svg) no-repeat center right;
}

.nav-cta {
    height: 40px !important;
    line-height: 40px !important;
    padding: 0px 30px;
    border-radius: 5px;
    background: var(--main-green);
    color: var(--white) !important;
}

    .nav-cta:hover {
        border: none !important;
        transform: scale(1.1);
    }



.nav-grey-link {
    color: var(--grey) !important;
}

/* Estilos dos MegaMenus */

.wrap-megamenu {
    z-index: 10;
    transition: var(--size-transition);
    display: none;
}

.shadow-megamenu {
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 1;
    background-color: rgba(0,0,0,0.5);
    display: none;
}

.megamenu {
    background: var(--white);
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.5);
    z-index: 10;
    position: fixed;
    width: 70vw;
    margin-top: var(--header-size);
}

.megamenu-ecossistema {
    grid-auto-flow: column;
    grid-template-columns: 25% 50% 25%;
}

.select-item li {
    padding: 20px;
    border-bottom: 1px solid var(--light-grey);
    background-image: url(../images/ImagesSiteNovaDecada/arrow-right.svg);
    background-repeat: no-repeat;
    background-position: center right 15px;
    background-size: auto 15px;
    transition: all 0.1s ease-in-out;
    cursor: pointer;
}

    .select-item li:hover {
        background-position: center right 10px;
    }

    .select-item li img {
        height: 25px;
    }

    .select-item li p {
        font-size: 14px;
        color: var(--dark-grey);
        margin-top: 5px;
    }

.selected-item {
    background: var(--light-grey);
    border-right: 1px ridge var(--grey);
}

.inner-item {
    width: 100%;
    height: 100%;
    background: var(--light-grey) url(../images/ImagesSiteNovaDecada/back-passagem-10.png) no-repeat right top;
    display: none;
    grid-auto-flow: column;
    grid-template-columns: repeat(2, 1fr);
    padding: 50px;
}

.inner-item-selected {
    display: grid;
}

.title-and-list {
    display: grid;
}

    .title-and-list .align-bottom {
        display: grid;
        align-content: end;
    }

    .title-and-list p {
        font-size: 21px;
        line-height: 28px;
        color: var(--dark-blue-cloud);
    }

    .title-and-list ul {
        display: grid;
        grid-auto-flow: row;
        grid-row-gap: 10px;
    }

        .title-and-list ul li {
            font-size: 16px;
            color: var(--dark-blue-cloud);
            padding-left: 25px;
            background: url(../images/ImagesSiteNovaDecada/icon-check-green.svg) no-repeat center left;
            background-size: auto 16px;
        }

.btn-and-icon {
    display: grid;
    align-content: end;
}

    .btn-and-icon div {
        text-align: right;
    }

        .btn-and-icon div a {
            padding: 20px;
            border: 2px solid var(--main-green);
            color: var(--main-green);
            display: inline-block;
            width: auto;
            border-radius: 10px;
            font-weight: 700;
            font-size: 16px;
            transition: all 0.1s ease-in-out;
        }

            .btn-and-icon div a:hover {
                transform: scale(1.05);
            }

#sige-loja-selected .icon-background {
    background: url(../images/ImagesSiteNovaDecada/sige-loja-icon.svg) no-repeat right top;
    background-size: auto 30px;
}

#sige-bank-selected .icon-background {
    background: url(../images/ImagesSiteNovaDecada/sige-bank-icon.svg) no-repeat right top;
    background-size: auto 30px;
}

#sige-mobi-selected .icon-background {
    background: url(../images/ImagesSiteNovaDecada/sige-mobi-icon.svg) no-repeat right top;
    background-size: auto 30px;
}

#sige-lite-selected .icon-background {
    background: url(../images/ImagesSiteNovaDecada/sige-lite-icon.svg) no-repeat right top;
    background-size: auto 30px;
}

#sige-talk-selected .icon-background {
    background: url(../images/ImagesSiteNovaDecada/sige-talk-icon.svg) no-repeat right top;
    background-size: auto 30px;
}

.banner-ecossistema-megamenu {
    display: grid;
    grid-auto-flow: row;
    grid-template-rows: 80% 20%;
}

.top-part-eco-mega {
    background-image: url(../images/ImagesSiteNovaDecada/colorful-hexagon.svg), url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(135deg, var(--dark-blue-cloud), var(--main-blue-cloud), var(--dark-purple-lite) 80%);
    background-repeat: no-repeat;
    background-size: 70% auto, cover, cover;
    background-position: right -50px bottom -50px, top right, top right;
    padding: 30px 20px;
    display: grid;
}

    .top-part-eco-mega h3 {
        font-size: 21px;
        line-height: 35px;
        font-weight: 300;
        color: var(--white);
    }

        .top-part-eco-mega h3 b {
            color: var(--light-green);
        }

    .top-part-eco-mega div p {
        font-size: 21px;
        color: var(--light-green);
        font-weight: 900;
    }

        .top-part-eco-mega div p span {
            transition: var(--all-transition);
        }

.banner-ecossistema-megamenu:hover div p span {
    padding-left: 5px;
}

.bottom-part-eco-mega {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(135deg, var(--light-blue-cloud), var(--white));
    background-repeat: no-repeat;
    background-size: cover, cover;
    background-position: top right, top right;
    display: grid;
    align-content: center;
    justify-content: start;
    padding-left: 20px;
}

.grey-div {
    background-color: var(--lighter-grey);
}

.megamenu-features div {
    padding: 20px 20px 40px 30px;
}

    .megamenu-features div img {
        height: 60px;
    }

    .megamenu-features div h3 {
        font-size: 18px;
        font-weight: 700;
        color: var(--main-blue-cloud);
        margin-top: 20px;
    }

    .megamenu-features div ul {
        display: grid;
        grid-row-gap: 10px;
        margin-top: 20px;
    }

        .megamenu-features div ul li a {
            color: var(--dark-blue-cloud);
            font-size: 16px;
            font-weight: 300;
            padding-left: 15px;
            line-height: 16px;
            vertical-align: middle;
            height: 16px;
            background: url(../images/ImagesSiteNovaDecada/arrow-right-green.svg) no-repeat center left;
            background-size: auto 10px;
            transition: var(--all-transition);
        }

            .megamenu-features div ul li a:hover {
                color: var(--main-green);
                background-position: center left 3px;
            }

.megamenu-segments .column-mega-menu {
    padding: 10px 30px 40px 30px;
}

.megamenu-segments div ul {
    display: grid;
    margin-top: 20px;
}

    .megamenu-segments div ul li a {
        color: var(--dark-blue-cloud);
        font-size: 16px;
        font-weight: 300;
        transition: var(--all-transition);
        display: grid;
        grid-auto-flow: column;
        justify-content: start;
        transition: var(--all-transition);
        padding: 10px;
        border-radius: 5px;
    }

        .megamenu-segments div ul li a div {
            display: grid;
            align-content: center;
        }

            .megamenu-segments div ul li a div svg {
                fill: var(--main-green);
                height: 20px;
                width: auto;
                margin-right: 10px;
                transition: var(--all-transition);
            }

        .megamenu-segments div ul li a:hover {
            background: var(--lighter-green);
            color: var(--main-blue-cloud);
        }

            .megamenu-segments div ul li a:hover div svg {
                fill: var(--main-blue-cloud);
            }

.banner-segments-megamenu {
    background: var(--main-blue-cloud) url(../images/ImagesSiteNovaDecada/banner-features-megamenu.png) no-repeat center center;
    background-size: cover;
    height: 100%;
    padding: 20px 30px 40px 30px;
    display: grid;
    transition: var(--all-transition);
}

    .banner-segments-megamenu .cta-white {
        height: 50px;
        width: 100%;
        border-radius: 5px;
        background-color: var(--white);
        color: var(--main-green);
        text-align: center;
        line-height: 50px;
        vertical-align: middle;
        font-size: 18px;
        font-weight: 700;
        border: 1px solid var(--main-green);
        padding: 0px;
    }

        .banner-segments-megamenu .cta-white:hover {
            background-color: var(--main-green);
            color: var(--white);
        }

/* Footer */

.white-line-of-2px {
    background-color: rgba(255,255,255,0.7);
    height: 2px;
    width: 100%;
}

.new-decade-footer {
    height: 50vw;
    background-image: linear-gradient(var(--lighter-blue-cloud) 0%, var(--white) 80%);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto;
}

.top-footer {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr 1fr 1fr;
}

.social-media-footer {
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    grid-column-gap: 50px;
    align-content: center;
}

    .social-media-footer p {
        color: var(--dark-blue-cloud);
        font-weight: 700;
        font-size: 16px;
    }

        .social-media-footer p a {
            padding-left: 10px;
        }

            .social-media-footer p a svg {
                fill: var(--main-blue-cloud);
            }

            .social-media-footer p a:hover svg {
                fill: var(--dark-blue-cloud);
            }

.link-phone-number-p {
    line-height: 28px;
}

    .link-phone-number-p a {
        font-size: 28px !important;
        font-weight: 700 !important;
        color: var(--yellow) !important;
        padding-top: 5px !important;
    }

.phone-footer {
    align-content: center;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 50px 1fr;
    grid-column-gap: 10px;
}

    .phone-footer div svg {
        height: 60px;
        fill: var(--yellow);
    }

.phone-plans {
    display: none;
    grid-auto-flow: column;
    grid-column-gap: 10px;
    justify-content: center;
}

    .phone-plans p {
        text-align: left !important;
    }

    .phone-plans div svg {
        height: 60px;
        fill: var(--dark-blue-cloud);
    }

.footer-brand-cloud {
    display: grid;
    justify-content: center;
}

    .footer-brand-cloud p {
        color: var(--main-blue-cloud);
        line-height: 18px;
        font-size: 18px;
        padding-top: 5px;
        text-align: center;
    }

.links-footer {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(4, 1fr);
}

    .links-footer ul {
        display: grid;
        grid-auto-flow: row;
        grid-row-gap: 10px;
        align-content: start;
    }

        .links-footer ul li h3 {
            font-size: 18px;
            font-weight: 700;
            color: var(--main-blue-cloud);
        }

        .links-footer ul li a {
            font-size: 16px;
            font-weight: 300;
            color: var(--dark-blue-cloud);
        }

            .links-footer ul li a:hover {
                font-size: 16px;
                font-weight: 300;
                color: var(--main-blue-cloud);
            }

.title-column-links {
    height: 40px;
}

.new-decade-footer h2 {
    color: var(--light-blue-cloud);
    font-size: 21px;
}

.footer-signature {
    display: grid;
    grid-auto-flow: column;
    height: 80px;
}

    .footer-signature p {
        color: var(--grey);
        font-size: 16px;
        line-height: 80px;
        vertical-align: middle;
    }

.footer-mobi-div-out {
    display: grid;
    justify-content: end;
}

.footer-mobi-div {
    display: grid;
    grid-auto-flow: column;
}

.logo-side {
    height: 80px;
    background: var(--main-blue-cloud);
    display: grid;
    align-content: center;
    padding: 0px 20px;
    border-radius: 10px 0px 0px 10px;
}

.links-side {
    height: 80px;
    background: var(--dark-blue-cloud);
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 20px;
    align-content: center;
    padding: 0px 20px;
    border-radius: 0px 10px 10px 0px;
}

    .links-side a {
        display: grid;
        align-content: center;
    }

.footer-cta-section {
    background: var(--light-green);
    background-size: cover;
}

.list-cta-footer {
    display: grid;
    grid-auto-flow: column;
    justify-content: end;
    grid-column-gap: 50px;
}

    .list-cta-footer li {
        font-size: 16px;
        font-weight: 300;
        padding-left: 26px;
        background: url(../images/ImagesSiteNovaDecada/icon-check-green.svg) no-repeat center left;
        background-size: auto 16px;
        color: var(--dark-blue-cloud);
    }

.content-side-footer-cta {
    display: grid;
}

.cta-footer-phone {
    height: 75px;
    background: var(--white);
    border: 1px solid var(--main-green);
    border-radius: 5px;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 50% 50%;
    padding: 10px;
}

.answer-cta-footer-phone {
    height: 75px;
    background: var(--white);
    border: 1px solid var(--main-green);
    border-radius: 5px;
    display: grid;
    align-content: center;
    justify-content: center;
}

.cta-footer-phone .p-cta-phone {
    display: grid;
    align-content: center;
    padding-left: 10px;
}

    .cta-footer-phone .p-cta-phone p {
        color: var(--dark-grey);
        font-size: 16px;
    }

.input-cta-phone {
    display: grid;
    grid-auto-flow: column;
    justify-content: end;
}

    .input-cta-phone input[type=text] {
        border: 2px solid var(--main-green);
        height: 100%;
        padding-left: 10px;
        font-size: 16px;
        font-weight: 700;
        color: var(--main-blue-cloud);
        border-radius: 5px 0px 0px 5px;
    }

    .input-cta-phone input[type=submit] {
        border: 0px;
        height: 100%;
        padding: 0px 10px;
        font-size: 16px;
        font-weight: 700;
        color: var(--white);
        background-color: var(--main-green);
        cursor: pointer;
        border-radius: 0px 5px 5px 0px;
    }

#answerformularioLigueMe {
    display: none;
}

#formularioLigueMe {
    display: grid;
}

.mid-title {
    display: grid;
    grid-template-columns: 200px 1fr;
    align-content: center;
}

/* ------------------------------------------ Estilos de elementos internos ------------------------------------------ */
/* Página Home - Header Top */
.home-header-nova-decada {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(45deg, var(--white) 5%, var(--light-blue-cloud) 300%);
    background-repeat: no-repeat;
    background-size: cover, cover;
    background-position: top right, top right;
}

    .home-header-nova-decada .top-header-n-decada {
        display: grid;
        grid-auto-flow: column;
        /*grid-template-columns: 35% 65%;*/
        grid-template-columns: 50% 50%;
    }

.header-nova-decada-new {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(to bottom, var(--main-blue-cloud), var(--dark-blue-cloud));
    background-repeat: no-repeat;
    background-size: cover;
}

.image-system-header-top {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    z-index: 1;
}

.centering-texts {
    display: grid;
    align-content: center;
}

.list-header-top {
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 50px;
    justify-content: center;
}

    .list-header-top li {
        padding-left: 20px;
        background: url(../images/ImagesSiteNovaDecada/check-top-header-light-orange.svg) no-repeat center left;
        background-size: 15px;
        line-height: 16px;
        color: #FFE0B2;
        font-size: 16px;
        height: 20px;
    }

.ecosystem-section-header-top {
    background-image: linear-gradient(45deg, var(--main-green), var(--light-blue-cloud), var(--light-green), var(--light-blue-cloud), var(--main-blue-cloud));
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5);
    z-index: 2;
    position: relative;
}

.title-ecosystem-section {
    height: 100px;
    display: grid;
    grid-template-columns: 1fr 3fr;
}

    .title-ecosystem-section #lottie {
        width: 200px;
        margin-left: -5px;
    }

.image-right-header {
    display: grid;
    justify-content: end;
    align-content: end;
    background-image: url(../images/ImagesSiteNovaDecada/sige-cloud-ecossistema-de-gestao.png), url(../images/ImagesSiteNovaDecada/features-icons-header.svg);
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: right 50px center, left 50px center;
}

    .image-right-header img {
        height: 40px;
        margin-bottom: 10px;
        margin-right: 10px;
    }

.cta-promo {
    display: block;
    height: 50px;
    width: 100%;
    background-image: url(../images/ImagesSiteNovaDecada/back-top-bar-cta-plans.png), linear-gradient(45deg, #FF6E3C, #FFB84D 200%);
    transition: var(--all-transition);
}

    .cta-promo:hover .seal-discount-2 {
        transform: rotate(360deg);
    }

    .cta-promo:hover .prices-from-p-topbar-plans-out {
        transform: scale(1.05);
    }

    .cta-promo:hover .see-plans-topbar {
        transform: scale(1.05);
    }

.cta-promo-inner {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
}

.seal-discount-2 {
    position: absolute;
    margin: 10px 0px 0px 0px;
    height: 80px;
    width: 80px;
    background: var(--white);
    border: 1px solid var(--dark-blue-cloud);
    border-radius: 50%;
    display: grid;
    justify-content: center;
    align-content: center;
    padding-bottom: 10px;
    transition: var(--all-transition);
}

    .seal-discount-2 div {
        transform: rotate(-10deg)
    }

        .seal-discount-2 div p {
            text-align: center;
            font-size: 18px;
            color: var(--dark-blue-cloud);
            font-weight: 300;
            display: inline-block;
            width: 100%;
        }

        .seal-discount-2 div h3 {
            color: var(--orange-lite);
            text-shadow: 1px 1px var(--dark-blue-cloud);
            font-size: 16px;
            padding: 0px;
            text-align: center;
            margin-top: 10px;
            margin-bottom: -8px;
        }

            .seal-discount-2 div h3 span {
                color: var(--orange-lite);
                text-shadow: 2px 2px var(--dark-blue-cloud);
                font-size: 44px;
            }

.prices-from-p-topbar-plans-out {
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 10px;
    justify-content: center;
    transition: var(--all-transition);
}

    .prices-from-p-topbar-plans-out p {
        color: var(--white);
        text-align: center;
        line-height: 50px;
        vertical-align: middle;
        font-size: 18px;
    }

        .prices-from-p-topbar-plans-out p b {
            font-size: 21px;
            text-shadow: 0px 3px 0px var(--dark-blue-cloud);
        }

            .prices-from-p-topbar-plans-out p b span {
                font-size: 35px;
                text-shadow: 0px 3px 0px var(--dark-blue-cloud);
            }

.see-plans-topbar {
    background-color: var(--white);
    height: 30px;
    border-radius: 5px;
    color: var(--dark-blue-cloud);
    line-height: 30px;
    vertical-align: middle;
    padding: 0px 20px;
    cursor: pointer;
    margin-top: 10px;
    transition: var(--all-transition);
}

@media (max-width: 1450px) {
    .centering-texts {
        padding-top: 10px;
        align-content: start;
    }

    .header-nova-decada-new .cta-green {
        padding: 20px 40px;
        font-size: 18px;
    }
}


/* Abobe the fold EXPERIENCE */
#cta-top-index {
    animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) infinite;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
    animation-iteration-count: 1;
}

@keyframes shake {
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }

    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}

.above-the-fold-experience {
    width: 100%;
    height: auto;
    display: grid;
    grid-row-gap: 10px;
    align-content: start;
    border-radius: 20px 0px 20px 0px;
}

.line-1-experience {
    height: 150px;
    display: grid;
    grid-column-gap: 10px;
    grid-auto-flow: column;
    grid-template-columns: repeat(2, 1fr);
}

.image-top-people {
    background-color: var(--light-blue-cloud);
    background-image: url(../images/ImagesSiteNovaDecada/top-pessoa-apontando-para-o-teste-gratis.png), url(../images/ImagesSiteNovaDecada/back-passagem-10.png);
    background-repeat: no-repeat;
    background-position: left 20px bottom, right top;
    background-size: auto, cover;
    height: 100%;
    border-top-left-radius: 0px;
    display: grid;
    justify-content: end;
    align-content: center;
    padding-right: 20px;
}

.image-top-cloud {
    background-image: url(../images/telaSigeCloudBanner.png), url(../images/ImagesSiteNovaDecada/back-passagem-10.png);
    background-color: var(--light-blue-cloud);
    background-repeat: no-repeat;
    background-size: 90% auto, cover;
    background-position: center top 15px, right top;
    height: 100%;
    border-bottom-right-radius: 20px;
}

.line-2-experience {
    display: grid;
    height: 150px;
    grid-column-gap: 10px;
    grid-auto-flow: column;
    grid-template-columns: 3fr 1fr;
}

.all-sectors {
    height: 100%;
    background-color: var(--light-blue-cloud);
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), url(../images/ImagesSiteNovaDecada/top-onda-azul-back.svg);
    background-repeat: no-repeat;
    background-size: cover, 100% auto;
    background-position: right top, left top -20px;
    display: grid;
    align-content: center;
    border-top-left-radius: 20px;
}

    .all-sectors ul {
        display: grid;
        grid-auto-flow: column;
        grid-column-gap: 30px;
        justify-content: center;
        margin-top: 20px;
    }

        .all-sectors ul li {
            transition: var(--all-transition);
        }

            .all-sectors ul li:hover {
                transform: translateY(5px);
            }

            .all-sectors ul li img {
                height: 50px;
                width: auto;
            }

.delivery-div-top {
    height: 100%;
    background-color: var(--light-blue-cloud);
    background-image: url(../images/ImagesSiteNovaDecada/top-delivery-sige-cloud.png), url(../images/ImagesSiteNovaDecada/back-passagem-10.png), url(../images/ImagesSiteNovaDecada/top-onda-azul-back.svg);
    background-repeat: no-repeat;
    background-size: auto, cover, 238% auto;
    background-position: top 20px center, left 25% top, right top;
}

.poucos-cliques-top {
    background-color: var(--light-blue-cloud);
    background-image: url(../images/ImagesSiteNovaDecada/top-apontando-funcionalidades.png), url(../images/ImagesSiteNovaDecada/back-passagem-10.png), url(../images/ImagesSiteNovaDecada/top-onda-azul-back.svg);
    background-repeat: no-repeat;
    background-size: auto, cover, 250% auto;
    background-position: center bottom, right top, right top -10px;
    display: grid;
    justify-content: center;
    align-content: center;
    padding: 20px;
    transition: var(--all-transition);
}

.line-3-experience {
    height: 150px;
    background-color: var(--light-blue-cloud);
    padding: 20px;
    display: grid;
    grid-row-gap: 10px;
}

    .line-3-experience ul {
        display: grid;
        grid-auto-flow: column;
        grid-gap: 10px;
        height: 30px;
        width: auto;
    }

        .line-3-experience ul li {
            height: 30px;
            border-radius: 5px;
            background-color: var(--white);
            width: auto;
            padding: 0px 10px;
            line-height: 30px;
            vertical-align: middle;
            font-weight: 700;
            color: var(--main-blue-cloud);
            text-align: center;
            width: auto;
        }

/*== start of code for tooltips ==*/

.tool {
    cursor: help;
    position: relative;
}


    /*== common styles for both parts of tool tip ==*/
    .tool::before,
    .tool::after {
        left: 50%;
        opacity: 0;
        position: absolute;
        z-index: -100;
    }

    .tool:hover::before,
    .tool:focus::before,
    .tool:hover::after,
    .tool:focus::after {
        opacity: 1;
        transform: scale(1) translateY(0);
        z-index: 100;
    }


    /*== pointer tip ==*/
    .tool::before {
        border-style: solid;
        border-width: 1em 0.75em 0 0.75em;
        border-color: var(--dark-blue-cloud) transparent transparent transparent;
        bottom: 130%;
        content: "";
        margin-left: -0.5em;
        transition: all .65s cubic-bezier(.84,-0.18,.31,1.26), opacity .65s .5s;
        transform: scale(.6) translateY(-90%);
    }

    .tool:hover::before,
    .tool:focus::before {
        transition: all .65s cubic-bezier(.84,-0.18,.31,1.26) .2s;
    }


    /*== speech bubble ==*/
    .tool::after {
        background: var(--dark-blue-cloud);
        border-radius: .25em;
        bottom: 180%;
        color: var(--white);
        content: attr(data-tip);
        margin-left: -8.75em;
        padding: 10px 5px;
        transition: all .65s cubic-bezier(.84,-0.18,.31,1.26) .2s;
        transform: scale(.6) translateY(50%);
        width: 17.5em;
        font-size: 16px;
        line-height: 24px;
        font-weight: 700;
    }

    .tool:hover::after,
    .tool:focus::after {
        transition: all .65s cubic-bezier(.84,-0.18,.31,1.26);
    }

@media (max-width: 760px) {
    .tool::after {
        font-size: .75em;
        margin-left: -5em;
        width: 10em;
    }
}


/* Fim dos códigos relacionados a experiência do acima da dobra */


.ecosystem-items-header {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(4, 1fr);
}

    .ecosystem-items-header .gradient-loja {
        border-top-left-radius: 20px;
    }

    .ecosystem-items-header .gradient-lite {
        border-bottom-right-radius: 20px;
    }

    .ecosystem-items-header .ecosystem-item {
        padding: 30px 15px 0px 15px;
        display: grid;
        transition: var(--all-transition);
    }

        .ecosystem-items-header .ecosystem-item:hover {
            transform: scale(1.08);
            border-radius: 20px 0px 20px 0px;
            box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2)
        }

        .ecosystem-items-header .ecosystem-item div .logo-apps {
            height: 25px;
            margin-bottom: 5px;
        }

        .ecosystem-items-header .ecosystem-item div h3 {
            text-align: center;
            color: var(--white);
            font-weight: 300;
            font-size: 16px;
            width: 100%;
            border: 1px solid transparent;
        }

        .ecosystem-items-header .ecosystem-item ul {
            display: grid;
            grid-row-gap: 10px;
            margin-top: 30px;
        }

            .ecosystem-items-header .ecosystem-item ul li {
                color: var(--white);
                font-weight: 300;
                font-size: 16px;
                padding-left: 17px;
                background: url(../images/ImagesSiteNovaDecada/icon-check-green.svg) no-repeat center left;
                background-size: auto 12px;
            }

        .ecosystem-items-header .ecosystem-item .image-apps {
            margin-top: 30px;
            display: grid;
            align-content: end;
        }

            .ecosystem-items-header .ecosystem-item .image-apps img {
                width: 100%;
                height: auto;
            }

.icon-and-title {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 30% 65%;
}

    .icon-and-title li img {
        width: auto;
        height: 80px;
    }

    .icon-and-title li h3 {
        padding-left: 10px;
    }

.list-of-features {
    display: grid;
    grid-row-gap: 15px;
}

    .list-of-features li {
        font-size: 16px;
        font-weight: 300;
        padding-left: 25px;
        background: url(../images/ImagesSiteNovaDecada/icon-check-green.svg) no-repeat center left;
        background-size: auto 18px;
    }

#text-changing-home::before {
    content: "empresarial";
    animation: animate linear 5s;
    padding-left: 10px;
}

@keyframes animate {

    0% {
        content: "de vendas";
    }

    20% {
        content: "financeira";
    }

    40% {
        content: "de estoque";
    }

    60% {
        content: "fiscal";
    }

    80% {
        content: "de produção";
    }

    100% {
        content: "empresarial";
    }
}

/* Página Home - References Section */

.references-section {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(45deg, var(--main-blue-cloud), var(--dark-blue-cloud));
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right top;
}

.content-reference-side img {
    width: auto;
    border-radius: 20px;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
}

.content-reference-side p {
    width: 100%;
    display: inline-block;
}

.arrows-references {
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 10px;
}

    .arrows-references li {
        width: 50px;
        height: 50px;
        border-radius: 10px;
        background: var(--dark-blue-cloud);
        display: grid;
        align-content: center;
        justify-content: center;
        cursor: pointer;
    }

        .arrows-references li:hover {
            background: var(--main-green);
        }

.hand-written-references {
    height: 60px;
    width: auto;
    margin-bottom: 50px;
    margin-left: -50px;
}

/* Página Home - Segments Section */

.segments {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(6, 1fr);
    grid-column-gap: 20px;
}

    .segments li {
        transition: var(--all-transition);
    }

        .segments li a img {
            width: 100%;
            height: auto;
        }

        .segments li:hover {
            transform: scale(1.05);
        }

        .segments li a h3 {
            font-size: 16px;
            font-weight: 700;
            color: var(--main-blue-cloud);
            text-align: center;
            margin-top: 20px;
        }



/* Página Home - Portability Section */

.portability-section {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(var(--light-blue-cloud) 69%, var(--dark-blue-cloud) 31%);
}

.form-portability-out {
    padding: 50px 0px;
    display: grid;
    justify-content: right;
}

.form-portability {
    height: 100%;
    width: 450px;
    background: var(--white);
    border-radius: 20px;
    border: 1px solid var(--light-green);
    display: grid;
    align-content: center;
    padding: 0px 50px;
}

.form-portability-in {
    border: 1px solid red;
}

.steps-portability {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(4, 1fr);
    background: url(../images/ImagesSiteNovaDecada/dashed-line-steps.svg) no-repeat center top 19px;
}

    .steps-portability li div {
        height: 40px;
        width: 40px;
        background-color: var(--light-green);
        border-radius: 20px;
        display: grid;
        align-content: center;
        justify-content: center;
        margin: auto;
        font-size: 28px;
        font-weight: 700;
        color: var(--dark-blue-cloud);
    }

    .steps-portability li p {
        color: var(--light-green);
        font-size: 18px;
        font-weight: 300;
        line-height: 24px;
        margin-top: 20px;
        display: inline-block;
        width: 100%;
        text-align: center;
    }

.form-input-portability p {
    color: var(--dark-blue-cloud);
    font-size: 16px;
    padding-bottom: 10px;
}

.form-input-portability .input-on-portability {
    height: 50px;
    color: var(--main-blue-cloud);
    font-size: 16px;
    font-weight: 700;
    padding-left: 20px;
    width: 100%;
    background: var(--light-grey);
    border: 1px solid var(--main-blue-cloud);
    border-radius: 5px;
}

.form-input-portability .btn-on-portability {
    height: 50px;
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    width: 100%;
    text-align: center;
    background: var(--main-blue-cloud);
    border-radius: 5px;
    border: 0px;
    cursor: pointer;
}

    .form-input-portability .btn-on-portability:hover {
        background: var(--main-green);
    }

#form-portabilidade {
    display: block;
}

#answer-form-portabilidade {
    display: none;
}

/* Página Home - Comparison Table Section */
.row-comparison {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 30% 20% 12.5% 12.5% 12.5% 12.5%;
}

.line-top div {
    height: 80px;
    text-align: center;
    display: table;
}

    .line-top div h4, p {
        display: table-cell;
        vertical-align: middle;
    }

    .line-top div h4 {
        font-size: 21px;
        font-weight: 900;
        color: var(--dark-blue-cloud);
        text-align: left;
        padding-left: 20px;
    }

    .line-top div p {
        font-size: 16px;
        font-weight: 900;
        color: var(--grey);
    }

.logo-cloud-comparison {
    height: 100%;
    width: 100%;
    border-radius: 10px 10px 0px 0px;
    background: var(--dark-blue-cloud);
    display: grid;
    padding-top: 25px;
}

    .logo-cloud-comparison img {
        height: 30px;
    }

.coluna-descritiva {
    background: var(--main-blue-cloud);
    height: 50px;
    display: table;
    border-bottom: 0.5px solid #0086ff;
}

    .coluna-descritiva a {
        color: var(--white);
        font-weight: 900;
        display: inline-block;
        display: table-cell;
        vertical-align: middle;
        padding-left: 20px;
    }

        .coluna-descritiva a:hover {
            color: var(--dark-blue-cloud);
        }

.coluna-cloud {
    height: 50px;
    background: var(--dark-blue-cloud);
    text-align: center;
    vertical-align: middle;
    line-height: 50px;
}

.coluna-outros {
    height: 50px;
    background: var(--light-grey);
    text-align: center;
    border-bottom: 0.5px solid #f9f9f9;
    display: grid;
    align-content: center;
    justify-content: center;
}

.best-option {
    height: 60px;
    line-height: 60px;
    vertical-align: middle;
    background: var(--main-green);
    border-radius: 0px 0px 10px 10px;
    text-align: center;
    font-weight: 900;
    font-size: 18px;
    color: var(--white);
}

.top-left-rounded {
    border-radius: 10px 0px 0px 0px;
}

.top-right-rounded {
    border-radius: 0px 10px 0px 0px;
}

.bottom-left-rounded {
    border-radius: 0px 0px 0px 10px;
}

.bottom-right-rounded {
    border-radius: 0px 0px 10px 0px;
}

.row-licenses-price .coluna-descritiva {
    height: 70px;
    background-color: var(--light-yellow);
    border-bottom: 0.5px solid var(--yellow);
}

    .row-licenses-price .coluna-descritiva p {
        color: var(--dark-blue-cloud);
        padding-left: 20px;
        font-weight: 700;
    }

.row-licenses-price .coluna-cloud {
    height: 70px;
    background-color: var(--yellow);
}

    .row-licenses-price .coluna-cloud p {
        text-align: center;
        display: inline-block;
        width: 100%;
        color: var(--dark-blue-cloud);
        line-height: 68px;
    }

.row-licenses-price .coluna-outros {
    height: 70px;
}

.row-licenses-price .color-red {
    color: #D20202;
}

.row-licenses-price .color-green {
    color: var(--main-green);
}

/* Página Home - Integrations Section */

.integrations-section {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(45deg, var(--main-blue-cloud), var(--dark-blue-cloud));
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top right;
}

    .integrations-section .container-width {
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: 60% 40%;
    }

        .integrations-section .container-width div img {
            width: 100%;
            height: auto;
        }

.content-integrations-section {
    padding-left: 50px;
    display: grid;
    align-content: center;
}

/* Estilos para páginas internas */

/* Páginas do Ecossistema */

/* Menu Vertical e Horizontal de icones do Ecossistema */

.vertical-ecosystem-links {
    width: 40px;
    display: grid;
    background: var(--white);
    border-radius: 25px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.icon-cloud {
    padding-top: 20px;
    padding-bottom: 30px;
}

.vertical-ecosystem-links a {
    width: 40px;
    height: 40px;
    text-align: center;
    display: grid;
    align-content: center;
    justify-content: center;
}

    .vertical-ecosystem-links a svg {
        height: 20px;
        width: auto;
    }

.active-app-icon {
    width: 60px !important;
    height: 60px !important;
    margin-left: -10px;
    border-radius: 30px;
    display: grid;
    align-content: center;
    justify-content: center;
}

    .active-app-icon svg {
        fill: var(--white);
        height: 25px !important;
        width: auto;
    }

.loja-icon-selected {
    background-color: var(--light-blue-cloud);
}

.bank-icon-selected {
    background-color: var(--main-green);
}

.mobi-icon-selected {
    background-color: var(--blue-mobi);
}

.lite-icon-selected {
    background-color: var(--dark-purple-lite);
}

.talk-icon-selected {
    background-color: var(--main-blue-cloud);
}

.fill-cloud {
    stroke: var(--main-blue-cloud);
}

.fill-loja {
    fill: var(--light-blue-cloud);
}

.fill-bank {
    fill: var(--main-green);
}

.fill-mobi {
    fill: var(--blue-mobi);
}

.fill-lite {
    fill: var(--dark-purple-lite);
}

.fill-talk {
    fill: var(--dark-blue-cloud);
}


.title-top-sections-apps {
    display: grid;
    align-content: center;
    justify-content: end;
}

    .title-top-sections-apps h2 {
        color: var(--white);
        font-size: 24px;
        font-weight: 300;
        line-height: 35px;
        text-align: right;
    }

    .title-top-sections-apps a {
        display: inline-block;
        text-align: right;
    }

.inner-anchors a {
    font-weight: 700;
    color: var(--main-green);
}

    .inner-anchors a:hover {
        text-decoration: underline !important;
    }

.blocking-items-ecosystem {
    grid-template-columns: 50% 50%;
}

.gradient-patterned-loja {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--loja-gradient);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.gradient-patterned-bank {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--bank-gradient);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.gradient-patterned-mobi {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--mobi-gradient);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.gradient-patterned-lite {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--lite-gradient);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.gradient-patterned-talk {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--talk-gradient);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.gradient-patterned-cloud {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--cloud-gradient);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.gradient-patterned-cloud-light {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(45deg, var(--white) 5%, var(--light-blue-cloud) 300%);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.gradient-patterned-cont {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--cont-gradient);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.images-section-apps img {
    width: 100%;
}

/* NavBar - Páginas Ecossistema */

.nav-bar-ecosystem {
    height: 60px;
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(60deg, var(--white) 0%, var(--light-blue-cloud) 250%);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: top right;
}

    .nav-bar-ecosystem .container-width div {
        display: grid;
        align-content: center;
        height: 60px;
    }

        .nav-bar-ecosystem .container-width div img {
            height: 40px;
        }

.navbar-ecossistema {
    display: grid;
    column-gap: 35px;
    grid-auto-flow: column;
    justify-content: end;
}


    .navbar-ecossistema li a {
        color: var(--main-blue-cloud);
        font-weight: 700;
        font-size: 16px;
    }

        .navbar-ecossistema li a:hover {
            text-decoration: underline !important;
        }

.content-left-app-page {
    display: grid;
    align-content: center;
}

    .content-left-app-page img {
        height: 30px;
    }


.nav-bellow-fold {
    background-color: var(--light-green);
    padding-bottom: 100px;
    position: relative;
}

    .nav-bellow-fold ul {
        position: absolute;
        width: 70vw;
        display: grid;
        grid-auto-flow: column;
        column-gap: 20px;
        margin-top: -50px;
        grid-auto-columns: 1fr;
    }

        .nav-bellow-fold ul li a {
            background: var(--white);
            height: 130px;
            border-radius: 10px;
            display: grid;
            align-content: center;
            justify-content: center;
            transition: var(--all-transition);
        }

        .nav-bellow-fold ul li h3 {
            font-size: 16px;
            font-weight: 700;
            text-align: center;
            color: var(--main-blue-cloud);
            padding: 0px 20px;
        }

        .nav-bellow-fold ul li a:hover {
            transform: scale(1.05);
        }


.icon-nav-bellow-fold {
    text-align: center;
    margin-bottom: 10px;
}

    .icon-nav-bellow-fold svg {
        height: 40px;
        width: auto;
        fill: var(--main-green);
    }

.cont-nav-bellow-fold {
    background: #4145AA;
}

    .cont-nav-bellow-fold ul li a {
        display: grid;
        grid-template-columns: 64px 150px;
        align-items: center;
        justify-items: center;
        gap: 19px;
    }

        .cont-nav-bellow-fold ul li a svg {
            width: auto;
            height: auto;
            display: grid;
            align-items: center;
            transform: translateX(25px);
            transform: translateY(5px);
        }


        .cont-nav-bellow-fold ul li a h3 {
            padding: 0;
            width: 200px;
            text-align: start;
            font: normal normal bold 24px/35px Ubuntu;
            color: #4C76DE;
            transform: translateX(25px);
        }

.section-management-clients {
    padding: 56.14px 0;
}

.section-form-cont {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(45deg, #4a4eaf, #494db0);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.list-cont {
    display: flex;
}

    .list-cont svg {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        margin-right: 8px;
        transform: translateY(5px);
    }

.form-cont-out {
    padding: 0px 0px;
    display: grid;
    justify-content: right;
}

.form-cont {
    padding-top: 25px;
    display: grid;
    align-content: stretch;
}

.label-cont {
    font: normal normal 300 16px/24px Ubuntu !important;
    color: #666666 !important;
}

.input-on-cont {
    height: 50px;
    color: var(--main-blue-cloud);
    font-size: 16px;
    font-weight: 700;
    padding-left: 20px;
    width: 100%;
    background: var(--light-grey);
    border: 1px solid #4145AA;
    border-radius: 5px;
}

.btn-on-cont {
    border: none;
    padding: 14px 0 16px 0;
    background: var(--main-green);
    color: var(--white);
    font-size: 21px;
    width: 100%;
    font-weight: 700;
    display: inline-block;
    border-radius: 25px;
    cursor: pointer;
    box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.2);
    transition: var(--all-transition);
    margin-bottom: 25px;
}

    .btn-on-cont:hover {
        transform: scale(1.05);
    }

.lite-line-divider {
    width: 100%;
    height: 5px;
    background: var(--lite-gradient);
}

.backup-section-lite {
    background: var(--light-grey) url(../images/ImagesSiteNovaDecada/back-passagem-10.png) no-repeat center top;
    background-size: cover;
}

.list-of-features-lite {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-flow: column;
}

    .list-of-features-lite li {
        padding: 30px 20px;
        display: grid;
        align-content: center;
        text-align: center;
    }

        .list-of-features-lite li h3 {
            margin-top: 20px;
            color: var(--dark-purple-lite);
            font-weight: 300;
            font-size: 16px;
            line-height: 24px;
        }

        .list-of-features-lite li div svg {
            height: 100px;
            width: auto;
        }



.bpo-section-bank {
    background: var(--main-blue-cloud) url(../images/ImagesSiteNovaDecada/back-passagem-10.png) no-repeat center top;
    background-size: cover;
}

.other-features-bank {
    background: var(--dark-blue-cloud) url(../images/ImagesSiteNovaDecada/back-passagem-10.png) no-repeat center top;
    background-size: cover;
}

.other-features-bank-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 50px 100px;
}

.coming-soon-stamp {
    background: var(--main-green);
    margin-left: 5px;
    padding: 2px 5px;
    border-radius: 15px;
    font-weight: 700;
    font-size: 12px;
}

.tax-cards-bank li {
    height: 275px;
    display: grid;
    align-content: center;
    justify-content: center;
    border-radius: 20px;
}

    .tax-cards-bank li h3 {
        text-align: center;
    }

.green-card-bank {
    background-color: var(--main-green);
    margin-right: 50px;
}

.blue-card-bank {
    background-color: var(--dark-blue-cloud);
    margin-left: 50px;
}

.cards-bank {
    display: grid;
    grid-auto-flow: column;
}

.payments-section-loja {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(225deg, var(--main-green), var(--light-green));
    background-size: cover;
}

.foods-section-loja {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(225deg, var(--orange-lite), var(--medium-orange-lite));
    background-size: cover;
}

@media (max-width: 1450px) {
    .nav-bellow-fold ul {
        width: 90vw;
    }
}

/* 

    Estilos das novas páginas de funcionalidades

*/


/* HEADER TOP */

.header-features {
    height: auto;
    background: var(--main-blue-cloud) url(../images/homeEcossistema/back-hex-on-blue.png) no-repeat center top;
    background-size: cover;
}

    .header-features h1 {
        font-weight: 900;
        font-size: 35px;
        color: var(--white);
        text-align: center;
        max-width: 50%;
        margin: auto;
        line-height: 44px;
    }

        .header-features h1 span {
            color: var(--lighter-green);
        }

    .header-features h2 {
        font-weight: 400;
        font-size: 18px;
        color: var(--white);
        text-align: center;
        max-width: 50%;
        margin: 0px;
        margin: auto;
        padding: 0px;
        letter-spacing: 0.05em;
        line-height: 28px;
    }

        .header-features h2 span {
            font-weight: 900;
        }

    .header-features p {
        font-weight: 400;
        text-align: center;
        display: inline-block;
        width: 100%;
        font-size: 14px;
        color: var(--white);
    }

.menu-funcionalidades-header ul {
    padding: 0px !important;
    margin-bottom: 0px !important;
}

.menu-funcionalidades-header .item-feature {
    width: 17.5%;
    float: left;
    padding: 0px !important;
}

.menu-funcionalidades-header .spacing-feature {
    width: 10%;
    height: 100px;
    float: left;
    margin: 0px !important;
    padding: 0px !important;
}

.spacing-feature-13 {
    width: 13.75%;
    height: 100px;
    float: left;
    margin: 0px !important;
    padding: 0px !important;
}

.spacing-feature-27 {
    width: 27.5%;
    height: 100px;
    float: left;
    margin: 0px !important;
    padding: 0px !important;
}

.linha-2 {
    margin-top: -100px;
}

.item-menu-func-out {
    width: 100%;
    height: 190px;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: var(--main-green);
    padding: 1.5px;
    display: inline-block;
}

    .item-menu-func-out:hover {
        background: var(--lighter-green);
    }

        .item-menu-func-out:hover .item-menu-func-in {
            background: var(--main-green) url(../images/homeEcossistema/back-hex-on-blue.png) no-repeat left bottom;
        }

        .item-menu-func-out:hover h3 {
            color: var(--white);
        }

        .item-menu-func-out:hover svg {
            fill: var(--white) !important;
        }


.image-on-menu {
    width: 100%;
    height: 190px;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: var(--lighter-green) url(../images/homeEcossistema/back-hex-on-blue.png) no-repeat left bottom;
    display: inline-block;
}

.on-menu-1 {
    width: 100%;
    height: 100%;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: url(../images/FuncionalidadesImages/menu-servicos-1.svg);
    background-size: cover;
}

.on-menu-2 {
    width: 100%;
    height: 100%;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: url(../images/FuncionalidadesImages/menu-servicos-2.svg);
    background-size: cover;
}

.on-menu-3 {
    width: 100%;
    height: 100%;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: url(../images/FuncionalidadesImages/menu-compras-1.svg);
    background-size: cover;
}

.on-menu-4 {
    width: 100%;
    height: 100%;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: url(../images/FuncionalidadesImages/menu-compras-2.svg);
    background-size: cover;
}

.on-menu-5 {
    width: 100%;
    height: 100%;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: url(../images/FuncionalidadesImages/menu-producao-1.svg);
    background-size: cover;
}

.on-menu-6 {
    width: 100%;
    height: 100%;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: url(../images/FuncionalidadesImages/menu-producao-2.svg);
    background-size: cover;
}



.item-menu-func-in {
    width: 100%;
    height: 100%;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    background: var(--white) url(../images/homeEcossistema/back-hex-on-blue.png) no-repeat left bottom;
    background-size: auto 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content-item-in {
    height: auto;
    width: 60%;
    margin: auto;
}

.item-menu-func-in .icon-func svg {
    height: 40px;
    width: 100%;
    margin: auto;
    fill: var(--main-green);
}

.item-menu-func-in h3 {
    font-size: 16px;
    font-weight: 900;
    color: var(--main-blue-cloud);
    padding: 0px;
    margin: 0px;
    margin-top: 10px;
}

/* APPS Section */

.apps-section {
    display: flex;
    width: 100%;
    height: auto;
}

@media (max-width: 1025px) {

    .apps-section {
        display: initial;
        width: auto;
        height: auto;
    }

    .right-apps {
        flex: auto;
    }

    .left-apps {
        flex: auto;
    }
}


.inside-right-apps {
    max-width: 600px;
    padding: 0px 50px;
}

    .inside-right-apps h3 {
        font-size: 35px;
        max-width: 350px;
        font-weight: 900;
        text-align: left;
        margin: 0px;
        line-height: 44px;
        color: var(--white);
    }

    .inside-right-apps ul li {
        font-size: 21px;
        line-height: 28px;
        margin-bottom: 15px;
        color: var(--white);
    }

        .inside-right-apps ul li svg {
            height: 15px;
            top: 5px;
            bottom: 5px;
            width: auto;
            margin-right: 5px;
        }

        .inside-right-apps ul li span {
            font-weight: 900;
        }

.wrap-btn-apps p {
    font-size: 21px;
    font-weight: 500;
    max-width: 350px;
    color: var(--white);
}

    .wrap-btn-apps p span {
        font-weight: 900;
    }

/* Coloring */

.app-bank .left-apps {
    background: url(../images/FuncionalidadesImages/sige-bank-cliente-satisfeito.jpg) no-repeat center center;
    background-size: cover;
    flex: 1;
}

.app-bank .right-apps {
    background: var(--main-green) url(../images/homeEcossistema/back-hex-on-blue.png) no-repeat center center;
    background-size: auto 100%;
    flex: 1;
}

.app-bank .inside-right-apps ul li svg {
    fill: var(--darker-blue);
}

.app-loja .left-apps {
    background: url(../images/FuncionalidadesImages/sige-loja-clientes-satisfeitos.jpg) no-repeat center center;
    background-size: cover;
    flex: 1;
}

.image-loja-producao {
    background: url(../images/FuncionalidadesImages/image-loja-producao.jpg) no-repeat center center !important;
    background-size: cover;
}

.app-loja .right-apps {
    background-image: url(../images/homeEcossistema/back-hex-on-blue.png), linear-gradient(145deg, var(--light-blue-cloud), var(--main-blue-cloud) 80%);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto 100%;
    flex: 1;
}

.app-loja .inside-right-apps ul li svg {
    fill: var(--lighter-green);
}

.pdv-sige .left-apps {
    background: url(../images/FuncionalidadesImages/pdv-cliente-satisfeito.jpg) no-repeat center center;
    background-size: cover;
    flex: 1;
}

.pdv-sige .right-apps {
    background-image: url(../images/homeEcossistema/back-hex-on-blue.png), linear-gradient(30deg, var(--main-blue-cloud) 50%, var(--light-blue-cloud));
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto 100%;
    flex: 1;
}

.pdv-sige .inside-right-apps ul li svg {
    fill: var(--lighter-green);
}

.pdv-sige h2 {
    font-size: 24px;
    font-weight: 400;
    color: var(--white);
    line-height: 40px;
    padding: 0px;
    margin: 0px;
}

    .pdv-sige h2 span {
        font-weight: 900;
    }

.pdv-paragrafo {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

    .pdv-paragrafo span {
        font-weight: 900;
    }

.app-mobi {
    height: auto;
    background-image: url(../images/homeEcossistema/back-hex-on-blue.png), linear-gradient(90deg, var(--light-blue-cloud), var(--main-blue-cloud));
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

    .app-mobi .image-mobi {
        width: 100%;
        height: auto;
        display: block;
    }

    .app-mobi h3 {
        font-size: 28px;
        max-width: 600px;
        font-weight: 900;
        text-align: left;
        margin: 0px;
        margin: auto;
        line-height: 35px;
        color: var(--white);
        text-align: center;
    }

        .app-mobi h3 span {
            color: var(--lighter-green);
        }

    .app-mobi ul li {
        font-size: 21px;
        line-height: 28px;
        margin-bottom: 15px;
        color: var(--white);
        text-align: center;
    }

        .app-mobi ul li svg {
            height: 15px;
            top: 5px;
            bottom: 5px;
            width: auto;
            margin-right: 5px;
            fill: var(--lighter-green);
        }

        .app-mobi ul li span {
            font-weight: 900;
        }

.wrap-btn-apps p {
    font-size: 21px;
    font-weight: 500;
    max-width: 350px;
    color: var(--white);
}

    .wrap-btn-apps p span {
        font-weight: 900;
    }

/* Funcionalidade - Sections */

.ancor-next-section {
    text-align: center;
    margin: 50px 0px;
}

    .ancor-next-section a {
        display: inline-block;
    }

.funcionalidade-section .row {
    display: table;
}

    .funcionalidade-section .row > [class*='col-'] {
        float: none;
        display: table-cell;
        vertical-align: middle;
    }


.crm-div-content {
    vertical-align: bottom !important;
    bottom: 50px;
}

.funcionalidade-section .col-12 img {
    width: 100%;
}

.content-on-the-right {
    padding-left: 100px !important;
}

.content-on-the-left {
    padding-right: 100px !important;
}

.content-funcionalidade h3 {
    font-size: 28px;
    color: var(--main-blue-cloud);
    font-weight: 900;
    margin: 0px;
    padding: 0px;
    text-align: left;
    line-height: 35px;
}

.content-funcionalidade p {
    font-size: 16px;
    line-height: 28px;
    color: var(--dark-grey);
    font-weight: 400;
    margin: 0px;
    padding: 0px;
    text-align: left;
}

    .content-funcionalidade p span {
        font-weight: 900;
    }

.lancamentos-recorrentes-div {
    background: url(../images/FuncionalidadesImages/lancamentos-recorrentes-img.png) no-repeat center right 8px;
}

.gestao-de-tecnicos-div {
    background: url(../images/FuncionalidadesImages/gestao-de-tecnicos-img.png) no-repeat center right 1px;
    padding: 10px 0px 10px 0px;
}

.gestao-de-vendedores-div {
    padding: 8px 0px 8px 0px;
    background: url(../images/FuncionalidadesImages/gestao-de-vendedores-img.png) no-repeat center right 8px;
}

/* Other Features */

.other-features {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(var(--light-blue-cloud) 75%, var(--dark-blue-cloud) 25%);
    background-size: cover;
}

.items-other-features {
    grid-column-gap: 20px;
}

.items-other-features {
    grid-column-gap: 20px;
}

    .items-other-features li {
        background: var(--white);
        border-radius: 10px;
        padding: 20px;
    }

        .items-other-features li h3 {
            font-size: 16px;
            font-weight: 900;
            color: var(--main-blue-cloud);
            text-align: left;
            line-height: 28px;
            padding: 0px;
            margin: 0px;
            margin-bottom: 10px;
        }


        .items-other-features li p {
            font-size: 16px;
            font-weight: 300;
            color: var(--dark-grey);
            text-align: left;
            line-height: 24px;
        }

            .items-other-features li p span {
                font-weight: 700;
            }

/* 

    Fim dos estilos das páginas de funcionalidades

*/

/* Página de Primeiros Passos */

.basic-inputs {
    border: 1px solid var(--white);
    border-radius: 0px 10px 0px 10px;
    padding: 0px 50px;
}

    .basic-inputs h3 {
        height: 40px;
        background: var(--white);
        display: inline-block;
        width: auto;
        padding: 0px 20px;
        line-height: 40px;
        vertical-align: middle;
        color: var(--dark-blue-cloud);
        border-radius: 10px 0px 10px 0px;
        margin-top: -25px;
    }

.list-steps {
    display: grid;
    grid-auto-flow: column;
    background: url(../images/ImagesSiteNovaDecada/dashed-line-horizontal.svg) no-repeat center top 50px;
    background-size: 75% auto;
}

    .list-steps li {
        text-align: center;
    }

        .list-steps li .icon-list-step {
            height: 100px;
            width: 100px;
            border-radius: 50px;
            background-color: var(--white);
            border: 2px solid var(--main-green);
            display: grid;
            align-content: center;
            justify-content: center;
            margin: auto;
        }

            .list-steps li .icon-list-step svg {
                height: 40px;
            }

        .list-steps li p {
            color: var(--light-green);
            font-size: 14px;
            display: block;
            text-align: center;
            margin: 10px 0px;
            font-weight: 700;
        }

        .list-steps li h4 {
            color: var(--white);
            font-size: 18px;
            line-height: 24px;
            font-weight: 300;
            margin-bottom: 20px;
        }

.video-link {
    background: var(--light-green);
    border-radius: 5px;
    padding: 10px 20px;
    display: inline-block;
    color: var(--dark-blue-cloud);
    font-weight: 700;
    transition: var(--all-transition);
}

    .video-link:hover {
        background: var(--white);
    }

.content-link {
    display: inline-block;
    color: var(--white);
}

    .content-link:hover {
        color: var(--light-green);
    }

.invoice-section {
    border: 1px solid var(--white);
    border-radius: 10px 0px 10px 0px;
    padding: 0px 50px;
    background: url(../images/ImagesSiteNovaDecada/primeiros-passos-emissao-de-notas.svg) no-repeat right bottom;
    background-size: auto 100%;
}

.content-by-segment-left {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 1fr 4fr;
}

.content-by-segment-right {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 4fr 1fr;
}

.list-segment-line {
    padding: 20px 0px;
}

.list-segment-line-inner {
    height: 100%;
    background: var(--white);
    display: grid;
    align-content: center;
    padding: 50px 30px;
}

    .list-segment-line-inner ul li h4 {
        color: var(--main-blue-cloud);
        font-size: 16px;
    }

    .list-segment-line-inner ul li .content-link {
        color: var(--dark-blue-cloud);
    }

    .list-segment-line-inner ul li .video-link {
        color: var(--main-green);
        background-color: var(--white);
        border: 1px solid var(--main-green);
    }

.image-segment-line {
    width: 100% !important; /* 1:1 Aspect Ratio */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: var(--light-blue-cloud);
}

    .image-segment-line h3 {
        display: inline-block;
        border: 2px solid var(--main-blue-cloud);
        padding: 5px 10px;
        margin-top: 20px;
        border-radius: 0px 10px 0px 10px;
        background: var(--white);
        font-size: 16px;
        color: var(--main-blue-cloud);
    }

.content-by-segment-left .list-segment-line-inner {
    border-top-right-radius: 10px;
}

.content-by-segment-left .image-segment-line {
    border-radius: 0px 10px 0px 10px;
    padding-left: 20px;
}

.content-by-segment-right .list-segment-line-inner {
    border-top-left-radius: 10px;
}

.content-by-segment-right .image-segment-line {
    border-radius: 10px 0px 10px 0px;
    text-align: right;
    padding-right: 20px;
}

.segment-img-comercio {
    background-image: url(../images/ImagesSiteNovaDecada/primeiros-passos-comercial.png);
}

.segment-img-industria {
    background-image: url(../images/ImagesSiteNovaDecada/primeiros-passos-para-industria.png);
}

.segment-img-servico {
    background-image: url(../images/ImagesSiteNovaDecada/primeiros-passos-servicos.png);
}

.segment-img-ecommerce {
    background-image: url(../images/ImagesSiteNovaDecada/primeiros-passos-para-ecommerce.png);
}

.useful-links {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(5, 1fr);
    grid-column-gap: 20px;
}

    .useful-links li a {
        display: block;
        width: 100%;
        padding: 15px 0px;
        background: var(--white);
        text-align: center;
        border-radius: 5px 0px 5px 0px;
        color: var(--main-blue-cloud);
        transition: var(--all-transition);
    }

        .useful-links li a:hover {
            transform: translateY(5px)
        }

.contacts-first-steps {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 2fr 1fr;
}

.contact-div-mail {
    text-align: center;
    border: 1px solid var(--dark-blue-cloud);
    border-radius: 10px 0px 10px 0px;
    width: 100%;
    padding: 0px 30px;
}

    .contact-div-mail h3 {
        height: 30px;
        line-height: 30px;
        padding: 0px 10px;
        border: 1px solid var(--main-green);
        background-color: var(--white);
        width: auto;
        border-radius: 0px 10px 0px 10px;
        margin-top: -15px;
        transition: var(--all-transition);
    }

    .contact-div-mail p {
        display: block;
        margin-top: 5px;
        margin-bottom: 20px;
    }

        .contact-div-mail p a {
            color: var(--dark-blue-cloud);
            font-weight: 700;
        }

            .contact-div-mail p a:hover {
                color: var(--main-green);
            }

.notice-red {
    border: 1px solid #FFAFAF;
    background-color: #FFF2F2;
    height: 100%;
    padding: 0px 15px;
    display: grid;
    align-content: center;
    border-radius: 5px;
}

    .notice-red p {
        color: var(--dark-grey);
    }

/* Página do Kit de Combate a Crise */

.wrap-header {
    position: relative;
}

.header-kit-combate {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(45deg, #534151, #705D8F);
    background-size: auto 100%;
    background-position: right bottom;
    height: 705px;
    top: 0;
    left: 0;
}

.header-kit-inside {
    background: url(../images/KitDeCombateACrise/transformacao-digital-sige-cloud-2.png) no-repeat center top -9px;
    background-size: auto 100%;
    height: 765px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.nav-top-kit {
    margin: 10px 0px;
}

    .nav-top-kit .sige-cloud-kit-nav-top {
        display: grid;
        grid-auto-flow: column;
        width: 100%;
        justify-content: end;
        grid-column-gap: 10px;
    }

        .nav-top-kit .sige-cloud-kit-nav-top li {
            display: grid;
            align-content: end;
        }

            .nav-top-kit .sige-cloud-kit-nav-top li p {
                font-size: 16px;
                font-weight: 700;
                color: #705D8F;
                margin-top: -3px;
            }

            .nav-top-kit .sige-cloud-kit-nav-top li img {
                height: 30px;
            }

.h1-kit-combate {
    color: #534151;
    max-width: 55%;
}

    .h1-kit-combate b {
        color: #EC5504;
    }

.scroll-down-cta {
    height: 267px;
    display: grid;
    align-content: end;
    padding-bottom: 40px;
}

.apps-kit-header {
    width: 80%;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: repeat(5, 1fr);
    grid-column-gap: 10px;
    align-content: center;
}

    .apps-kit-header li p {
        color: #534151;
        font-size: 16px;
        line-height: 21px;
        border-left: 3px solid #EC5504;
        padding-left: 10px;
    }

.color-orange-app {
    color: #EC5504 !important;
}

.image-discount {
    text-align: right;
    margin-top: -50px;
}

.form-discount {
    background-color: #EC5504;
    margin-top: -53px;
}

    .form-discount .form-kit {
        display: grid;
        grid-auto-flow: column;
        grid-column-gap: 20px;
        grid-template-columns: repeat(4, 1fr);
        padding-top: 10px;
    }

.form-part-kit {
    display: grid;
}

.answer-form-kit {
    height: 120px;
    justify-content: center;
    align-content: center;
    display: none;
}

    .answer-form-kit p a {
        text-decoration: underline !important;
        font-weight: 700;
        color: var(--white);
    }

.form-kit li input[type=text], input[type=email] {
    height: 60px;
    width: 100%;
    background: var(--white);
    border: 1.5px solid #534151;
    border-radius: 5px;
    font-weight: 300;
    padding-left: 20px;
    font-size: 18px;
    color: #534151;
}

.form-kit li input[type=submit] {
    height: 60px;
    width: 100%;
    background: #F2E5B8;
    border: 1.5px solid #534151;
    border-radius: 30px;
    font-size: 21px;
    color: #534151;
    font-weight: 700;
    cursor: pointer;
    transition: var(--all-transition);
}

    .form-kit li input[type=submit]:hover {
        transform: scale(1.05);
    }

.content-apps-kit h2 {
    color: #534151;
}

    .content-apps-kit h2 span {
        color: #EC5504;
    }

.content-apps-kit p {
    color: #534151;
}

.items-apps-kit {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 50px;
}

    .items-apps-kit li img {
        height: 30px;
        margin-bottom: 10px;
    }

    .items-apps-kit li h3 {
        font-size: 21px;
        margin-bottom: 10px;
    }

        .items-apps-kit li h3 span {
            font-size: 16px;
            font-weight: 300;
        }

.back-grey {
    background: var(--lighter-grey);
}

.blog-content-list {
    grid-column-gap: 20px;
}

    .blog-content-list li img {
        width: 100%;
    }

    .blog-content-list li p {
        color: var(--dark-grey);
        font-size: 16px;
        line-height: 24px;
        margin-top: 10px;
        display: inline-block;
    }

    .blog-content-list li .link-to-blog-content {
        color: var(--main-green);
        font-size: 16px;
        font-weight: 700;
        display: inline-block;
        margin-top: 10px;
        padding-right: 18px;
        background: url(../images/ImagesSiteNovaDecada/arrow-right-green.svg) no-repeat top 5px right 5px;
        background-size: auto 12px;
        transition: var(--all-transition);
    }

    .blog-content-list li a:hover .link-to-blog-content {
        background-position: top 5px right;
    }

/* Responsividade da página Kit de Combate a Crise */

@media (max-width: 1400px) {
    .header-kit-combate {
        height: 650px;
    }

    .header-kit-inside {
        height: 700px;
        background-position: right -100px top -10px;
    }

    .scroll-down-cta {
        height: 212px;
    }

    .content-left-header {
        align-content: start;
    }
}

@media (max-width: 1025px) {

    .answer-form-kit {
        height: 200px;
    }

        .answer-form-kit p {
            font-size: 18px;
        }

    .header-kit-combate {
        background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(45deg, #534151, #705D8F);
        background-size: cover;
        background-position: right bottom;
        height: 650px;
    }

    .header-kit-inside {
        background-position: right -380px top -10px;
        height: 750px;
    }

    .scroll-down-cta {
        height: 194px;
    }

    .apps-kit-header {
        display: none;
    }

    .h1-kit-combate {
        max-width: 100%;
    }

    .sige-cloud-kit-nav-top {
        display: none !important;
    }

    .image-discount {
        display: none;
    }

    .form-discount {
        background-image: url(../images/KitDeCombateACrise/desconto-porcentagem.svg);
        background-repeat: no-repeat;
        background-position: left 20px top 50px;
        background-size: 50% auto;
        padding-top: 200px;
    }

        .form-discount h2 {
            font-size: 21px;
            line-height: 28px;
        }

        .form-discount .form-kit {
            grid-auto-flow: row;
            grid-row-gap: 10px;
            grid-template-columns: auto;
            padding-top: 0px;
        }

            .form-discount .form-kit li {
                padding: 0px;
            }

                .form-discount .form-kit li input {
                    height: 50px !important;
                    margin-bottom: 0px;
                }

    .items-apps-kit {
        grid-template-columns: 1fr;
        grid-gap: 30px;
    }

    .blog-content-list li {
        margin-top: 50px;
    }
}

/* Responsividade */

.hide-on-mobile {
    display: block;
}

.hide-on-desktop {
    display: none;
}

.mobile-hidden-desktop-grid {
    display: grid;
}

@media (max-width: 1025px) {

    .right-50-padding {
        padding: 0px;
    }

    .left-50-padding {
        padding: 0px;
    }

    .list-steps {
        grid-auto-flow: row;
        grid-row-gap: 50px;
        background: none;
    }

    .invoice-section {
        background: none;
        padding: 0px 20px;
    }

    .list-segment-line {
        padding: 0px;
    }

    .image-segment-line {
        height: 300px;
    }

    .content-by-segment-left {
        display: block;
    }

    .content-by-segment-right {
        display: block;
    }

    .useful-links {
        display: grid;
        grid-auto-flow: row;
        grid-template-columns: auto;
        grid-row-gap: 20px;
    }

    .notice-red {
        padding: 10px;
    }

    .size-24-mobile {
        font-size: 24px;
        line-height: 28px;
    }

    .mobile-hidden-desktop-grid {
        display: none;
    }

    .hide-on-mobile {
        display: none;
    }

    .hide-on-desktop {
        display: block;
    }

    .divided-on-2 {
        display: block;
    }

    .divided-on-3 {
        display: block;
    }

    .divided-on-4 {
        display: block;
    }

    .divided-on-6-list {
        display: grid;
        grid-auto-flow: column;
        grid-column-gap: 10px;
        grid-template-columns: repeat(6, 1fr);
    }

    .funcionalidade-section .divided-on-2 {
        display: block;
    }

    .header-features h1 {
        max-width: 100%;
    }

    .header-features h2 {
        max-width: 100%;
    }

    .nav-bellow-fold {
        display: none;
    }

    .justify-end {
        justify-content: start;
    }

    .max-100-width img {
        width: 100% !important;
    }

    .content-on-the-right {
        padding-left: 0px !important;
    }

    .content-on-the-left {
        padding-right: 0px !important;
    }

    .funcionalidade-section div img {
        width: 100%;
    }

    .pop-up-opener-out {
        display: none !important;
    }

    .nav {
        display: none;
    }

    .list-cta-footer {
        display: grid;
        grid-auto-flow: row;
        width: 100%;
        justify-content: start;
        margin: 0px;
        padding: 0px;
    }

        .list-cta-footer li {
            width: 100%;
            margin-bottom: 10px;
        }

    .links-footer {
        display: grid;
        grid-auto-flow: dense;
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 20px;
        grid-row-gap: 50px;
    }


    .footer-signature {
        display: grid;
        grid-auto-flow: row;
        height: auto;
    }

        .footer-signature p {
            vertical-align: middle;
            text-align: center;
            line-height: 24px;
            font-size: 14px;
            text-align: center;
            width: 100%;
            display: inline-block;
            margin-bottom: 20px;
        }

    .footer-mobi-div-out {
        display: grid;
        justify-content: start;
    }

    .footer-mobi-div {
        display: none;
    }

    .top-footer {
        display: grid;
        grid-auto-flow: row;
        grid-row-gap: 20px;
        grid-auto-columns: auto;
    }

    .footer-brand-cloud {
        display: grid;
        grid-auto-flow: row;
        justify-content: start;
        grid-row-gap: 10px;
    }

    .btLigamosParaVoceFixo {
        display: none;
    }

    .cta-green {
        padding: 15px 30px;
        background: var(--main-green);
        color: var(--white);
        font-size: 16px;
    }

    .cta-green-squared {
        padding: 15px 30px;
        font-size: 16px;
    }

    .items-other-features li {
        margin-bottom: 20px;
    }

    .cta-footer-phone {
        display: none;
    }

    .input-cta-phone {
        margin-top: 10px;
        height: 50px;
    }
}

/* ----------------------------------------------- Estilos especiais para as páginas de Áreas de Atuação ----------------------------------------------- */

/* Features */

.line-conection-bg {
    background: url(../images/ImagesNovasAreas/vertical-line.svg) repeat-y left 52px center;
}

.border-bottom-grey {
    border-bottom: 2px solid var(--light-grey);
}

.border-right-grey {
    border-right: 2px solid var(--light-grey);
}

.left-side-of-the-feature {
    padding-left: 50px !important;
}

.inside-features-on-top {
    padding: 50px 0px;
}

    .inside-features-on-top h2 {
        font-size: 24px;
        line-height: 28px;
        font-weight: 700;
        text-align: left;
        color: var(--main-blue-cloud);
        padding-right: 50px;
    }

    .inside-features-on-top .image-svg {
        width: auto;
        height: 200px;
    }

        .inside-features-on-top .image-svg svg {
            height: 100%;
            width: auto;
        }

.icon-feature-hex {
    width: 105px;
    height: 100px;
    -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
    padding-top: 30px;
}

.blue-hex {
    background: var(--dark-blue-cloud);
}

.green-hex {
    background: var(--main-green);
}

.icon-feature-hex svg {
    height: 40px;
    width: 100%;
    fill: var(--white);
}

.items-features {
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    grid-column-gap: 20px;
}

    .items-features .coluna-2 {
        width: auto;
        padding-right: 20px;
        display: grid;
        align-content: center;
    }

        .items-features .coluna-2 a {
            font-size: 16px;
            font-weight: 700;
            text-align: left;
            color: var(--dark-grey);
        }

            .items-features .coluna-2 a:hover {
                color: var(--main-green);
            }

.divider-arrow {
    background: url(../images/ImagesNovasAreas/divider-arrow.svg) no-repeat center top;
    height: 23px;
}

@media (max-width: 1023px) {

    .img-top-header img {
        margin-top: 50px;
        width: 100%;
    }

    .img-top-sections img {
        width: 100%;
    }

    .border-bottom-grey {
        border: 0px;
    }

    .border-right-grey {
        border: 0px;
    }

    .left-side-of-the-feature {
        padding: 0px !important;
    }

    .ecosystem-items-header {
        display: grid;
        grid-auto-flow: row;
        grid-template-columns: auto;
    }


    .inside-features-on-top .image-svg {
        display: none;
    }

    .inside-features-on-top {
        padding: 25px 0px;
    }

        .inside-features-on-top h2 {
            font-size: 18px;
            text-align: center;
            padding: 0px;
        }

    .div-top-sections .content-top-sections {
        margin-bottom: 50px;
    }

    .div-top-sections {
        background: url(../images/ImagesNovasAreas/back-rounded-top-sections.svg) no-repeat center bottom !important;
    }
}

/* Sections por grupos de funcionalidades */

.div-top-sections {
    background: url(../images/ImagesNovasAreas/back-rounded-top-sections.svg) no-repeat center top;
    min-height: 647px;
}

.img-top-sections img {
    max-height: 600px;
}

.content-top-sections p span {
    font-weight: 700;
}

.dark-div-bottom {
    background: #003B81;
}

.items-div-bottom-sections div {
    text-align: center;
    padding: 20px;
}

    .items-div-bottom-sections div svg {
        height: 60px;
        width: 100%;
        fill: var(--light-blue-cloud);
    }

    .items-div-bottom-sections div p {
        text-align: center;
        padding: 0px;
        font-size: 16px;
        line-height: 24px;
    }

        .items-div-bottom-sections div p span {
            font-weight: 700;
        }

    .items-div-bottom-sections div h4 {
        padding: 10px 0px 10px 0px;
        font-size: 21px;
        font-weight: 700;
    }

.dark-div-bottom .items-div-bottom-sections div h4 {
    color: var(--white);
}

.dark-div-bottom .items-div-bottom-sections div p {
    color: var(--white);
}

.light-div-bottom .items-div-bottom-sections div h4 {
    color: var(--main-blue-cloud);
}

.light-div-bottom .items-div-bottom-sections div p {
    color: var(--dark-grey);
}

/* ----------------------------------------------- Estilos da página de Portabilidade ----------------------------------------------- */

.passos-portabilidade li {
    height: 30px;
    line-height: 30px;
    vertical-align: middle;
    margin-bottom: 15px;
}

    .passos-portabilidade li p {
        font-size: 16px;
        font-weight: 300;
        color: var(--dark-blue-cloud);
    }

        .passos-portabilidade li p span {
            height: 30px;
            width: 30px;
            border: 1px solid var(--main-green);
            display: inline-block;
            text-align: center;
            border-radius: 15px;
            margin-right: 10px;
            font-weight: 900;
            color: var(--main-green);
        }

.form-portabilidade {
    height: 550px;
    padding: 0px 25px 0px 25px;
    border: 2px solid var(--main-green);
    box-shadow: 0px 0px 5px 0px rgba(0, 200, 83, 0.50);
    background: var(--white);
    max-width: 400px;
    border-radius: 10px 0px 10px 0px;
}

.form-portabilidade-inputs {
    display: grid;
    grid-row-gap: 20px;
}

    .form-portabilidade-inputs li p {
        font-size: 16px;
        color: var(--main-blue-cloud);
        font-weight: 700;
        padding-bottom: 10px;
    }

    .form-portabilidade-inputs li input[type=text], input[type=email] {
        height: 50px;
        border-radius: 5px;
        background: var(--lighter-grey);
        font-size: 16px;
        border: 1px solid var(--light-grey);
        margin: 0px;
        font-weight: 300;
        width: 100%;
        padding-left: 20px;
    }

    .form-portabilidade-inputs li input[type=submit] {
        height: 50px;
        border-radius: 25px;
        background: var(--main-green);
        font-size: 18px;
        margin: 0px;
        font-weight: 700;
        width: 100%;
        border: 0px;
        color: var(--white);
        cursor: pointer;
    }

.partners ul {
    display: grid;
    grid-auto-flow: column;
}

    .partners ul li {
        display: grid;
        align-content: center;
        justify-content: center;
    }

        .partners ul li p {
            color: var(--dark-blue-cloud);
            font-size: 16px;
            width: 100%;
            line-height: 24px;
        }

            .partners ul li p a {
                color: var(--main-green);
                font-size: 14px;
                font-weight: 700;
            }

        .partners ul li img {
            height: 45px;
            margin-left: 20px;
            opacity: 0.6;
        }

            .partners ul li img:hover {
                opacity: 1;
            }

.you-re-here {
    background: var(--white) url(../images/ImagesSiteNovaDecada/Portabilidade/background-problemas-com-meu-erp.png) no-repeat center top;
    background-size: 100% auto;
    min-height: 843px;
}

.cta-changing-system {
    height: 200px;
    margin-top: -100px;
    border-radius: 10px 0px 10px 0px;
    padding: 0px 50px;
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 50% 50%;
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(245deg, var(--white) 10%, var(--light-blue-cloud) 300%);
    background-repeat: no-repeat;
    background-size: cover, cover;
    background-position: top right, top right;
    z-index: 5;
    position: relative;
}

.left-side-of-the-cta-changing {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 50px 100%;
    grid-column-gap: 20px;
}

.cloud-differentials {
    margin-top: -100px;
    padding-top: 100px;
    z-index: 0;
}

.cloud-differentials-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
}

    .cloud-differentials-list li {
        background-color: var(--white);
        border: 1px solid var(--dark-blue-cloud);
        box-shadow: 3px 3px 0px 0px var(--lighter-green);
        border-radius: 5px 0px 5px 0px;
    }

        .cloud-differentials-list li a {
            display: block;
            width: 100%;
            height: 100%;
            padding: 20px;
        }

            .cloud-differentials-list li a p {
                color: var(--main-blue-cloud);
                font-size: 16px;
                line-height: 24px;
            }

            .cloud-differentials-list li a div {
                color: var(--main-green);
                font-size: 16px;
                font-weight: 700;
                background: url(../images/ImagesSiteNovaDecada/arrow-right-green.svg) no-repeat bottom 3px right 5px;
                background-size: auto 10px;
                padding-right: 15px;
                width: auto;
                display: inline-block;
                transition: var(--all-transition);
                margin-top: 50px;
            }

            .cloud-differentials-list li a:hover div {
                background-position: bottom 3px right;
            }

.differentials-image img {
    position: relative;
    margin-bottom: -70px;
    width: 92%;
}

.all-sectors-integrated {
    background: var(--dark-blue-cloud);
}

.features-portability {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 30px;
}

    .features-portability div svg {
        height: 40px;
        fill: var(--white);
    }

    .features-portability h3 {
        font-size: 16px;
        color: var(--lighter-green);
        line-height: 21px;
        margin-top: 20px;
    }

    .features-portability p {
        font-size: 16px;
        color: var(--white);
        line-height: 24px;
        padding-top: 10px;
    }

@media (max-width: 1400px) {

    .you-re-here {
        background-size: auto 100%;
    }
}


@media (max-width: 1023px) {

    .passos-portabilidade li p span {
        height: auto;
        width: auto;
        border: none;
        border-radius: 0px;
        margin-right: 5px;
        font-weight: 900;
        color: var(--main-green);
    }

    .form-portabilidade {
        padding: 10px;
        height: 480px;
    }

        .form-portabilidade div h3 {
            font-size: 21px;
            line-height: 28px;
        }

    .you-re-here {
        background: var(--white) url(../images/ImagesSiteNovaDecada/Portabilidade/background-problemas-com-meu-erp-mobile.png) no-repeat center top;
        background-size: 100% auto;
        min-height: 750px;
    }

    .cta-changing-system {
        height: 300px;
        margin-top: -150px;
        border-radius: 10px 0px 10px 0px;
        padding: 20px;
        display: block;
    }

    .left-side-of-the-cta-changing {
        display: block;
    }

        .left-side-of-the-cta-changing p {
            padding-top: 10px;
        }

    .left-side-of-the-cta-changing {
        margin-top: 20px;
    }

    .cloud-differentials-list {
        grid-template-columns: 1fr;
    }

    .cloud-differentials {
        margin-top: -150px;
        padding-top: 150px;
    }

    .subtitle-mobile {
        text-align: left;
        padding-top: 10px;
    }

    .features-portability {
        grid-template-columns: 1fr;
    }
}

.download-talk-section {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient(to right, var(--dark-blue-cloud) 50%, var(--light-grey) 50%);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

.links-download-os {
    display: grid;
    justify-content: center;
    align-content: center;
}

    .links-download-os ul {
        display: grid;
        grid-auto-flow: column;
        grid-column-gap: 20px;
    }

        .links-download-os ul li {
            height: 100px;
            width: 100px;
            border: 1px solid var(--dark-blue-cloud);
            border-radius: 10px 0px 10px 0px;
            transition: var(--all-transition);
        }

            .links-download-os ul li:hover {
                border-radius: 0px 10px 0px 10px;
            }

            .links-download-os ul li a {
                display: block;
                height: 100%;
                width: 100%;
                display: grid;
                align-content: center;
                justify-content: center;
            }

                .links-download-os ul li a div {
                    text-align: center;
                }

                    .links-download-os ul li a div svg {
                        height: 50px;
                        width: auto;
                    }

                    .links-download-os ul li a div p {
                        font-size: 16px;
                        color: var(--dark-blue-cloud);
                    }

/* Estilos da página - Central de Integrações */

.gradient-div-integrations {
    background-image: linear-gradient(145deg, var(--dark-blue-cloud), var(--main-blue-cloud));
}

.filters-integrations {
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 30px;
    justify-content: center;
}

    .filters-integrations li a {
        color: var(--white);
        padding: 5px 0px;
    }

        .filters-integrations li a:hover {
            border-bottom: 2px solid var(--white);
        }

.active-filter-integration {
    border-bottom: 2px solid var(--white);
}

.integrations-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 10px;
}

    .integrations-list li a {
        height: 50px;
        border-radius: 5px;
        background: var(--lighter-green);
        color: var(--dark-blue-cloud);
        display: inline-block;
        line-height: 50px;
        vertical-align: middle;
        font-size: 18px;
        font-weight: 700;
        width: 100%;
        text-align: center;
        transition: var(--all-transition);
    }

        .integrations-list li a:hover {
            background: var(--white);
        }

.logo-integration-item {
    width: 300px;
    height: 300px;
    display: grid;
    align-content: center;
    justify-content: center;
    background-color: var(--white);
    border: 2px solid var(--dark-blue-cloud);
    border-radius: 20px 0px 20px 0px;
    position: absolute;
    margin-top: 50px;
}

    .logo-integration-item img {
        max-width: 200px;
    }

.content-integration-item {
    height: 400px;
    position: relative;
    display: grid;
    align-content: center;
    background: var(--lighter-grey);
    border-radius: 20px 0px 20px 0px;
}

    .content-integration-item h3 {
        font-size: 28px;
        color: var(--main-blue-cloud);
    }

        .content-integration-item h3 span {
            font-size: 16px;
            color: var(--dark-blue-cloud);
        }

    .content-integration-item p {
        font-size: 16px;
        color: var(--dark-grey);
        line-height: 24px;
    }

.integration-item-left .logo-integration-item {
    margin-left: -150px;
}

.integration-item-left .content-integration-item {
    padding: 0px 100px 0px 250px;
    margin-left: 150px;
}

.integration-item-right .logo-integration-item {
    right: 0px;
    margin-right: -150px;
}

.integration-item-right .content-integration-item {
    padding: 0px 250px 0px 100px;
    margin-right: 150px;
}

/* Responsividade da página - Central de Integrações */


@media (max-width: 1023px) {

    .filters-integrations {
        display: none;
    }

    .integrations-list {
        grid-template-columns: repeat(1, 1fr);
    }

    .logo-integration-item {
        width: 100%;
        height: 300px;
        position: initial;
        margin: 0px !important;
        padding: 0px !important;
        left: 0 !important;
        right: auto !important;
        margin-bottom: 20px !important;
    }

    .content-integration-item {
        height: auto;
        position: initial;
        padding: 20px !important;
        margin: 0px !important;
    }


    .cta-green-small {
        padding: 15px 0px;
        width: 100%;
        text-align: center;
    }
}

/* Página Trabalhe Conosco */

.job-opportunity-container {
    background-image: url(../images/ImagesSiteNovaDecada/back-squares-light-30.png), linear-gradient(45deg, #200DFF, #0074FF);
    background-blend-mode: multiply;
    background-size: cover;
}

    .job-opportunity-container .divided-3 {
        gap: 20px;
        color: #707070;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-auto-flow: column;
    }

        .job-opportunity-container .divided-3 .size-24 {
            font-weight: bold;
        }

.opportunity {
    width: 100%;
    background-color: white;
    border-radius: 5px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    row-gap: 20px;
}

    .opportunity .char {
        display: flex;
        flex-wrap: wrap;
        column-gap: 10px;
        row-gap: 5px;
        font-size: 16px;
    }

.section-tag {
    border-radius: 5px;
    border: 1px solid #707070;
    padding: 4px 15px;
    width: max-content;
}

    .section-tag.orange {
        border-color: #FF7119;
        background-color: #FF7119;
        color: white;
    }

    .section-tag.purple {
        border-color: #624DF7;
        background-color: #624DF7;
        color: white;
    }

    .section-tag.cyan {
        border-color: #3CCCCF;
        background-color: #3CCCCF;
        color: white;
    }

.opportunity .text-over {
    max-height: 133px;
    overflow: hidden;
    position: relative;
}

    .opportunity .text-over::after {
        content: "";
        position: absolute;
        inset: 0;
        height: 100%;
        width: 100%;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 1) 100%);
    }

.opportunity .cta-redirect-opportunity {
    display: flex;
    align-items: center;
    column-gap: 10px;
    cursor: pointer;
    width: max-content;
    margin-top: auto;
}


.work-with-us-header {
    background-image: url(../images/ImagesSiteNovaDecada/back-squares-light-30.png), linear-gradient(45deg, var(--yellow), var(--light-yellow) 150%);
}

.fixed-container {
    position: fixed;
    height: 100vh;
    width: 100vw;
    background-color: #EDEDED;
    display: none;
    z-index: 10000;
    top: 0;
    overflow: auto;
}

    .fixed-container .alert-popup {
        position: fixed;
        height: 100vh;
        width: 100vw;
        background-color: rgba(112, 112, 112, 0.75);
        display: none;
    }

        .fixed-container .alert-popup .alert-content {
            border-radius: 10px;
            background-color: white;
            width: 400px;
            display: flex;
            flex-direction: column;
            row-gap: 20px;
            margin: 125px auto 0 auto;
            height: max-content;
            padding: 20px 40px;
            text-align: center;
        }

            .fixed-container .alert-popup .alert-content span:nth-child(1) {
                color: #200DFF;
            }

            .fixed-container .alert-popup .alert-content span:nth-child(2) {
                color: #707070;
            }

            .fixed-container .alert-popup .alert-content a {
                width: 200px;
                height: 40px;
                border: 1px solid #00C853;
                border-radius: 5px;
                color: #00C853;
                font-size: 18px;
                margin: auto;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;
            }

    .fixed-container .header {
        height: 80px;
        background-color: #FFFFFF;
    }

        .fixed-container .header .container-width {
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 80px;
        }

            .fixed-container .header .container-width a {
                display: flex;
                align-items: center;
                column-gap: 10px;
                font-weight: bold;
                color: #200DFF;
                cursor: pointer;
            }

            .fixed-container .header .container-width img {
                height: 40px;
            }

    .fixed-container .content {
        width: 100%;
        margin-top: 50px;
        min-height: 700px;
        display: grid;
        grid-template-columns: 1fr 375px;
        color: #707070;
    }

        .fixed-container .content .left {
            width: 100%;
            background-color: #FFFFFF;
            border-radius: 5px 0 0 5px;
            padding: 25px;
            display: flex;
            flex-direction: column;
            row-gap: 20px;
        }

            .fixed-container .content .left .divided-on-2 {
                margin-top: 20px;
                column-gap: 30px;
            }

            .fixed-container .content .left ul {
                list-style: inherit;
                padding-left: 15px;
                margin-top: 20px;
            }

            .fixed-container .content .left .title {
                display: flex;
                column-gap: 20px;
                align-items: center;
            }

                .fixed-container .content .left .title .section-tag {
                    font-size: 18px;
                }

        .fixed-container .content .right {
            width: 100%;
            background-color: #200DFF;
            border-radius: 0 5px 5px 0;
            padding: 25px;
            display: flex;
            flex-direction: column;
            row-gap: 20px;
            text-align: inherit;
        }

            .fixed-container .content .right h1,
            .fixed-container .content .right span {
                font-weight: normal !important;
            }

    .fixed-container .form-container label {
        color: white;
        font-weight: bold;
        margin-bottom: -6px;
    }

    .fixed-container .form-container input[type="text"],
    .fixed-container .form-container input[type="email"] {
        border: none;
        border-radius: 3px;
        padding: 5px 15px;
        height: 40px;
        color: #3F3F3F;
        font-size: 16px;
    }

    .fixed-container .form-container input[type="file"] {
        height: 0;
        overflow: hidden;
        width: 0;
    }

    .fixed-container .form-container .btn-file-upload {
        display: flex;
        align-items: center;
        justify-content: center;
        column-gap: 15px;
        border: 1px solid white;
        border-radius: 3px;
        height: 40px;
        cursor: pointer;
    }

    .fixed-container .form-container .desc-file {
        color: white;
        font-size: 14px;
    }

    .fixed-container .form-container .cta-green-squared {
        border: none;
        cursor: pointer;
    }

        .fixed-container .form-container .cta-green-squared:hover {
            transform: scale(1.0);
        }

        .fixed-container .form-container .cta-green-squared:active {
            transform: scale(.98);
        }

@media (max-width: 1025px) {
    .job-opportunity-container .divided-3 {
        grid-template-columns: 1fr;
        grid-auto-flow: row;
    }

    .fixed-container .content {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 710px) {
    .fixed-container .content .left .title {
        align-items: inherit;
        flex-direction: column;
        gap: 10px;
    }

    .fixed-container .content .left ul {
        margin-top: 10px;
    }
}

.divider {
    width: 100%;
    height: 1px;
    background-color: #B7B7B7;
}

.flex-column {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
}

    .flex-column > div {
        display: flex;
        flex-direction: column;
        row-gap: 10px;
    }

.line-50-dark-blue {
    height: 5px;
    width: 50px;
    background: var(--dark-blue-cloud);
    margin-bottom: 10px;
}

.shadow-lined {
    text-shadow: 2px 2px 0px var(--yellow);
}

.content-left-workus {
    padding-left: 15vw;
}

.items-right-workus {
    padding-right: 15vw;
    margin-left: 92.5px;
}

.light-blue-background {
    background: #28D8DE url(../images/ImagesSiteNovaDecada/back-squares-light-30.png) no-repeat right top;
}

.yellow-background {
    background: var(--yellow) url(../images/ImagesSiteNovaDecada/back-squares-light-30.png) no-repeat right top;
}

.list-items-workus {
    margin-left: -92.5px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 20px;
}

    .list-items-workus li {
        height: 185px;
        border-radius: 5px 0px 5px 0px;
        border: 1px solid var(--yellow);
        background-color: var(--white);
        display: grid;
        align-content: center;
        text-align: center;
        padding: 0px 10px;
        box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
    }

        .list-items-workus li div svg {
            height: 80px;
            width: auto;
        }

        .list-items-workus li h3 {
            margin-top: 10px;
            font-size: 16px;
            font-weight: 300;
            color: var(--main-blue-cloud);
            line-height: 21px;
        }

.dark-blue-background {
    background-color: var(--dark-blue-cloud);
}

.list-of-locations {
    margin: 0px 100px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 50px;
}

    .list-of-locations li {
        background: url(../images/ImagesSiteNovaDecada/ver-mapa-cta.svg) no-repeat right bottom;
    }

        .list-of-locations li div {
            width: 100%;
            height: 200px;
            border-radius: 5px 0px 5px 0px;
            border: 1px solid var(--yellow);
        }

        .list-of-locations li p {
            font-size: 16px;
            color: var(--dark-blue-cloud);
            line-height: 24px;
            padding-top: 10px;
        }

        .list-of-locations li h3 {
            font-size: 18px;
            color: var(--main-blue-cloud);
            padding-top: 10px;
        }

.image-feliz {
    background: url(../images/ImagesSiteNovaDecada/cidade-feliz.png) no-repeat center top;
}

.image-caxias {
    background: url(../images/ImagesSiteNovaDecada/cidade-caxias-do-sul.png) no-repeat center top;
}

.image-florianopolis {
    background: url(../images/ImagesSiteNovaDecada/cidade-florianopolis.png) no-repeat center top;
}

.workus-section-form {
    background-image: url(../images/ImagesSiteNovaDecada/back-squares-light-30.png), radial-gradient(var(--dark-blue-cloud), var(--main-blue-cloud));
    background-size: cover;
}

.form-space-workus {
    max-width: 500px;
    margin: auto;
    background: var(--white);
    border-radius: 10px 10px 0px 0px;
    border: 1px solid var(--yellow);
    border-bottom: 0px;
}

.top-part-form-workups {
    background-color: var(--yellow);
    text-align: center;
    border-radius: 10px 10px 0px 0px;
    display: grid;
    align-content: center;
    padding: 30px 50px;
}

.workus-form {
    display: grid;
    margin: 0px 50px;
    grid-row-gap: 20px;
}

    .workus-form li p {
        font-size: 16px;
        color: var(--dark-blue-cloud);
        font-weight: 700;
        padding-bottom: 5px;
    }

    .workus-form li input[type=text], input[type="email"] {
        width: 100%;
        height: 50px;
        border-radius: 3px;
        border: 1px solid var(--dark-blue-cloud);
        background: var(--lighter-grey);
        padding-left: 20px;
        font-size: 16px;
        color: var(--dark-blue-cloud);
    }

    .workus-form li textarea {
        width: 100%;
        height: 100px;
        border-radius: 3px;
        border: 1px solid var(--dark-blue-cloud);
        background: var(--lighter-grey);
        padding-left: 20px;
        padding-top: 10px;
        font-size: 16px;
        color: var(--dark-blue-cloud);
        resize: none;
    }

.trabalheConoscoBtn {
    height: 50px;
    text-align: center;
    background: var(--yellow);
    border: 1px solid var(--dark-blue-cloud);
    width: 100%;
    border-radius: 50px;
    font-size: 21px;
    font-weight: 700;
    color: var(--dark-blue-cloud);
}

@media (max-width: 1023px) {
    .list-items-workus {
        grid-template-columns: 1fr 1fr;
        margin: 0px;
    }

    .content-left-workus {
        padding: 50px 5vw;
    }

        .content-left-workus .size-55 {
            font-size: 35px;
            line-height: 44px;
        }

    .items-right-workus {
        margin: 0px;
        padding: 5vw;
    }

    .list-of-locations {
        margin: 0px;
        grid-template-columns: 1fr;
        grid-row-gap: 50px;
    }

    .form-space-workus {
        margin: 0px 5vw;
    }

    .top-part-form-workups {
        padding: 20px;
    }

    .workus-form {
        margin: 0px;
        padding: 0px 5vw 0px 4.5vw;
    }

        .workus-form li input[type=text], input[type="email"] {
            width: 100%;
        }
}

#form-work-with-us-answer {
    padding: 0px 50px;
    display: none;
}

/* Vertical de Turismo! */

.menu-features-new {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 20px;
}

    .menu-features-new h2 {
        font-size: 18px;
        font-weight: 700;
        color: var(--main-blue-cloud);
        margin-bottom: 20px;
    }

    .menu-features-new ul {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 20px;
    }

        .menu-features-new ul li {
            border-radius: 10px;
            transition: var(--all-transition);
        }

            .menu-features-new ul li a {
                text-align: center;
                font-size: 16px;
                line-height: 24px;
                color: var(--dark-blue-cloud);
                background: url(../images/ImagesSiteNovaDecada/icon-check-green.svg) no-repeat center left;
                padding-left: 20px;
                background-size: auto 15px;
            }

            .menu-features-new ul li:hover {
                transform: translateY(-5px);
            }

.img-futebol {
    margin-bottom: -200px;
}

.aligned-on-left-items div {
    text-align: left;
}

    .aligned-on-left-items div p {
        text-align: left;
    }

    .aligned-on-left-items div svg {
        display: grid;
        width: auto;
    }

.blue-div-bottom {
    background: var(--main-blue-cloud) !important;
}

.cta-inner-bottom-div {
    background: var(--dark-blue-cloud);
    height: 100px;
    display: grid;
    align-content: center;
}

@media (max-width: 1023px) {



    .menu-features-new {
        grid-template-columns: 1fr;
        grid-row-gap: 40px;
    }

    .title-ecosystem-section {
        grid-template-columns: 1fr;
        height: auto;
        padding: 30px 0px;
    }

        .title-ecosystem-section h2 {
            text-align: left;
        }

    .ecosystem-items-header .gradient-talk {
        border-top-right-radius: 0px;
    }

    .cta-inner-bottom-div {
        height: auto;
        padding-top: 75px;
        padding-bottom: 20px;
        text-align: center;
    }

    .img-futebol {
        margin-bottom: -55px;
    }
}


/* Layout da Página Termos e Condições, Parceiros*/

.section-title {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), linear-gradient( 45deg, var(--main-blue-cloud), var(--dark-blue-cloud));
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top right;
}

.content-termos {
    max-width: 960px;
    margin: 0 auto;
}

.url-resize {
    word-wrap: break-word;
    word-break: break-all;
}

.content-parceiros {
    width: 100%;
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    overflow: hidden;
    align-content: center;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

    .content-parceiros a {
        width: 20vw;
        height: 180px;
        background-color: #fff;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 50%;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        border: 2px solid #e5e5e5;
        margin-bottom: 3rem;
        margin-left: 1.5rem;
        margin-right: 1.5rem;
        cursor: pointer;
    }

.parceiros-div {
    width: 100%;
    background: #fff;
    display: grid;
    position: relative;
    z-index: 10;
}

.imgLogoParceiro {
    max-width: 400px;
    min-width: 200px;
    width: 30vw;
    max-height: 150px;
    min-height: 100px;
    background-color: #fff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50%;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 100px;
    border: 2px solid #e5e5e5;
    margin: 0 auto;
    margin-bottom: -125px;
}

@media(max-width: 1023px) {
    .content-parceiros a {
        width: 90%;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
        background-size: 60%;
        margin-left: 0;
        margin-right: 0;
    }

    .imgLogoParceiro {
        background-size: 70%;
    }
}

/* Cases de Sucesso */

.slider {
    width: 100%;
    margin: 0 auto;
}

.listaDeCases {
    width: 100%;
    display: flex;
    margin-top: 30px;
    flex-wrap: wrap;
    justify-content: center;
}

    .listaDeCases .bgCase {
        width: 28%;
        margin: 0 30px 80px 30px;
    }

        .listaDeCases .bgCase .thumbVideo {
            width: 100%;
            height: 170px;
            border-radius: 20px;
            background-color: #2577f6;
            position: relative;
            overflow: hidden;
            display: flex;
            align-items: center;
            justify-content: center;
        }

            .listaDeCases .bgCase .thumbVideo svg {
                display: block;
                width: 50px;
                height: 50px;
                position: relative;
            }

            .listaDeCases .bgCase .thumbVideo .imagem {
                width: 100%;
                position: absolute;
                height: 170px;
                background-position: center;
                background-repeat: no-repeat;
                background-size: cover;
                opacity: 0.5;
                left: 0;
                top: 0;
            }

        .listaDeCases .bgCase p {
            font-size: 16px;
            text-align: center;
            color: #365b99;
            margin-top: 15px;
            display: block;
        }

        .listaDeCases .bgCase a {
            cursor: pointer;
        }


.bgModal {
    position: fixed;
    opacity: 0;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 2000;
}

    .bgModal .modal {
        width: 90vw;
        height: 90vh;
        left: 5vw;
        top: 5vh;
        background: #fff;
        position: absolute;
    }

        .bgModal .modal .btFechar {
            width: 30px;
            height: 30px;
            right: 0;
            position: absolute;
            background: #2cc3ff;
            -webkit-border-radius: 20px;
            -moz-border-radius: 20px;
            border-radius: 20px;
            margin: -15px -15px 0 0;
            cursor: pointer;
        }

            .bgModal .modal .btFechar svg {
                fill: #fff;
                width: 13px;
                margin: 8px auto 0 auto;
                display: block;
            }

    .bgModal iframe {
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
    }

.bgModalVisivel {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 1;
}

@media(max-width: 1023px) {
    .listaDeCases .bgCase {
        width: 100%;
    }
}


/* Cases de Sucesso */

.formContato {
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 7rem;
    position: relative;
    justify-content: space-between;
}

    .formContato .textBox {
        width: 100%;
        border: 0;
        height: 100%;
        color: #666;
        resize: none;
        padding: 0;
        margin: 0;
        text-decoration: none;
        outline: none;
    }



.meioCampo {
    width: 48%;
    height: 60px;
    background: #fff;
    margin-bottom: 3rem;
}

    .meioCampo svg {
        position: absolute;
        width: 16px;
        fill: #2cc3ff;
        right: 0;
        top: 0;
        transform: rotate( -90deg );
        right: 1.5rem;
        top: 38%;
    }


.campoInteiro {
    width: 100%;
    height: 60px;
    background: #fff;
    margin-bottom: 3rem;
}

.campoMensagem {
    width: 100%;
    height: 150px;
    background: #fff;
}

.meioCampo, .campoInteiro, .campoMensagem {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 2px solid #e7e7e7;
    padding: 1rem 2.5rem;
    position: relative;
    font-size: 16px;
}

    .meioCampo::before, .campoInteiro::before, .campoMensagem::before {
        content: "";
        position: absolute;
        bottom: -2px;
        width: 10%;
        background: #2cc3ff;
        left: 2.5rem;
        height: 2px;
    }

.formContato .actionButton {
    float: right;
    border: 2px solid #2cc3ff;
    background: #fff;
    color: #2cc3ff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -ms-transform: scale(0.7);
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
    position: absolute;
    right: 0;
    transform-origin: right bottom;
    bottom: 0;
    cursor: pointer;
    padding: 20px;
    font-size: 21px;
    text-align: center;
}

.formContato .mensagem {
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-family: "Ubuntu", sans-serif !important;
}


.msgEnviadaComSucesso {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    opacity: 1;
    width: 60%;
    height: 45%;
    max-height: 400px;
    padding: 3rem;
    border: 1px solid #ccc;
    border-radius: 10px;
    display: none;
    z-index: 1000;
}

    .msgEnviadaComSucesso svg {
        display: block;
        width: 5vw;
        fill: #01d71f;
        margin: 0 auto;
        -moz-animation: envioDeMensagem 3s 1;
        -webkit-animation: envioDeMensagem 3s 1;
        animation: envioDeMensagem 3s 1;
    }

    .msgEnviadaComSucesso p {
        text-align: center;
        font-size: 1.6rem;
        color: #666;
        line-height: 2rem;
    }

    .msgEnviadaComSucesso a {
        width: 200px;
        margin: 0 auto;
        cursor: pointer;
    }

    .msgEnviadaComSucesso b {
        text-align: center;
        font-size: 3vw;
        color: #01d71f;
    }

.box-svg {
    margin-bottom: 3rem;
}

.wrap-mensagem {
    width: 100vw;
    height: 100vw;
    position: absolute;
    top: 0;
    left: 0;
    background-color: black;
    opacity: 0.6;
    z-index: 100;
    overflow: hidden;
    display: none;
}

.bottom-modal {
    position: absolute;
    bottom: 6%;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100px;
}


.meioCampo select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 100%;
    background: #fff;
    border: 0;
    cursor: pointer;
    color: var(--grey);
    outline: none;
}

@media(max-width: 1023px) {
    .meioCampo {
        width: 100%;
        margin-bottom: 2rem;
    }
}

@media(max-width: 700px) {
    .msgEnviadaComSucesso {
        width: 95%;
        height: 50%;
    }

        .msgEnviadaComSucesso svg {
            width: 50px;
        }

        .msgEnviadaComSucesso h1 {
            font-size: 24px;
        }

        .msgEnviadaComSucesso p {
            font-size: 18px;
        }
}

@media(max-width: 450px) {

    .box-svg {
        margin-bottom: 1rem;
    }

    .msgEnviadaComSucesso h1 {
        font-size: 21px;
    }

    .msgEnviadaComSucesso p {
        font-size: 16px;
    }
}


/* Página Certificado Digital */

.bg-top-certificados-page {
    background-image: linear-gradient(var(--main-blue-cloud) 50%, #F7C14D 50%);
}

.background-main-red {
    background-color: #C00D0D;
}

.container-menu-certificado-digital .imagem-certificado img {
    margin-top: 20px;
}

container-menu-certificado-digital div:nth-child(2) {
    padding: 20px;
}

.container-certificado-digital {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 60px 160px 160px 160px 160px;
    justify-content: center;
    position: relative;
    z-index: 2;
}

    .container-certificado-digital div {
        text-align: center;
        display: grid;
        align-content: center;
    }

    .container-certificado-digital .bg-white {
        background-color: var(--white);
    }

    .container-certificado-digital .bg-grey {
        background-color: var(--light-grey);
    }

    .container-certificado-digital div:nth-child(12) {
    }

    .container-certificado-digital div:nth-child(1) {
        grid-column: 2 / 3;
        border-start-start-radius: 10px;
        border-start-end-radius: 10px;
    }

        .container-certificado-digital div:nth-child(1) img {
            width: 160px;
            height: 26px;
            margin: auto;
        }

    .container-certificado-digital div:nth-child(2) {
        color: white;
    }

    .container-certificado-digital div:nth-child(3) {
        color: white;
    }

    .container-certificado-digital div:nth-child(4) {
        border-start-start-radius: 10px;
    }

    .container-certificado-digital div:nth-child(7) {
        border-start-end-radius: 10px;
    }

    .container-certificado-digital div:nth-child(16) {
        border-end-start-radius: 10px;
    }



    .container-certificado-digital div:nth-child(19) {
        border-end-end-radius: 10px;
    }

@media (max-width: 1024px) {

    .container-certificado-digital div:nth-child(1) {
        grid-column: 1 / 5;
        grid-row: 1 / 2;
    }

    .background-none {
        background-color: transparent !important;
    }

    .container-certificado-digital div:nth-child(4) {
        border-radius: 0px;
        grid-column: 1 / 3;
        grid-row: 2 / 3;
    }

    .container-certificado-digital div:nth-child(5) {
        grid-column: 3 / 5;
        grid-row: 2 / 3;
    }

    .container-certificado-digital div:nth-child(8) {
        grid-column: 1 / 3;
        grid-row: 3 / 4;
    }

    .container-certificado-digital div:nth-child(9) {
        grid-column: 3 / 5;
        grid-row: 3 / 4;
    }

    .container-certificado-digital div:nth-child(12) {
        grid-column: 1 / 3;
        grid-row: 4 / 5;
    }

    .container-certificado-digital div:nth-child(13) {
        grid-column: 3 / 5;
        grid-row: 4 / 5;
    }

    .container-certificado-digital div:nth-child(16) {
        grid-column: 1 / 3;
        grid-row: 5 / 6;
        border-end-start-radius: 10px;
    }

    .container-certificado-digital div:nth-child(17) {
        grid-column: 3 / 5;
        grid-row: 5 / 6;
        border-end-end-radius: 10px;
    }


    .container-certificado-digital div:nth-child(2) {
        display: none;
    }

    .container-certificado-digital div:nth-child(3) {
        display: none;
    }

    .container-certificado-digital div:nth-child(6) {
        display: none;
    }

    .container-certificado-digital div:nth-child(7) {
        display: none;
    }

    .container-certificado-digital div:nth-child(10) {
        display: none;
    }

    .container-certificado-digital div:nth-child(11) {
        display: none;
    }

    .container-certificado-digital div:nth-child(14) {
        display: none;
    }

    .container-certificado-digital div:nth-child(15) {
        display: none;
    }

    .container-certificado-digital div:nth-child(18) {
        display: none;
    }

    .container-certificado-digital div:nth-child(19) {
        display: none;
    }



    .textos-certificado-digital {
        padding: 0px;
    }

    .segments {
        grid-template-columns: repeat(2, 1fr) !important;
        grid-auto-flow: initial;
        grid-gap: 20px;
    }

    .right-110-padding {
        padding: 0px;
    }

    .container-menu-certificado-digital .imagem-certificado img {
        width: 300px !important;
    }

    .container-menu-certificado-digital .imagem-certificado {
        margin-top: 10px;
        text-align: center !important;
    }

    .textos-certificado-digital {
        padding-right: 0px !important;
    }
}

@media (max-width: 1400px) {

    .container-menu-certificado-digital .imagem-certificado {
        text-align: end;
    }

        .container-menu-certificado-digital .imagem-certificado img {
            width: 500px;
        }
}

@media (max-width: 1600px) {
    .container-menu-certificado-digital .imagem-certificado {
        text-align: end;
    }

        .container-menu-certificado-digital .imagem-certificado img {
            width: 450px;
        }
}


.select-year-month {
    padding: 5px;
    border-radius: 100px;
    border: 2px solid #FFDC19;
    margin: auto;
    max-width: 400px;
}

    .select-year-month ul {
        display: grid;
        grid-template-columns: 1fr 1fr;
        border-radius: 100px;
        padding: 5px;
    }

        .select-year-month ul li {
            height: 40px;
        }

            .select-year-month ul li a {
                display: inline-block;
                height: 100%;
                width: 100%;
                border-radius: 100px;
                text-align: center;
                line-height: 40px;
                vertical-align: middle;
                font-size: 18px;
                font-weight: 700;
                cursor: pointer;
                color: #FFDC19;
            }

            .select-year-month ul li .inactive-link-year-month:hover {
                text-decoration: underline !important;
            }

            .select-year-month ul li .active-link-year-month {
                background: #FFDC19;
                color: var(--dark-blue-cloud);
            }


.green-btn-certificado {
    padding: 10px;
    width: auto;
    align-content: center;
    background: var(--main-green);
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    display: inline-block;
    margin: 0px 20px;
    margin-top: 10px;
    border-radius: 5px;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.2);
    transition: var(--all-transition);
}

    .green-btn-certificado:hover {
        transform: scale(1.05);
    }

@media (max-width: 1024px) {
    .green-btn-certificado {
        border-start-start-radius: 0px;
        border-end-start-radius: 0px;
        margin: 0px 0px !important;
        margin-top: 10px !important;
    }
}



/*--- Link do certificado digital  -----*/

.link-certificado-digital {
    height: 80px;
}

    .link-certificado-digital .itens {
        align-items: center;
        height: 80px;
    }

    .link-certificado-digital .grid-column {
        align-items: center;
    }

    .link-certificado-digital .imagem-texto {
        justify-content: start;
        grid-column-gap: 10px;
    }


    .link-certificado-digital .botao {
        display: grid;
        justify-content: end;
    }

        .link-certificado-digital .botao a {
            padding: 10px;
            border-radius: 5px;
        }

            .link-certificado-digital .botao a:visited {
                color: var(--dark-blue-cloud);
            }






/*-- Telefonia nova empresarial --*/

.gradient-patterned-telefone-nova-empresa {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--talk-gradient);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

    .gradient-patterned-telefone-nova-empresa .texto-pensou-sige {
        align-items: end;
    }

        .gradient-patterned-telefone-nova-empresa .texto-pensou-sige div {
            margin-left: auto;
        }

    .gradient-patterned-telefone-nova-empresa .texto-internet-6gb {
        padding: 30px 25px;
        border: 1px solid #00FF96;
        align-items: center;
        border-radius: 10px;
    }

        .gradient-patterned-telefone-nova-empresa .texto-internet-6gb .btn-experimente-gratis {
            text-align: end;
        }


content-left-app-page-2 {
    display: grid;
}

.content-left-app-page-2 img {
    height: 30px;
}

.conheca-nossos-planos {
    background-image: url(../images/ImagesSiteNovaDecada/back-passagem-10.png), var(--new-telephone);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: cover;
}

    .conheca-nossos-planos .grid-nossos-planos {
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: 40% 60%;
    }

    .conheca-nossos-planos .divided-on-3 {
        grid-column-gap: 20px;
    }

    .conheca-nossos-planos .grid-nossos-planos div {
        display: grid;
        align-items: center;
    }


    .conheca-nossos-planos .divided-on-3 li {
        position: relative;
    }

    .conheca-nossos-planos .divided-on-3 img {
        width: 100%;
    }


    .conheca-nossos-planos .grid-bottom {
        display: grid;
        align-items: end;
    }

.titulo-planos-1, .titulo-planos-2 {
    position: absolute;
    width: 100%;
    font-size: 36px;
    top: -7%;
    display: grid;
    justify-items: center;
}

    .titulo-planos-1 p {
        background-color: var(--dark-blue-cloud);
        text-align: center;
        color: #00FF96;
        padding: 5px 35px;
        border-radius: 5px;
    }

    .titulo-planos-2 p {
        background-color: #00FF96;
        text-align: center;
        color: var(--dark-blue-cloud);
        border-radius: 5px;
        padding: 5px 35px;
    }

.titulo-mais-escolhido {
    background-color: #200DFF;
    color: #00FF96;
    height: 100px;
    display: grid;
    justify-items: center;
    align-items: center;
    border-start-start-radius: 5px;
    border-start-end-radius: 5px;
}


.border-bottom {
    border-bottom: 1px solid;
    width: 100%;
}

.border-test {
    border: 2px solid red;
}

.preco-nossos-planos {
    background-color: #200DFF;
    border-end-start-radius: 5px;
    border-end-end-radius: 5px;
}

    .preco-nossos-planos .grid-nossos-planos {
        grid-column-gap: 10px;
    }

    .preco-nossos-planos .padding {
        padding: 20px 80px;
    }





.imagem-nossos-planos {
    position: relative;
}


/*lista de imagem*/
/*Usado em telefonia-nova-empresarial*/


.itens-novos-produtos-1 {
    padding-right: 10px;
}

.itens-novos-produtos-2 {
    padding-left: 10px;
}

.infos-novos-produtos {
    padding-top: 20px;
}

    .infos-novos-produtos .divided-on-60-40 {
        grid-column-gap: 5px;
    }

.novos-produtos {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 30% 1fr;
    border: 1px solid #00FF96;
    border-radius: 10px;
    background-color: var(--white);
    grid-column-gap: 20px;
}


@media(max-width: 1360px) {
    .preco-nossos-planos .size-48 {
        font-size: 40px !important;
        height: fit-content;
    }

    .texto-rodape {
        font-size: 16px;
    }
}

@media(max-width: 1224px) {
    .lista-telefonia-nova .divided-on-2 img {
        width: 450px;
    }



    .novos-produtos {
        grid-auto-flow: initial;
        grid-template-columns: 1fr;
    }

        .novos-produtos div {
            text-align: center
        }

    .infos-novos-produtos {
        padding: 0px 50px 50px 50px;
    }
}

@media (max-width: 1024px) {
    .itens-novos-produtos-1 {
        padding-right: 0px;
    }

    .itens-novos-produtos-2 {
        padding-left: 0px;
    }

    .gradient-patterned-telefone-nova-empresa img {
        display: none;
    }

    .gradient-patterned-telefone-nova-empresa .divided-on-60-40 {
        grid-template-columns: 1fr
    }

    .gradient-patterned-telefone-nova-empresa .texto-pensou-sige {
        display: grid !important;
    }

    .gradient-patterned-telefone-nova-empresa .texto-internet-6gb {
        display: grid !important;
    }

    .texto-imagem-telefonia-nova .justify-end {
        justify-content: center !important;
        margin-top: 50px;
    }


    .novos-produtos {
        margin-bottom: 50px;
    }

    .conheca-nossos-planos .divided-on-3 {
        grid-row-gap: 60px;
    }

        .conheca-nossos-planos .divided-on-3 .imagem-nossos-planos {
            text-align: center;
        }

        .conheca-nossos-planos .divided-on-3 img {
            width: 350px;
        }

        .conheca-nossos-planos .divided-on-3 li {
            text-align: -webkit-center;
            margin-bottom: 80px;
        }

        .conheca-nossos-planos .divided-on-3 .titulo-mais-escolhido {
            text-align: -webkit-center;
            width: fit-content;
            padding: 0px 43px;
        }

        .conheca-nossos-planos .divided-on-3 .preco-nossos-planos {
            text-align: -webkit-center;
            width: fit-content;
        }

    .lista-telefonia-nova .justify-end, .lista-telefonia-nova .center-align {
        justify-content: center;
    }

    .lista-telefonia-nova .divided-on-2 {
        display: grid !important;
        grid-auto-flow: initial;
        grid-row-gap: 50px;
        grid-template-columns: 1fr;
    }


    .titulo-planos-1, .titulo-planos-2 {
        top: -6%;
    }

    .lista-telefonia-nova .left {
        text-align: center;
    }


    .lista-telefonia-nova .space-of-100 {
        height: 100px !important;
    }
}

@media(max-width: 630px) {

    .lista-telefonia-nova .divided-on-2 img {
        width: 300px;
    }

    .gradient-patterned-telefone-nova-empresa .texto-pensou-sige {
        display: block !important;
        margin-top: 20px;
    }

        .gradient-patterned-telefone-nova-empresa .texto-pensou-sige .size-35 {
            font-size: 28px;
        }

        .gradient-patterned-telefone-nova-empresa .texto-pensou-sige .size-21 {
            font-size: 19px;
        }

    .gradient-patterned-telefone-nova-empresa .texto-internet-6gb {
        display: block !important;
    }

        .gradient-patterned-telefone-nova-empresa .texto-internet-6gb .btn-experimente-gratis {
            text-align: start;
            margin-top: 20px;
        }


    .conheca-nossos-planos .grid-nossos-planos {
        grid-template-columns: 1fr;
        margin-bottom: 30px;
        text-align: center;
    }

        .conheca-nossos-planos .grid-nossos-planos div {
            display: none;
        }

    .titulo-planos-1, .titulo-planos-2 {
    }

    .infos-novos-produtos .size-48 {
        font-size: 28px !important;
        height: fit-content;
    }

    .texto-imagem-telefonia-nova img {
        width: 310px;
    }

    .conheca-nossos-planos .divided-on-3 img {
        width: 348px;
    }

    .conheca-nossos-planos .divided-on-3 .imagem-nossos-planos-imgNossosPlanos3 img {
        width: 323px;
    }

    .infos-novos-produtos .divided-on-60-40 {
        align-items: end;
    }

    .preco-nossos-planos .imgNossosPlanos3 .padding {
        padding: 20px 98px !important;
    }
}

@media(max-width: 400px) {
    .conheca-nossos-planos .divided-on-3 img {
        width: 322px;
    }
}


/*
       Página de Franquias
    */

.lista-funcoes-sistema {
    width: 95vw;
    margin: auto;
}

    .lista-funcoes-sistema .container-width {
        padding: 50px 0px;
    }

    .lista-funcoes-sistema > div {
        border-radius: 20px;
    }

.bg-lighter-blue {
    background-color: #E9F9FF;
}

.bg-lighter-yellow {
    background-color: #FFF9ED;
}

.lista-funcoes-sistema .divided-on-8 {
    grid-column-gap: 50px;
    grid-row-gap: 65px;
}

.svg-arrow {
    position: relative;
    width: 100%;
}

.lista-funcoes-sistema .svg-arrow .blue-arrow-up {
    position: absolute;
    left: 85%;
    margin-top: -125px;
}

.lista-funcoes-sistema .svg-arrow .yellow-arrow-down {
    position: absolute;
    left: 8%;
    margin-top: -125px;
}

.franquia-centralizar-gestao {
    height: 400px;
}

    .franquia-centralizar-gestao .imagem-centralizar-gestao {
        position: relative;
    }

        .franquia-centralizar-gestao .imagem-centralizar-gestao img {
            position: absolute;
            right: 0px;
            top: -50px;
        }

.lista-diferenciais-competitivos .divided-on-4 {
    grid-column-gap: 10px;
}

    .lista-diferenciais-competitivos .divided-on-4 div {
        text-align: -webkit-center;
    }

    .lista-diferenciais-competitivos .divided-on-4 li {
        background-color: var(--white);
        border: 1px solid var(--grey);
        border-radius: 10px;
        text-align: center;
        padding: 20px 35px;
    }

.lista-diferenciais-competitivos .container-width > div {
    position: relative;
}

.titulo-diferenciais-competitivos {
    padding: 75px 285px 0px 285px;
}

.lista-diferenciais-competitivos .svg-arrow .blue-arrow-up {
    position: absolute;
    left: 85%;
    bottom: -12%;
}

.lista-diferenciais-competitivos .svg-arrow .white-arrow-down {
    position: absolute;
    left: 8%;
}

.fora-da-caixa img {
    width: 100%;
}

.sistema-erp-franquia .img-top-sections img {
    width: 100%;
}

.menu-header-franquias .grid-column {
    grid-column-gap: 10px;
}

@media(max-width: 1224px) {

    .lista-diferenciais-competitivos .divided-on-4 {
        display: grid;
        grid-row-gap: 15px;
        grid-auto-flow: initial;
        grid-template-columns: 1fr;
    }

    .franquia-centralizar-gestao .divided-on-2 {
        grid-template-columns: 1fr;
    }

    .imagem-centralizar-gestao {
        display: none;
    }

    .comapre-teste-entenda .justify-end {
        justify-content: center;
    }

    .solucao-lojas-redes .div-imagem {
        text-align: -webkit-center;
    }

    .divided-on-2 {
        display: grid;
        grid-auto-flow: initial;
        grid-template-columns: 1fr;
        grid-row-gap: 50px;
    }

    .fora-da-caixa .div-imagem {
        text-align: center;
    }

    .titulo-diferenciais-competitivos {
        padding: 85px 0px 0px 0px;
    }

    .head-franquia .img-top-header img {
        display: none;
    }

    .dashboard-gerencial-franquias .justify-end {
        justify-content: center;
    }

    .sistema-erp-franquia .img-top-sections {
        text-align: -webkit-center;
    }

    .bring-it-down {
        order: 2;
    }

    .lista-diferenciais-competitivos .divided-on-4 {
        grid-row-gap: 10px;
    }
}

@media(max-width: 600px) {
    .lista-diferenciais-competitivos .svg-arrow .blue-arrow-up, .lista-funcoes-sistema .svg-arrow .blue-arrow-up, .yellow-arrow-down {
        display: none;
    }

    .lista-funcoes-sistema .divided-on-8 li div, .lista-funcoes-sistema .divided-on-8 li p {
        text-align: -webkit-center;
    }

    .franquia-centralizar-gestao .size-44 {
        font-size: 29px;
    }
}



/*Página de planos*/
/*Configurações de css referentesw à página planos*/




.banner-top-plan-inner {
    position: relative;
}

    .banner-top-plan-inner .shadow {
        text-shadow: 2px 2px #0074FF;
    }

    .banner-top-plan-inner .botao {
        position: relative;
        z-index: 2;
        margin-top: -14px;
    }

    .banner-top-plan-inner .imagem {
        margin-top: -135px;
    }

    .banner-top-plan-inner .nav-cta {
        text-align: center;
        height: 80px !important;
        width: 100%;
        padding: 10px 45px;
        background: var(--main-green);
        color: var(--white) !important;
        border-radius: 5px;
        line-height: 24px !important;
    }

.plan-entire-page-inner .nav-cta:hover {
    border: none !important;
    transform: scale(1.1);
}



.plans-description-top {
    margin-top: 30px;
}

/* HomePage - 2022 */

.header-top-2022 {
    height: 100%;
    display: grid;
    grid-template-rows: 1fr 220px;
    background-image: url(../images/NovasImagens2022/pattern-main-2022.png), linear-gradient(292deg, #0056B3 0%, #0074FF 25%, #00AEEF 50%, #0074FF 75%, #003F8C 100%);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center, center center;
}

.top-header-2022 .container-width, .divided-on-2 {
    height: 100%;
}

.header-top-2022 .image-on-top {
    display: grid;
    align-content: center !important;
    position: relative;
    align-content: center;
}

    .header-top-2022 .image-on-top img {
        max-height: 90%;
        align-self: center;
        transition: all 0.4s ease-in-out;
    }

.content-top-2022 h2 {
    font: normal normal bold 21px/21px;
    color: var(--white);
}

.content-top-2022 h1 {
    font-size: 28px/44px;
    font-weight: 100;
    color: var(--white);
    margin-top: 20px;
    line-height: 50px;
}

.content-top-2022 ul {
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    align-content: center;
    margin-top: 50px;
}

/* CTA's novos 2022 */

.cta-2022-blue {
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    grid-column-gap: 20px;
    height: 50px;
    align-content: center;
    background-color: var(--dark-blue-cloud);
    border-radius: 50px;
    padding-left: 20px;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.5);
}

    .cta-2022-blue p {
        color: var(--white);
        line-height: 46px;
        vertical-align: middle;
        font-size: 18px;
    }

    .cta-2022-blue div {
        height: 46px;
        width: 46px;
        border-radius: 50px;
        background-color: #00FF96;
        margin-right: 2px;
        display: grid;
        align-content: center;
        justify-content: center;
        transition: all 0.4s ease-in-out;
    }

    .cta-2022-blue:hover div {
        transform: rotate(360deg);
    }


.cta-2022-green-arrow div {
    height: 55px;
    width: 30px;
    border-radius: 50px;
    margin-right: 2px;
    display: grid;
    align-content: center;
    justify-content: center;
    transition: all 0.4s ease-in-out;
}

.cta-2022-green-arrow:hover div {
    width: 35px;
}

.cta-2022-green {
    display: grid;
    grid-auto-flow: column;
    justify-content: start;
    grid-column-gap: 20px;
    height: 55px;
    align-content: center;
    background-color: #00FF96;
    border-radius: 50px;
    padding-left: 20px;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.5);
}

    .cta-2022-green p {
        color: var(--dark-blue-cloud);
        line-height: 46px;
        vertical-align: middle;
        font-size: 22px;
    }

    .cta-2022-green div {
        height: 46px;
        width: 46px;
        border-radius: 50px;
        background-color: var(--dark-blue-cloud);
        margin-right: 2px;
        display: grid;
        align-content: center;
        justify-content: center;
        transition: all 0.5s ease-in-out;
    }

/*    .cta-2022-green:hover div {
        transform: rotate(360deg);
    }*/

.cta-hover:hover .cta-2022-green div {
    transform: rotate(360deg);
}

.cta-hover:hover .cta-2022-green-arrow div {
    width: 40px;
}

.divided-on-2:has(.cta-hover:hover) .image-on-top img {
    transform: scale(1.02);
}

.link-to-plans-top {
    display: grid;
    align-content: center;
    padding-left: 20px;
}

    .link-to-plans-top a {
        color: #00FF96;
        font-size: 18px;
    }

.bottom-header-2022 {
    background-color: #F1F1F1;
    display: grid;
    align-content: center;
}

    .bottom-header-2022 h3 {
        color: var(--dark-blue-cloud);
        font-size: 24px;
        font-weight: 300;
        line-height: 35px;
    }

.scroll-to-plans-side {
    display: grid;
    justify-content: end;
    align-content: center;
}

    .scroll-to-plans-side a {
        display: grid;
        grid-auto-flow: column;
        justify-content: end;
        align-content: center;
        line-height: 40px;
        vertical-align: middle;
        font-size: 18px;
        column-gap: 20px;
        color: var(--main-blue-cloud);
    }

/* Tabela nova de preços */

.tabela-de-planos-2022 {
    background: #f1f1f1;
}

    .tabela-de-planos-2022 ul {
        display: grid;
        grid-template-columns: repeat(4,1fr);
        grid-column-gap: 10px;
    }

        .tabela-de-planos-2022 ul li {
            background-color: var(--white);
            border-radius: 10px;
            transition: all 0.5s ease-in-out;
        }

            .tabela-de-planos-2022 ul li:hover {
                transform: scale(1.02);
                box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2)
            }


.bg-economico {
    height: 120px;
    background: url(../images/NovasImagens2022/planos-1.png) no-repeat center center;
    background-size: cover;
    border-radius: 10px 10px 0px 0px;
}

.bg-intermediario {
    height: 120px;
    background: url(../images/NovasImagens2022/planos-2.png) no-repeat center center;
    background-size: cover;
    border-radius: 10px 10px 0px 0px;
}

.bg-profissional {
    height: 120px;
    background: url(../images/NovasImagens2022/planos-3.png) no-repeat center center;
    background-size: cover;
    border-radius: 10px 10px 0px 0px;
}

.bg-ultra {
    height: 120px;
    background: url(../images/NovasImagens2022/planos-4.png) no-repeat center center;
    background-size: cover;
    border-radius: 10px 10px 0px 0px;
}

.coluna-plano-in {
    padding: 20px;
}

.title-plano {
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
    align-content: center;
    margin-bottom: 20px;
}

    .title-plano h4 {
        color: #FF9600;
        font-weight: 900;
        font-size: 21px;
    }

    .title-plano p {
        font-weight: 900;
        color: var(--dark-grey);
        font-size: 12px;
        padding-top: 4px;
    }

.list-of-features-nova-tabela {
    display: grid;
    grid-auto-flow: row;
    row-gap: 5px;
    margin-bottom: 20px;
}

    .list-of-features-nova-tabela a {
        background: url(../images/NovasImagens2022/orange-arrow-right.svg) no-repeat center left;
        padding-left: 11px;
        color: var(--main-blue-cloud);
    }

.not-in-the-plan {
    text-decoration: line-through !important;
    color: var(--grey) !important;
}

.price-on-table-2022 {
    color: var(--grey);
    font-size: 16px;
    font-weight: 400;
    display: inline-block;
    width: 100%;
}

    .price-on-table-2022 b {
        font-size: 28px;
        color: var(--main-green);
    }

.price-on-table-before-discount {
    font-size: 16px;
    color: #bdbdbd;
    margin-bottom: 5px;
    display: none;
}

    .price-on-table-before-discount b {
        text-decoration: line-through;
    }

.cta-on-table-2022 {
    display: inline-block;
    margin-top: 20px;
    height: 50px;
    border-radius: 25px;
    background-color: var(--main-blue-cloud);
    width: 100%;
    text-align: center;
    line-height: 50px;
    vertical-align: middle;
    color: var(--white);
}

.label-on-table-2022 {
    text-align: center;
    display: inline-block;
    width: 100%;
    font-size: 14px;
    margin-top: 20px;
    color: #FF9600;
}

.asteriscos-tabela-2022 {
    font-size: 15px;
    text-align: center;
    color: var(--grey);
    display: inline-block;
    width: 100%;
    margin-top: 20px;
}

.aplicar-desconto-2022 {
    display: grid;
    align-content: center;
    justify-content: center;
    grid-auto-flow: column;
    padding: 20px 0px;
    grid-column-gap: 40px;
}

    .aplicar-desconto-2022 p {
        font-size: 20px;
        color: #FD4857;
        font-weight: 700;
    }

        .aplicar-desconto-2022 p b {
            font-size: 24px;
        }

    .aplicar-desconto-2022 a {
        padding: 20px;
        border-radius: 50px;
        border: 1px solid #FD4857;
        color: #FD4857;
        font-size: 18px;
        font-weight: 700;
        text-decoration: underline !important;
    }

/* Estilos ecossistema seção nova */

.ecossistema-2022-section {
    background-image: url(../images/NovasImagens2022/pattern-main-2022.png), linear-gradient(241deg, #42ffff 0%, #0187bf 60%, #65b1ff 100%);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center, center center;
    padding: 100px 0px;
}

.ecossistema-2022-section-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-content: center;
}

.ecosystem-new-vertical {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 10px;
}

    .ecosystem-new-vertical .ecosystem-item {
        padding: 30px 15px 0px 15px;
        display: grid;
        transition: var(--all-transition);
        border-radius: 10px;
    }

        .ecosystem-new-vertical .ecosystem-item:hover {
            transform: scale(1.02);
            box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2)
        }

        .ecosystem-new-vertical .ecosystem-item div .logo-apps {
            height: 25px;
            margin-bottom: 5px;
        }

        .ecosystem-new-vertical .ecosystem-item div h3 {
            text-align: center;
            color: var(--dark-blue-cloud);
            font-weight: 300;
            font-size: 16px;
            width: 100%;
            border: 1px solid transparent;
        }

        .ecosystem-new-vertical .ecosystem-item ul {
            display: grid;
            grid-row-gap: 10px;
            margin-top: 30px;
        }

            .ecosystem-new-vertical .ecosystem-item ul li {
                color: var(--dark-blue-cloud);
                font-weight: 300;
                font-size: 16px;
                padding-left: 17px;
                background: url(../images/ImagesSiteNovaDecada/icon-check-green.svg) no-repeat center left;
                background-size: auto 12px;
            }

        .ecosystem-new-vertical .ecosystem-item .image-apps {
            margin-top: 30px;
            display: grid;
            align-content: end;
        }

            .ecosystem-new-vertical .ecosystem-item .image-apps img {
                width: 100%;
                height: auto;
            }


.content-ecossistema-2022 h1 {
    color: #fff;
    font-size: 35px;
    color: var(--dark-blue-cloud);
}

.content-ecossistema-2022 h3 {
    font: 24px/44px;
    font-weight: 700;
    color: var(--dark-blue-cloud);
    text-transform: uppercase;
}

.content-ecossistema-2022 h2 {
    font-size: 30px;
    font-weight: 200;
    line-height: 44px;
    color: #FFFFFF;
    margin-top: 20px;
    margin-bottom: 40px;
    padding-right: 50px;
}

.link-with-arrow-on-left {
    font-size: 18px;
    font-weight: 500;
    color: var(--dark-blue-cloud);
    margin-top: 40px;
    background: url(../images/NovasImagens2022/arrow-dark-blue-right.svg) no-repeat center left;
    padding-left: 12px;
}

/* Ferramentas básicas section */

.ferramentas-basicas-section {
    background-color: #f1f1f1;
    padding: 100px;
}

.title-ferramentas-basicas {
    display: grid;
    grid-auto-flow: column;
    justify-content: space-between;
    align-content: center;
}

    .title-ferramentas-basicas h2 {
        font-size: 28px;
        color: var(--dark-blue-cloud);
        font-weight: 300;
        padding-top: 8px;
    }

.ferramentas-basicas-section ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 40px;
    margin-top: 100px;
}

    .ferramentas-basicas-section ul li {
        display: grid;
        row-gap: 10px;
    }

        .ferramentas-basicas-section ul li h3 {
            color: var(--main-blue-cloud);
            font-size: 18px;
            font-weight: 700;
        }

        .ferramentas-basicas-section ul li p {
            color: var(--dark-grey);
            font-size: 16px;
            line-height: 24px;
        }

/* Integrações section */

.integracoes-section {
    padding: 100px 0px;
    background-image: url(../images/NovasImagens2022/pattern-main-2022.png), linear-gradient(90deg, #D7FFEF 50%,#0074FF 50%);
}

.content-integrations-2022 {
    text-align: right;
}

    .content-integrations-2022 h3 {
        font: 24px/44px;
        font-weight: 700;
        color: #00ff96;
        text-transform: uppercase;
    }

    .content-integrations-2022 h2 {
        font-size: 35px;
        font-weight: 200;
        line-height: 44px;
        color: #FFFFFF;
        margin-top: 10px;
        margin-bottom: 40px;
        padding-left: 100px;
    }

    .content-integrations-2022 .link-with-arrow-on-left {
        font-size: 18px;
        font-weight: 500;
        color: #00ff96;
        margin-top: 40px;
        background: url(../images/NovasImagens2022/arrow-dark-greenwish-right.svg) no-repeat center right;
        padding-right: 12px;
    }

/* Areas de atuação 2022 */

.areas-de-atuacao-2022 {
    background-color: #f1f1f1;
    padding: 80px 0px;
}

    .areas-de-atuacao-2022 h2 {
        font-weight: 300;
        font-size: 28px;
        text-align: center;
        width: 100%;
        display: inline-block;
        margin-bottom: 40px;
        color: var(--dark-blue-cloud);
    }

    .areas-de-atuacao-2022 ul {
        display: grid;
        grid-template-columns: repeat(8, 1fr);
        justify-content: space-between;
    }

        .areas-de-atuacao-2022 ul li {
            text-align: center;
        }

            .areas-de-atuacao-2022 ul li h4 {
                color: var(--main-blue-cloud);
                font-size: 18px;
                font-weight: 700;
                text-align: center;
                margin-top: 10px;
            }

#apply-discount-home {
    cursor: pointer;
}