/* woff2 first: the same three faces are ~30% smaller than the woff the site
   shipped (33 KB vs 46 KB each), and every current browser takes woff2. The
   woff stays as the fallback. The woff2 files were already in /fonts, unused. */
@font-face {
    font-family: JTMarnie;
    src: local('JT Marnie Light'), local('JTMarnie-Light'),
        url('../fonts/jt-marnie/JTMarnie-Light.woff2') format('woff2'),
        url('../fonts/jt-marnie/JTMarnie-Light.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: JTMarnie;
    src: local('JT Marnie Regular'), local('JTMarnie-Regular'),
        url('../fonts/jt-marnie/JTMarnie-Regular.woff2') format('woff2'),
        url('../fonts/jt-marnie/JTMarnie-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: JTMarnie;
    src: local('JT Marnie Bold'), local('JTMarnie-Bold'),
        url('../fonts/jt-marnie/JTMarnie-Bold.woff2') format('woff2'),
        url('../fonts/jt-marnie/JTMarnie-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Design-system tokens (00. Magni Design System / colors_and_type.css).
       These names were declared only in a global.css that no layout ever
       linked, so every page styled against them - the 404 page, the partner
       networks page - rendered with transparent backgrounds, borderless
       inputs and zero spacing. Defined here, once, so a page can use them and
       actually get them. Values are the design system's, not the stock
       Material palette the orphaned file carried. */
    --primary-red: #EA2628;
    --primary-red-dark: #CC2122;
    --primary-red-light: #F38486;
    --border-color: #DDDFE3;
    --background-white: #FFFFFF;
    --background-light: #FAFAFB;
    --text-primary: #14161A;
    --text-secondary: #3D3F43;
    --text-light: #6D6E71;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-full: 999px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --spacing-xxl: 48px;
    --transition-fast: 0.15s ease;

    /* d1d1de */
    --primary-color: #000099;
    --primary-color-link: #302D95;
    --primary-color-hover: #0b0bba;
    --dark-color: #000000;
    --dark-color-light: #555555;
    --dark-color-hover: #212121;
    --danger-color: #C43639;
    --danger-color-hover: #e54d43;
    --success-color: #8ED136;
    --success-color-hover: #77b700;
    --medium-color: rgb(153,153,153);
    --medium-color-hover: #bababa;
    --spacing: 8px;
    --spacing-1: calc(var(--spacing)*1);
    --spacing-2: calc(var(--spacing)*2);
    --spacing-3: calc(var(--spacing)*3);
    --spacing-4: calc(var(--spacing)*4);
    --spacing-5: calc(var(--spacing)*5);
    --spacing-6: calc(var(--spacing)*6);
    --spacing-7: calc(var(--spacing)*7);
    --spacing-8: calc(var(--spacing)*8);
    --spacing-9: calc(var(--spacing)*9);
    --spacing-10: calc(var(--spacing)*10);
    --spacing-20: calc(var(--spacing)*20);
}

section.section-hero h1, section.section-hero h1 * {
    text-align: left;
}

    section.section-hero h1.centered {
        text-align: center;
    }

section h1.title,
section h2.title {
    font-weight: bold;
    font-size: 36px;
    line-height: 38px;
    color: var(--dark-color-light);
}

section.section-hero h2 {
    font-weight: 400;
    font-size: 20px;
}

section video {
    max-width: 100%;
    width: 100%;
}

section,
.max-width {
    max-width: 1200px;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
}

.browser {
    background: #EEEEEE;
    border: 1px solid #CCCCCC;
    box-sizing: border-box;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    flex: 1;
}

    .browser .actions {
        display: inline-flex;
        margin: 10px;
    }

        .browser .actions div {
            width: 8px;
            height: 8px;
            border-radius: 500px;
            margin: 0 4px;
        }

            .browser .actions div.action-gray {
                background: rgba(0, 0, 0, 0.1);
            }

            .browser .actions div.action-red {
                background: #8B2C2F;
            }

            .browser .actions div.action-yellow {
                background: #898E46;
            }

            .browser .actions div.action-green {
                background: #569C35;
            }

    .browser .url-bar {
        background: #FFFFFF;
        border: 1px solid rgba(0, 0, 0, 0.1);
        box-sizing: border-box;
        border-radius: 6px;
        margin: 5px 10px;
        padding: 4px var(--spacing-2);
    }

    .browser img {
        border-radius: 0 0 6px 6px;
    }

    /* Product videos in browser frames (homepage feature tabs): fill the frame
       like the screenshots they replace. */
    .browser video {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 0 0 6px 6px;
    }

header.single-page {
    margin: 0 !important;
    height: 100px;
    padding: 0 !important;
}

.padding-1 {
    padding: var(--spacing-1)
}

.padding-2 {
    padding: var(--spacing-2)
}

.padding-3 {
    padding: var(--spacing-3)
}

.padding-horizontal-1 {
    padding: 0 var(--spacing-1)
}

.padding-horizontal-2 {
    padding: 0 var(--spacing-2)
}

.padding-horizontal-3 {
    padding: 0 var(--spacing-3)
}

.padding-horizontal-4 {
    padding: 0 var(--spacing-4)
}

.padding-horizontal-5 {
    padding: 0 var(--spacing-5)
}

.padding-horizontal-6 {
    padding: 0 var(--spacing-6)
}

.padding-horizontal-10 {
    padding: 0 var(--spacing-10)
}

.padding-vertical-1 {
    padding: var(--spacing-1) 0
}

.padding-vertical-2 {
    padding: var(--spacing-2) 0
}

.padding-vertical-3 {
    padding: var(--spacing-3) 0
}

.margin-1 {
    margin: var(--spacing-1)
}

.margin-2 {
    margin: var(--spacing-2)
}

.margin-3 {
    margin: var(--spacing-3)
}

.margin-horizontal-1 {
    margin: 0 var(--spacing-1)
}

.margin-horizontal-2 {
    margin: 0 var(--spacing-2)
}

.margin-horizontal-3 {
    margin: 0 var(--spacing-3)
}

.margin-horizontal-4 {
    margin: 0 var(--spacing-4)
}

.margin-horizontal-5 {
    margin: 0 var(--spacing-5)
}

.margin-horizontal-6 {
    margin: 0 var(--spacing-6)
}

.margin-vertical-1 {
    margin: var(--spacing-1) 0
}

.margin-vertical-2 {
    margin: var(--spacing-2) 0
}

.margin-vertical-3 {
    margin: var(--spacing-3) 0
}

.margin-vertical-4 {
    margin: var(--spacing-4) 0
}

.margin-vertical-5 {
    margin: var(--spacing-5) 0
}

.margin-vertical-6 {
    margin: var(--spacing-6) 0
}

.margin-bottom-1 {
    margin-bottom: var(--spacing-2)
}

.margin-bottom-2 {
    margin-bottom: var(--spacing-2)
}

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

.material-icons.md-18 {
    font-size: 18px;
}

.material-icons.md-24 {
    font-size: 24px;
}

.material-icons.md-36 {
    font-size: 36px;
}

.material-icons.md-48 {
    font-size: 48px;
}

button[color="primary"] {
    background: var(--primary-color);
    border-radius: 6px;
    color: white;
    padding: 13px var(--spacing-3);
    border: none;
    font-size: 16px;
    transition: all 0.2s;
}

button:hover[color="primary"] {
    background: var(--primary-color-hover);
}

button[color="primary"][fill="outline"] {
    background: transparent;
    border-radius: 6px;
    color: var(--primary-color);
    padding: 13px var(--spacing-3);
    border: 1px solid var(--primary-color);
    font-size: 16px;
    font-weight: bold;
    transition: all 0.2s;
}

button:hover[color="primary"][fill="outline"] {
    border: 1px solid var(--primary-color-hover);
    color: var(--primary-color-hover);
}

button[color="danger"] {
    background: var(--danger-color);
    border-radius: 6px;
    color: white;
    padding: 13px var(--spacing-3);
    border: none;
    font-size: 16px;
    transition: all 0.2s;
}

button:hover[color="danger"] {
    background: var(--danger-color-hover);
}

button[color="danger"][fill="outline"] {
    background: transparent;
    border-radius: 6px;
    color: var(--danger-color);
    padding: 13px var(--spacing-3);
    border: 1px solid var(--danger-color);
    font-size: 16px;
    font-weight: bold;
    transition: all 0.2s;
}

button:hover[color="danger"][fill="outline"] {
    border: 1px solid var(--danger-color-hover);
    color: var(--danger-color-hover);
}

button[color="success"] {
    background: var(--success-color);
    border-radius: 6px;
    color: white;
    padding: 13px var(--spacing-3);
    border: none;
    font-size: 16px;
    transition: all 0.2s;
}

button:hover[color="success"] {
    background: var(--success-color-hover);
}

button[color="medium"] {
    background: var(--medium-color);
    border-radius: 6px;
    color: white;
    padding: 13px var(--spacing-3);
    border: none;
    font-size: 16px;
    transition: all 0.2s;
}

button:hover[color="medium"] {
    background: var(--medium-color-hover);
}

button[color="medium"][fill="outline"] {
    background: white;
    border-radius: 6px;
    color: var(--medium-color);
    padding: 10px var(--spacing-3);
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-weight: bold;
    transition: all 0.2s;
}

button[color="success"][fill="outline"] {
    background: none;
    color: var(--success-color);
    border: 1px solid var(--success-color);
    font-weight: bold;
    transition: all 0.2s;
}

button:hover[color="success"][fill="outline"] {
    border: 1px solid var(--success-color-hover);
    color: var(--success-color-hover);
}

button[color="success"][fill="clear"] {
    background: none;
    color: var(--success-color);
}

button[size="small"] {
    font-size: 14px;
    padding: var(--spacing-1);
}

.longer-on-left-side .right .button-wrapper {
    margin-top: var(--spacing-4);
    text-align: left;
}

.longer-on-left-side .left .button-wrapper {
    margin-top: var(--spacing-4);
    text-align: right;
}

.longer-on-right-side .left .button-wrapper {
    margin-top: var(--spacing-4);
    text-align: right;
}

.longer-on-right-side .right .button-wrapper {
    margin-top: var(--spacing-4);
    text-align: left;
}

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

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

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

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

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

a {
    color: var(--primary-color);
}

.tabs .tabs-header {
    flex: 1;
    text-align: center;
    max-width: 1200px;
    margin: 0 auto var(--spacing-3) auto;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-left: none;
    border-right: none;
}

    .tabs .tabs-header .tabs-header-content {
        display: flex;
        cursor: pointer;
    }

        .tabs .tabs-header .tabs-header-content .tab-menu {
            flex: 1;
            font-size: 18px;
            line-height: 22px;
            color: rgba(0, 0, 0, 0.3);
            position: relative;
            font-weight: bold;
        }

            .tabs .tabs-header .tabs-header-content .tab-menu.selected {
                color: rgba(0, 0, 0, 0.8);
            }

                .tabs .tabs-header .tabs-header-content .tab-menu.selected:after {
                    content: '';
                    display: block;
                    width: 40%;
                    height: 4px;
                    background-color: red;
                    margin: 5px 0 0 30%;
                    position: absolute;
                }

.tabs .tabs-body {
    max-width: 1200px;
    margin: 0 auto !important;
    float: none !important;
}

    .tabs .tabs-body .tabs-divider {
        display: none;
    }

        .tabs .tabs-body .tabs-divider.selected {
            display: flex;
        }

.code {
    font-family: 'Courier New', Courier, monospace;
    background: rgba(0, 0, 0, 0.8);
    padding: var(--spacing-2);
    color: white;
    max-height: 350px;
    overflow-y: auto;
    border-radius: 0 0 8px 8px;
}

.carousel-control.left,
.carousel-control.right {
    background: none !important;
}

.flex {
    display: flex;
}

.rect-background {
    opacity: 0.99;
    transform: rotate(1.1deg);
}

    .rect-background.rect-blue {
        background: rgba(0, 0, 153, 0.1);
    }

    .rect-background.rect-red {
        background: rgba(198, 56, 32, 0.1);
    }

.longer-on-left-side,
.longer-on-right-side,
.divide-in-half {
    display: flex;
}

    .longer-on-left-side .left {
        flex: 6;
        padding-right: var(--spacing-2);
    }

    .longer-on-left-side .right {
        flex: 4;
        padding-left: var(--spacing-2);
    }

    .longer-on-right-side .left {
        flex: 4;
        padding-right: var(--spacing-2);
    }

    .longer-on-right-side .right {
        flex: 6;
        padding-left: var(--spacing-2);
    }

    .divide-in-half .left {
        flex: 1;
        padding-right: var(--spacing-2);
    }

    .divide-in-half .right {
        flex: 1;
        padding-left: var(--spacing-2);
    }

    .divide-in-half .left .button-wrapper {
        text-align: right;
    }

    .divide-in-half .right {
        text-align: left;
    }

.link {
    font-size: 16px;
    line-height: 19px;
    cursor: pointer;
    color: var(--primary-color) !important;
}

    .link i {
        vertical-align: middle;
    }

    .link a, .link a:hover, .link a:focus, .link a:visited, .link a:link {
        text-decoration: none;
        color: var(--primary-color) !important;
    }

        .link[size="small"],
        .link a[size="small"] {
            font-size: 12px;
            line-height: 14px;
        }

        .link[fill="strong"],
        .link a[fill="strong"] {
            font-weight: bold;
        }

        .link[text="uppercase"],
        .link a[text="uppercase"] {
            text-transform: uppercase;
        }

.card-review {
    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.24);
    border-radius: 6px;
    padding: var(--spacing-2);
    height: 324px;
}

    .card-review p {
        height: 140px;
        overflow: auto;
        text-align: left;
        font-size: 12px;
    }

        .card-review p::-webkit-scrollbar {
            width: 7px;
        }

        .card-review p::-webkit-scrollbar-track {
            background: #f1f1f1;
        }

        .card-review p::-webkit-scrollbar-thumb {
            background: #888;
        }

            .card-review p::-webkit-scrollbar-thumb:hover {
                background: #555;
            }

    .card-review img {
        border-radius: 100px;
        transform: matrix(-1, 0, 0, 1, 0, 0);
        width: 56px;
        height: 56px;
        display: inline-block;
        vertical-align: top;
    }

    .card-review .review-details {
        display: inline-block;
        width: calc(100% - 62px);
        vertical-align: top;
    }

        .card-review .review-details .name {
            font-weight: bold;
            font-size: 14px;
            line-height: 150%;
            color: #000000;
            opacity: 0.6;
            display: block;
        }

        .card-review .review-details .description {
            font-size: 14px;
            line-height: 150%;
            color: #000000;
            opacity: 0.6;
            display: inline-block;
        }

        .card-review .review-details img {
            width: 16px;
            height: 16px;
        }

        .card-review .review-details .review-source {
            font-size: 10px;
            line-height: 150%;
            color: #000000;
            opacity: 0.6;
        }

        .card-review .review-details .review-value img,
        .card-review .review-details .review-value .review-source {
            display: inline-block;
        }

footer li {
    list-style: none;
}


/*reset base*/
* {
    margin: 0px;
    padding: 0px;
}

body {
    background: #fff;
    font-weight: 400;
}

    body * {
        font-family: JTMarnie, Helvetica, Arial, sans-serif;
    }

    /* JT Marnie carries no CJK glyphs, so Chinese text would otherwise fall
       back to whatever the browser picks. Latin runs still render in the brand
       font; the CJK faces only take the glyphs JT Marnie cannot draw.

       Icon fonts must be excluded. They are ligature fonts: the element's text
       is the glyph NAME ("keyboard_arrow_down"), which the font renders as a
       symbol. This selector scores (0,1,2) and so outranks the (0,1,0) of
       `.material-icons { font-family: 'Material Icons' }`, and with the icon
       font gone the raw name renders as literal text - which is exactly what
       happened on the /zh pages, spelling out "keyboard_arrow_down" across the
       mobile nav and overflowing the viewport. `body *` alone scores (0,0,1),
       which is why the rest of the site was never affected. */
    html[lang^="zh"] body *:not(.material-icons):not(.glyphicon):not([class*="fa-"]) {
        font-family: JTMarnie, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", Helvetica, Arial, sans-serif;
    }

.article-font, .article-font * {
    font-family: 'Aleo',serif !important;
}

p {
    font-size: 16px;
    font-weight: 600;
    text-align: left;
    line-height: 1.8em;
}

h2 {
    margin-bottom: 10px;
    color: rgba(0,0,0,.6);
}

a:hover {
    text-decoration: none;
}

.row {
    margin-top: 50px;
    margin-bottom: 50px;
}

img {
    width: 100%;
    display: block;
}

.onMobile {
    display: none;
}
/*NAV*/
.navbar-nav {
    margin-top: 23px !important;
    padding-left: 10px;
    padding-right: 10px;
}


.navbar-fixed-top {
    background-color: rgba(255, 255, 255, 0.99);
    min-height: 90px !important;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.08);
    transition: all 0.5s ease;
}

    .navbar-fixed-top.hide-shadow {
        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0);
    }

.navbar-toggle {
    padding: 15px 20px;
    margin-right: 16px;
}

.navbar-brand {
    position: relative;
    width: 220px;
    left: 15px;
    background-size: contain;
    height: auto;
}

.navbar-fixed-top a {
    font-size: 15px;
    font-weight: normal;
    color: #333;
}

    .navbar-fixed-top a, .navbar-fixed-top a:hover, .navbar-fixed-top a:active, .nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
        border-radius: 5px;
    }

.navbar-nav > li > .dropdown-menu {
    border-radius: 8px !important;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.08);
}

.nav > li > a {
    padding: 10px 11px !important;
}
/*Experimente agora btn*/
nav a.tryNow, nav a.tryNow:hover {
    background-color: #00aeef;
    color: #fff;
    border-radius: 20px;
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    border-bottom-left-radius: 20px;
    -moz-border-radius: 25px;
    -o-border-radius: 25px;
    -webkit-border-radius: 25px;
}

    nav a.tryNow:hover {
        background-color: #00a4f1 !important;
        color: #fff !important;
    }
/*Header*/
header.homepage {
    background-size: cover;
    margin-top: 100px;
}

    header.homepage h4 {
        margin-top: 5px;
        color: #fff;
    }

    header.homepage h1 {
        color: #fff;
        margin: 20px 0;
        font-size: 28px;
        font-weight: bold;
        text-transform: uppercase;
    }

        header.homepage h1 strong {
            color: #ff5252;
        }

    header.homepage .copy h2 {
        color: #fff
    }
    /*copy*/
    header.homepage h2, header.homepage h4 {
        color: white;
    }
/*FIm Header*/
/*CTA*/
.cta_wrapper {
    margin-top: 40px;
}
/*CTA BOX*/
.cta-box {
    padding-top: 50px;
    padding-bottom: 50px !important;
    background-color: #e7e7e7;
}
/*phone*/
nav .phone {
    padding-top: 15px;
    padding-bottom: 15px;
    line-height: 20px;
    display: inline-block;
    color: #ed262a;
    padding-right: 15px;
    font-weight: 400;
}

    nav .phone img {
        display: inline-block;
        margin-right: 5px;
        vertical-align: middle;
    }
/*NAV change language*/
.btn_login {
    color: #87B33A !important;
    font-weight: bold !important;
}

    .btn_login:hover {
        color: #73a025 !important;
    }
/* oculto nessa primeira ves?o*/
.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background: none;
}

.nav > li > a:hover, .nav > li > a:focus {
    background: none;
    color: #ed262a;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background: none;
    color: #ed262a;
}

.lang_menu {
    padding: 15px;
}

.menu-change-lang {
    padding: 10px;
    padding-bottom: 20px;
    left: -60px !important;
    top: -300px;
    max-width: 270px;
}

    .menu-change-lang li {
        padding: 0px;
        margin: 0px;
        height: 35px;
    }

    .menu-change-lang a {
        line-height: 40px !important;
    }

.change-lang-icon {
    width: 20px;
    height: 20px;
    display: inline-block;
    margin-bottom: -5px;
    background-size: cover;
}

.back-to-top-button {
    background: #F8F8F8;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 6px;
    line-height: 0 !important;
}

.top-bar-buttons-container {
    display: flex;
    flex-direction: row;
    margin-top: 26px;
    margin-right: 100px;
}

    .top-bar-buttons-container button {
        padding: 5px 15px !important;
    }

.top-bar-login-btn {
    display: none;
}

.links {
    margin-bottom: 10px;
}

.menu-change-lang .change-lang-icon {
    margin-right: 10px;
}

.espanol-icon {
    background-image: url("../images/flags/es.png");
}

.portugues-icon {
    background-image: url("../images/flags/pt.png");
}

.english-icon {
    background-image: url("../images/flags/en.png");
}

.germany-icon {
    background-image: url("../images/flags/ge.png");
}

.austrian-icon {
    background-image: url("../images/flags/au.png");
}

.france-icon {
    background-image: url("../images/flags/fr.png");
}

.italy-icon {
    background-image: url("../images/flags/it.png");
}

/* SVG rather than PNG: drawn in-repo, and background-image treats them alike. */
.china-icon {
    background-image: url("../images/flags/cn.svg");
}

.btn_lang_menu, .btn_lang_menu:hover, .btn_lang_menu:focus {
    border: none;
    color: rgba(0,0,0);
}
/*fim menu lang*/
.navbar-toggle[aria-expanded=true] #navbar-hamburger {
    display: none;
}

.navbar-toggle[aria-expanded=false] #navbar-close {
    display: none;
}

.navbar-toggle .icon-bar {
    background-color: var(--danger-color);
}

.navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
    max-height: 650px;
}
/*Fim NAV*/
/*inicio contact widget*/
.contactWidget {
    background: #fff none repeat scroll 0 0;
    border-radius: 8px;
    -o-border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    box-sizing: border-box;
    overflow: visible;
    padding: 20px 30px;
    position: fixed;
    width: 420px;
    display: none;
    z-index: 500;
    top: 35%;
    left: 45%;
    margin-left: -150px;
    margin-top: -100px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.newsletterWidget {
    position: relative;
    display: none;
    left: 50%;
    margin-left: -140px;
    top: -270px;
    background-color: white;
    width: 280px;
    padding: 20px;
    padding-bottom: 52px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 178px 25px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 178px 25px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 178px 25px rgba(0,0,0,0.5);
}

    .newsletterWidget:before {
        bottom: -15px;
        left: 50%;
        margin-left: -10px;
        top: auto;
        transform: rotate(270deg);
    }
/*fim contact widget*/
/*contacts*/
.onepager.contacts h1 {
    color: #FFF;
    font-size: 46px;
    font-weight: 300;
    padding-top: 30px;
    text-transform: uppercase;
    position: relative;
    z-index: 20;
}

.onepager.contacts .col5 p {
    font-size: 17px;
}

.onepager.contacts .col5 .contactBtn {
    margin-bottom: 20px;
}

.contactWidget label {
    width: 100%;
    font-size: 11px;
}

.contactWidget .closeBtn {
    position: absolute;
    top: 10px;
    right: 10px;
}

.contactWidget .sendBtn {
    padding: 5px 30px;
}

.contactWidget input[type="text"]::placeholder, .contactWidget select::placeholder, .contactWidget textarea::placeholder {
    color: rgba(0,0,0,0.5);
    opacity: 1;
}

.contactWidget input[type="text"]:focus, .contactWidget select:focus, .contactWidget textarea:focus {
    outline: none;
    border-bottom: solid 1px rgba(0,0,0,0.5);
}

.contactWidget input[type="text"], .contactWidget select, .contactWidget textarea, .contactFixed_email, .contactFixed_name, .contactWidget input[type="email"], .contactWidget input[type="number"], .newsletterWidget input[type="text"], .newsletterWidget input[type="email"], .newsletterWidget input[type="number"], .contactFixed_textarea, .newsletter_wrapper input[type="email"], .newsletter_wrapper input[type="text"] {
    padding: 5px;
    box-sizing: border-box;
    width: 100%;
    color: #000;
    border: none;
    border-bottom: solid 1px rgba(0,0,0,0.1);
    font-size: 15px;
}

.contactWidget input[type="submit"], .contactWidget .fechar, .contactFixed input[type="submit"], .contactFixed_button, .newsletterWidget input[type="submit"], .newsletter_wrapper .btn {
    padding: 8px 15px;
    background: #FFF;
    border: 1px solid var(--primary-color);
    border-radius: 6px !important;
    -o-border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    color: var(--primary-color);
    float: right;
    font-weight: bold;
    cursor: pointer;
}

.contactWidget .fechar {
    background-color: #a1a1a1 !important;
    margin-right: 10px;
}

.contactResponse {
    display: none;
    height: 30px;
    padding: 5px 15px;
    color: #FFF;
    text-decoration: none;
    width: 100%;
    margin-bottom: 5px;
}

    .contactResponse:hover {
        text-decoration: none;
        color: white;
    }

.contactWidget .sucessmsg {
    background-color: #1b9321 !important;
    display: block;
    height: 50px;
}

.contactWidget .errormsg {
    background-color: red !important;
    display: block;
}
/*fim contact*/
/*Subscribe Widget*/
.subscribe_widget {
    background: #fff none repeat scroll 0 0;
    border-radius: 8px;
    -o-border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    box-sizing: border-box;
    overflow: visible;
    padding: 20px;
    position: fixed;
    width: 420px;
    display: none;
    z-index: 500;
    top: 35%;
    left: 50%;
    margin-left: -210px;
    margin-top: -100px;
    -webkit-box-shadow: 0 4px 4px rgba(0,0,0,.25);
    -moz-box-shadow: 0 4px 4px rgba(0,0,0,.25);
    box-shadow: 0 4px 4px rgba(0,0,0,.25);
}

.onepager.contacts .col5 .btn_subscribe_newsletter {
    margin-bottom: 20px;
}

.subscribe_widget input[type="text"], .subscribe_widget select, .subscribe_widget textarea, .contactFixed_email, .contactFixed_name, .subscribe_widget input[type="email"], .subscribe_widget input[type="number"], .newsletterWidget input[type="text"], .newsletterWidget input[type="email"], .newsletterWidget input[type="number"], .contactFixed_textarea, .newsletter_wrapper input[type="email"], .newsletter_wrapper input[type="text"] {
    padding: 5px;
    box-sizing: border-box;
    width: 100%;
    color: #000;
    margin-bottom: 10px;
    border: none;
    border-bottom: solid 1px rgba(0,0,0,0.1);
    font-size: 15px;
}

    .subscribe_widget input[type="text"]:focus, .subscribe_widget select:focus, .subscribe_widget textarea:focus {
        outline: none;
        border-bottom: solid 1px rgba(0,0,0,0.5);
    }

.subscribe_widget input[type="submit"], .contactFixed input[type="submit"], .contactFixed_button, .newsletterWidget input[type="submit"], .newsletter_wrapper .btn {
    padding: 8px 15px;
    background: #FFF;
    border: 1px solid var(--primary-color);
    border-radius: 6px !important;
    -o-border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    color: var(--primary-color);
    float: right;
    font-weight: bold;
    cursor: pointer;
}

.subscribe_widget .fechar {
    position: absolute;
    top: 10px;
    right: 10px;
}

.contactResponse {
    display: none;
    height: 30px;
    padding: 5px 15px;
    color: #FFF;
    text-decoration: none;
    width: 100%;
    margin-bottom: 5px;
}

    .contactResponse:hover {
        text-decoration: none;
        color: white;
    }

.subscribe_widget .sucessmsg {
    background-color: #1b9321 !important;
    display: block;
    height: 50px;
}

.subscribe_widget .errormsg {
    background-color: red !important;
    display: block;
}
/*Cokkies alert*/
#cookies {
    top: 0px;
    display: none;
    background: #f9f9f9;
    position: fixed;
    margin: 0px;
    height: 40px;
    z-index: 1000;
}

    #cookies p {
        color: #A9A59E;
        font-size: 12px;
        margin: 12px 0px;
        font-weight: 100;
    }

        #cookies p span.btn {
            cursor: pointer;
            font-size: 12px;
            color: #767676;
            margin-left: 5px;
            text-decoration: underline;
        }

p.cookies {
    background: #DDD;
    bottom: 0;
    color: #000;
    font-weight: 300;
    margin: auto;
    padding: 10px 0;
    position: fixed;
    text-align: center;
    width: 100%;
    z-index: 1000000000;
}

    p.cookies a {
        background: #ed262a;
        color: #FFF;
        padding: 6px 10px;
    }
/*Ribbon*/
#ribbon {
    position: fixed;
    width: 130px;
    height: 130px;
    top: 0px;
    left: 0px;
    z-index: 2000;
    background: url("/Content/images/ribbon.png") no-repeat top center;
    background-size: cover;
}
/*footer*/
footer {
    background: #f2f2f2;
    margin-bottom: -20px;
}

    footer .row {
        margin-top: 0px;
    }

    footer section.links {
        padding-top: 40px;
    }

        footer section.links p.about-us {
            font-weight: 400;
            font-size: 14px;
        }

        footer section.links ul li {
            margin: 7px 0px;
        }

            footer section.links ul li a {
                color: #000000DD;
            }

                footer section.links ul li a:hover {
                    color: #686563;
                }

        footer section.links form .fa {
            position: absolute;
            color: #ada8a2;
            font-size: 20px;
            margin-left: 12px;
            line-height: 38px;
        }

        footer section.links ul li img.top5-2020-stamp {
            width: 110px;
            height: 110px;
            margin: auto auto;
        }

        footer section.links ul li img.portugal-2020 {
            width: 95px;
            height: 54px;
            margin: auto auto;
        }

        footer section.links ul img.app-stores-badge {
            width: 130px !important;
            height: 38px !important;
        }

    footer section.social {
        display: grid !important;
        grid-template-columns: 1fr 1fr 1fr;
    }

@media screen and (max-width: 1200px) {
    footer section.social {
        grid-template-columns: 1fr;
    }
}

footer section.social {
    padding: 20px 0px 5px 0px;
    margin: 64px 0 20px 0 !important;
}

    footer section.social ul li {
        display: inline-block;
        padding: 15px;
    }

        footer section.social ul li i.bubble {
            color: #F9F4ED;
            width: 50px;
            height: 50px;
            border-radius: 50px;
            -o-border-radius: 50px;
            -moz-border-radius: 50px;
            -webkit-border-radius: 50px;
            line-height: 50px;
            text-align: center;
            font-size: 18px;
        }

        footer section.social ul li i.fa-twitter {
            background: #7EA2AE;
        }

        footer section.social ul li i.fa-facebook {
            background: #acacac;
        }

        footer section.social ul li i.fa-linkedin {
            background: #acacac;
        }

        footer section.social ul li i.fa-youtube {
            background: #acacac;
        }

        footer section.social ul li i.fa-instagram {
            background: #acacac;
        }

.mauticform-message {
    color: #00aeef;
    font-weight: bold;
    text-align: left;
}

.row-no-padding {
    padding-left: 0px !important;
    padding-right: 0px;
}

.lock-scroll {
    overflow: hidden;
}
/*fim footer*/
/*angularjs*/
[ng\:cloag], [ng-cloak], .ng-cloak {
    display: none !important;
}
/*MOBILE menor de 400px*/
@media only screen and (max-width:400px) {
    .newsletter_wrapper {
        margin-top: 20px;
    }
    /*mobile cookies*/
    p .cookies a {
        display: inline-block;
        margin-top: 2px;
    }

    .contactWidget:before {
        bottom: -15px;
        left: 50%;
        margin-left: -10px;
        margin-top: -16px;
        position: absolute;
        transform: rotate(270deg);
        top: auto;
    }

    .contactResponse {
        font-size: 13px !important;
        line-height: 15px;
        text-align: center;
    }

    footer section.social {
        padding: 20px 0;
    }

    footer .links {
        font-size: 12px;
    }

    .row {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .btn_contact_submit {
        padding: 10px;
    }
}

@media only screen and (max-width:767px) {
    /*mobile widget*/
    .contactWidget {
        width: 300px;
    }

    h1, .h1 {
        font-size: 18px;
        font-weight: 400;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    header.homepage h1, .h1 {
        font-size: 18px !important;
    }

    .h2 {
        font-size: 20px;
    }

    h2 {
        font-size: 18px;
    }

    p {
        font-size: 14px;
        line-height: 2em;
    }

    .navbar-nav {
        margin: 0px;
        float: left !important;
    }


    .newsletterWidget {
        left: 50%;
        margin-left: -140px;
    }

    nav .cookies {
        height: 50px;
    }

    nav ul.main-menu {
        padding: 18px 40px;
    }

        nav ul.main-menu li.logo img {
            width: 140px;
            margin-top: 18px;
        }

    .onMobile {
        display: block !important;
    }

    .offMobile {
        display: none !important;
    }

    nav .cookies {
        height: 50px;
    }


    p.cookies a {
        display: inline-block;
        margin-top: 2px;
    }

    .cta {
        font-size: 17px !important;
    }

    /* Footer link groups collapse into an accordion on phones, but
       .mobile-links-aggregator was never styled in any loaded stylesheet (nor
       in the orphaned global.css - checked), so the headers rendered as bare
       links flush against the left edge with Bootstrap's .pull-right throwing
       their chevrons to the far side of the screen.

       No `display` is declared here on purpose: .onMobile owns it (none by
       default, block !important under this same breakpoint). Declaring display
       on an .onMobile element is what previously leaked the trial strip onto
       desktop. */
    .links .mobile-links-aggregator {
        padding: 14px 16px;
        border-bottom: 1px solid #DDDFE3;
        color: #14161A;
        font-weight: 600;
        text-decoration: none;
        /* Contains the floated chevron, which otherwise escapes the row. */
        overflow: hidden;
    }

    .links .mobile-links-aggregator .material-icons {
        color: #6D6E71;
    }

    /* Expanded group: real tap targets rather than flush-packed text. */
    .links .panel-collapse li a {
        display: block;
        padding: 8px 0;
    }

    /* The two <br> tags separate columns that .footer-mobile-off hides here,
       so on a phone they only leave a gap where content used to be. */
    .links br {
        display: none;
    }
    /*header.single-page h1 {
        padding-top:30px!important;
        padding-left:20px;
        font-size:24px!important;
        }*/
}

@media only screen and (min-width:1024px) and (max-width: 1280px) {
    .newsletterWidget {
        left: 50%;
        margin-left: -140px;
    }
}

.entrar_mobile {
    background-color: #eee;
}
/*Header para pre?o, contabilistas,contactos, */
/*header.single-page {
    position: relative;
    margin-top: 100px;
    background-size: cover !important;
}*/
header.header1 {
    background: url("/Content/images/headers/1.jpg") no-repeat center top;
}

header.header2 {
    background: url("/Content/images/headers/2.jpg") no-repeat center top;
}

header.header3 {
    background: url("/Content/images/headers/3.jpg") no-repeat center top;
}

header.header4 {
    background: url("/Content/images/headers/4.jpg") no-repeat center top;
}

header.header5 {
    background: url("/Content/images/headers/5.jpg") no-repeat center top;
}

header.header6 {
    background: url("/Content/images/headers/6.jpg") no-repeat center top;
}

header.header7 {
    background: url("/Content/images/headers/7.jpg") no-repeat center top;
}

header.header8 {
    background: url("/Content/images/headers/8.jpg") no-repeat center top;
}

    header.header4:after, header.header6:after, header.header7:after, header.header8:after {
        position: absolute;
        width: 100%;
        height: 100%;
        background: #000;
        opacity: .5;
        z-index: 0;
        left: 0;
        top: 0;
        content: "";
    }

header.single-page h1 {
    color: var(--dark-color);
    opacity: 0.6;
    font-weight: bold;
    font-size: 36px;
    line-height: 43px;
}

header.single-page h2 {
    font-weight: 250;
    font-size: 20px;
    line-height: 140%;
    color: var(--dark-color-light);
    text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.08);
}

header p {
    color: #FFF;
    font-weight: 300;
    float: left;
    clear: left;
    z-index: 20;
    line-height: 36px;
}

header .top-img {
    width: 540px;
    position: relative;
    z-index: 500;
}

@media only screen and (max-width: 767px) {
    .row-full {
        min-width: 100% !important;
    }

    .top-img {
        display: none;
    }

    header.single-page.header2 {
        background: url(/Content/images/headers/2_mobile.jpg);
    }

    header.single-page h1 {
        font-size: 18px;
        line-height: 27px;
    }
}

.side-side {
    padding: 50px;
}
/* fim de header*/
#hack {
    display: none;
}

.cta-footer {
    color: #00aeef !important;
    background-color: #fff !important;
    border: 2px solid #00aeef !important;
}

@media only screen and (max-width: 768px) {
    .homepage {
        background-position: left;
    }

        .homepage h1 {
            font-size: 22px;
        }
}

@media only screen and (max-width:860px) {
    .newsletter_wrapper {
        margin-top: 30px !important;
    }
}

@media only screen and (max-width:500px) {
    .h1 {
        font-size: 16px !important;
    }

    .trusted h3 {
        font-size: 13px;
    }

    .videos_wrapper {
        width: 100%;
        display: grid;
        grid-template-columns: 100% !important;
        grid-template-rows: 1fr 1fr 1fr;
        column-gap: 50px;
        align-items: center;
    }

    .video_resize_mobile {
        width: 70%;
    }

    .navbar-nav {
        margin-top: 0px !important;
    }

        .navbar-nav > li > a {
            font-size: 18px;
            line-height: 30px;
        }

        .navbar-nav .open .dropdown-menu > li > a {
            font-size: 18px;
            line-height: 30px;
        }
}

.form-wrapper {
    padding: 10px;
}

    .form-wrapper input {
        border-radius: 5px;
        margin-top: 5px;
        margin-bottom: 5px;
    }

        .form-wrapper input[type=text], .form-wrapper input[type=email] {
            width: 100%;
            padding: 5px;
            border: 1px solid #ccc;
        }

        .form-wrapper input[type=submit] {
            padding: 10px;
            font-weight: bold;
        }

    .form-wrapper col-xs-12 {
        margin-top: 10px;
    }

.termos_condicoes_wrapper > .container > .row {
    margin-top: 0;
    margin-bottom: 60px;
}

.termos_condicoes_wrapper section.article-font {
    word-break: break-word;
}

.termos_condicoes_wrapper p {
    color: black !important;
}

.text-left {
    text-align: left !important;
}

.videos_wrapper {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 30px;
}

    .videos_wrapper .h3 {
        margin-bottom: 30px;
        font-size: 16px;
    }

.videocontainer {
    position: relative;
    overflow: hidden;
    width: 100%;
    margin-bottom: 10px;
}

    .videocontainer iframe {
        width: 100%;
        height: 100%;
    }

.responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.numbers {
    color: #464646;
    font-weight: bold !important;
    font-size: 36px;
    text-align: center;
    font-weight: normal;
    letter-spacing: 2px;
    margin: auto;
    display: block;
}

.change-lang-header .menu-change-lang {
    left: -150px !important;
    top: 45px;
}

.change-lang-header .btn_lang_menu .change-lang-icon {
    width: 35px;
    height: 35px;
}

#navbar .change-lang-header ul.dropdown-menu li {
    border: none !important;
}

.synchronization-banks-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 10px;
    padding: 10px 20px;
}

.synchronization-clients-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 40px;
    padding: 10px 40px;
}

@media only screen and (max-width:998px) {
    header.homepage h1 {
        font-size: 22px !important;
    }

    header.homepage h2 {
        font-size: 18px;
    }

    .footer-mobile-off {
        display: none;
    }
}

.logoimg, .logoimgsubtitle {
    max-width: 200px;
}

@media only screen and (max-width:767px) {
    .navbar-brand {
        padding: 15px 0;
        width: 180px;
    }

    .logoimg, .logoimgsubtitle {
        max-width: 180px;
    }

    img:not(.logoimg) {
        /*    width: 60%;*/
        margin: auto;
    }

    img.logoimgsubtitle {
        display: none;
    }

    .synchronization-banks-grid {
        gap: 0;
        padding: 0;
    }

    .synchronization-clients-grid {
        gap: 0;
        padding: 0;
    }
}
/*animation*/
.animation.float { /* Float Animation */
    display: inline-block;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform, background-color;
    transition-property: transform, background-color;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

    .animation.float:hover, .animation.float:focus, .animation.float:active {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
    }


.footer_mobile_buttons {
    width: 100%;
    display: grid;
/*    grid-template-columns: 150px 150px;
*/    grid-template-columns: 1fr 1fr;
    padding-top: 20px;
   gap:10px;
}
    .footer_mobile_buttons img{
        max-width:130px;
    }

    @media only screen and (max-width:950px) {
        nav a.tryNow {
        display: none;
    }
}

@media screen and (min-width: 768px) {
    .links .panel-collapse {
        display: block;
    }
}

@media only screen and (max-width: 1054px) {
    .tabs-header {
        overflow-x: scroll;
    }

        .tabs-header::-webkit-scrollbar {
            width: 0;
            background: transparent;
            height: 0;
        }

    .tab-menu {
        text-align: center;
    }

    .tabs .tabs-header .tabs-header-content .tab-menu {
        font-size: 14px;
    }

    .tabs .tabs-body .tabs-divider.selected {
        display: block !important;
    }

    .tabs .tabs-body .left {
        margin: var(--spacing-2) 0;
    }

    .tabs .tabs-body img {
        width: 100%;
    }

    button[color="primary"],
    button[color="success"] {
        margin: 0;
    }

    .navbar-header button {
        font-size: 14px !important;
    }

    section,
    .max-width {
        margin-left: var(--spacing-2) !important;
        margin-right: var(--spacing-2) !important;
    }

    .menu-change-lang {
        left: -60px !important;
        top: -300px;
    }
}

@media only screen and (max-width: 700px) {
    button[color="primary"],
    button[color="primary"][fill="outline"],
    button[color="success"],
    button[color="danger"] {
        margin: 0;
        padding: var(--spacing-1) var(--spacing-2);
    }

    .tabs .tabs-header .tabs-header-content .tab-menu {
        font-size: 10px;
    }
}

#navbar ul.dropdown-menu li {
    padding: 5px;
}

    #navbar ul.dropdown-menu li:not(:last-of-type) {
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

@media screen and (max-width:767px) {
    #navbar {
        padding-bottom: 200px;
    }

        #navbar .top-bar-buttons-container {
            display: none;
        }

        #navbar[aria-expanded=true] {
            display: flex;
            flex-direction: column;
        }

    .navbar-header {
        padding-top: 20px;
    }

    .top-bar-login-btn {
        float: right;
        display: inline;
        margin-top: 22px !important;
        border-radius: 10px;
        padding: 3px var(--spacing-1) !important;
    }

    li.dropdown a.dropdown-toggle {
        display: none;
    }
}

/* Spam honeypot: invisible to people, still submitted by naive bots.
   Positioned off-screen rather than display:none so bots that skip hidden
   fields still fill it in. */
.hp-field {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}