/*!* Bootstrap v4.0.0-beta (https://getbootstrap.com)
* Copyright 2011-2017 The Bootstrap Authors
* Copyright 2011-2017 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)*/

@media print {
    *, *::before, *::after {
        text-shadow: none !important;
        box-shadow: none !important
    }

    a, a:visited {
        text-decoration: underline
    }

    abbr[title]::after {
        content: " (" attr(title) ")"
    }

    pre {
        white-space: pre-wrap !important
    }

    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid
    }

    thead {
        display: table-header-group
    }

    tr, img {
        page-break-inside: avoid
    }

    p, h2, h3 {
        orphans: 3;
        widows: 3
    }

    h2, h3 {
        page-break-after: avoid
    }

    .navbar {
        display: none
    }

    .badge {
        border: 1px solid #000
    }

    .table {
        border-collapse: collapse !important
    }

        .table td, .table th {
            background-color: #fff !important
        }

    .table-bordered th, .table-bordered td {
        border: 1px solid #ddd !important
    }
}

html {
    box-sizing: border-box;
    font-family: sans-serif;
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent
}

*, *::before, *::after {
    box-sizing: inherit
}

@-ms-viewport {
    width: device-width
}

article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section {
    display: block
}

body {
    margin: 0;
    font-family: -apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff
}

[tabindex="-1"]:focus {
    outline: none !important
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: .5rem
}

p {
    margin-top: 0;
    margin-bottom: 1rem
}

abbr[title], abbr[data-original-title] {
    text-decoration: underline;
    text-decoration: underline dotted;
    cursor: help;
    border-bottom: 0
}

address {
    margin-bottom: 1rem;
    font-style: normal;
    line-height: inherit
}

ol, ul, dl {
    margin-top: 0;
    margin-bottom: 1rem
}

    ol ol, ul ul, ol ul, ul ol {
        margin-bottom: 0
    }

dt {
    font-weight: 700
}

dd {
    margin-bottom: .5rem;
    margin-left: 0
}

blockquote {
    margin: 0 0 1rem
}

dfn {
    font-style: italic
}

b, strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

sub, sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

a {
    color: #007bff;
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

    a:hover {
        color: #0056b3;
        text-decoration: underline
    }

    a:not([href]):not([tabindex]) {
        color: inherit;
        text-decoration: none
    }

        a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
            color: inherit;
            text-decoration: none
        }

        a:not([href]):not([tabindex]):focus {
            outline: 0
        }

pre, code, kbd, samp {
    font-family: sans-serif,sans-serif;
    font-size: 1em
}

pre {
    margin-top: 0;
    margin-bottom: 1rem;
    overflow: auto
}

figure {
    margin: 0 0 1rem
}

img {
    vertical-align: middle;
    border-style: none
}

svg:not(:root) {
    overflow: hidden
}

a, area, button, [role=button], input, label, select, summary, textarea {
    touch-action: manipulation
}

table {
    border-collapse: collapse
}

caption {
    padding-top: .75rem;
    padding-bottom: .75rem;
    color: #868e96;
    text-align: left;
    caption-side: bottom
}

th {
    text-align: left
}

label {
    display: inline-block;
    margin-bottom: .5rem
}

button:focus {
    outline: 1px dotted;
    outline: 5px auto -webkit-focus-ring-color
}

input, button, select, optgroup, textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

button, input {
    overflow: visible
}

button, select {
    text-transform: none
}

button, html [type=button], [type=reset], [type=submit] {
    -webkit-appearance: button
}

    button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {
        padding: 0;
        border-style: none
    }

input[type=radio], input[type=checkbox] {
    box-sizing: border-box;
    padding: 0
}

input[type=date], input[type=time], input[type=datetime-local], input[type=month] {
    -webkit-appearance: listbox
}

textarea {
    overflow: auto;
    resize: vertical
}

fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0
}

legend {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin-bottom: .5rem;
    font-size: 1.5rem;
    line-height: inherit;
    color: inherit;
    white-space: normal
}

progress {
    vertical-align: baseline
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    outline-offset: -2px;
    -webkit-appearance: none
}

    [type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration {
        -webkit-appearance: none
    }

::-webkit-file-upload-button {
    font: inherit;
    -webkit-appearance: button
}

output {
    display: inline-block
}

summary {
    display: list-item
}

template {
    display: none
}

[hidden] {
    display: none !important
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    margin-bottom: .5rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit
}

h1, .h1 {
    font-size: 2.5rem
}

h2, .h2 {
    font-size: 2rem
}

h3, .h3 {
    font-size: 1.75rem
}

h4, .h4 {
    font-size: 1.5rem
}

h5, .h5 {
    font-size: 1.25rem
}

h6, .h6 {
    font-size: 1rem
}

.lead {
    font-size: 1.25rem;
    font-weight: 300
}

.display-1 {
    font-size: 6rem;
    font-weight: 300;
    line-height: 1.1
}

@media(max-width:768px) {
    .display-1 {
        font-size: 5.5rem
    }
}

.display-2 {
    font-size: 5.5rem;
    font-weight: 300;
    line-height: 1.1
}

.display-3 {
    font-size: 4.5rem;
    font-weight: 300;
    line-height: 1.1
}

.display-4 {
    font-size: 3.5rem;
    font-weight: 300;
    line-height: 1.1
}

hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid rgba(0,0,0,.1)
}

small, .small {
    font-size: 80%;
    font-weight: 400
}

mark, .mark {
    padding: .2em;
    background-color: #fcf8e3
}

.list-unstyled {
    padding-left: 0;
    list-style: none
}

.list-inline {
    padding-left: 0;
    list-style: none
}

.list-inline-item {
    display: inline-block
}

    .list-inline-item:not(:last-child) {
        margin-right: 5px
    }

.initialism {
    font-size: 90%;
    text-transform: uppercase
}

.blockquote {
    margin-bottom: 1rem;
    font-size: 1.25rem
}

.blockquote-footer {
    display: block;
    font-size: 80%;
    color: #868e96
}

    .blockquote-footer::before {
        content: "\2014 \00A0"
    }

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

.img-thumbnail {
    padding: .25rem;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: .25rem;
    transition: all .2s ease-in-out;
    max-width: 100%;
    height: auto
}

.figure {
    display: inline-block
}

.figure-img {
    margin-bottom: .5rem;
    line-height: 1
}

.figure-caption {
    font-size: 90%;
    color: #868e96
}

code, kbd, pre, samp {
    font-family: Menlo,Monaco,Consolas,liberation mono,courier new,sans-serif
}

code {
    padding: .2rem .4rem;
    font-size: 90%;
    color: #bd4147;
    background-color: #f8f9fa;
    border-radius: .25rem
}

a > code {
    padding: 0;
    color: inherit;
    background-color: inherit
}

kbd {
    padding: .2rem .4rem;
    font-size: 90%;
    color: #fff;
    background-color: #212529;
    border-radius: .2rem
}

    kbd kbd {
        padding: 0;
        font-size: 100%;
        font-weight: 700
    }

pre {
    display: block;
    margin-top: 0;
    margin-bottom: 1rem;
    font-size: 90%;
    color: #212529
}

    pre code {
        padding: 0;
        font-size: inherit;
        color: inherit;
        background-color: transparent;
        border-radius: 0
    }

.pre-scrollable {
    max-height: 340px;
    overflow-y: scroll
}

.container {
    margin-right: auto;
    margin-left: auto;
    padding-right: 15px;
    padding-left: 15px;
    width: 100%
}

@media(min-width:576px) {
    .container {
        max-width: 540px
    }
}

@media(min-width:768px) {
    .container {
        max-width: 720px
    }
}

@media(min-width:992px) {
    .container {
        max-width: 960px
    }
}

@media(min-width:1200px) {
    .container {
        max-width: 1140px
    }
}

.container-fluid {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 15px;
    padding-left: 15px;
    width: 100%
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}

.no-gutters {
    margin-right: 0;
    margin-left: 0
}

    .no-gutters > .col, .no-gutters > [class*=col-] {
        padding-right: 0;
        padding-left: 0
    }

.col-xl, .col-xl-auto, .col-xl-12, .col-xl-11, .col-xl-10, .col-xl-9, .col-xl-8, .col-xl-7, .col-xl-6, .col-xl-5, .col-xl-4, .col-xl-3, .col-xl-2, .col-xl-1, .col-lg, .col-lg-auto, .col-lg-12, .col-lg-11, .col-lg-10, .col-lg-9, .col-lg-8, .col-lg-7, .col-lg-6, .col-lg-5, .col-lg-4, .col-lg-3, .col-lg-2, .col-lg-1, .col-md, .col-md-auto, .col-md-12, .col-md-11, .col-md-10, .col-md-9, .col-md-8, .col-md-7, .col-md-6, .col-md-5, .col-md-4, .col-md-3, .col-md-2, .col-md-1, .col-sm, .col-sm-auto, .col-sm-12, .col-sm-11, .col-sm-10, .col-sm-9, .col-sm-8, .col-sm-7, .col-sm-6, .col-sm-5, .col-sm-4, .col-sm-3, .col-sm-2, .col-sm-1, .col, .col-auto, .col-12, .col-11, .col-10, .col-9, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2, .col-1 {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px
}

.col {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%
}

.col-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: none
}

.col-1 {
    flex: 0 0 8.3333333333%;
    max-width: 8.3333333333%
}

.col-2 {
    flex: 0 0 16.6666666667%;
    max-width: 16.6666666667%
}

.col-3 {
    flex: 0 0 25%;
    max-width: 25%
}

.col-4 {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%
}

.col-5 {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%
}

.col-6 {
    flex: 0 0 50%;
    max-width: 50%
}

.col-7 {
    flex: 0 0 58.3333333333%;
    max-width: 58.3333333333%
}

.col-8 {
    flex: 0 0 66.6666666667%;
    max-width: 66.6666666667%
}

.col-9 {
    flex: 0 0 75%;
    max-width: 75%
}

.col-10 {
    flex: 0 0 83.3333333333%;
    max-width: 83.3333333333%
}

.col-11 {
    flex: 0 0 91.6666666667%;
    max-width: 91.6666666667%
}

.col-12 {
    flex: 0 0 100%;
    max-width: 100%
}

.order-1 {
    order: 1
}

.order-2 {
    order: 2
}

.order-3 {
    order: 3
}

.order-4 {
    order: 4
}

.order-5 {
    order: 5
}

.order-6 {
    order: 6
}

.order-7 {
    order: 7
}

.order-8 {
    order: 8
}

.order-9 {
    order: 9
}

.order-10 {
    order: 10
}

.order-11 {
    order: 11
}

.order-12 {
    order: 12
}

@media(min-width:576px) {
    .col-sm {
        flex-basis: 0;
        flex-grow: 1;
        max-width: 100%
    }

    .col-sm-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: none
    }

    .col-sm-1 {
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%
    }

    .col-sm-2 {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-sm-3 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-sm-4 {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .col-sm-5 {
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%
    }

    .col-sm-6 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-sm-7 {
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%
    }

    .col-sm-8 {
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%
    }

    .col-sm-9 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-sm-10 {
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%
    }

    .col-sm-11 {
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%
    }

    .col-sm-12 {
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-sm-1 {
        order: 1
    }

    .order-sm-2 {
        order: 2
    }

    .order-sm-3 {
        order: 3
    }

    .order-sm-4 {
        order: 4
    }

    .order-sm-5 {
        order: 5
    }

    .order-sm-6 {
        order: 6
    }

    .order-sm-7 {
        order: 7
    }

    .order-sm-8 {
        order: 8
    }

    .order-sm-9 {
        order: 9
    }

    .order-sm-10 {
        order: 10
    }

    .order-sm-11 {
        order: 11
    }

    .order-sm-12 {
        order: 12
    }
}

@media(min-width:768px) {
    .col-md {
        flex-basis: 0;
        flex-grow: 1;
        max-width: 100%
    }

    .col-md-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: none
    }

    .col-md-1 {
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%
    }

    .col-md-2 {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-md-3 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-md-4 {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .col-md-5 {
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%
    }

    .col-md-6 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-md-7 {
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%
    }

    .col-md-8 {
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%
    }

    .col-md-9 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-md-10 {
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%
    }

    .col-md-11 {
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%
    }

    .col-md-12 {
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-md-1 {
        order: 1
    }

    .order-md-2 {
        order: 2
    }

    .order-md-3 {
        order: 3
    }

    .order-md-4 {
        order: 4
    }

    .order-md-5 {
        order: 5
    }

    .order-md-6 {
        order: 6
    }

    .order-md-7 {
        order: 7
    }

    .order-md-8 {
        order: 8
    }

    .order-md-9 {
        order: 9
    }

    .order-md-10 {
        order: 10
    }

    .order-md-11 {
        order: 11
    }

    .order-md-12 {
        order: 12
    }
}

@media(min-width:992px) {
    .col-lg {
        flex-basis: 0;
        flex-grow: 1;
        max-width: 100%
    }

    .col-lg-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: none
    }

    .col-lg-1 {
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%
    }

    .col-lg-2 {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-lg-3 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-lg-4 {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .col-lg-5 {
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%
    }

    .col-lg-6 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-lg-7 {
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%
    }

    .col-lg-8 {
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%
    }

    .col-lg-9 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-lg-10 {
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%
    }

    .col-lg-11 {
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%
    }

    .col-lg-12 {
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-lg-1 {
        order: 1
    }

    .order-lg-2 {
        order: 2
    }

    .order-lg-3 {
        order: 3
    }

    .order-lg-4 {
        order: 4
    }

    .order-lg-5 {
        order: 5
    }

    .order-lg-6 {
        order: 6
    }

    .order-lg-7 {
        order: 7
    }

    .order-lg-8 {
        order: 8
    }

    .order-lg-9 {
        order: 9
    }

    .order-lg-10 {
        order: 10
    }

    .order-lg-11 {
        order: 11
    }

    .order-lg-12 {
        order: 12
    }
}

@media(min-width:1200px) {
    .col-xl {
        flex-basis: 0;
        flex-grow: 1;
        max-width: 100%
    }

    .col-xl-auto {
        flex: 0 0 auto;
        width: auto;
        max-width: none
    }

    .col-xl-1 {
        flex: 0 0 8.3333333333%;
        max-width: 8.3333333333%
    }

    .col-xl-2 {
        flex: 0 0 16.6666666667%;
        max-width: 16.6666666667%
    }

    .col-xl-3 {
        flex: 0 0 25%;
        max-width: 25%
    }

    .col-xl-4 {
        flex: 0 0 33.3333333333%;
        max-width: 33.3333333333%
    }

    .col-xl-5 {
        flex: 0 0 41.6666666667%;
        max-width: 41.6666666667%
    }

    .col-xl-6 {
        flex: 0 0 50%;
        max-width: 50%
    }

    .col-xl-7 {
        flex: 0 0 58.3333333333%;
        max-width: 58.3333333333%
    }

    .col-xl-8 {
        flex: 0 0 66.6666666667%;
        max-width: 66.6666666667%
    }

    .col-xl-9 {
        flex: 0 0 75%;
        max-width: 75%
    }

    .col-xl-10 {
        flex: 0 0 83.3333333333%;
        max-width: 83.3333333333%
    }

    .col-xl-11 {
        flex: 0 0 91.6666666667%;
        max-width: 91.6666666667%
    }

    .col-xl-12 {
        flex: 0 0 100%;
        max-width: 100%
    }

    .order-xl-1 {
        order: 1
    }

    .order-xl-2 {
        order: 2
    }

    .order-xl-3 {
        order: 3
    }

    .order-xl-4 {
        order: 4
    }

    .order-xl-5 {
        order: 5
    }

    .order-xl-6 {
        order: 6
    }

    .order-xl-7 {
        order: 7
    }

    .order-xl-8 {
        order: 8
    }

    .order-xl-9 {
        order: 9
    }

    .order-xl-10 {
        order: 10
    }

    .order-xl-11 {
        order: 11
    }

    .order-xl-12 {
        order: 12
    }
}

.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 1rem;
    background-color: transparent
}

    .table th, .table td {
        padding: .75rem;
        vertical-align: top;
        border-top: 1px solid #e9ecef
    }

    .table thead th {
        vertical-align: bottom;
        border-bottom: 2px solid #e9ecef
    }

    .table tbody + tbody {
        border-top: 2px solid #e9ecef
    }

    .table .table {
        background-color: #fff
    }

.table-sm th, .table-sm td {
    padding: .3rem
}

.table-bordered {
    border: 1px solid #e9ecef
}

    .table-bordered th, .table-bordered td {
        border: 1px solid #e9ecef
    }

    .table-bordered thead th, .table-bordered thead td {
        border-bottom-width: 2px
    }

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0,0,0,.05)
}

.table-hover tbody tr:hover {
    background-color: rgba(0,0,0,.075)
}

.table-primary, .table-primary > th, .table-primary > td {
    background-color: #b8daff
}

.table-hover .table-primary:hover {
    background-color: #9fcdff
}

    .table-hover .table-primary:hover > td, .table-hover .table-primary:hover > th {
        background-color: #9fcdff
    }

.table-secondary, .table-secondary > th, .table-secondary > td {
    background-color: #dddfe2
}

.table-hover .table-secondary:hover {
    background-color: #cfd2d6
}

    .table-hover .table-secondary:hover > td, .table-hover .table-secondary:hover > th {
        background-color: #cfd2d6
    }

.table-success, .table-success > th, .table-success > td {
    background-color: #b8edd7
}

.table-hover .table-success:hover {
    background-color: #a4e8cc
}

    .table-hover .table-success:hover > td, .table-hover .table-success:hover > th {
        background-color: #a4e8cc
    }

.table-info, .table-info > th, .table-info > td {
    background-color: #bee5eb
}

.table-hover .table-info:hover {
    background-color: #abdde5
}

    .table-hover .table-info:hover > td, .table-hover .table-info:hover > th {
        background-color: #abdde5
    }

.table-warning, .table-warning > th, .table-warning > td {
    background-color: #ffeeba
}

.table-hover .table-warning:hover {
    background-color: #ffe8a1
}

    .table-hover .table-warning:hover > td, .table-hover .table-warning:hover > th {
        background-color: #ffe8a1
    }

.table-danger, .table-danger > th, .table-danger > td {
    background-color: #f5c6cb
}

.table-hover .table-danger:hover {
    background-color: #f1b0b7
}

    .table-hover .table-danger:hover > td, .table-hover .table-danger:hover > th {
        background-color: #f1b0b7
    }

.table-light, .table-light > th, .table-light > td {
    background-color: #fdfdfe
}

.table-hover .table-light:hover {
    background-color: #ececf6
}

    .table-hover .table-light:hover > td, .table-hover .table-light:hover > th {
        background-color: #ececf6
    }

.table-dark, .table-dark > th, .table-dark > td {
    background-color: #c6c8ca
}

.table-hover .table-dark:hover {
    background-color: #b9bbbe
}

    .table-hover .table-dark:hover > td, .table-hover .table-dark:hover > th {
        background-color: #b9bbbe
    }

.table-active, .table-active > th, .table-active > td {
    background-color: rgba(0,0,0,.075)
}

.table-hover .table-active:hover {
    background-color: rgba(0,0,0,.075)
}

    .table-hover .table-active:hover > td, .table-hover .table-active:hover > th {
        background-color: rgba(0,0,0,.075)
    }

.thead-inverse th {
    color: #fff;
    background-color: #212529
}

.thead-default th {
    color: #495057;
    background-color: #e9ecef
}

.table-inverse {
    color: #fff;
    background-color: #212529
}

    .table-inverse th, .table-inverse td, .table-inverse thead th {
        border-color: #32383e
    }

    .table-inverse.table-bordered {
        border: 0
    }

    .table-inverse.table-striped tbody tr:nth-of-type(odd) {
        background-color: rgba(255,255,255,.05)
    }

    .table-inverse.table-hover tbody tr:hover {
        background-color: rgba(255,255,255,.075)
    }

@media(max-width:991px) {
    .table-responsive {
        display: block;
        width: 100%;
        overflow-x: auto;
        -ms-overflow-style: -ms-autohiding-scrollbar
    }

        .table-responsive.table-bordered {
            border: 0
        }
}

.form-control {
    display: block;
    width: 100%;
    padding: .5rem .75rem;
    font-size: 1rem;
    line-height: 1.25;
    color: #495057;
    background-color: #fff;
    background-image: none;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s
}

    .form-control::-ms-expand {
        background-color: transparent;
        border: 0
    }

    .form-control:focus {
        color: #495057;
        background-color: #fff;
        border-color: #80bdff;
        outline: none
    }

    .form-control::placeholder {
        color: #868e96;
        opacity: 1
    }

    .form-control:disabled, .form-control[readonly] {
        background-color: #e9ecef;
        opacity: 1
    }

select.form-control:not([size]):not([multiple]) {
    height: calc(2.25rem + 2px)
}

select.form-control:focus::-ms-value {
    color: #495057;
    background-color: #fff
}

.form-control-file, .form-control-range {
    display: block
}

.col-form-label {
    padding-top: calc(.5rem - 1px * 2);
    padding-bottom: calc(.5rem - 1px * 2);
    margin-bottom: 0
}

.col-form-label-lg {
    padding-top: calc(.5rem - 1px * 2);
    padding-bottom: calc(.5rem - 1px * 2);
    font-size: 1.25rem
}

.col-form-label-sm {
    padding-top: calc(.25rem - 1px * 2);
    padding-bottom: calc(.25rem - 1px * 2);
    font-size: .875rem
}

.col-form-legend {
    padding-top: .5rem;
    padding-bottom: .5rem;
    margin-bottom: 0;
    font-size: 1rem
}

.form-control-plaintext {
    padding-top: .5rem;
    padding-bottom: .5rem;
    margin-bottom: 0;
    line-height: 1.25;
    border: solid transparent;
    border-width: 1px 0
}

    .form-control-plaintext.form-control-sm, .input-group-sm > .form-control-plaintext.form-control, .input-group-sm > .form-control-plaintext.input-group-addon, .input-group-sm > .input-group-btn > .form-control-plaintext.btn, .form-control-plaintext.form-control-lg, .input-group-lg > .form-control-plaintext.form-control, .input-group-lg > .form-control-plaintext.input-group-addon, .input-group-lg > .input-group-btn > .form-control-plaintext.btn {
        padding-right: 0;
        padding-left: 0
    }

.form-control-sm, .input-group-sm > .form-control, .input-group-sm > .input-group-addon, .input-group-sm > .input-group-btn > .btn {
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem
}

select.form-control-sm:not([size]):not([multiple]), .input-group-sm > select.form-control:not([size]):not([multiple]), .input-group-sm > select.input-group-addon:not([size]):not([multiple]), .input-group-sm > .input-group-btn > select.btn:not([size]):not([multiple]) {
    height: calc(1.8125rem + 2px)
}

.form-control-lg, .input-group-lg > .form-control, .input-group-lg > .input-group-addon, .input-group-lg > .input-group-btn > .btn {
    padding: .5rem 1rem;
    font-size: 1.25rem;
    line-height: 1.5;
    border-radius: .3rem
}

select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.form-control:not([size]):not([multiple]), .input-group-lg > select.input-group-addon:not([size]):not([multiple]), .input-group-lg > .input-group-btn > select.btn:not([size]):not([multiple]) {
    height: calc(2.3125rem + 2px)
}

.form-group {
    margin-bottom: 1rem
}

.form-text {
    display: block;
    margin-top: .25rem
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px
}

    .form-row > .col, .form-row > [class*=col-] {
        padding-right: 5px;
        padding-left: 5px
    }

.form-check {
    position: relative;
    display: block;
    margin-bottom: .5rem
}

    .form-check.disabled .form-check-label {
        color: #868e96
    }

.form-check-label {
    padding-left: 1.25rem;
    margin-bottom: 0
}

.form-check-input {
    position: absolute;
    margin-top: .25rem;
    margin-left: -1.25rem
}

    .form-check-input:only-child {
        position: static
    }

.form-check-inline {
    display: inline-block
}

    .form-check-inline .form-check-label {
        vertical-align: middle
    }

    .form-check-inline + .form-check-inline {
        margin-left: .75rem
    }

.invalid-feedback {
    display: none;
    margin-top: .25rem;
    font-size: .875rem;
    color: #dc3545
}

.invalid-tooltip {
    position: absolute;
    top: 100%;
    z-index: 5;
    display: none;
    width: 250px;
    padding: .5rem;
    margin-top: .1rem;
    font-size: .875rem;
    line-height: 1;
    color: #fff;
    background-color: rgba(220,53,69,.8);
    border-radius: .2rem
}

.was-validated .form-control:valid, .form-control.is-valid, .was-validated .custom-select:valid, .custom-select.is-valid {
    border-color: #00bf71
}

    .was-validated .form-control:valid:focus, .form-control.is-valid:focus, .was-validated .custom-select:valid:focus, .custom-select.is-valid:focus {
        box-shadow: 0 0 0 .2rem rgba(0,191,113,.25)
    }

    .was-validated .form-control:valid ~ .invalid-feedback, .was-validated .form-control:valid ~ .invalid-tooltip, .form-control.is-valid ~ .invalid-feedback, .form-control.is-valid ~ .invalid-tooltip, .was-validated .custom-select:valid ~ .invalid-feedback, .was-validated .custom-select:valid ~ .invalid-tooltip, .custom-select.is-valid ~ .invalid-feedback, .custom-select.is-valid ~ .invalid-tooltip {
        display: block
    }

.was-validated .form-check-input:valid + .form-check-label, .form-check-input.is-valid + .form-check-label {
    color: #00bf71
}

.was-validated .custom-control-input:valid ~ .custom-control-indicator, .custom-control-input.is-valid ~ .custom-control-indicator {
    background-color: rgba(0,191,113,.25)
}

.was-validated .custom-control-input:valid ~ .custom-control-description, .custom-control-input.is-valid ~ .custom-control-description {
    color: #00bf71
}

.was-validated .custom-file-input:valid ~ .custom-file-control, .custom-file-input.is-valid ~ .custom-file-control {
    border-color: #00bf71
}

    .was-validated .custom-file-input:valid ~ .custom-file-control::before, .custom-file-input.is-valid ~ .custom-file-control::before {
        border-color: inherit
    }

.was-validated .custom-file-input:valid:focus, .custom-file-input.is-valid:focus {
    box-shadow: 0 0 0 .2rem rgba(0,191,113,.25)
}

.was-validated .form-control:invalid, .form-control.is-invalid, .was-validated .custom-select:invalid, .custom-select.is-invalid {
    border-color: #dc3545
}

    .was-validated .form-control:invalid:focus, .form-control.is-invalid:focus, .was-validated .custom-select:invalid:focus, .custom-select.is-invalid:focus {
        box-shadow: 0 0 0 .2rem rgba(220,53,69,.25)
    }

    .was-validated .form-control:invalid ~ .invalid-feedback, .was-validated .form-control:invalid ~ .invalid-tooltip, .form-control.is-invalid ~ .invalid-feedback, .form-control.is-invalid ~ .invalid-tooltip, .was-validated .custom-select:invalid ~ .invalid-feedback, .was-validated .custom-select:invalid ~ .invalid-tooltip, .custom-select.is-invalid ~ .invalid-feedback, .custom-select.is-invalid ~ .invalid-tooltip {
        display: block
    }

.was-validated .form-check-input:invalid + .form-check-label, .form-check-input.is-invalid + .form-check-label {
    color: #dc3545
}

.was-validated .custom-control-input:invalid ~ .custom-control-indicator, .custom-control-input.is-invalid ~ .custom-control-indicator {
    background-color: rgba(220,53,69,.25)
}

.was-validated .custom-control-input:invalid ~ .custom-control-description, .custom-control-input.is-invalid ~ .custom-control-description {
    color: #dc3545
}

.was-validated .custom-file-input:invalid ~ .custom-file-control, .custom-file-input.is-invalid ~ .custom-file-control {
    border-color: #dc3545
}

    .was-validated .custom-file-input:invalid ~ .custom-file-control::before, .custom-file-input.is-invalid ~ .custom-file-control::before {
        border-color: inherit
    }

.was-validated .custom-file-input:invalid:focus, .custom-file-input.is-invalid:focus {
    box-shadow: 0 0 0 .2rem rgba(220,53,69,.25)
}

.form-inline {
    display: flex;
    flex-flow: row wrap;
    align-items: center
}

    .form-inline .form-check {
        width: 100%
    }

@media(min-width:576px) {
    .form-inline label {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 0
    }

    .form-inline .form-group {
        display: flex;
        flex: 0 0 auto;
        flex-flow: row wrap;
        align-items: center;
        margin-bottom: 0
    }

    .form-inline .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle
    }

    .form-inline .form-control-plaintext {
        display: inline-block
    }

    .form-inline .input-group {
        width: auto
    }

    .form-inline .form-control-label {
        margin-bottom: 0;
        vertical-align: middle
    }

    .form-inline .form-check {
        display: flex;
        align-items: center;
        justify-content: center;
        width: auto;
        margin-top: 0;
        margin-bottom: 0
    }

    .form-inline .form-check-label {
        padding-left: 0
    }

    .form-inline .form-check-input {
        position: relative;
        margin-top: 0;
        margin-right: .25rem;
        margin-left: 0
    }

    .form-inline .custom-control {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-left: 0
    }

    .form-inline .custom-control-indicator {
        position: static;
        display: inline-block;
        margin-right: .25rem;
        vertical-align: text-bottom
    }

    .form-inline .has-feedback .form-control-feedback {
        top: 0
    }
}

.btn {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    border: 1px solid transparent;
    padding: .5rem .75rem;
    font-size: 1rem;
    line-height: 1.25;
    border-radius: .25rem;
    transition: all .15s ease-in-out
}

    .btn:focus, .btn:hover {
        text-decoration: none
    }

    .btn:focus, .btn.focus {
        outline: 0;
        box-shadow: 0 0 0 3px rgba(0,123,255,.25)
    }

    .btn.disabled, .btn:disabled {
        opacity: .65
    }

    .btn:active, .btn.active {
        background-image: none
    }

a.btn.disabled, fieldset[disabled] a.btn {
    pointer-events: none
}

.btn-primary {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff
}

    .btn-primary:hover {
        color: #fff;
        background-color: #0069d9;
        border-color: #0062cc
    }

    .btn-primary:focus, .btn-primary.focus {
        box-shadow: 0 0 0 3px rgba(0,123,255,.5)
    }

    .btn-primary.disabled, .btn-primary:disabled {
        background-color: #007bff;
        border-color: #007bff
    }

    .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
        background-color: #0069d9;
        background-image: none;
        border-color: #0062cc
    }

.btn-secondary {
    color: #fff;
    background-color: #868e96;
    border-color: #868e96
}

    .btn-secondary:hover {
        color: #fff;
        background-color: #727b84;
        border-color: #6c757d
    }

    .btn-secondary:focus, .btn-secondary.focus {
        box-shadow: 0 0 0 3px rgba(134,142,150,.5)
    }

    .btn-secondary.disabled, .btn-secondary:disabled {
        background-color: #868e96;
        border-color: #868e96
    }

    .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle {
        background-color: #727b84;
        background-image: none;
        border-color: #6c757d
    }

.btn-success {
    color: #fff;
    background-color: #00bf71;
    border-color: #00bf71
}

    .btn-success:hover {
        color: #fff;
        background-color: #00995a;
        border-color: #008c53
    }

    .btn-success:focus, .btn-success.focus {
        box-shadow: 0 0 0 3px rgba(0,191,113,.5)
    }

    .btn-success.disabled, .btn-success:disabled {
        background-color: #00bf71;
        border-color: #00bf71
    }

    .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle {
        background-color: #00995a;
        background-image: none;
        border-color: #008c53
    }

.btn-info {
    color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8
}

    .btn-info:hover {
        color: #fff;
        background-color: #138496;
        border-color: #117a8b
    }

    .btn-info:focus, .btn-info.focus {
        box-shadow: 0 0 0 3px rgba(23,162,184,.5)
    }

    .btn-info.disabled, .btn-info:disabled {
        background-color: #17a2b8;
        border-color: #17a2b8
    }

    .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle {
        background-color: #138496;
        background-image: none;
        border-color: #117a8b
    }

.btn-warning {
    color: #111;
    background-color: #ffc107;
    border-color: #ffc107
}

    .btn-warning:hover {
        color: #111;
        background-color: #e0a800;
        border-color: #d39e00
    }

    .btn-warning:focus, .btn-warning.focus {
        box-shadow: 0 0 0 3px rgba(255,193,7,.5)
    }

    .btn-warning.disabled, .btn-warning:disabled {
        background-color: #ffc107;
        border-color: #ffc107
    }

    .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle {
        background-color: #e0a800;
        background-image: none;
        border-color: #d39e00
    }

.btn-danger {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545
}

    .btn-danger:hover {
        color: #fff;
        background-color: #c82333;
        border-color: #bd2130
    }

    .btn-danger:focus, .btn-danger.focus {
        box-shadow: 0 0 0 3px rgba(220,53,69,.5)
    }

    .btn-danger.disabled, .btn-danger:disabled {
        background-color: #dc3545;
        border-color: #dc3545
    }

    .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle {
        background-color: #c82333;
        background-image: none;
        border-color: #bd2130
    }

.btn-light {
    color: #111;
    background-color: #f8f9fa;
    border-color: #f8f9fa
}

    .btn-light:hover {
        color: #111;
        background-color: #e2e6ea;
        border-color: #dae0e5
    }

    .btn-light:focus, .btn-light.focus {
        box-shadow: 0 0 0 3px rgba(248,249,250,.5)
    }

    .btn-light.disabled, .btn-light:disabled {
        background-color: #f8f9fa;
        border-color: #f8f9fa
    }

    .btn-light:active, .btn-light.active, .show > .btn-light.dropdown-toggle {
        background-color: #e2e6ea;
        background-image: none;
        border-color: #dae0e5
    }

.btn-dark {
    color: #fff;
    background-color: #343a40;
    border-color: #343a40
}

    .btn-dark:hover {
        color: #fff;
        background-color: #23272b;
        border-color: #1d2124
    }

    .btn-dark:focus, .btn-dark.focus {
        box-shadow: 0 0 0 3px rgba(52,58,64,.5)
    }

    .btn-dark.disabled, .btn-dark:disabled {
        background-color: #343a40;
        border-color: #343a40
    }

    .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle {
        background-color: #23272b;
        background-image: none;
        border-color: #1d2124
    }

.btn-outline-primary {
    color: #007bff;
    background-color: transparent;
    background-image: none;
    border-color: #007bff
}

    .btn-outline-primary:hover {
        color: #fff;
        background-color: #007bff;
        border-color: #007bff
    }

    .btn-outline-primary:focus, .btn-outline-primary.focus {
        box-shadow: 0 0 0 3px rgba(0,123,255,.5)
    }

    .btn-outline-primary.disabled, .btn-outline-primary:disabled {
        color: #007bff;
        background-color: transparent
    }

    .btn-outline-primary:active, .btn-outline-primary.active, .show > .btn-outline-primary.dropdown-toggle {
        color: #fff;
        background-color: #007bff;
        border-color: #007bff
    }

.btn-outline-secondary {
    color: #868e96;
    background-color: transparent;
    background-image: none;
    border-color: #868e96
}

    .btn-outline-secondary:hover {
        color: #fff;
        background-color: #868e96;
        border-color: #868e96
    }

    .btn-outline-secondary:focus, .btn-outline-secondary.focus {
        box-shadow: 0 0 0 3px rgba(134,142,150,.5)
    }

    .btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
        color: #868e96;
        background-color: transparent
    }

    .btn-outline-secondary:active, .btn-outline-secondary.active, .show > .btn-outline-secondary.dropdown-toggle {
        color: #fff;
        background-color: #868e96;
        border-color: #868e96
    }

.btn-outline-success {
    color: #00bf71;
    background-color: transparent;
    background-image: none;
    border-color: #00bf71
}

    .btn-outline-success:hover {
        color: #fff;
        background-color: #00bf71;
        border-color: #00bf71
    }

    .btn-outline-success:focus, .btn-outline-success.focus {
        box-shadow: 0 0 0 3px rgba(0,191,113,.5)
    }

    .btn-outline-success.disabled, .btn-outline-success:disabled {
        color: #00bf71;
        background-color: transparent
    }

    .btn-outline-success:active, .btn-outline-success.active, .show > .btn-outline-success.dropdown-toggle {
        color: #fff;
        background-color: #00bf71;
        border-color: #00bf71
    }

.btn-outline-info {
    color: #17a2b8;
    background-color: transparent;
    background-image: none;
    border-color: #17a2b8
}

    .btn-outline-info:hover {
        color: #fff;
        background-color: #17a2b8;
        border-color: #17a2b8
    }

    .btn-outline-info:focus, .btn-outline-info.focus {
        box-shadow: 0 0 0 3px rgba(23,162,184,.5)
    }

    .btn-outline-info.disabled, .btn-outline-info:disabled {
        color: #17a2b8;
        background-color: transparent
    }

    .btn-outline-info:active, .btn-outline-info.active, .show > .btn-outline-info.dropdown-toggle {
        color: #fff;
        background-color: #17a2b8;
        border-color: #17a2b8
    }

.btn-outline-warning {
    color: #ffc107;
    background-color: transparent;
    background-image: none;
    border-color: #ffc107
}

    .btn-outline-warning:hover {
        color: #fff;
        background-color: #ffc107;
        border-color: #ffc107
    }

    .btn-outline-warning:focus, .btn-outline-warning.focus {
        box-shadow: 0 0 0 3px rgba(255,193,7,.5)
    }

    .btn-outline-warning.disabled, .btn-outline-warning:disabled {
        color: #ffc107;
        background-color: transparent
    }

    .btn-outline-warning:active, .btn-outline-warning.active, .show > .btn-outline-warning.dropdown-toggle {
        color: #fff;
        background-color: #ffc107;
        border-color: #ffc107
    }

.btn-outline-danger {
    color: #dc3545;
    background-color: transparent;
    background-image: none;
    border-color: #dc3545
}

    .btn-outline-danger:hover {
        color: #fff;
        background-color: #dc3545;
        border-color: #dc3545
    }

    .btn-outline-danger:focus, .btn-outline-danger.focus {
        box-shadow: 0 0 0 3px rgba(220,53,69,.5)
    }

    .btn-outline-danger.disabled, .btn-outline-danger:disabled {
        color: #dc3545;
        background-color: transparent
    }

    .btn-outline-danger:active, .btn-outline-danger.active, .show > .btn-outline-danger.dropdown-toggle {
        color: #fff;
        background-color: #dc3545;
        border-color: #dc3545
    }

.btn-outline-light {
    color: #f8f9fa;
    background-color: transparent;
    background-image: none;
    border-color: #f8f9fa
}

    .btn-outline-light:hover {
        color: #fff;
        background-color: #f8f9fa;
        border-color: #f8f9fa
    }

    .btn-outline-light:focus, .btn-outline-light.focus {
        box-shadow: 0 0 0 3px rgba(248,249,250,.5)
    }

    .btn-outline-light.disabled, .btn-outline-light:disabled {
        color: #f8f9fa;
        background-color: transparent
    }

    .btn-outline-light:active, .btn-outline-light.active, .show > .btn-outline-light.dropdown-toggle {
        color: #fff;
        background-color: #f8f9fa;
        border-color: #f8f9fa
    }

.btn-outline-dark {
    color: #343a40;
    background-color: transparent;
    background-image: none;
    border-color: #343a40
}

    .btn-outline-dark:hover {
        color: #fff;
        background-color: #343a40;
        border-color: #343a40
    }

    .btn-outline-dark:focus, .btn-outline-dark.focus {
        box-shadow: 0 0 0 3px rgba(52,58,64,.5)
    }

    .btn-outline-dark.disabled, .btn-outline-dark:disabled {
        color: #343a40;
        background-color: transparent
    }

    .btn-outline-dark:active, .btn-outline-dark.active, .show > .btn-outline-dark.dropdown-toggle {
        color: #fff;
        background-color: #343a40;
        border-color: #343a40
    }

.btn-link {
    font-weight: 400;
    color: #007bff;
    border-radius: 0
}

    .btn-link, .btn-link:active, .btn-link.active, .btn-link:disabled {
        background-color: transparent
    }

        .btn-link, .btn-link:focus, .btn-link:active {
            border-color: transparent;
            box-shadow: none
        }

            .btn-link:hover {
                border-color: transparent
            }

            .btn-link:focus, .btn-link:hover {
                color: #0056b3;
                text-decoration: underline;
                background-color: transparent
            }

            .btn-link:disabled {
                color: #868e96
            }

                .btn-link:disabled:focus, .btn-link:disabled:hover {
                    text-decoration: none
                }

.btn-lg, .btn-group-lg > .btn {
    padding: .5rem 1rem;
    font-size: 1.25rem;
    line-height: 1.5;
    border-radius: .3rem
}

.btn-sm, .btn-group-sm > .btn {
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem
}

.btn-block {
    display: block;
    width: 100%
}

    .btn-block + .btn-block {
        margin-top: .5rem
    }

input.btn-block[type=submit], input.btn-block[type=reset], input.btn-block[type=button] {
    width: 100%
}

.fade {
    opacity: 0;
    transition: opacity .15s linear
}

    .fade.show {
        opacity: 1
    }

.collapse {
    display: none
}

    .collapse.show {
        display: block
    }

tr.collapse.show {
    display: table-row
}

tbody.collapse.show {
    display: table-row-group
}

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    transition: height .35s ease
}

.dropup, .dropdown {
    position: relative
}

.dropdown-toggle::after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-left: .3em solid transparent
}

.dropdown-toggle:empty::after {
    margin-left: 0
}

.dropup .dropdown-menu {
    margin-top: 0;
    margin-bottom: .125rem
}

.dropup .dropdown-toggle::after {
    border-top: 0;
    border-bottom: .3em solid
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem
}

.dropdown-divider {
    height: 0;
    margin: .5rem 0;
    overflow: hidden;
    border-top: 1px solid #e9ecef
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background: 0 0;
    border: 0
}

    .dropdown-item:focus, .dropdown-item:hover {
        color: #16181b;
        text-decoration: none;
        background-color: #f8f9fa
    }

    .dropdown-item.active, .dropdown-item:active {
        color: #fff;
        text-decoration: none;
        background-color: #007bff
    }

    .dropdown-item.disabled, .dropdown-item:disabled {
        color: #868e96;
        background-color: transparent
    }

.show > a {
    outline: 0
}

.dropdown-menu.show {
    display: block
}

.dropdown-header {
    display: block;
    padding: .5rem 1.5rem;
    margin-bottom: 0;
    font-size: .875rem;
    color: #868e96;
    white-space: nowrap
}

.btn-group, .btn-group-vertical {
    position: relative;
    display: inline-flex;
    vertical-align: middle
}

    .btn-group > .btn, .btn-group-vertical > .btn {
        position: relative;
        flex: 0 1 auto;
        margin-bottom: 0
    }

        .btn-group > .btn:hover, .btn-group-vertical > .btn:hover {
            z-index: 2
        }

        .btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active, .btn-group-vertical > .btn:focus, .btn-group-vertical > .btn:active, .btn-group-vertical > .btn.active {
            z-index: 2
        }

    .btn-group .btn + .btn, .btn-group .btn + .btn-group, .btn-group .btn-group + .btn, .btn-group .btn-group + .btn-group, .btn-group-vertical .btn + .btn, .btn-group-vertical .btn + .btn-group, .btn-group-vertical .btn-group + .btn, .btn-group-vertical .btn-group + .btn-group {
        margin-left: -1px
    }

.btn-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start
}

    .btn-toolbar .input-group {
        width: auto
    }

.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0
}

.btn-group > .btn:first-child {
    margin-left: 0
}

    .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

.btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.btn-group > .btn-group {
    float: left
}

    .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
        border-radius: 0
    }

    .btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

    .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }

.btn + .dropdown-toggle-split {
    padding-right: .5625rem;
    padding-left: .5625rem
}

    .btn + .dropdown-toggle-split::after {
        margin-left: 0
    }

.btn-sm + .dropdown-toggle-split, .btn-group-sm > .btn + .dropdown-toggle-split {
    padding-right: .375rem;
    padding-left: .375rem
}

.btn-lg + .dropdown-toggle-split, .btn-group-lg > .btn + .dropdown-toggle-split {
    padding-right: .75rem;
    padding-left: .75rem
}

.btn-group-vertical {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center
}

    .btn-group-vertical .btn, .btn-group-vertical .btn-group {
        width: 100%
    }

    .btn-group-vertical > .btn + .btn, .btn-group-vertical > .btn + .btn-group, .btn-group-vertical > .btn-group + .btn, .btn-group-vertical > .btn-group + .btn-group {
        margin-top: -1px;
        margin-left: 0
    }

    .btn-group-vertical > .btn:not(:first-child):not(:last-child) {
        border-radius: 0
    }

    .btn-group-vertical > .btn:first-child:not(:last-child) {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0
    }

    .btn-group-vertical > .btn:last-child:not(:first-child) {
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

    .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
        border-radius: 0
    }

    .btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0
    }

    .btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

[data-toggle=buttons] > .btn input[type=radio], [data-toggle=buttons] > .btn input[type=checkbox], [data-toggle=buttons] > .btn-group > .btn input[type=radio], [data-toggle=buttons] > .btn-group > .btn input[type=checkbox] {
    position: absolute;
    clip: rect(0,0,0,0);
    pointer-events: none
}

.input-group {
    position: relative;
    display: flex;
    width: 100%
}

    .input-group .form-control {
        position: relative;
        z-index: 2;
        flex: 1 1 auto;
        width: 1%;
        margin-bottom: 0
    }

        .input-group .form-control:focus, .input-group .form-control:active, .input-group .form-control:hover {
            z-index: 3
        }

    .input-group-addon, .input-group-btn, .input-group .form-control {
        display: flex;
        align-items: center
    }

        .input-group-addon:not(:first-child):not(:last-child), .input-group-btn:not(:first-child):not(:last-child), .input-group .form-control:not(:first-child):not(:last-child) {
            border-radius: 0
        }

.input-group-addon, .input-group-btn {
    white-space: nowrap;
    vertical-align: middle
}

.input-group-addon {
    padding: .5rem .75rem;
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.25;
    color: #495057;
    text-align: center;
    background-color: #e9ecef;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem
}

    .input-group-addon.form-control-sm, .input-group-sm > .input-group-addon, .input-group-sm > .input-group-btn > .input-group-addon.btn {
        padding: .25rem .5rem;
        font-size: .875rem;
        border-radius: .2rem
    }

    .input-group-addon.form-control-lg, .input-group-lg > .input-group-addon, .input-group-lg > .input-group-btn > .input-group-addon.btn {
        padding: .5rem 1rem;
        font-size: 1.25rem;
        border-radius: .3rem
    }

    .input-group-addon input[type=radio], .input-group-addon input[type=checkbox] {
        margin-top: 0
    }

    .input-group .form-control:not(:last-child), .input-group-addon:not(:last-child), .input-group-btn:not(:last-child) > .btn, .input-group-btn:not(:last-child) > .btn-group > .btn, .input-group-btn:not(:last-child) > .dropdown-toggle, .input-group-btn:not(:first-child) > .btn:not(:last-child):not(.dropdown-toggle), .input-group-btn:not(:first-child) > .btn-group:not(:last-child) > .btn {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0
    }

    .input-group-addon:not(:last-child) {
        border-right: 0
    }

    .input-group .form-control:not(:first-child), .input-group-addon:not(:first-child), .input-group-btn:not(:first-child) > .btn, .input-group-btn:not(:first-child) > .btn-group > .btn, .input-group-btn:not(:first-child) > .dropdown-toggle, .input-group-btn:not(:last-child) > .btn:not(:first-child), .input-group-btn:not(:last-child) > .btn-group:not(:first-child) > .btn {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0
    }

.form-control + .input-group-addon:not(:first-child) {
    border-left: 0
}

.input-group-btn {
    position: relative;
    font-size: 0;
    white-space: nowrap
}

    .input-group-btn > .btn {
        position: relative
    }

        .input-group-btn > .btn + .btn {
            margin-left: -1px
        }

        .input-group-btn > .btn:focus, .input-group-btn > .btn:active, .input-group-btn > .btn:hover {
            z-index: 3
        }

    .input-group-btn:not(:last-child) > .btn, .input-group-btn:not(:last-child) > .btn-group {
        margin-right: -1px
    }

    .input-group-btn:not(:first-child) > .btn, .input-group-btn:not(:first-child) > .btn-group {
        z-index: 2;
        margin-left: -1px
    }

        .input-group-btn:not(:first-child) > .btn:focus, .input-group-btn:not(:first-child) > .btn:active, .input-group-btn:not(:first-child) > .btn:hover, .input-group-btn:not(:first-child) > .btn-group:focus, .input-group-btn:not(:first-child) > .btn-group:active, .input-group-btn:not(:first-child) > .btn-group:hover {
            z-index: 3
        }

.custom-control {
    position: relative;
    display: inline-flex;
    min-height: 1.5rem;
    padding-left: 1.5rem;
    margin-right: 1rem
}

.custom-control-input {
    position: absolute;
    z-index: -1;
    opacity: 0
}

    .custom-control-input:checked ~ .custom-control-indicator {
        color: #fff;
        background-color: #007bff
    }

    .custom-control-input:focus ~ .custom-control-indicator {
        box-shadow: 0 0 0 1px #fff,0 0 0 3px #007bff
    }

    .custom-control-input:active ~ .custom-control-indicator {
        color: #fff;
        background-color: #b3d7ff
    }

    .custom-control-input:disabled ~ .custom-control-indicator {
        background-color: #e9ecef
    }

    .custom-control-input:disabled ~ .custom-control-description {
        color: #868e96
    }

.custom-control-indicator {
    position: absolute;
    top: .25rem;
    left: 0;
    display: block;
    width: 1rem;
    height: 1rem;
    pointer-events: none;
    user-select: none;
    background-color: #ddd;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%
}

.custom-checkbox .custom-control-indicator {
    border-radius: .25rem
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-indicator {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA4IDgnPjxwYXRoIGZpbGw9JyNmZmYnIGQ9J002LjU2NC43NWwtMy41OSAzLjYxMi0xLjUzOC0xLjU1TDAgNC4yNiAyLjk3NCA3LjI1IDggMi4xOTN6Jy8+PC9zdmc+)
}

.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-indicator {
    background-color: #007bff;
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA0IDQnPjxwYXRoIHN0cm9rZT0nI2ZmZicgZD0nTTAgMmg0Jy8+PC9zdmc+)
}

.custom-radio .custom-control-indicator {
    border-radius: 50%
}

.custom-radio .custom-control-input:checked ~ .custom-control-indicator {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9Jy00IC00IDggOCc+PGNpcmNsZSByPSczJyBmaWxsPScjZmZmJy8+PC9zdmc+)
}

.custom-controls-stacked {
    display: flex;
    flex-direction: column
}

    .custom-controls-stacked .custom-control {
        margin-bottom: .25rem
    }

        .custom-controls-stacked .custom-control + .custom-control {
            margin-left: 0
        }

.custom-select {
    display: inline-block;
    max-width: 100%;
    height: calc(2.25rem + 2px);
    padding: .375rem 1.75rem .375rem .75rem;
    line-height: 1.25;
    color: #495057;
    vertical-align: middle;
    background: #fff url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA0IDUnPjxwYXRoIGZpbGw9JyMzMzMnIGQ9J00yIDBMMCAyaDR6bTAgNUwwIDNoNHonLz48L3N2Zz4=) no-repeat right .75rem center;
    background-size: 8px 10px;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
    appearance: none
}

    .custom-select:focus {
        border-color: #80bdff;
        outline: none
    }

        .custom-select:focus::-ms-value {
            color: #495057;
            background-color: #fff
        }

    .custom-select:disabled {
        color: #868e96;
        background-color: #e9ecef
    }

    .custom-select::-ms-expand {
        opacity: 0
    }

.custom-select-sm {
    height: calc(1.8125rem + 2px);
    padding-top: .375rem;
    padding-bottom: .375rem;
    font-size: 75%
}

.custom-file {
    position: relative;
    display: inline-block;
    max-width: 100%;
    height: 2.5rem;
    margin-bottom: 0
}

.custom-file-input {
    min-width: 14rem;
    max-width: 100%;
    height: 2.5rem;
    margin: 0;
    opacity: 0
}

.custom-file-control {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 5;
    height: 2.5rem;
    padding: .5rem 1rem;
    line-height: 1.5;
    color: #495057;
    pointer-events: none;
    user-select: none;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem
}

    .custom-file-control:lang(en):empty::after {
        content: "Choose file..."
    }

    .custom-file-control::before {
        position: absolute;
        top: -1px;
        right: -1px;
        bottom: -1px;
        z-index: 6;
        display: block;
        height: 2.5rem;
        padding: .5rem 1rem;
        line-height: 1.5;
        color: #495057;
        background-color: #e9ecef;
        border: 1px solid rgba(0,0,0,.15);
        border-radius: 0 .25rem .25rem 0
    }

    .custom-file-control:lang(en)::before {
        content: "Browse"
    }

.nav {
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none
}

.nav-link {
    display: block;
    padding: .5rem 1rem
}

    .nav-link:focus, .nav-link:hover {
        text-decoration: none
    }

    .nav-link.disabled {
        color: #868e96
    }

.nav-tabs {
    border-bottom: 1px solid #ddd
}

    .nav-tabs .nav-item {
        margin-bottom: -1px
    }

    .nav-tabs .nav-link {
        border: 1px solid transparent;
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem
    }

        .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
            border-color: #e9ecef #e9ecef #ddd
        }

        .nav-tabs .nav-link.disabled {
            color: #868e96;
            background-color: transparent;
            border-color: transparent
        }

        .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
            color: #495057;
            background-color: #fff;
            border-color: #ddd #ddd #fff
        }

    .nav-tabs .dropdown-menu {
        margin-top: -1px;
        border-top-left-radius: 0;
        border-top-right-radius: 0
    }

.nav-pills .nav-link {
    border-radius: .25rem
}

    .nav-pills .nav-link.active, .show > .nav-pills .nav-link {
        color: #fff;
        background-color: #007bff
    }

.nav-fill .nav-item {
    flex: 1 1 auto;
    text-align: center
}

.nav-justified .nav-item {
    flex-basis: 0;
    flex-grow: 1;
    text-align: center
}

.tab-content > .tab-pane {
    display: none
}

.tab-content > .active {
    display: block
}

.navbar {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: .5rem 1rem
}

    .navbar > .container, .navbar > .container-fluid {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between
    }

.navbar-brand {
    display: inline-block;
    padding-top: .3125rem;
    padding-bottom: .3125rem;
    margin-right: 1rem;
    font-size: 1.25rem;
    line-height: inherit;
    white-space: nowrap
}

    .navbar-brand:focus, .navbar-brand:hover {
        text-decoration: none
    }

.navbar-nav {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none
}

    .navbar-nav .nav-link {
        padding-right: 0;
        padding-left: 0
    }

    .navbar-nav .dropdown-menu {
        position: static;
        float: none
    }

.navbar-text {
    display: inline-block;
    padding-top: .5rem;
    padding-bottom: .5rem
}

.navbar-collapse {
    flex-basis: 100%;
    align-items: center
}

.navbar-toggler {
    padding: .25rem .75rem;
    font-size: 1.25rem;
    line-height: 1;
    background: 0 0;
    border: 1px solid transparent;
    border-radius: .25rem
}

    .navbar-toggler:focus, .navbar-toggler:hover {
        text-decoration: none
    }

.navbar-toggler-icon {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    content: "";
    background: no-repeat center center;
    background-size: 100% 100%
}

@media(max-width:575px) {
    .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid {
        padding-right: 0;
        padding-left: 0
    }
}

@media(min-width:576px) {
    .navbar-expand-sm {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start
    }

        .navbar-expand-sm .navbar-nav {
            flex-direction: row
        }

            .navbar-expand-sm .navbar-nav .dropdown-menu {
                position: absolute
            }

            .navbar-expand-sm .navbar-nav .dropdown-menu-right {
                right: 0;
                left: auto
            }

            .navbar-expand-sm .navbar-nav .nav-link {
                padding-right: .5rem;
                padding-left: .5rem
            }

        .navbar-expand-sm > .container, .navbar-expand-sm > .container-fluid {
            flex-wrap: nowrap
        }

        .navbar-expand-sm .navbar-collapse {
            display: flex !important
        }

        .navbar-expand-sm .navbar-toggler {
            display: none
        }
}

@media(max-width:767px) {
    .navbar-expand-md > .container, .navbar-expand-md > .container-fluid {
        padding-right: 0;
        padding-left: 0
    }
}

@media(min-width:768px) {
    .navbar-expand-md {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start
    }

        .navbar-expand-md .navbar-nav {
            flex-direction: row
        }

            .navbar-expand-md .navbar-nav .dropdown-menu {
                position: absolute
            }

            .navbar-expand-md .navbar-nav .dropdown-menu-right {
                right: 0;
                left: auto
            }

            .navbar-expand-md .navbar-nav .nav-link {
                padding-right: .5rem;
                padding-left: .5rem
            }

        .navbar-expand-md > .container, .navbar-expand-md > .container-fluid {
            flex-wrap: nowrap
        }

        .navbar-expand-md .navbar-collapse {
            display: flex !important
        }

        .navbar-expand-md .navbar-toggler {
            display: none
        }
}

@media(max-width:991px) {
    .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid {
        padding-right: 0;
        padding-left: 0
    }
}

@media(min-width:992px) {
    .navbar-expand-lg {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start
    }

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

            .navbar-expand-lg .navbar-nav .dropdown-menu {
                position: absolute
            }

            .navbar-expand-lg .navbar-nav .dropdown-menu-right {
                right: 0;
                left: auto
            }

            .navbar-expand-lg .navbar-nav .nav-link {
                padding-right: .5rem;
                padding-left: .5rem
            }

        .navbar-expand-lg > .container, .navbar-expand-lg > .container-fluid {
            flex-wrap: nowrap
        }

        .navbar-expand-lg .navbar-collapse {
            display: flex !important
        }

        .navbar-expand-lg .navbar-toggler {
            display: none
        }
}

@media(max-width:1199px) {
    .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid {
        padding-right: 0;
        padding-left: 0
    }
}

@media(min-width:1200px) {
    .navbar-expand-xl {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start
    }

        .navbar-expand-xl .navbar-nav {
            flex-direction: row
        }

            .navbar-expand-xl .navbar-nav .dropdown-menu {
                position: absolute
            }

            .navbar-expand-xl .navbar-nav .dropdown-menu-right {
                right: 0;
                left: auto
            }

            .navbar-expand-xl .navbar-nav .nav-link {
                padding-right: .5rem;
                padding-left: .5rem
            }

        .navbar-expand-xl > .container, .navbar-expand-xl > .container-fluid {
            flex-wrap: nowrap
        }

        .navbar-expand-xl .navbar-collapse {
            display: flex !important
        }

        .navbar-expand-xl .navbar-toggler {
            display: none
        }
}

.navbar-expand {
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start
}

    .navbar-expand > .container, .navbar-expand > .container-fluid {
        padding-right: 0;
        padding-left: 0
    }

    .navbar-expand .navbar-nav {
        flex-direction: row
    }

        .navbar-expand .navbar-nav .dropdown-menu {
            position: absolute
        }

        .navbar-expand .navbar-nav .dropdown-menu-right {
            right: 0;
            left: auto
        }

        .navbar-expand .navbar-nav .nav-link {
            padding-right: .5rem;
            padding-left: .5rem
        }

    .navbar-expand > .container, .navbar-expand > .container-fluid {
        flex-wrap: nowrap
    }

    .navbar-expand .navbar-collapse {
        display: flex !important
    }

    .navbar-expand .navbar-toggler {
        display: none
    }

.navbar-light .navbar-brand {
    color: rgba(0,0,0,.9)
}

    .navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover {
        color: rgba(0,0,0,.9)
    }

.navbar-light .navbar-nav .nav-link {
    color: rgba(0,0,0,.5)
}

    .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
        color: rgba(0,0,0,.7)
    }

    .navbar-light .navbar-nav .nav-link.disabled {
        color: rgba(0,0,0,.3)
    }

    .navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active {
        color: rgba(0,0,0,.9)
    }

.navbar-light .navbar-toggler {
    color: rgba(0,0,0,.5);
    border-color: rgba(0,0,0,.1)
}

.navbar-light .navbar-toggler-icon {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB2aWV3Qm94PScwIDAgMzAgMzAnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zyc+PHBhdGggc3Ryb2tlPSdyZ2JhKDAsMCwwLDAuNSknIHN0cm9rZS13aWR0aD0nMicgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbWl0ZXJsaW1pdD0nMTAnIGQ9J000IDdoMjJNNCAxNWgyMk00IDIzaDIyJy8+PC9zdmc+)
}

.navbar-light .navbar-text {
    color: rgba(0,0,0,.5)
}

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

    .navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover {
        color: #fff
    }

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.5)
}

    .navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
        color: rgba(255,255,255,.75)
    }

    .navbar-dark .navbar-nav .nav-link.disabled {
        color: rgba(255,255,255,.25)
    }

    .navbar-dark .navbar-nav .show > .nav-link, .navbar-dark .navbar-nav .active > .nav-link, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .nav-link.active {
        color: #fff
    }

.navbar-dark .navbar-toggler {
    color: rgba(255,255,255,.5);
    border-color: rgba(255,255,255,.1)
}

.navbar-dark .navbar-toggler-icon {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB2aWV3Qm94PScwIDAgMzAgMzAnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zyc+PHBhdGggc3Ryb2tlPSdyZ2JhKDI1NSwyNTUsMjU1LDAuNSknIHN0cm9rZS13aWR0aD0nMicgc3Ryb2tlLWxpbmVjYXA9J3JvdW5kJyBzdHJva2UtbWl0ZXJsaW1pdD0nMTAnIGQ9J000IDdoMjJNNCAxNWgyMk00IDIzaDIyJy8+PC9zdmc+)
}

.navbar-dark .navbar-text {
    color: rgba(255,255,255,.5)
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem
}

.card-body {
    flex: 1 1 auto;
    padding: 1.25rem
}

.card-title {
    margin-bottom: .75rem
}

.card-subtitle {
    margin-top: -.375rem;
    margin-bottom: 0
}

.card-text:last-child {
    margin-bottom: 0
}

.card-link:hover {
    text-decoration: none
}

.card-link + .card-link {
    margin-left: 1.25rem
}

.card > .list-group:first-child .list-group-item:first-child {
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem
}

.card > .list-group:last-child .list-group-item:last-child {
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem
}

.card-header {
    padding: .75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125)
}

    .card-header:first-child {
        border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0
    }

.card-footer {
    padding: .75rem 1.25rem;
    background-color: rgba(0,0,0,.03);
    border-top: 1px solid rgba(0,0,0,.125)
}

    .card-footer:last-child {
        border-radius: 0 0 calc(.25rem - 1px) calc(.25rem - 1px)
    }

.card-header-tabs {
    margin-right: -.625rem;
    margin-bottom: -.75rem;
    margin-left: -.625rem;
    border-bottom: 0
}

.card-header-pills {
    margin-right: -.625rem;
    margin-left: -.625rem
}

.card-img-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1.25rem
}

.card-img {
    width: 100%;
    border-radius: calc(.25rem - 1px)
}

.card-img-top {
    width: 100%;
    border-top-left-radius: calc(.25rem - 1px);
    border-top-right-radius: calc(.25rem - 1px)
}

.card-img-bottom {
    width: 100%;
    border-bottom-right-radius: calc(.25rem - 1px);
    border-bottom-left-radius: calc(.25rem - 1px)
}

@media(min-width:576px) {
    .card-deck {
        display: flex;
        flex-flow: row wrap;
        margin-right: -15px;
        margin-left: -15px
    }

        .card-deck .card {
            display: flex;
            flex: 1 0 0%;
            flex-direction: column;
            margin-right: 15px;
            margin-left: 15px
        }
}

@media(min-width:576px) {
    .card-group {
        display: flex;
        flex-flow: row wrap
    }

        .card-group .card {
            flex: 1 0 0%
        }

            .card-group .card + .card {
                margin-left: 0;
                border-left: 0
            }

            .card-group .card:first-child {
                border-top-right-radius: 0;
                border-bottom-right-radius: 0
            }

                .card-group .card:first-child .card-img-top {
                    border-top-right-radius: 0
                }

                .card-group .card:first-child .card-img-bottom {
                    border-bottom-right-radius: 0
                }

            .card-group .card:last-child {
                border-top-left-radius: 0;
                border-bottom-left-radius: 0
            }

                .card-group .card:last-child .card-img-top {
                    border-top-left-radius: 0
                }

                .card-group .card:last-child .card-img-bottom {
                    border-bottom-left-radius: 0
                }

            .card-group .card:not(:first-child):not(:last-child) {
                border-radius: 0
            }

                .card-group .card:not(:first-child):not(:last-child) .card-img-top, .card-group .card:not(:first-child):not(:last-child) .card-img-bottom {
                    border-radius: 0
                }
}

.card-columns .card {
    margin-bottom: .75rem
}

@media(min-width:576px) {
    .card-columns {
        column-count: 3;
        column-gap: 1.25rem
    }

        .card-columns .card {
            display: inline-block;
            width: 100%
        }
}

.breadcrumb {
    padding: .75rem 1rem;
    margin-bottom: 1rem;
    list-style: none;
    background-color: #e9ecef;
    border-radius: .25rem
}

    .breadcrumb::after {
        display: block;
        clear: both;
        content: ""
    }

.breadcrumb-item {
    float: left
}

    .breadcrumb-item + .breadcrumb-item::before {
        display: inline-block;
        padding-right: .5rem;
        padding-left: .5rem;
        color: #868e96;
        content: "/"
    }

    .breadcrumb-item + .breadcrumb-item:hover::before {
        text-decoration: underline
    }

    .breadcrumb-item + .breadcrumb-item:hover::before {
        text-decoration: none
    }

    .breadcrumb-item.active {
        color: #868e96
    }

.pagination {
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: .25rem
}

.page-item:first-child .page-link {
    margin-left: 0;
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem
}

.page-item:last-child .page-link {
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem
}

.page-item.active .page-link {
    z-index: 2;
    color: #fff;
    background-color: #007bff;
    border-color: #007bff
}

.page-item.disabled .page-link {
    color: #868e96;
    pointer-events: none;
    background-color: #fff;
    border-color: #ddd
}

.page-link {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #007bff;
    background-color: #fff;
    border: 1px solid #ddd
}

    .page-link:focus, .page-link:hover {
        color: #0056b3;
        text-decoration: none;
        background-color: #e9ecef;
        border-color: #ddd
    }

.pagination-lg .page-link {
    padding: .75rem 1.5rem;
    font-size: 1.25rem;
    line-height: 1.5
}

.pagination-lg .page-item:first-child .page-link {
    border-top-left-radius: .3rem;
    border-bottom-left-radius: .3rem
}

.pagination-lg .page-item:last-child .page-link {
    border-top-right-radius: .3rem;
    border-bottom-right-radius: .3rem
}

.pagination-sm .page-link {
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.5
}

.pagination-sm .page-item:first-child .page-link {
    border-top-left-radius: .2rem;
    border-bottom-left-radius: .2rem
}

.pagination-sm .page-item:last-child .page-link {
    border-top-right-radius: .2rem;
    border-bottom-right-radius: .2rem
}

.badge {
    display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem
}

    .badge:empty {
        display: none
    }

.btn .badge {
    position: relative;
    top: -1px
}

.badge-pill {
    padding-right: .6em;
    padding-left: .6em;
    border-radius: 10rem
}

.badge-primary {
    color: #fff;
    background-color: #007bff
}

    .badge-primary[href]:focus, .badge-primary[href]:hover {
        color: #fff;
        text-decoration: none;
        background-color: #0062cc
    }

.badge-secondary {
    color: #fff;
    background-color: #868e96
}

    .badge-secondary[href]:focus, .badge-secondary[href]:hover {
        color: #fff;
        text-decoration: none;
        background-color: #6c757d
    }

.badge-success {
    color: #fff;
    background-color: #00bf71
}

    .badge-success[href]:focus, .badge-success[href]:hover {
        color: #fff;
        text-decoration: none;
        background-color: #008c53
    }

.badge-info {
    color: #fff;
    background-color: #17a2b8
}

    .badge-info[href]:focus, .badge-info[href]:hover {
        color: #fff;
        text-decoration: none;
        background-color: #117a8b
    }

.badge-warning {
    color: #111;
    background-color: #ffc107
}

    .badge-warning[href]:focus, .badge-warning[href]:hover {
        color: #111;
        text-decoration: none;
        background-color: #d39e00
    }

.badge-danger {
    color: #fff;
    background-color: #dc3545
}

    .badge-danger[href]:focus, .badge-danger[href]:hover {
        color: #fff;
        text-decoration: none;
        background-color: #bd2130
    }

.badge-light {
    color: #111;
    background-color: #f8f9fa
}

    .badge-light[href]:focus, .badge-light[href]:hover {
        color: #111;
        text-decoration: none;
        background-color: #dae0e5
    }

.badge-dark {
    color: #fff;
    background-color: #343a40
}

    .badge-dark[href]:focus, .badge-dark[href]:hover {
        color: #fff;
        text-decoration: none;
        background-color: #1d2124
    }

.jumbotron {
    padding: 2rem 1rem;
    margin-bottom: 2rem;
    background-color: #e9ecef;
    border-radius: .3rem
}

@media(min-width:576px) {
    .jumbotron {
        padding: 4rem 2rem
    }
}

.jumbotron-fluid {
    padding-right: 0;
    padding-left: 0;
    border-radius: 0
}

.alert {
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem
}

.alert-heading {
    color: inherit
}

.alert-link {
    font-weight: 700
}

.alert-dismissible .close {
    position: relative;
    top: -.75rem;
    right: -1.25rem;
    padding: .75rem 1.25rem;
    color: inherit
}

.alert-primary {
    color: #004085;
    background-color: #cce5ff;
    border-color: #b8daff
}

    .alert-primary hr {
        border-top-color: #9fcdff
    }

    .alert-primary .alert-link {
        color: #002752
    }

.alert-secondary {
    color: #464a4e;
    background-color: #e7e8ea;
    border-color: #dddfe2
}

    .alert-secondary hr {
        border-top-color: #cfd2d6
    }

    .alert-secondary .alert-link {
        color: #2e3133
    }

.alert-success {
    color: #00633b;
    background-color: #ccf2e3;
    border-color: #b8edd7
}

    .alert-success hr {
        border-top-color: #a4e8cc
    }

    .alert-success .alert-link {
        color: #00301d
    }

.alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb
}

    .alert-info hr {
        border-top-color: #abdde5
    }

    .alert-info .alert-link {
        color: #062c33
    }

.alert-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba
}

    .alert-warning hr {
        border-top-color: #ffe8a1
    }

    .alert-warning .alert-link {
        color: #533f03
    }

.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb
}

    .alert-danger hr {
        border-top-color: #f1b0b7
    }

    .alert-danger .alert-link {
        color: #491217
    }

.alert-light {
    color: #818182;
    background-color: #fefefe;
    border-color: #fdfdfe
}

    .alert-light hr {
        border-top-color: #ececf6
    }

    .alert-light .alert-link {
        color: #686868
    }

.alert-dark {
    color: #1b1e21;
    background-color: #d6d8d9;
    border-color: #c6c8ca
}

    .alert-dark hr {
        border-top-color: #b9bbbe
    }

    .alert-dark .alert-link {
        color: #040505
    }

@keyframes progress-bar-stripes {
    from {
        background-position: 1rem 0
    }

    to {
        background-position: 0 0
    }
}

.progress {
    display: flex;
    overflow: hidden;
    font-size: .75rem;
    line-height: 1rem;
    text-align: center;
    background-color: #e9ecef;
    border-radius: .25rem
}

.progress-bar {
    height: 1rem;
    line-height: 1rem;
    color: #fff;
    background-color: #007bff;
    transition: width .6s ease
}

.progress-bar-striped {
    background-image: linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
    background-size: 1rem 1rem
}

.progress-bar-animated {
    animation: progress-bar-stripes 1s linear infinite
}

.media {
    display: flex;
    align-items: flex-start
}

.media-body {
    flex: 1
}

.list-group {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0
}

.list-group-item-action {
    width: 100%;
    color: #495057;
    text-align: inherit
}

    .list-group-item-action:focus, .list-group-item-action:hover {
        color: #495057;
        text-decoration: none;
        background-color: #f8f9fa
    }

    .list-group-item-action:active {
        color: #212529;
        background-color: #e9ecef
    }

.list-group-item {
    position: relative;
    display: block;
    padding: .75rem 1.25rem;
    margin-bottom: -1px;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.125)
}

    .list-group-item:first-child {
        border-top-left-radius: .25rem;
        border-top-right-radius: .25rem
    }

    .list-group-item:last-child {
        margin-bottom: 0;
        border-bottom-right-radius: .25rem;
        border-bottom-left-radius: .25rem
    }

    .list-group-item:focus, .list-group-item:hover {
        text-decoration: none
    }

    .list-group-item.disabled, .list-group-item:disabled {
        color: #868e96;
        background-color: #fff
    }

    .list-group-item.active {
        z-index: 2;
        color: #fff;
        background-color: #007bff;
        border-color: #007bff
    }

.list-group-flush .list-group-item {
    border-right: 0;
    border-left: 0;
    border-radius: 0
}

.list-group-flush:first-child .list-group-item:first-child {
    border-top: 0
}

.list-group-flush:last-child .list-group-item:last-child {
    border-bottom: 0
}

.list-group-item-primary {
    color: #004085;
    background-color: #b8daff
}

a.list-group-item-primary, button.list-group-item-primary {
    color: #004085
}

    a.list-group-item-primary:focus, a.list-group-item-primary:hover, button.list-group-item-primary:focus, button.list-group-item-primary:hover {
        color: #004085;
        background-color: #9fcdff
    }

    a.list-group-item-primary.active, button.list-group-item-primary.active {
        color: #fff;
        background-color: #004085;
        border-color: #004085
    }

.list-group-item-secondary {
    color: #464a4e;
    background-color: #dddfe2
}

a.list-group-item-secondary, button.list-group-item-secondary {
    color: #464a4e
}

    a.list-group-item-secondary:focus, a.list-group-item-secondary:hover, button.list-group-item-secondary:focus, button.list-group-item-secondary:hover {
        color: #464a4e;
        background-color: #cfd2d6
    }

    a.list-group-item-secondary.active, button.list-group-item-secondary.active {
        color: #fff;
        background-color: #464a4e;
        border-color: #464a4e
    }

.list-group-item-success {
    color: #00633b;
    background-color: #b8edd7
}

a.list-group-item-success, button.list-group-item-success {
    color: #00633b
}

    a.list-group-item-success:focus, a.list-group-item-success:hover, button.list-group-item-success:focus, button.list-group-item-success:hover {
        color: #00633b;
        background-color: #a4e8cc
    }

    a.list-group-item-success.active, button.list-group-item-success.active {
        color: #fff;
        background-color: #00633b;
        border-color: #00633b
    }

.list-group-item-info {
    color: #0c5460;
    background-color: #bee5eb
}

a.list-group-item-info, button.list-group-item-info {
    color: #0c5460
}

    a.list-group-item-info:focus, a.list-group-item-info:hover, button.list-group-item-info:focus, button.list-group-item-info:hover {
        color: #0c5460;
        background-color: #abdde5
    }

    a.list-group-item-info.active, button.list-group-item-info.active {
        color: #fff;
        background-color: #0c5460;
        border-color: #0c5460
    }

.list-group-item-warning {
    color: #856404;
    background-color: #ffeeba
}

a.list-group-item-warning, button.list-group-item-warning {
    color: #856404
}

    a.list-group-item-warning:focus, a.list-group-item-warning:hover, button.list-group-item-warning:focus, button.list-group-item-warning:hover {
        color: #856404;
        background-color: #ffe8a1
    }

    a.list-group-item-warning.active, button.list-group-item-warning.active {
        color: #fff;
        background-color: #856404;
        border-color: #856404
    }

.list-group-item-danger {
    color: #721c24;
    background-color: #f5c6cb
}

a.list-group-item-danger, button.list-group-item-danger {
    color: #721c24
}

    a.list-group-item-danger:focus, a.list-group-item-danger:hover, button.list-group-item-danger:focus, button.list-group-item-danger:hover {
        color: #721c24;
        background-color: #f1b0b7
    }

    a.list-group-item-danger.active, button.list-group-item-danger.active {
        color: #fff;
        background-color: #721c24;
        border-color: #721c24
    }

.list-group-item-light {
    color: #818182;
    background-color: #fdfdfe
}

a.list-group-item-light, button.list-group-item-light {
    color: #818182
}

    a.list-group-item-light:focus, a.list-group-item-light:hover, button.list-group-item-light:focus, button.list-group-item-light:hover {
        color: #818182;
        background-color: #ececf6
    }

    a.list-group-item-light.active, button.list-group-item-light.active {
        color: #fff;
        background-color: #818182;
        border-color: #818182
    }

.list-group-item-dark {
    color: #1b1e21;
    background-color: #c6c8ca
}

a.list-group-item-dark, button.list-group-item-dark {
    color: #1b1e21
}

    a.list-group-item-dark:focus, a.list-group-item-dark:hover, button.list-group-item-dark:focus, button.list-group-item-dark:hover {
        color: #1b1e21;
        background-color: #b9bbbe
    }

    a.list-group-item-dark.active, button.list-group-item-dark.active {
        color: #fff;
        background-color: #1b1e21;
        border-color: #1b1e21
    }

.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5
}

    .close:focus, .close:hover {
        color: #000;
        text-decoration: none;
        opacity: .75
    }

button.close {
    padding: 0;
    background: 0 0;
    border: 0;
    -webkit-appearance: none
}

.modal-open {
    overflow: hidden
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    outline: 0
}

    .modal.fade .modal-dialog {
        transition: transform .3s ease-out;
        transform: translate(0,-25%)
    }

    .modal.show .modal-dialog {
        transform: translate(0,0)
    }

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 10px
}

.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: .3rem;
    outline: 0
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000
}

    .modal-backdrop.fade {
        opacity: 0
    }

    .modal-backdrop.show {
        opacity: .5
    }

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
    border-bottom: 1px solid #e9ecef
}

.modal-title {
    margin-bottom: 0;
    line-height: 1.5
}

.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 15px
}

.modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 15px;
    border-top: 1px solid #e9ecef
}

    .modal-footer > :not(:first-child) {
        margin-left: .25rem
    }

    .modal-footer > :not(:last-child) {
        margin-right: .25rem
    }

.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll
}

@media(min-width:576px) {
    .modal-dialog {
        max-width: 500px;
        margin: 30px auto
    }

    .modal-sm {
        max-width: 300px
    }
}

@media(min-width:992px) {
    .modal-lg {
        max-width: 800px
    }
}

.tooltip {
    position: absolute;
    z-index: 1070;
    display: block;
    margin: 0;
    font-family: -apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,sans-serif;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    white-space: normal;
    line-break: auto;
    font-size: 16px;
    word-wrap: break-word;
    border-radius: 8px;
    opacity: 0
}

    .tooltip.show {
        opacity: 1
    }

    .tooltip .arrow {
        position: absolute;
        display: block;
        width: 5px;
        height: 5px
    }

    .tooltip.bs-tooltip-top, .tooltip.bs-tooltip-auto[x-placement^=top] {
        padding: 5px 0
    }

        .tooltip.bs-tooltip-top .arrow, .tooltip.bs-tooltip-auto[x-placement^=top] .arrow {
            bottom: 0
        }

            .tooltip.bs-tooltip-top .arrow::before, .tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before {
                margin-left: -3px;
                content: "";
                border-width: 5px 5px 0;
                border-top-color: #e9e9e9
            }

    .tooltip.bs-tooltip-right, .tooltip.bs-tooltip-auto[x-placement^=right] {
        padding: 0 5px
    }

        .tooltip.bs-tooltip-right .arrow, .tooltip.bs-tooltip-auto[x-placement^=right] .arrow {
            left: 0
        }

            .tooltip.bs-tooltip-right .arrow::before, .tooltip.bs-tooltip-auto[x-placement^=right] .arrow::before {
                margin-top: -3px;
                content: "";
                border-width: 5px 5px 5px 0;
                border-right-color: #e9e9e9
            }

    .tooltip.bs-tooltip-bottom, .tooltip.bs-tooltip-auto[x-placement^=bottom] {
        padding: 5px 0
    }

        .tooltip.bs-tooltip-bottom .arrow, .tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow {
            top: 0
        }

            .tooltip.bs-tooltip-bottom .arrow::before, .tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow::before {
                margin-left: -3px;
                content: "";
                border-width: 0 5px 5px;
                border-bottom-color: #e9e9e9
            }

    .tooltip.bs-tooltip-left, .tooltip.bs-tooltip-auto[x-placement^=left] {
        padding: 0 5px
    }

        .tooltip.bs-tooltip-left .arrow, .tooltip.bs-tooltip-auto[x-placement^=left] .arrow {
            right: 0
        }

            .tooltip.bs-tooltip-left .arrow::before, .tooltip.bs-tooltip-auto[x-placement^=left] .arrow::before {
                right: 0;
                margin-top: -3px;
                content: "";
                border-width: 5px 0 5px 5px;
                border-left-color: #e9e9e9
            }

    .tooltip .arrow::before {
        position: absolute;
        border-color: transparent;
        border-style: solid
    }

.tooltip-inner {
    max-width: 200px;
    padding: .5rem 1rem;
    color: #222324;
    text-align: left;
    background-color: #e9e9e9;
    border-radius: .25rem;
    box-shadow: 0 32px 64px -12px rgba(0,0,0,.18)
}

.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: block;
    max-width: 276px;
    padding: 1px;
    font-family: -apple-system,BlinkMacSystemFont,segoe ui,Roboto,helvetica neue,Arial,sans-serif;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    white-space: normal;
    line-break: auto;
    font-size: .875rem;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: .3rem
}

    .popover .arrow {
        position: absolute;
        display: block;
        width: 10px;
        height: 5px
    }

        .popover .arrow::before, .popover .arrow::after {
            position: absolute;
            display: block;
            border-color: transparent;
            border-style: solid
        }

        .popover .arrow::before {
            content: "";
            border-width: 11px
        }

        .popover .arrow::after {
            content: "";
            border-width: 11px
        }

    .popover.bs-popover-top, .popover.bs-popover-auto[x-placement^=top] {
        margin-bottom: 10px
    }

        .popover.bs-popover-top .arrow, .popover.bs-popover-auto[x-placement^=top] .arrow {
            bottom: 0
        }

            .popover.bs-popover-top .arrow::before, .popover.bs-popover-auto[x-placement^=top] .arrow::before, .popover.bs-popover-top .arrow::after, .popover.bs-popover-auto[x-placement^=top] .arrow::after {
                border-bottom-width: 0
            }

            .popover.bs-popover-top .arrow::before, .popover.bs-popover-auto[x-placement^=top] .arrow::before {
                bottom: -11px;
                margin-left: -6px;
                border-top-color: rgba(0,0,0,.25)
            }

            .popover.bs-popover-top .arrow::after, .popover.bs-popover-auto[x-placement^=top] .arrow::after {
                bottom: -10px;
                margin-left: -6px;
                border-top-color: #fff
            }

    .popover.bs-popover-right, .popover.bs-popover-auto[x-placement^=right] {
        margin-left: 10px
    }

        .popover.bs-popover-right .arrow, .popover.bs-popover-auto[x-placement^=right] .arrow {
            left: 0
        }

            .popover.bs-popover-right .arrow::before, .popover.bs-popover-auto[x-placement^=right] .arrow::before, .popover.bs-popover-right .arrow::after, .popover.bs-popover-auto[x-placement^=right] .arrow::after {
                margin-top: -8px;
                border-left-width: 0
            }

            .popover.bs-popover-right .arrow::before, .popover.bs-popover-auto[x-placement^=right] .arrow::before {
                left: -11px;
                border-right-color: rgba(0,0,0,.25)
            }

            .popover.bs-popover-right .arrow::after, .popover.bs-popover-auto[x-placement^=right] .arrow::after {
                left: -10px;
                border-right-color: #fff
            }

    .popover.bs-popover-bottom, .popover.bs-popover-auto[x-placement^=bottom] {
        margin-top: 10px
    }

        .popover.bs-popover-bottom .arrow, .popover.bs-popover-auto[x-placement^=bottom] .arrow {
            top: 0
        }

            .popover.bs-popover-bottom .arrow::before, .popover.bs-popover-auto[x-placement^=bottom] .arrow::before, .popover.bs-popover-bottom .arrow::after, .popover.bs-popover-auto[x-placement^=bottom] .arrow::after {
                margin-left: -7px;
                border-top-width: 0
            }

            .popover.bs-popover-bottom .arrow::before, .popover.bs-popover-auto[x-placement^=bottom] .arrow::before {
                top: -11px;
                border-bottom-color: rgba(0,0,0,.25)
            }

            .popover.bs-popover-bottom .arrow::after, .popover.bs-popover-auto[x-placement^=bottom] .arrow::after {
                top: -10px;
                border-bottom-color: #fff
            }

        .popover.bs-popover-bottom .popover-header::before, .popover.bs-popover-auto[x-placement^=bottom] .popover-header::before {
            position: absolute;
            top: 0;
            left: 50%;
            display: block;
            width: 20px;
            margin-left: -10px;
            content: "";
            border-bottom: 1px solid #f7f7f7
        }

    .popover.bs-popover-left, .popover.bs-popover-auto[x-placement^=left] {
        margin-right: 10px
    }

        .popover.bs-popover-left .arrow, .popover.bs-popover-auto[x-placement^=left] .arrow {
            right: 0
        }

            .popover.bs-popover-left .arrow::before, .popover.bs-popover-auto[x-placement^=left] .arrow::before, .popover.bs-popover-left .arrow::after, .popover.bs-popover-auto[x-placement^=left] .arrow::after {
                margin-top: -8px;
                border-right-width: 0
            }

            .popover.bs-popover-left .arrow::before, .popover.bs-popover-auto[x-placement^=left] .arrow::before {
                right: -11px;
                border-left-color: rgba(0,0,0,.25)
            }

            .popover.bs-popover-left .arrow::after, .popover.bs-popover-auto[x-placement^=left] .arrow::after {
                right: -10px;
                border-left-color: #fff
            }

.popover-header {
    padding: 8px 14px;
    margin-bottom: 0;
    font-size: 1rem;
    color: inherit;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    border-top-left-radius: calc(.3rem - 1px);
    border-top-right-radius: calc(.3rem - 1px)
}

    .popover-header:empty {
        display: none
    }

.popover-body {
    padding: 9px 14px;
    color: #212529
}

.carousel {
    position: relative
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden
}

.carousel-item {
    position: relative;
    display: none;
    align-items: center;
    width: 100%;
    transition: transform .6s ease;
    backface-visibility: hidden;
    perspective: 1000px
}

    .carousel-item.active, .carousel-item-next, .carousel-item-prev {
        display: block
    }

.carousel-item-next, .carousel-item-prev {
    position: absolute;
    top: 0
}

    .carousel-item-next.carousel-item-left, .carousel-item-prev.carousel-item-right {
        transform: translateX(0)
    }

@supports(transform-style:preserve-3d) {
    .carousel-item-next.carousel-item-left, .carousel-item-prev.carousel-item-right {
        transform: translate3d(0,0,0)
    }
}

.carousel-item-next, .active.carousel-item-right {
    transform: translateX(100%)
}

@supports(transform-style:preserve-3d) {
    .carousel-item-next, .active.carousel-item-right {
        transform: translate3d(100%,0,0)
    }
}

.carousel-item-prev, .active.carousel-item-left {
    transform: translateX(-100%)
}

@supports(transform-style:preserve-3d) {
    .carousel-item-prev, .active.carousel-item-left {
        transform: translate3d(-100%,0,0)
    }
}

.carousel-control-prev, .carousel-control-next {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15%;
    color: #fff;
    text-align: center;
    opacity: .5
}

    .carousel-control-prev:focus, .carousel-control-prev:hover, .carousel-control-next:focus, .carousel-control-next:hover {
        color: #fff;
        text-decoration: none;
        outline: 0;
        opacity: .9
    }

.carousel-control-prev {
    left: 0
}

.carousel-control-next {
    right: 0
}

.carousel-control-prev-icon, .carousel-control-next-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: transparent no-repeat center center;
    background-size: 100% 100%
}

.carousel-control-prev-icon {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGZpbGw9JyNmZmYnIHZpZXdCb3g9JzAgMCA4IDgnPjxwYXRoIGQ9J000IDBsLTQgNCA0IDQgMS41LTEuNS0yLjUtMi41IDIuNS0yLjUtMS41LTEuNXonLz48L3N2Zz4=)
}

.carousel-control-next-icon {
    background-image: url(data:image/svg+xml;charset=utf8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIGZpbGw9JyNmZmYnIHZpZXdCb3g9JzAgMCA4IDgnPjxwYXRoIGQ9J00xLjUgMGwtMS41IDEuNSAyLjUgMi41LTIuNSAyLjUgMS41IDEuNSA0LTQtNC00eicvPjwvc3ZnPg==)
}

.carousel-indicators {
    position: absolute;
    right: 0;
    bottom: 10px;
    left: 0;
    z-index: 15;
    display: flex;
    justify-content: center;
    padding-left: 0;
    margin-right: 15%;
    margin-left: 15%;
    list-style: none
}

    .carousel-indicators li {
        position: relative;
        flex: 0 1 auto;
        width: 30px;
        height: 3px;
        margin-right: 3px;
        margin-left: 3px;
        text-indent: -999px;
        background-color: rgba(255,255,255,.5)
    }

        .carousel-indicators li::before {
            position: absolute;
            top: -10px;
            left: 0;
            display: inline-block;
            width: 100%;
            height: 10px;
            content: ""
        }

        .carousel-indicators li::after {
            position: absolute;
            bottom: -10px;
            left: 0;
            display: inline-block;
            width: 100%;
            height: 10px;
            content: ""
        }

    .carousel-indicators .active {
        background-color: #fff
    }

.carousel-caption {
    position: absolute;
    right: 15%;
    bottom: 20px;
    left: 15%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: center
}

.align-baseline {
    vertical-align: baseline !important
}

.align-top {
    vertical-align: top !important
}

.align-middle {
    vertical-align: middle !important
}

.align-bottom {
    vertical-align: bottom !important
}

.align-text-bottom {
    vertical-align: text-bottom !important
}

.align-text-top {
    vertical-align: text-top !important
}

.bg-primary {
    background-color: #007bff !important
}

a.bg-primary:focus, a.bg-primary:hover {
    background-color: #0062cc !important
}

.bg-secondary {
    background-color: #868e96 !important
}

a.bg-secondary:focus, a.bg-secondary:hover {
    background-color: #6c757d !important
}

.bg-success {
    background-color: #00bf71 !important
}

a.bg-success:focus, a.bg-success:hover {
    background-color: #008c53 !important
}

.bg-info {
    background-color: #17a2b8 !important
}

a.bg-info:focus, a.bg-info:hover {
    background-color: #117a8b !important
}

.bg-warning {
    background-color: #ffc107 !important
}

a.bg-warning:focus, a.bg-warning:hover {
    background-color: #d39e00 !important
}

.bg-danger {
    background-color: #dc3545 !important
}

a.bg-danger:focus, a.bg-danger:hover {
    background-color: #bd2130 !important
}

.bg-light {
    background-color: #f8f9fa !important
}

a.bg-light:focus, a.bg-light:hover {
    background-color: #dae0e5 !important
}

.bg-dark {
    background-color: #343a40 !important
}

a.bg-dark:focus, a.bg-dark:hover {
    background-color: #1d2124 !important
}

.bg-white {
    background-color: #fff !important
}

.bg-transparent {
    background-color: transparent !important
}

.border {
    border: 1px solid #e9ecef !important
}

.border-0 {
    border: 0 !important
}

.border-top-0 {
    border-top: 0 !important
}

.border-right-0 {
    border-right: 0 !important
}

.border-bottom-0 {
    border-bottom: 0 !important
}

.border-left-0 {
    border-left: 0 !important
}

.border-primary {
    border-color: #007bff !important
}

.border-secondary {
    border-color: #868e96 !important
}

.border-success {
    border-color: #00bf71 !important
}

.border-info {
    border-color: #17a2b8 !important
}

.border-warning {
    border-color: #ffc107 !important
}

.border-danger {
    border-color: #dc3545 !important
}

.border-light {
    border-color: #f8f9fa !important
}

.border-dark {
    border-color: #343a40 !important
}

.border-white {
    border-color: #fff !important
}

.rounded {
    border-radius: .25rem !important
}

.rounded-top {
    border-top-left-radius: .25rem !important;
    border-top-right-radius: .25rem !important
}

.rounded-right {
    border-top-right-radius: .25rem !important;
    border-bottom-right-radius: .25rem !important
}

.rounded-bottom {
    border-bottom-right-radius: .25rem !important;
    border-bottom-left-radius: .25rem !important
}

.rounded-left {
    border-top-left-radius: .25rem !important;
    border-bottom-left-radius: .25rem !important
}

.rounded-circle {
    border-radius: 50%
}

.rounded-0 {
    border-radius: 0
}

.clearfix::after {
    display: block;
    clear: both;
    content: ""
}

.d-none {
    display: none !important
}

.d-inline {
    display: inline !important
}

.d-inline-block {
    display: inline-block !important
}

.d-block {
    display: block !important
}

.d-table {
    display: table !important
}

.d-table-cell {
    display: table-cell !important
}

.d-flex {
    display: flex !important
}

.d-inline-flex {
    display: inline-flex !important
}

@media(min-width:576px) {
    .d-sm-none {
        display: none !important
    }

    .d-sm-inline {
        display: inline !important
    }

    .d-sm-inline-block {
        display: inline-block !important
    }

    .d-sm-block {
        display: block !important
    }

    .d-sm-table {
        display: table !important
    }

    .d-sm-table-cell {
        display: table-cell !important
    }

    .d-sm-flex {
        display: flex !important
    }

    .d-sm-inline-flex {
        display: inline-flex !important
    }
}

@media(min-width:768px) {
    .d-md-none {
        display: none !important
    }

    .d-md-inline {
        display: inline !important
    }

    .d-md-inline-block {
        display: inline-block !important
    }

    .d-md-block {
        display: block !important
    }

    .d-md-table {
        display: table !important
    }

    .d-md-table-cell {
        display: table-cell !important
    }

    .d-md-flex {
        display: flex !important
    }

    .d-md-inline-flex {
        display: inline-flex !important
    }
}

@media(min-width:992px) {
    .d-lg-none {
        display: none !important
    }

    .d-lg-inline {
        display: inline !important
    }

    .d-lg-inline-block {
        display: inline-block !important
    }

    .d-lg-block {
        display: block !important
    }

    .d-lg-table {
        display: table !important
    }

    .d-lg-table-cell {
        display: table-cell !important
    }

    .d-lg-flex {
        display: flex !important
    }

    .d-lg-inline-flex {
        display: inline-flex !important
    }
}

@media(min-width:1200px) {
    .d-xl-none {
        display: none !important
    }

    .d-xl-inline {
        display: inline !important
    }

    .d-xl-inline-block {
        display: inline-block !important
    }

    .d-xl-block {
        display: block !important
    }

    .d-xl-table {
        display: table !important
    }

    .d-xl-table-cell {
        display: table-cell !important
    }

    .d-xl-flex {
        display: flex !important
    }

    .d-xl-inline-flex {
        display: inline-flex !important
    }
}

.d-print-block {
    display: none !important
}

@media print {
    .d-print-block {
        display: block !important
    }
}

.d-print-inline {
    display: none !important
}

@media print {
    .d-print-inline {
        display: inline !important
    }
}

.d-print-inline-block {
    display: none !important
}

@media print {
    .d-print-inline-block {
        display: inline-block !important
    }
}

@media print {
    .d-print-none {
        display: none !important
    }
}

.embed-responsive {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden
}

    .embed-responsive::before {
        display: block;
        content: ""
    }

    .embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object, .embed-responsive video {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 0
    }

.embed-responsive-21by9::before {
    padding-top: 42.8571428571%
}

.embed-responsive-16by9::before {
    padding-top: 56.25%
}

.embed-responsive-4by3::before {
    padding-top: 75%
}

.embed-responsive-1by1::before {
    padding-top: 100%
}

.flex-row {
    flex-direction: row !important
}

.flex-column {
    flex-direction: column !important
}

.flex-row-reverse {
    flex-direction: row-reverse !important
}

.flex-column-reverse {
    flex-direction: column-reverse !important
}

.flex-wrap {
    flex-wrap: wrap !important
}

.flex-nowrap {
    flex-wrap: nowrap !important
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse !important
}

.justify-content-start {
    justify-content: flex-start !important
}

.justify-content-end {
    justify-content: flex-end !important
}

.justify-content-center {
    justify-content: center !important
}

.justify-content-between {
    justify-content: space-between !important
}

.justify-content-around {
    justify-content: space-around !important
}

.align-items-start {
    align-items: flex-start !important
}

.align-items-end {
    align-items: flex-end !important
}

.align-items-center {
    align-items: center !important
}

.align-items-baseline {
    align-items: baseline !important
}

.align-items-stretch {
    align-items: stretch !important
}

.align-content-start {
    align-content: flex-start !important
}

.align-content-end {
    align-content: flex-end !important
}

.align-content-center {
    align-content: center !important
}

.align-content-between {
    align-content: space-between !important
}

.align-content-around {
    align-content: space-around !important
}

.align-content-stretch {
    align-content: stretch !important
}

.align-self-auto {
    align-self: auto !important
}

.align-self-start {
    align-self: flex-start !important
}

.align-self-end {
    align-self: flex-end !important
}

.align-self-center {
    align-self: center !important
}

.align-self-baseline {
    align-self: baseline !important
}

.align-self-stretch {
    align-self: stretch !important
}

@media(min-width:576px) {
    .flex-sm-row {
        flex-direction: row !important
    }

    .flex-sm-column {
        flex-direction: column !important
    }

    .flex-sm-row-reverse {
        flex-direction: row-reverse !important
    }

    .flex-sm-column-reverse {
        flex-direction: column-reverse !important
    }

    .flex-sm-wrap {
        flex-wrap: wrap !important
    }

    .flex-sm-nowrap {
        flex-wrap: nowrap !important
    }

    .flex-sm-wrap-reverse {
        flex-wrap: wrap-reverse !important
    }

    .justify-content-sm-start {
        justify-content: flex-start !important
    }

    .justify-content-sm-end {
        justify-content: flex-end !important
    }

    .justify-content-sm-center {
        justify-content: center !important
    }

    .justify-content-sm-between {
        justify-content: space-between !important
    }

    .justify-content-sm-around {
        justify-content: space-around !important
    }

    .align-items-sm-start {
        align-items: flex-start !important
    }

    .align-items-sm-end {
        align-items: flex-end !important
    }

    .align-items-sm-center {
        align-items: center !important
    }

    .align-items-sm-baseline {
        align-items: baseline !important
    }

    .align-items-sm-stretch {
        align-items: stretch !important
    }

    .align-content-sm-start {
        align-content: flex-start !important
    }

    .align-content-sm-end {
        align-content: flex-end !important
    }

    .align-content-sm-center {
        align-content: center !important
    }

    .align-content-sm-between {
        align-content: space-between !important
    }

    .align-content-sm-around {
        align-content: space-around !important
    }

    .align-content-sm-stretch {
        align-content: stretch !important
    }

    .align-self-sm-auto {
        align-self: auto !important
    }

    .align-self-sm-start {
        align-self: flex-start !important
    }

    .align-self-sm-end {
        align-self: flex-end !important
    }

    .align-self-sm-center {
        align-self: center !important
    }

    .align-self-sm-baseline {
        align-self: baseline !important
    }

    .align-self-sm-stretch {
        align-self: stretch !important
    }
}

@media(min-width:768px) {
    .flex-md-row {
        flex-direction: row !important
    }

    .flex-md-column {
        flex-direction: column !important
    }

    .flex-md-row-reverse {
        flex-direction: row-reverse !important
    }

    .flex-md-column-reverse {
        flex-direction: column-reverse !important
    }

    .flex-md-wrap {
        flex-wrap: wrap !important
    }

    .flex-md-nowrap {
        flex-wrap: nowrap !important
    }

    .flex-md-wrap-reverse {
        flex-wrap: wrap-reverse !important
    }

    .justify-content-md-start {
        justify-content: flex-start !important
    }

    .justify-content-md-end {
        justify-content: flex-end !important
    }

    .justify-content-md-center {
        justify-content: center !important
    }

    .justify-content-md-between {
        justify-content: space-between !important
    }

    .justify-content-md-around {
        justify-content: space-around !important
    }

    .align-items-md-start {
        align-items: flex-start !important
    }

    .align-items-md-end {
        align-items: flex-end !important
    }

    .align-items-md-center {
        align-items: center !important
    }

    .align-items-md-baseline {
        align-items: baseline !important
    }

    .align-items-md-stretch {
        align-items: stretch !important
    }

    .align-content-md-start {
        align-content: flex-start !important
    }

    .align-content-md-end {
        align-content: flex-end !important
    }

    .align-content-md-center {
        align-content: center !important
    }

    .align-content-md-between {
        align-content: space-between !important
    }

    .align-content-md-around {
        align-content: space-around !important
    }

    .align-content-md-stretch {
        align-content: stretch !important
    }

    .align-self-md-auto {
        align-self: auto !important
    }

    .align-self-md-start {
        align-self: flex-start !important
    }

    .align-self-md-end {
        align-self: flex-end !important
    }

    .align-self-md-center {
        align-self: center !important
    }

    .align-self-md-baseline {
        align-self: baseline !important
    }

    .align-self-md-stretch {
        align-self: stretch !important
    }
}

@media(min-width:992px) {
    .flex-lg-row {
        flex-direction: row !important
    }

    .flex-lg-column {
        flex-direction: column !important
    }

    .flex-lg-row-reverse {
        flex-direction: row-reverse !important
    }

    .flex-lg-column-reverse {
        flex-direction: column-reverse !important
    }

    .flex-lg-wrap {
        flex-wrap: wrap !important
    }

    .flex-lg-nowrap {
        flex-wrap: nowrap !important
    }

    .flex-lg-wrap-reverse {
        flex-wrap: wrap-reverse !important
    }

    .justify-content-lg-start {
        justify-content: flex-start !important
    }

    .justify-content-lg-end {
        justify-content: flex-end !important
    }

    .justify-content-lg-center {
        justify-content: center !important
    }

    .justify-content-lg-between {
        justify-content: space-between !important
    }

    .justify-content-lg-around {
        justify-content: space-around !important
    }

    .align-items-lg-start {
        align-items: flex-start !important
    }

    .align-items-lg-end {
        align-items: flex-end !important
    }

    .align-items-lg-center {
        align-items: center !important
    }

    .align-items-lg-baseline {
        align-items: baseline !important
    }

    .align-items-lg-stretch {
        align-items: stretch !important
    }

    .align-content-lg-start {
        align-content: flex-start !important
    }

    .align-content-lg-end {
        align-content: flex-end !important
    }

    .align-content-lg-center {
        align-content: center !important
    }

    .align-content-lg-between {
        align-content: space-between !important
    }

    .align-content-lg-around {
        align-content: space-around !important
    }

    .align-content-lg-stretch {
        align-content: stretch !important
    }

    .align-self-lg-auto {
        align-self: auto !important
    }

    .align-self-lg-start {
        align-self: flex-start !important
    }

    .align-self-lg-end {
        align-self: flex-end !important
    }

    .align-self-lg-center {
        align-self: center !important
    }

    .align-self-lg-baseline {
        align-self: baseline !important
    }

    .align-self-lg-stretch {
        align-self: stretch !important
    }
}

@media(min-width:1200px) {
    .flex-xl-row {
        flex-direction: row !important
    }

    .flex-xl-column {
        flex-direction: column !important
    }

    .flex-xl-row-reverse {
        flex-direction: row-reverse !important
    }

    .flex-xl-column-reverse {
        flex-direction: column-reverse !important
    }

    .flex-xl-wrap {
        flex-wrap: wrap !important
    }

    .flex-xl-nowrap {
        flex-wrap: nowrap !important
    }

    .flex-xl-wrap-reverse {
        flex-wrap: wrap-reverse !important
    }

    .justify-content-xl-start {
        justify-content: flex-start !important
    }

    .justify-content-xl-end {
        justify-content: flex-end !important
    }

    .justify-content-xl-center {
        justify-content: center !important
    }

    .justify-content-xl-between {
        justify-content: space-between !important
    }

    .justify-content-xl-around {
        justify-content: space-around !important
    }

    .align-items-xl-start {
        align-items: flex-start !important
    }

    .align-items-xl-end {
        align-items: flex-end !important
    }

    .align-items-xl-center {
        align-items: center !important
    }

    .align-items-xl-baseline {
        align-items: baseline !important
    }

    .align-items-xl-stretch {
        align-items: stretch !important
    }

    .align-content-xl-start {
        align-content: flex-start !important
    }

    .align-content-xl-end {
        align-content: flex-end !important
    }

    .align-content-xl-center {
        align-content: center !important
    }

    .align-content-xl-between {
        align-content: space-between !important
    }

    .align-content-xl-around {
        align-content: space-around !important
    }

    .align-content-xl-stretch {
        align-content: stretch !important
    }

    .align-self-xl-auto {
        align-self: auto !important
    }

    .align-self-xl-start {
        align-self: flex-start !important
    }

    .align-self-xl-end {
        align-self: flex-end !important
    }

    .align-self-xl-center {
        align-self: center !important
    }

    .align-self-xl-baseline {
        align-self: baseline !important
    }

    .align-self-xl-stretch {
        align-self: stretch !important
    }
}

.float-left {
    float: left !important
}

.float-right {
    float: right !important
}

.float-none {
    float: none !important
}

@media(min-width:576px) {
    .float-sm-left {
        float: left !important
    }

    .float-sm-right {
        float: right !important
    }

    .float-sm-none {
        float: none !important
    }
}

@media(min-width:768px) {
    .float-md-left {
        float: left !important
    }

    .float-md-right {
        float: right !important
    }

    .float-md-none {
        float: none !important
    }
}

@media(min-width:992px) {
    .float-lg-left {
        float: left !important
    }

    .float-lg-right {
        float: right !important
    }

    .float-lg-none {
        float: none !important
    }
}

@media(min-width:1200px) {
    .float-xl-left {
        float: left !important
    }

    .float-xl-right {
        float: right !important
    }

    .float-xl-none {
        float: none !important
    }
}

.fixed-top {
    position: sticky;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030
}

.fixed-bottom {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030
}

@supports(position:sticky) {
    .sticky-top {
        position: sticky;
        top: 0;
        z-index: 1020
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    clip-path: inset(50%);
    border: 0
}

.sr-only-focusable:active, .sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
    white-space: normal;
    clip-path: none
}

.w-25 {
    width: 25% !important
}

.w-50 {
    width: 50% !important
}

.w-75 {
    width: 75% !important
}

.w-100 {
    width: 100% !important
}

.h-25 {
    height: 25% !important
}

.h-50 {
    height: 50% !important
}

.h-75 {
    height: 75% !important
}

.h-100 {
    height: 100% !important
}

.mw-100 {
    max-width: 100% !important
}

.mh-100 {
    max-height: 100% !important
}

.m-0 {
    margin: 0 !important
}

.mt-0 {
    margin-top: 0 !important
}

.mr-0 {
    margin-right: 0 !important
}

.mb-0 {
    margin-bottom: 0 !important
}

.ml-0 {
    margin-left: 0 !important
}

.mx-0 {
    margin-right: 0 !important;
    margin-left: 0 !important
}

.my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important
}

.m-1 {
    margin: .25rem !important
}

.mt-1 {
    margin-top: .25rem !important
}

.mr-1 {
    margin-right: .25rem !important
}

.mb-1 {
    margin-bottom: .25rem !important
}

.ml-1 {
    margin-left: .25rem !important
}

.mx-1 {
    margin-right: .25rem !important;
    margin-left: .25rem !important
}

.my-1 {
    margin-top: .25rem !important;
    margin-bottom: .25rem !important
}

.m-2 {
    margin: .5rem !important
}

.mt-2 {
    margin-top: .5rem !important
}

.mr-2 {
    margin-right: .5rem !important
}

.mb-2 {
    margin-bottom: .5rem !important
}

.ml-2 {
    margin-left: .5rem !important
}

.mx-2 {
    margin-right: .5rem !important;
    margin-left: .5rem !important
}

.my-2 {
    margin-top: .5rem !important;
    margin-bottom: .5rem !important
}

.m-3 {
    margin: 1rem !important
}

.mt-3 {
    margin-top: 1rem !important
}

.mr-3 {
    margin-right: 1rem !important
}

.mb-3 {
    margin-bottom: 1rem !important
}

.ml-3 {
    margin-left: 1rem !important
}

.mx-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important
}

.my-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important
}

.m-4 {
    margin: 1.5rem !important
}

.mt-4 {
    margin-top: 1.5rem !important
}

.mr-4 {
    margin-right: 1.5rem !important
}

.mb-4 {
    margin-bottom: 1.5rem !important
}

.ml-4 {
    margin-left: 1.5rem !important
}

.mx-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important
}

.my-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important
}

.m-5 {
    margin: 3rem !important
}

.mt-5 {
    margin-top: 3rem !important
}

.mr-5 {
    margin-right: 3rem !important
}

.mb-5 {
    margin-bottom: 3rem !important
}

.ml-5 {
    margin-left: 3rem !important
}

.mx-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important
}

.my-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important
}

.p-0 {
    padding: 0 !important
}

.pt-0 {
    padding-top: 0 !important
}

.pr-0 {
    padding-right: 0 !important
}

.pb-0 {
    padding-bottom: 0 !important
}

.pl-0 {
    padding-left: 0 !important
}

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

.py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.p-1 {
    padding: .25rem !important
}

.pt-1 {
    padding-top: .25rem !important
}

.pr-1 {
    padding-right: .25rem !important
}

.pb-1 {
    padding-bottom: .25rem !important
}

.pl-1 {
    padding-left: .25rem !important
}

.px-1 {
    padding-right: .25rem !important;
    padding-left: .25rem !important
}

.py-1 {
    padding-top: .25rem !important;
    padding-bottom: .25rem !important
}

.p-2 {
    padding: .5rem !important
}

.pt-2 {
    padding-top: .5rem !important
}

.pr-2 {
    padding-right: .5rem !important
}

.pb-2 {
    padding-bottom: .5rem !important
}

.pl-2 {
    padding-left: .5rem !important
}

.px-2 {
    padding-right: .5rem !important;
    padding-left: .5rem !important
}

.py-2 {
    padding-top: .5rem !important;
    padding-bottom: .5rem !important
}

.p-3 {
    padding: 1rem !important
}

.pt-3 {
    padding-top: 1rem !important
}

.pr-3 {
    padding-right: 1rem !important
}

.pb-3 {
    padding-bottom: 1rem !important
}

.pl-3 {
    padding-left: 1rem !important
}

.px-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important
}

.py-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important
}

.p-4 {
    padding: 1.5rem !important
}

.pt-4 {
    padding-top: 1.5rem !important
}

.pr-4 {
    padding-right: 1.5rem !important
}

.pb-4 {
    padding-bottom: 1.5rem !important
}

.pl-4 {
    padding-left: 1.5rem !important
}

.px-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important
}

.py-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important
}

.p-5 {
    padding: 3rem !important
}

.pt-5 {
    padding-top: 3rem !important
}

.pr-5 {
    padding-right: 3rem !important
}

.pb-5 {
    padding-bottom: 3rem !important
}

.pl-5 {
    padding-left: 3rem !important
}

.px-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important
}

.py-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important
}

.m-auto {
    margin: auto !important
}

.mt-auto {
    margin-top: auto !important
}

.mr-auto {
    margin-right: auto !important
}

.mb-auto {
    margin-bottom: auto !important
}

.ml-auto {
    margin-left: auto !important
}

.mx-auto {
    margin-right: auto !important;
    margin-left: auto !important
}

.my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important
}

@media(min-width:576px) {
    .m-sm-0 {
        margin: 0 !important
    }

    .mt-sm-0 {
        margin-top: 0 !important
    }

    .mr-sm-0 {
        margin-right: 0 !important
    }

    .mb-sm-0 {
        margin-bottom: 0 !important
    }

    .ml-sm-0 {
        margin-left: 0 !important
    }

    .mx-sm-0 {
        margin-right: 0 !important;
        margin-left: 0 !important
    }

    .my-sm-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .m-sm-1 {
        margin: .25rem !important
    }

    .mt-sm-1 {
        margin-top: .25rem !important
    }

    .mr-sm-1 {
        margin-right: .25rem !important
    }

    .mb-sm-1 {
        margin-bottom: .25rem !important
    }

    .ml-sm-1 {
        margin-left: .25rem !important
    }

    .mx-sm-1 {
        margin-right: .25rem !important;
        margin-left: .25rem !important
    }

    .my-sm-1 {
        margin-top: .25rem !important;
        margin-bottom: .25rem !important
    }

    .m-sm-2 {
        margin: .5rem !important
    }

    .mt-sm-2 {
        margin-top: .5rem !important
    }

    .mr-sm-2 {
        margin-right: .5rem !important
    }

    .mb-sm-2 {
        margin-bottom: .5rem !important
    }

    .ml-sm-2 {
        margin-left: .5rem !important
    }

    .mx-sm-2 {
        margin-right: .5rem !important;
        margin-left: .5rem !important
    }

    .my-sm-2 {
        margin-top: .5rem !important;
        margin-bottom: .5rem !important
    }

    .m-sm-3 {
        margin: 1rem !important
    }

    .mt-sm-3 {
        margin-top: 1rem !important
    }

    .mr-sm-3 {
        margin-right: 1rem !important
    }

    .mb-sm-3 {
        margin-bottom: 1rem !important
    }

    .ml-sm-3 {
        margin-left: 1rem !important
    }

    .mx-sm-3 {
        margin-right: 1rem !important;
        margin-left: 1rem !important
    }

    .my-sm-3 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important
    }

    .m-sm-4 {
        margin: 1.5rem !important
    }

    .mt-sm-4 {
        margin-top: 1.5rem !important
    }

    .mr-sm-4 {
        margin-right: 1.5rem !important
    }

    .mb-sm-4 {
        margin-bottom: 1.5rem !important
    }

    .ml-sm-4 {
        margin-left: 1.5rem !important
    }

    .mx-sm-4 {
        margin-right: 1.5rem !important;
        margin-left: 1.5rem !important
    }

    .my-sm-4 {
        margin-top: 1.5rem !important;
        margin-bottom: 1.5rem !important
    }

    .m-sm-5 {
        margin: 3rem !important
    }

    .mt-sm-5 {
        margin-top: 3rem !important
    }

    .mr-sm-5 {
        margin-right: 3rem !important
    }

    .mb-sm-5 {
        margin-bottom: 3rem !important
    }

    .ml-sm-5 {
        margin-left: 3rem !important
    }

    .mx-sm-5 {
        margin-right: 3rem !important;
        margin-left: 3rem !important
    }

    .my-sm-5 {
        margin-top: 3rem !important;
        margin-bottom: 3rem !important
    }

    .p-sm-0 {
        padding: 0 !important
    }

    .pt-sm-0 {
        padding-top: 0 !important
    }

    .pr-sm-0 {
        padding-right: 0 !important
    }

    .pb-sm-0 {
        padding-bottom: 0 !important
    }

    .pl-sm-0 {
        padding-left: 0 !important
    }

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

    .py-sm-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .p-sm-1 {
        padding: .25rem !important
    }

    .pt-sm-1 {
        padding-top: .25rem !important
    }

    .pr-sm-1 {
        padding-right: .25rem !important
    }

    .pb-sm-1 {
        padding-bottom: .25rem !important
    }

    .pl-sm-1 {
        padding-left: .25rem !important
    }

    .px-sm-1 {
        padding-right: .25rem !important;
        padding-left: .25rem !important
    }

    .py-sm-1 {
        padding-top: .25rem !important;
        padding-bottom: .25rem !important
    }

    .p-sm-2 {
        padding: .5rem !important
    }

    .pt-sm-2 {
        padding-top: .5rem !important
    }

    .pr-sm-2 {
        padding-right: .5rem !important
    }

    .pb-sm-2 {
        padding-bottom: .5rem !important
    }

    .pl-sm-2 {
        padding-left: .5rem !important
    }

    .px-sm-2 {
        padding-right: .5rem !important;
        padding-left: .5rem !important
    }

    .py-sm-2 {
        padding-top: .5rem !important;
        padding-bottom: .5rem !important
    }

    .p-sm-3 {
        padding: 1rem !important
    }

    .pt-sm-3 {
        padding-top: 1rem !important
    }

    .pr-sm-3 {
        padding-right: 1rem !important
    }

    .pb-sm-3 {
        padding-bottom: 1rem !important
    }

    .pl-sm-3 {
        padding-left: 1rem !important
    }

    .px-sm-3 {
        padding-right: 1rem !important;
        padding-left: 1rem !important
    }

    .py-sm-3 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important
    }

    .p-sm-4 {
        padding: 1.5rem !important
    }

    .pt-sm-4 {
        padding-top: 1.5rem !important
    }

    .pr-sm-4 {
        padding-right: 1.5rem !important
    }

    .pb-sm-4 {
        padding-bottom: 1.5rem !important
    }

    .pl-sm-4 {
        padding-left: 1.5rem !important
    }

    .px-sm-4 {
        padding-right: 1.5rem !important;
        padding-left: 1.5rem !important
    }

    .py-sm-4 {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important
    }

    .p-sm-5 {
        padding: 3rem !important
    }

    .pt-sm-5 {
        padding-top: 3rem !important
    }

    .pr-sm-5 {
        padding-right: 3rem !important
    }

    .pb-sm-5 {
        padding-bottom: 3rem !important
    }

    .pl-sm-5 {
        padding-left: 3rem !important
    }

    .px-sm-5 {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    .py-sm-5 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important
    }

    .m-sm-auto {
        margin: auto !important
    }

    .mt-sm-auto {
        margin-top: auto !important
    }

    .mr-sm-auto {
        margin-right: auto !important
    }

    .mb-sm-auto {
        margin-bottom: auto !important
    }

    .ml-sm-auto {
        margin-left: auto !important
    }

    .mx-sm-auto {
        margin-right: auto !important;
        margin-left: auto !important
    }

    .my-sm-auto {
        margin-top: auto !important;
        margin-bottom: auto !important
    }
}

@media(min-width:768px) {
    .m-md-0 {
        margin: 0 !important
    }

    .mt-md-0 {
        margin-top: 0 !important
    }

    .mr-md-0 {
        margin-right: 0 !important
    }

    .mb-md-0 {
        margin-bottom: 0 !important
    }

    .ml-md-0 {
        margin-left: 0 !important
    }

    .mx-md-0 {
        margin-right: 0 !important;
        margin-left: 0 !important
    }

    .my-md-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .m-md-1 {
        margin: .25rem !important
    }

    .mt-md-1 {
        margin-top: .25rem !important
    }

    .mr-md-1 {
        margin-right: .25rem !important
    }

    .mb-md-1 {
        margin-bottom: .25rem !important
    }

    .ml-md-1 {
        margin-left: .25rem !important
    }

    .mx-md-1 {
        margin-right: .25rem !important;
        margin-left: .25rem !important
    }

    .my-md-1 {
        margin-top: .25rem !important;
        margin-bottom: .25rem !important
    }

    .m-md-2 {
        margin: .5rem !important
    }

    .mt-md-2 {
        margin-top: .5rem !important
    }

    .mr-md-2 {
        margin-right: .5rem !important
    }

    .mb-md-2 {
        margin-bottom: .5rem !important
    }

    .ml-md-2 {
        margin-left: .5rem !important
    }

    .mx-md-2 {
        margin-right: .5rem !important;
        margin-left: .5rem !important
    }

    .my-md-2 {
        margin-top: .5rem !important;
        margin-bottom: .5rem !important
    }

    .m-md-3 {
        margin: 1rem !important
    }

    .mt-md-3 {
        margin-top: 1rem !important
    }

    .mr-md-3 {
        margin-right: 1rem !important
    }

    .mb-md-3 {
        margin-bottom: 1rem !important
    }

    .ml-md-3 {
        margin-left: 1rem !important
    }

    .mx-md-3 {
        margin-right: 1rem !important;
        margin-left: 1rem !important
    }

    .my-md-3 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important
    }

    .m-md-4 {
        margin: 1.5rem !important
    }

    .mt-md-4 {
        margin-top: 1.5rem !important
    }

    .mr-md-4 {
        margin-right: 1.5rem !important
    }

    .mb-md-4 {
        margin-bottom: 1.5rem !important
    }

    .ml-md-4 {
        margin-left: 1.5rem !important
    }

    .mx-md-4 {
        margin-right: 1.5rem !important;
        margin-left: 1.5rem !important
    }

    .my-md-4 {
        margin-top: 1.5rem !important;
        margin-bottom: 1.5rem !important
    }

    .m-md-5 {
        margin: 3rem !important
    }

    .mt-md-5 {
        margin-top: 3rem !important
    }

    .mr-md-5 {
        margin-right: 3rem !important
    }

    .mb-md-5 {
        margin-bottom: 3rem !important
    }

    .ml-md-5 {
        margin-left: 3rem !important
    }

    .mx-md-5 {
        margin-right: 3rem !important;
        margin-left: 3rem !important
    }

    .my-md-5 {
        margin-top: 3rem !important;
        margin-bottom: 3rem !important
    }

    .p-md-0 {
        padding: 0 !important
    }

    .pt-md-0 {
        padding-top: 0 !important
    }

    .pr-md-0 {
        padding-right: 0 !important
    }

    .pb-md-0 {
        padding-bottom: 0 !important
    }

    .pl-md-0 {
        padding-left: 0 !important
    }

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

    .py-md-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .p-md-1 {
        padding: .25rem !important
    }

    .pt-md-1 {
        padding-top: .25rem !important
    }

    .pr-md-1 {
        padding-right: .25rem !important
    }

    .pb-md-1 {
        padding-bottom: .25rem !important
    }

    .pl-md-1 {
        padding-left: .25rem !important
    }

    .px-md-1 {
        padding-right: .25rem !important;
        padding-left: .25rem !important
    }

    .py-md-1 {
        padding-top: .25rem !important;
        padding-bottom: .25rem !important
    }

    .p-md-2 {
        padding: .5rem !important
    }

    .pt-md-2 {
        padding-top: .5rem !important
    }

    .pr-md-2 {
        padding-right: .5rem !important
    }

    .pb-md-2 {
        padding-bottom: .5rem !important
    }

    .pl-md-2 {
        padding-left: .5rem !important
    }

    .px-md-2 {
        padding-right: .5rem !important;
        padding-left: .5rem !important
    }

    .py-md-2 {
        padding-top: .5rem !important;
        padding-bottom: .5rem !important
    }

    .p-md-3 {
        padding: 1rem !important
    }

    .pt-md-3 {
        padding-top: 1rem !important
    }

    .pr-md-3 {
        padding-right: 1rem !important
    }

    .pb-md-3 {
        padding-bottom: 1rem !important
    }

    .pl-md-3 {
        padding-left: 1rem !important
    }

    .px-md-3 {
        padding-right: 1rem !important;
        padding-left: 1rem !important
    }

    .py-md-3 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important
    }

    .p-md-4 {
        padding: 1.5rem !important
    }

    .pt-md-4 {
        padding-top: 1.5rem !important
    }

    .pr-md-4 {
        padding-right: 1.5rem !important
    }

    .pb-md-4 {
        padding-bottom: 1.5rem !important
    }

    .pl-md-4 {
        padding-left: 1.5rem !important
    }

    .px-md-4 {
        padding-right: 1.5rem !important;
        padding-left: 1.5rem !important
    }

    .py-md-4 {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important
    }

    .p-md-5 {
        padding: 3rem !important
    }

    .pt-md-5 {
        padding-top: 3rem !important
    }

    .pr-md-5 {
        padding-right: 3rem !important
    }

    .pb-md-5 {
        padding-bottom: 3rem !important
    }

    .pl-md-5 {
        padding-left: 3rem !important
    }

    .px-md-5 {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    .py-md-5 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important
    }

    .m-md-auto {
        margin: auto !important
    }

    .mt-md-auto {
        margin-top: auto !important
    }

    .mr-md-auto {
        margin-right: auto !important
    }

    .mb-md-auto {
        margin-bottom: auto !important
    }

    .ml-md-auto {
        margin-left: auto !important
    }

    .mx-md-auto {
        margin-right: auto !important;
        margin-left: auto !important
    }

    .my-md-auto {
        margin-top: auto !important;
        margin-bottom: auto !important
    }
}

@media(min-width:992px) {
    .m-lg-0 {
        margin: 0 !important
    }

    .mt-lg-0 {
        margin-top: 0 !important
    }

    .mr-lg-0 {
        margin-right: 0 !important
    }

    .mb-lg-0 {
        margin-bottom: 0 !important
    }

    .ml-lg-0 {
        margin-left: 0 !important
    }

    .mx-lg-0 {
        margin-right: 0 !important;
        margin-left: 0 !important
    }

    .my-lg-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .m-lg-1 {
        margin: .25rem !important
    }

    .mt-lg-1 {
        margin-top: .25rem !important
    }

    .mr-lg-1 {
        margin-right: .25rem !important
    }

    .mb-lg-1 {
        margin-bottom: .25rem !important
    }

    .ml-lg-1 {
        margin-left: .25rem !important
    }

    .mx-lg-1 {
        margin-right: .25rem !important;
        margin-left: .25rem !important
    }

    .my-lg-1 {
        margin-top: .25rem !important;
        margin-bottom: .25rem !important
    }

    .m-lg-2 {
        margin: .5rem !important
    }

    .mt-lg-2 {
        margin-top: .5rem !important
    }

    .mr-lg-2 {
        margin-right: .5rem !important
    }

    .mb-lg-2 {
        margin-bottom: .5rem !important
    }

    .ml-lg-2 {
        margin-left: .5rem !important
    }

    .mx-lg-2 {
        margin-right: .5rem !important;
        margin-left: .5rem !important
    }

    .my-lg-2 {
        margin-top: .5rem !important;
        margin-bottom: .5rem !important
    }

    .m-lg-3 {
        margin: 1rem !important
    }

    .mt-lg-3 {
        margin-top: 1rem !important
    }

    .mr-lg-3 {
        margin-right: 1rem !important
    }

    .mb-lg-3 {
        margin-bottom: 1rem !important
    }

    .ml-lg-3 {
        margin-left: 1rem !important
    }

    .mx-lg-3 {
        margin-right: 1rem !important;
        margin-left: 1rem !important
    }

    .my-lg-3 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important
    }

    .m-lg-4 {
        margin: 1.5rem !important
    }

    .mt-lg-4 {
        margin-top: 1.5rem !important
    }

    .mr-lg-4 {
        margin-right: 1.5rem !important
    }

    .mb-lg-4 {
        margin-bottom: 1.5rem !important
    }

    .ml-lg-4 {
        margin-left: 1.5rem !important
    }

    .mx-lg-4 {
        margin-right: 1.5rem !important;
        margin-left: 1.5rem !important
    }

    .my-lg-4 {
        margin-top: 1.5rem !important;
        margin-bottom: 1.5rem !important
    }

    .m-lg-5 {
        margin: 3rem !important
    }

    .mt-lg-5 {
        margin-top: 3rem !important
    }

    .mr-lg-5 {
        margin-right: 3rem !important
    }

    .mb-lg-5 {
        margin-bottom: 3rem !important
    }

    .ml-lg-5 {
        margin-left: 3rem !important
    }

    .mx-lg-5 {
        margin-right: 3rem !important;
        margin-left: 3rem !important
    }

    .my-lg-5 {
        margin-top: 3rem !important;
        margin-bottom: 3rem !important
    }

    .p-lg-0 {
        padding: 0 !important
    }

    .pt-lg-0 {
        padding-top: 0 !important
    }

    .pr-lg-0 {
        padding-right: 0 !important
    }

    .pb-lg-0 {
        padding-bottom: 0 !important
    }

    .pl-lg-0 {
        padding-left: 0 !important
    }

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

    .py-lg-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .p-lg-1 {
        padding: .25rem !important
    }

    .pt-lg-1 {
        padding-top: .25rem !important
    }

    .pr-lg-1 {
        padding-right: .25rem !important
    }

    .pb-lg-1 {
        padding-bottom: .25rem !important
    }

    .pl-lg-1 {
        padding-left: .25rem !important
    }

    .px-lg-1 {
        padding-right: .25rem !important;
        padding-left: .25rem !important
    }

    .py-lg-1 {
        padding-top: .25rem !important;
        padding-bottom: .25rem !important
    }

    .p-lg-2 {
        padding: .5rem !important
    }

    .pt-lg-2 {
        padding-top: .5rem !important
    }

    .pr-lg-2 {
        padding-right: .5rem !important
    }

    .pb-lg-2 {
        padding-bottom: .5rem !important
    }

    .pl-lg-2 {
        padding-left: .5rem !important
    }

    .px-lg-2 {
        padding-right: .5rem !important;
        padding-left: .5rem !important
    }

    .py-lg-2 {
        padding-top: .5rem !important;
        padding-bottom: .5rem !important
    }

    .p-lg-3 {
        padding: 1rem !important
    }

    .pt-lg-3 {
        padding-top: 1rem !important
    }

    .pr-lg-3 {
        padding-right: 1rem !important
    }

    .pb-lg-3 {
        padding-bottom: 1rem !important
    }

    .pl-lg-3 {
        padding-left: 1rem !important
    }

    .px-lg-3 {
        padding-right: 1rem !important;
        padding-left: 1rem !important
    }

    .py-lg-3 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important
    }

    .p-lg-4 {
        padding: 1.5rem !important
    }

    .pt-lg-4 {
        padding-top: 1.5rem !important
    }

    .pr-lg-4 {
        padding-right: 1.5rem !important
    }

    .pb-lg-4 {
        padding-bottom: 1.5rem !important
    }

    .pl-lg-4 {
        padding-left: 1.5rem !important
    }

    .px-lg-4 {
        padding-right: 1.5rem !important;
        padding-left: 1.5rem !important
    }

    .py-lg-4 {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important
    }

    .p-lg-5 {
        padding: 3rem !important
    }

    .pt-lg-5 {
        padding-top: 3rem !important
    }

    .pr-lg-5 {
        padding-right: 3rem !important
    }

    .pb-lg-5 {
        padding-bottom: 3rem !important
    }

    .pl-lg-5 {
        padding-left: 3rem !important
    }

    .px-lg-5 {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    .py-lg-5 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important
    }

    .m-lg-auto {
        margin: auto !important
    }

    .mt-lg-auto {
        margin-top: auto !important
    }

    .mr-lg-auto {
        margin-right: auto !important
    }

    .mb-lg-auto {
        margin-bottom: auto !important
    }

    .ml-lg-auto {
        margin-left: auto !important
    }

    .mx-lg-auto {
        margin-right: auto !important;
        margin-left: auto !important
    }

    .my-lg-auto {
        margin-top: auto !important;
        margin-bottom: auto !important
    }
}

@media(min-width:1200px) {
    .m-xl-0 {
        margin: 0 !important
    }

    .mt-xl-0 {
        margin-top: 0 !important
    }

    .mr-xl-0 {
        margin-right: 0 !important
    }

    .mb-xl-0 {
        margin-bottom: 0 !important
    }

    .ml-xl-0 {
        margin-left: 0 !important
    }

    .mx-xl-0 {
        margin-right: 0 !important;
        margin-left: 0 !important
    }

    .my-xl-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important
    }

    .m-xl-1 {
        margin: .25rem !important
    }

    .mt-xl-1 {
        margin-top: .25rem !important
    }

    .mr-xl-1 {
        margin-right: .25rem !important
    }

    .mb-xl-1 {
        margin-bottom: .25rem !important
    }

    .ml-xl-1 {
        margin-left: .25rem !important
    }

    .mx-xl-1 {
        margin-right: .25rem !important;
        margin-left: .25rem !important
    }

    .my-xl-1 {
        margin-top: .25rem !important;
        margin-bottom: .25rem !important
    }

    .m-xl-2 {
        margin: .5rem !important
    }

    .mt-xl-2 {
        margin-top: .5rem !important
    }

    .mr-xl-2 {
        margin-right: .5rem !important
    }

    .mb-xl-2 {
        margin-bottom: .5rem !important
    }

    .ml-xl-2 {
        margin-left: .5rem !important
    }

    .mx-xl-2 {
        margin-right: .5rem !important;
        margin-left: .5rem !important
    }

    .my-xl-2 {
        margin-top: .5rem !important;
        margin-bottom: .5rem !important
    }

    .m-xl-3 {
        margin: 1rem !important
    }

    .mt-xl-3 {
        margin-top: 1rem !important
    }

    .mr-xl-3 {
        margin-right: 1rem !important
    }

    .mb-xl-3 {
        margin-bottom: 1rem !important
    }

    .ml-xl-3 {
        margin-left: 1rem !important
    }

    .mx-xl-3 {
        margin-right: 1rem !important;
        margin-left: 1rem !important
    }

    .my-xl-3 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important
    }

    .m-xl-4 {
        margin: 1.5rem !important
    }

    .mt-xl-4 {
        margin-top: 1.5rem !important
    }

    .mr-xl-4 {
        margin-right: 1.5rem !important
    }

    .mb-xl-4 {
        margin-bottom: 1.5rem !important
    }

    .ml-xl-4 {
        margin-left: 1.5rem !important
    }

    .mx-xl-4 {
        margin-right: 1.5rem !important;
        margin-left: 1.5rem !important
    }

    .my-xl-4 {
        margin-top: 1.5rem !important;
        margin-bottom: 1.5rem !important
    }

    .m-xl-5 {
        margin: 3rem !important
    }

    .mt-xl-5 {
        margin-top: 3rem !important
    }

    .mr-xl-5 {
        margin-right: 3rem !important
    }

    .mb-xl-5 {
        margin-bottom: 3rem !important
    }

    .ml-xl-5 {
        margin-left: 3rem !important
    }

    .mx-xl-5 {
        margin-right: 3rem !important;
        margin-left: 3rem !important
    }

    .my-xl-5 {
        margin-top: 3rem !important;
        margin-bottom: 3rem !important
    }

    .p-xl-0 {
        padding: 0 !important
    }

    .pt-xl-0 {
        padding-top: 0 !important
    }

    .pr-xl-0 {
        padding-right: 0 !important
    }

    .pb-xl-0 {
        padding-bottom: 0 !important
    }

    .pl-xl-0 {
        padding-left: 0 !important
    }

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

    .py-xl-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .p-xl-1 {
        padding: .25rem !important
    }

    .pt-xl-1 {
        padding-top: .25rem !important
    }

    .pr-xl-1 {
        padding-right: .25rem !important
    }

    .pb-xl-1 {
        padding-bottom: .25rem !important
    }

    .pl-xl-1 {
        padding-left: .25rem !important
    }

    .px-xl-1 {
        padding-right: .25rem !important;
        padding-left: .25rem !important
    }

    .py-xl-1 {
        padding-top: .25rem !important;
        padding-bottom: .25rem !important
    }

    .p-xl-2 {
        padding: .5rem !important
    }

    .pt-xl-2 {
        padding-top: .5rem !important
    }

    .pr-xl-2 {
        padding-right: .5rem !important
    }

    .pb-xl-2 {
        padding-bottom: .5rem !important
    }

    .pl-xl-2 {
        padding-left: .5rem !important
    }

    .px-xl-2 {
        padding-right: .5rem !important;
        padding-left: .5rem !important
    }

    .py-xl-2 {
        padding-top: .5rem !important;
        padding-bottom: .5rem !important
    }

    .p-xl-3 {
        padding: 1rem !important
    }

    .pt-xl-3 {
        padding-top: 1rem !important
    }

    .pr-xl-3 {
        padding-right: 1rem !important
    }

    .pb-xl-3 {
        padding-bottom: 1rem !important
    }

    .pl-xl-3 {
        padding-left: 1rem !important
    }

    .px-xl-3 {
        padding-right: 1rem !important;
        padding-left: 1rem !important
    }

    .py-xl-3 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important
    }

    .p-xl-4 {
        padding: 1.5rem !important
    }

    .pt-xl-4 {
        padding-top: 1.5rem !important
    }

    .pr-xl-4 {
        padding-right: 1.5rem !important
    }

    .pb-xl-4 {
        padding-bottom: 1.5rem !important
    }

    .pl-xl-4 {
        padding-left: 1.5rem !important
    }

    .px-xl-4 {
        padding-right: 1.5rem !important;
        padding-left: 1.5rem !important
    }

    .py-xl-4 {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important
    }

    .p-xl-5 {
        padding: 3rem !important
    }

    .pt-xl-5 {
        padding-top: 3rem !important
    }

    .pr-xl-5 {
        padding-right: 3rem !important
    }

    .pb-xl-5 {
        padding-bottom: 3rem !important
    }

    .pl-xl-5 {
        padding-left: 3rem !important
    }

    .px-xl-5 {
        padding-right: 3rem !important;
        padding-left: 3rem !important
    }

    .py-xl-5 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important
    }

    .m-xl-auto {
        margin: auto !important
    }

    .mt-xl-auto {
        margin-top: auto !important
    }

    .mr-xl-auto {
        margin-right: auto !important
    }

    .mb-xl-auto {
        margin-bottom: auto !important
    }

    .ml-xl-auto {
        margin-left: auto !important
    }

    .mx-xl-auto {
        margin-right: auto !important;
        margin-left: auto !important
    }

    .my-xl-auto {
        margin-top: auto !important;
        margin-bottom: auto !important
    }
}

.text-justify {
    text-align: justify !important
}

.text-nowrap {
    white-space: nowrap !important
}

.text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

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

.text-right {
    text-align: right !important
}

.text-center {
    text-align: center !important
}

@media(min-width:576px) {
    .text-sm-left {
        text-align: left !important
    }

    .text-sm-right {
        text-align: right !important
    }

    .text-sm-center {
        text-align: center !important
    }
}

@media(min-width:768px) {
    .text-md-left {
        text-align: left !important
    }

    .text-md-right {
        text-align: right !important
    }

    .text-md-center {
        text-align: center !important
    }
}

@media(min-width:992px) {
    .text-lg-left {
        text-align: left !important
    }

    .text-lg-right {
        text-align: right !important
    }

    .text-lg-center {
        text-align: center !important
    }
}

@media(min-width:1200px) {
    .text-xl-left {
        text-align: left !important
    }

    .text-xl-right {
        text-align: right !important
    }

    .text-xl-center {
        text-align: center !important
    }
}

.text-lowercase {
    text-transform: lowercase !important
}

.text-uppercase {
    text-transform: uppercase !important
}

.text-capitalize {
    text-transform: capitalize !important
}

.font-weight-normal {
    font-weight: 400
}

.font-weight-bold {
    font-weight: 700
}

.font-italic {
    font-style: italic
}

.text-white {
    color: #fff !important
}

.text-primary {
    color: #007bff !important
}

a.text-primary:focus, a.text-primary:hover {
    color: #0062cc !important
}

.text-secondary {
    color: #868e96 !important
}

a.text-secondary:focus, a.text-secondary:hover {
    color: #6c757d !important
}

.text-success {
    color: #00bf71 !important
}

a.text-success:focus, a.text-success:hover {
    color: #008c53 !important
}

.text-info {
    color: #17a2b8 !important
}

a.text-info:focus, a.text-info:hover {
    color: #117a8b !important
}

.text-warning {
    color: #ffc107 !important
}

a.text-warning:focus, a.text-warning:hover {
    color: #d39e00 !important
}

.text-danger {
    color: #dc3545 !important
}

a.text-danger:focus, a.text-danger:hover {
    color: #bd2130 !important
}

.text-light {
    color: #f8f9fa !important
}

a.text-light:focus, a.text-light:hover {
    color: #dae0e5 !important
}

.text-dark {
    color: #343a40 !important
}

a.text-dark:focus, a.text-dark:hover {
    color: #1d2124 !important
}

.text-muted {
    color: #868e96 !important
}

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0
}

.visible {
    visibility: visible !important
}

.invisible {
    visibility: hidden !important
}

.animation-popup-hover {
    position: relative;
    display: inline-block;
    box-shadow: 0 0 0 rgba(0,0,0,.1);
    -webkit-transition: all .2s cubic-bezier(.165,.84,.44,1);
    transition: all .2s cubic-bezier(.165,.84,.44,1)
}

    .animation-popup-hover::after {
        content: "";
        border-radius: 5px;
        position: absolute;
        z-index: -1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        box-shadow: 0 15px 35px rgba(50,50,93,.1),0 5px 15px rgba(0,0,0,.07);
        opacity: 0;
        -webkit-transition: all .2s cubic-bezier(.165,.84,.44,1);
        transition: all .2s cubic-bezier(.165,.84,.44,1)
    }

    .animation-popup-hover:hover {
        -webkit-transform: scale(1.15,1.15);
        transform: scale(1.15,1.15);
        z-index: 10
    }

        .animation-popup-hover:hover::after {
            opacity: 1;
            z-index: 10
        }

.animation-popup-hover-no-shadow::after {
    box-shadow: 0 0 0 rgba(0,0,0,.1)
}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

    .animated.infinite {
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite
    }

@-webkit-keyframes bounceInLeft {
    from,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px,0,0);
        transform: translate3d(-3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px,0,0);
        transform: translate3d(25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(5px,0,0);
        transform: translate3d(5px,0,0)
    }

    to {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }
}

@keyframes bounceInLeft {
    from,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px,0,0);
        transform: translate3d(-3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px,0,0);
        transform: translate3d(25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(5px,0,0);
        transform: translate3d(5px,0,0)
    }

    to {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }
}

.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
}

@-webkit-keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

@keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

.bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp
}

@-webkit-keyframes bounceInUp {
    from,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    from {
        opacity: 0;
        -webkit-transform: translate3d(0,3000px,0);
        transform: translate3d(0,3000px,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }

    75% {
        -webkit-transform: translate3d(0,10px,0);
        transform: translate3d(0,10px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-5px,0);
        transform: translate3d(0,-5px,0)
    }

    to {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }
}

@keyframes bounceInUp {
    from,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    from {
        opacity: 0;
        -webkit-transform: translate3d(0,3000px,0);
        transform: translate3d(0,3000px,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }

    75% {
        -webkit-transform: translate3d(0,10px,0);
        transform: translate3d(0,10px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-5px,0);
        transform: translate3d(0,-5px,0)
    }

    to {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }
}

.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp
}

@-webkit-keyframes bounceInDown {
    from,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-3000px,0);
        transform: translate3d(0,-3000px,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0,25px,0);
        transform: translate3d(0,25px,0)
    }

    75% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    90% {
        -webkit-transform: translate3d(0,5px,0);
        transform: translate3d(0,5px,0)
    }

    to {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }
}

@keyframes bounceInDown {
    from,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-3000px,0);
        transform: translate3d(0,-3000px,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0,25px,0);
        transform: translate3d(0,25px,0)
    }

    75% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    90% {
        -webkit-transform: translate3d(0,5px,0);
        transform: translate3d(0,5px,0)
    }

    to {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0)
    }
}

.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
}

@-webkit-keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px,0,0);
        transform: translate3d(20px,0,0)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px,0,0);
        transform: translate3d(20px,0,0)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft
}

@media(max-width:767px) {
    #mainNav .menu-1 {
        text-align: left
    }
}

@media(max-width:767px) {
    #mainNav .menu-1 .nav-item .nav-link {
        border-bottom: 1px solid #eee;
        font-size: 18px;
        color: #767676
    }
}

@media(max-width:767px) {
    #mainNav .menu-2 {
        flex-direction: row;
        margin-top: 20px
    }
}

@media(max-width:767px) {
    #mainNav .menu-2 .nav-item .btn-menu-register {
        padding: 14px 10px !important
    }
}

@media(max-width:767px) {
    #top {
        margin-top: 1rem
    }
}

#top .container .row .affiliate-heading {
    display: flex;
    flex-direction: column;
    justify-content: center
}

@media(max-width:767px) {
    #top .container .row .affiliate-heading {
        margin: 2rem
    }
}

#top .container .row .affiliate-heading .aff-heading {
    font-size: 52px
}

@media(max-width:767px) {
    #top .container .row .affiliate-heading .aff-heading {
        font-size: 48px;
        text-align: left
    }
}

#top .container .row .affiliate-heading p {
    color: #767676;
    font-size: 24px
}

@media(max-width:767px) {
    #top .container .row .affiliate-heading p {
        font-size: 18px;
        line-height: 34px
    }
}

@media(min-width:768px) and (max-width:991px) {
    #top .container .row .affiliate-hero {
        display: flex;
        justify-content: end
    }
}

@media(min-width:768px) and (max-width:991px) {
    #top .container .row .affiliate-hero .aff-hero-img {
        width: 50%
    }
}

#column-partner {
    margin: 7rem 0
}

@media(max-width:767px) {
    #column-partner {
        margin: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .lg-small-column-partners {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .container {
        max-width: 790px
    }
}

#column-partner .tablet-column-partners {
    display: none
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .tablet-column-partners {
        display: block
    }
}

#column-partner .tablet-column-partners .carousel-item {
    margin: 0 5rem
}

@media(max-width:767px) {
    #column-partner .tablet-column-partners .carousel-indicators {
        bottom: -5rem
    }
}

#column-partner .tablet-column-partners .carousel-indicators li {
    border-radius: 50%;
    width: 10px;
    height: 10px;
    margin-right: 10px;
    background-color: #767676
}

#column-partner .tablet-column-partners .carousel-indicators .active {
    background-color: #fff !important
}

#column-partner .row {
    justify-content: center
}

#column-partner .box-partner {
    border-radius: 26px;
    margin-right: 4rem;
    box-shadow: 0 4px 10px 2px rgba(0,0,0,.17);
    background-color: #ffc502
}

@media(max-width:767px) {
    #column-partner .box-partner {
        margin: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .box-partner {
        margin-right: 0;
        width: 80%;
        height: 500px;
        padding: 0 3rem
    }
}

#column-partner .box-partner .content {
    padding: 10px
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .box-partner .content {
        padding: 0
    }
}

#column-partner .box-partner .content .content-links {
    padding-top: 3rem
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .box-partner .content .content-links {
        text-align: center
    }
}

#column-partner .box-partner .content h2 {
    font-size: 26px;
    color: #fff;
    font-weight: 700;
    padding: 2rem 0
}

#column-partner .box-partner .content p {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.63;
    padding: 10px 20px 0 0
}

#column-partner .box-partner .content a {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    border-bottom: 1px solid #fff;
    text-align: center;
    margin-bottom: 1rem;
    display: block
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .box-partner .content a {
        display: inline-block
    }
}

#column-partner .box-partner .content span {
    text-align: center;
    display: block;
    color: #fff
}

#column-partner .box-partner .center-button {
    margin-top: 2.2rem
}

@media(max-width:767px) {
    #column-partner .box-partner .center-button {
        margin-bottom: 5.2rem;
        margin-top: 5.2px
    }
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .box-partner .center-button {
        margin-top: 5.2rem
    }
}

#column-partner .box-partner .button-content {
    text-align: center
}

    #column-partner .box-partner .button-content a {
        padding: 15px 40px
    }

@media(min-width:768px) and (max-width:991px) {
    #column-partner .box-partner .button-content a {
        padding: 15px 50px
    }
}

#column-partner .box-partner .button-content .btn-filled {
    color: #ffc502
}

#column-partner .box-partner .contact-us-btn {
    margin-bottom: 3rem
}

@media(min-width:768px) and (max-width:991px) {
    #column-partner .box-partner .contact-us-btn {
        padding-top: 20px
    }
}

#affiliate-column {
    margin: 4rem 0
}

    #affiliate-column .middle-aff-column {
        margin: 6rem 0
    }

@media(max-width:767px) {
    #affiliate-column .middle-aff-column {
        flex-direction: column-reverse
    }
}

#affiliate-column .middle-aff-column .affiliate-section__img img {
    width: 80%
}

#affiliate-column h2 {
    font-size: 36px;
    font-weight: 700;
    padding: 2rem 0
}

@media(max-width:767px) {
    #affiliate-column h2 {
        font-size: 28px
    }
}

#affiliate-column .affiliate-top-img {
    display: none
}

@media(max-width:767px) {
    #affiliate-column .affiliate-top-img {
        display: block
    }
}

@media(max-width:767px) {
    #affiliate-column .affiliate-top-img img {
        width: 100%
    }
}

#affiliate-column .affiliate-section__text .text p {
    line-height: 1.7;
    text-align: left
}

    #affiliate-column .affiliate-section__text .text p .special-text {
        background-color: #ffc502;
        color: #fff;
        padding: 3px 15px;
        border-radius: 19.5px;
        font-weight: 700
    }

    #affiliate-column .affiliate-section__text .text p .text-green {
        color: #ffc502;
        font-weight: 700;
        padding: 0
    }

#affiliate-column .affiliate-section__text .text .aff-btn {
    color: #ffc502;
    font-size: 16px;
    letter-spacing: 1.07px;
    font-weight: 700;
    padding: 0 !important
}

#affiliate-column .affiliate-section__text .text span {
    padding: 0 1rem
}

#affiliate-column .affiliate-section__img {
    display: flex;
    justify-content: end;
    align-items: center
}

@media(max-width:767px) {
    #affiliate-column .affiliate-section__img {
        margin: 3rem 0
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #affiliate-column .affiliate-section__img img {
        width: 100%
    }
}

#affiliate-column .affiliate-section__img:nth-of-type(1) {
    justify-content: start
}

#bottom-banner {
    background-color: #f3f3f3
}

    #bottom-banner .banner-affiliate {
        display: flex;
        padding: 6rem;
        justify-content: center;
        flex-direction: column;
        align-items: center
    }

@media(max-width:767px) {
    #bottom-banner .banner-affiliate {
        padding: 3rem;
        align-items: flex-start
    }
}

@media(min-width:768px) and (max-width:991px) {
    #bottom-banner .banner-affiliate {
        padding: 4rem
    }
}

#bottom-banner .banner-affiliate h2 {
    font-size: 48px;
    font-weight: 700;
    padding-bottom: 2rem
}

#bottom-banner .banner-affiliate .malachite {
    background-color: #ffc502;
    padding: 15px 40px
}

    #bottom-banner .banner-affiliate .malachite:hover {
        background-color: #1da44c
    }

.common .extra-text p {
    margin: 3rem auto 0;
    width: 58%;
    font-size: 16px;
    text-align: center
}

    .common .extra-text p span {
        font-weight: 700
    }

.homepage h3, .homepage h4 {
    font-family: nunito sans,sans-serif
}

.homepage .special-paragraph {
    font-size: 14px;
    color: #ffc502;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 2rem
}

@media(max-width:767px) {
    .homepage .special-paragraph {
        text-align: left
    }
}

.homepage .btn-underline {
    border-bottom: 1px solid #767676;
    color: #767676;
    font-size: 20px !important;
    font-weight: 700;
    transition: all .2s
}

    .homepage .btn-underline:hover {
        border-bottom: 1px solid #000;
        color: #000;
        font-size: 20.2px !important
    }

.homepage #fixed-form {
    margin-top: -5.5rem;
    opacity: 0;
    visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    background-color: rgba(255,255,255,.822);
    height: 100vh;
    width: 100vw;
    z-index: 99999999999999999999999;
    transition: all .2s ease-in-out
}

    .homepage #fixed-form.visible {
        opacity: 1;
        visibility: visible
    }

    .homepage #fixed-form .form-box {
        width: 480px;
        padding: 60px 32px 48px;
        display: flex;
        flex-direction: column;
        gap: 48px;
        box-shadow: 0 5px 24px -2px #0000001f;
        background: #fff;
        border-radius: 24px;
        position: relative
    }

        .homepage #fixed-form .form-box .exit-button {
            position: absolute;
            top: 1rem;
            right: 1.5rem;
            font-size: 22px;
            font-weight: 100;
            transform: scaleX(1.2);
            color: #222324;
            cursor: pointer;
            transition: all .2s ease-in-out
        }

            .homepage #fixed-form .form-box .exit-button:hover {
                color: #1da44c
            }

.homepage #top {
    padding-bottom: 4rem
}

    .homepage #top .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        padding: 2rem 0 6rem
    }

@media(max-width:767px) {
    .homepage #top .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #top .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .homepage #top .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .homepage #top .container--custom {
        width: 1440px
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top .container--custom {
        padding: 0
    }
}

.homepage #top .container--custom .homepage__heading {
    padding-left: 7rem !important
}

@media(min-width:992px) and (max-width:1440px),(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top .container--custom .homepage__heading {
        padding-left: 0 !important
    }
}

.homepage #top .homepage__heading {
    padding: 0
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top .homepage__heading {
        display: flex;
        flex-direction: column;
        align-items: center
    }
}

@media(max-width:767px) {
    .homepage #top .homepage__heading {
        margin-top: 2rem
    }
}

.homepage #top .homepage__heading h1 {
    font-size: 46px !important;
    width: 100% !important;
    font-weight: 700
}

@media(max-width:767px) {
    .homepage #top .homepage__heading h1 {
        text-align: left !important
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top .homepage__heading h1 {
        text-align: center;
        padding: 0 6rem
    }
}

.homepage #top .homepage__heading h2 {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    font-family: nunito sans,sans-serif;
    width: 100%;
    line-height: 1.89
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top .homepage__heading h2 {
        padding: 0 6rem;
        text-align: center
    }
}

.homepage #top .terms-submission {
    margin: 20px 0;
    font-size: 13px;
    color: #767676
}

    .homepage #top .terms-submission a {
        color: #ffc502
    }

.homepage #top .check-wrapper {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-top: 6rem
}

@media(max-width:767px) {
    .homepage #top .check-wrapper {
        flex-direction: column;
        display: block
    }
}

.homepage #top .check-wrapper .checks {
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .homepage #top .check-wrapper .checks {
        margin-bottom: 1rem;
        justify-content: flex-start;
        margin-left: 5rem
    }
}

.homepage #top .check-wrapper .checks p {
    margin: 0 0 0 1rem;
    color: #ffc502
}

.homepage #top .buttons {
    margin-top: 2rem;
    display: flex;
    gap: 24px
}

@media(max-width:767px) {
    .homepage #top .buttons {
        flex-direction: column;
        align-items: center;
        justify-content: center
    }
}

.homepage #top .button-wrapper {
    display: flex;
    margin-top: 2rem;
    align-items: center
}

@media(max-width:767px) {
    .homepage #top .button-wrapper {
        flex-direction: column
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top .button-wrapper {
        justify-content: center
    }
}

@media(max-width:767px) {
    .homepage #top .button-wrapper .form-home-top {
        width: 100%;
        margin-bottom: 2rem;
        text-align: center
    }
}

@media(min-width:1024px) and (max-width:1199px) {
    .homepage #top .button-wrapper .form-home-top {
        padding: 15px 25px
    }
}

.homepage #top .button-wrapper .button-wrapper__google {
    margin-left: 1rem
}

    .homepage #top .button-wrapper .button-wrapper__google img {
        margin-left: .2rem
    }

@media(min-width:768px) and (max-width:991px) {
    .homepage #top .terms-submission {
        text-align: center
    }
}

.homepage #top #specialContent {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

@media(max-width:767px) {
    .homepage #top #specialContent {
        justify-content: center;
        padding: 0
    }
}

.homepage #top #specialContent video {
    width: 100%
}

.homepage #top #specialContent img {
    width: 95%;
    box-shadow: 0 2px 10px -5px #868692;
    border-radius: 10px
}

.homepage #top-test-homepage {
    padding-bottom: 4rem
}

    .homepage #top-test-homepage .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 5rem;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }

@media(max-width:767px) {
    .homepage #top-test-homepage .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-test-homepage .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #top-test-homepage .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .homepage #top-test-homepage .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .homepage #top-test-homepage .container--custom {
        width: 100%
    }
}

.homepage #top-test-homepage .container--custom .row {
    align-items: center
}

    .homepage #top-test-homepage .container--custom .row h1 {
        margin-top: 0 !important
    }

.homepage #top-test-homepage .container--custom .homepage__heading {
    padding-left: 10rem !important;
    padding-right: 5rem !important
}

@media(min-width:992px) and (max-width:1440px),(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-test-homepage .container--custom .homepage__heading {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

.homepage #top-test-homepage .homepage__heading {
    padding: 0
}

@media(max-width:767px) {
    .homepage #top-test-homepage .homepage__heading {
        margin-top: 2rem
    }
}

.homepage #top-test-homepage .homepage__heading h1 {
    font-size: 46px !important;
    width: 100% !important;
    font-weight: 700
}

@media(max-width:767px) {
    .homepage #top-test-homepage .homepage__heading h1 {
        text-align: left !important
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-test-homepage .homepage__heading h1 {
        text-align: center;
        padding: 0 6rem
    }
}

.homepage #top-test-homepage .homepage__heading h2 {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    font-family: nunito sans,sans-serif;
    width: 100%;
    line-height: 1.89
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-test-homepage .homepage__heading h2 {
        padding: 0 6rem;
        text-align: center
    }
}

.homepage #top-test-homepage .terms-submission {
    margin: 20px 0;
    font-size: 13px;
    color: #767676
}

    .homepage #top-test-homepage .terms-submission a {
        color: #ffc502
    }

.homepage #top-test-homepage .check-wrapper {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-top: 6rem
}

@media(max-width:767px) {
    .homepage #top-test-homepage .check-wrapper {
        margin-top: 0;
        flex-direction: column;
        display: block
    }
}

.homepage #top-test-homepage .check-wrapper .checks {
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .homepage #top-test-homepage .check-wrapper .checks {
        margin-bottom: 1rem;
        justify-content: flex-start;
        margin-left: 5rem
    }
}

.homepage #top-test-homepage .check-wrapper .checks p {
    margin: 0 0 0 1rem;
    color: #ffc502
}

.homepage #top-test-homepage .button-wrapper {
    display: flex;
    margin-top: 2rem;
    align-items: center
}

@media(max-width:767px) {
    .homepage #top-test-homepage .button-wrapper {
        flex-direction: column
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-test-homepage .button-wrapper {
        justify-content: center
    }
}

@media(max-width:767px) {
    .homepage #top-test-homepage .button-wrapper .form-home-top {
        width: 100%;
        margin-bottom: 2rem;
        text-align: center
    }
}

@media(min-width:1024px) and (max-width:1199px) {
    .homepage #top-test-homepage .button-wrapper .form-home-top {
        padding: 15px 25px
    }
}

.homepage #top-test-homepage .button-wrapper .button-wrapper__google {
    margin-left: 1rem
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-test-homepage .terms-submission {
        text-align: center
    }
}

.homepage #top-test-homepage #specialContent {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

@media(max-width:767px) {
    .homepage #top-test-homepage #specialContent {
        margin-top: 2rem;
        justify-content: center;
        padding: 0
    }
}

.homepage #top-test-homepage #specialContent video {
    width: 100%
}

.homepage #top-test-homepage #specialContent img {
    width: 95%;
    box-shadow: 0 2px 10px -5px #868692;
    border-radius: 10px
}

.homepage #top-old-test-homepage {
    padding-bottom: 4rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage {
        padding-bottom: 0;
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }
}

@media(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .homepage #top-old-test-homepage {
        padding-left: 5rem !important
    }
}

.homepage #top-old-test-homepage .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 10%;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1rem
}

@media(max-width:767px) {
    .homepage #top-old-test-homepage .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #top-old-test-homepage .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .homepage #top-old-test-homepage .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .homepage #top-old-test-homepage .container--custom {
        width: 100%
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom {
        padding: 0
    }
}

.homepage #top-old-test-homepage .container--custom .heading {
    margin-bottom: 3rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

    .homepage #top-old-test-homepage .container--custom .heading h1 {
        font-size: 55px;
        font-weight: 800;
        text-transform: uppercase;
        margin: 2.5rem 0
    }

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom .heading h1 {
        margin: 2.5rem 0 1rem
    }
}

.homepage #top-old-test-homepage .container--custom .content {
    width: 100%;
    display: flex
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom .content {
        flex-direction: column
    }
}

.homepage #top-old-test-homepage .container--custom .content-left {
    width: 40%;
    display: flex;
    flex-direction: column;
    padding-right: 3rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom .content-left {
        width: 100%;
        padding-right: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom .content-left--clasic {
        display: none
    }
}

@media(max-width:767px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .homepage #top-old-test-homepage .container--custom .content-left--tablet {
        display: none
    }
}

.homepage #top-old-test-homepage .container--custom .content-left h2 {
    font-size: 20px;
    margin-bottom: 1rem
}

.homepage #top-old-test-homepage .container--custom .content-left .green {
    font-size: 18px
}

.homepage #top-old-test-homepage .container--custom .content-left .button-wrapper {
    margin-top: 3rem;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

    .homepage #top-old-test-homepage .container--custom .content-left .button-wrapper span {
        margin-left: 1rem
    }

@media(max-width:767px) {
    .homepage #top-old-test-homepage .container--custom .content-left .button-wrapper {
        flex-direction: column
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom .content-left .button-wrapper {
        justify-content: center
    }
}

@media(max-width:767px) {
    .homepage #top-old-test-homepage .container--custom .content-left .button-wrapper__google {
        margin-top: 1.5rem
    }
}

.homepage #top-old-test-homepage .container--custom .content-left .paragraphgreen {
    margin-top: 2rem;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(min-width:1920px) {
    .homepage #top-old-test-homepage .container--custom .content-left .paragraphgreen {
        width: 70%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom .content-left .paragraphgreen {
        margin-bottom: 2.5rem
    }
}

.homepage #top-old-test-homepage .container--custom .content-left .paragraphgreen p {
    color: #00bf71;
    font-weight: 700
}

.homepage #top-old-test-homepage .container--custom .content-right {
    width: 60%;
    margin-top: -1rem
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom .content-right {
        width: 100%
    }
}

@media(max-width:767px) {
    .homepage #top-old-test-homepage .container--custom .content-right {
        display: none
    }
}

.homepage #top-old-test-homepage .container--custom .content-right img {
    width: 100%;
    margin-left: 1rem;
    border-radius: 15px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-old-test-homepage .container--custom .content-right img {
        margin-left: 0
    }
}

.homepage #top-old-test-homepage .container--custom .review {
    width: 100%;
    display: flex;
    flex-direction: row;
    margin-top: 4rem
}

.homepage #top-old-test-homepage .container--custom .review-img {
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center
}

    .homepage #top-old-test-homepage .container--custom .review-img img {
        width: 45%
    }

.homepage #top-old-test-homepage .container--custom .review-content {
    width: 40%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center
}

    .homepage #top-old-test-homepage .container--custom .review-content p {
        font-size: 22px;
        font-style: italic;
        margin: 0;
        text-align: left;
        width: 70%
    }

    .homepage #top-old-test-homepage .container--custom .review-content span {
        margin-left: 7rem;
        font-size: 18px;
        font-weight: 800
    }

    .homepage #top-old-test-homepage .container--custom .review-content img {
        width: 35%;
        margin-top: 1.5rem
    }

.homepage #social-proof {
    background-color: #ffc502;
    width: 100%;
    padding-bottom: 0 !important
}

@media(max-width:767px) {
    .homepage #social-proof {
        padding-bottom: 4rem !important
    }
}

.homepage #social-proof .row {
    border-bottom: none !important
}

@media(max-width:767px) {
    .homepage #social-proof .row .social-proof__heading {
        padding-right: 30px;
        padding-left: 30px
    }
}

.homepage #social-proof .row .social-proof__heading h3 {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    text-align: center
}

@media(max-width:767px) {
    .homepage #social-proof .row .social-proof__heading h3 {
        line-height: 34px
    }
}

.homepage #feature-section {
    margin-bottom: 2rem
}

    .homepage #feature-section .container .feature-section__top-heading {
        font-weight: 700;
        text-align: center;
        margin: 3rem 0;
        padding: 0 15rem;
        font-size: 36px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .homepage #feature-section .container .feature-section__top-heading {
        padding: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #feature-section .container .row:nth-of-type(2), .homepage #feature-section .container .row:nth-of-type(4) {
        flex-direction: row
    }
}

.homepage #feature-section .container .row .col-sm-12 {
    margin-bottom: 3rem
}

@media(max-width:767px) {
    .homepage #feature-section .container .row .col-sm-12 {
        margin-bottom: 3rem
    }
}

.homepage #feature-section .container .row .feature-section-heading h2 {
    padding-right: 2rem !important;
    text-align: left
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #feature-section .container .row .feature-section-heading h2 {
        font-size: 36px;
        padding-right: 0 !important
    }
}

@media(max-width:767px) {
    .homepage #feature-section .container .row .feature-section-heading h2 {
        font-size: 28px;
        padding-right: 5rem !important
    }
}

.homepage #feature-section .container .row .feature-section-heading .feature-section-content {
    min-height: 240px
}

@media(max-width:330px) {
    .homepage #feature-section .container .row .feature-section-heading .feature-section-content button {
        font-size: 13px !important
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #feature-section .container .row .feature-section-heading .special-paragraph {
        text-align: left
    }
}

.homepage #feature-section .container .row .feature-section-heading .heading-paragraph {
    font-size: 16px;
    font-weight: 600;
    padding: 1rem 0
}

.homepage #feature-section .container .row .feature-section-heading p {
    text-align: left
}

@media(max-width:767px) {
    .homepage #feature-section .container .row .feature-section-heading p {
        font-weight: 600;
        text-align: left;
        margin: 0 0 2rem
    }
}

.homepage #feature-section .container .row .feature-section-heading .features-button {
    display: flex;
    margin-top: 2rem;
    width: fit-content
}

@media(max-width:767px) {
    .homepage #feature-section .container .row .feature-section-heading .features-button {
        display: inline-block
    }
}

.homepage #feature-section .container .row img {
    width: 100%;
    padding: 2rem
}

@media(max-width:767px) {
    .homepage #feature-section .container .row img {
        padding: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #feature-section .container .row img {
        padding: 0
    }
}

.homepage #feature-section .container .row #image-accordion-2, .homepage #feature-section .container .row #image-accordion-4 {
    padding: 5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .homepage #feature-section .container .row #image-accordion-2, .homepage #feature-section .container .row #image-accordion-4 {
        padding: 0;
        width: 100%
    }
}

.homepage #feature-section .container .row .image-desktop-accordion {
    height: 650px;
    display: flex;
    align-items: center
}

@media(max-width:767px) {
    .homepage #feature-section .container .row .image-desktop-accordion {
        display: none
    }
}

.homepage #feature-section .container .row #accordion .card, .homepage #feature-section .container .row #accordionTwo .card, .homepage #feature-section .container .row #accordionThree .card, .homepage #feature-section .container .row #accordionFour .card {
    border: none
}

    .homepage #feature-section .container .row #accordion .card .card-header, .homepage #feature-section .container .row #accordionTwo .card .card-header, .homepage #feature-section .container .row #accordionThree .card .card-header, .homepage #feature-section .container .row #accordionFour .card .card-header {
        border-bottom: 0;
        padding: 0;
        background-color: #fff
    }

        .homepage #feature-section .container .row #accordion .card .card-header h3, .homepage #feature-section .container .row #accordionTwo .card .card-header h3, .homepage #feature-section .container .row #accordionThree .card .card-header h3, .homepage #feature-section .container .row #accordionFour .card .card-header h3 {
            padding: 0;
            text-align: left
        }

            .homepage #feature-section .container .row #accordion .card .card-header h3 button, .homepage #feature-section .container .row #accordionTwo .card .card-header h3 button, .homepage #feature-section .container .row #accordionThree .card .card-header h3 button, .homepage #feature-section .container .row #accordionFour .card .card-header h3 button {
                padding: 0;
                font-size: 18px;
                color: #767676;
                font-weight: 400;
                padding-bottom: 10px
            }

                .homepage #feature-section .container .row #accordion .card .card-header h3 button:hover, .homepage #feature-section .container .row #accordionTwo .card .card-header h3 button:hover, .homepage #feature-section .container .row #accordionThree .card .card-header h3 button:hover, .homepage #feature-section .container .row #accordionFour .card .card-header h3 button:hover {
                    text-decoration: none
                }

                .homepage #feature-section .container .row #accordion .card .card-header h3 button[aria-expanded=true], .homepage #feature-section .container .row #accordionTwo .card .card-header h3 button[aria-expanded=true], .homepage #feature-section .container .row #accordionThree .card .card-header h3 button[aria-expanded=true], .homepage #feature-section .container .row #accordionFour .card .card-header h3 button[aria-expanded=true] {
                    text-decoration: none;
                    border-bottom: 2px solid #ffc502;
                    color: #1b1b20;
                    font-weight: 700
                }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #feature-section .container .row #accordion .card .card-header h3 button[aria-expanded=true], .homepage #feature-section .container .row #accordionTwo .card .card-header h3 button[aria-expanded=true], .homepage #feature-section .container .row #accordionThree .card .card-header h3 button[aria-expanded=true], .homepage #feature-section .container .row #accordionFour .card .card-header h3 button[aria-expanded=true] {
        font-size: 15px
    }
}

.homepage #feature-section .container .row #accordion .card .card-header h3 button[aria-expanded=true] .fa-arrow-right, .homepage #feature-section .container .row #accordionTwo .card .card-header h3 button[aria-expanded=true] .fa-arrow-right, .homepage #feature-section .container .row #accordionThree .card .card-header h3 button[aria-expanded=true] .fa-arrow-right, .homepage #feature-section .container .row #accordionFour .card .card-header h3 button[aria-expanded=true] .fa-arrow-right {
    display: none
}

.homepage #feature-section .container .row #accordion .card .card-header h3 .collapsed, .homepage #feature-section .container .row #accordionTwo .card .card-header h3 .collapsed, .homepage #feature-section .container .row #accordionThree .card .card-header h3 .collapsed, .homepage #feature-section .container .row #accordionFour .card .card-header h3 .collapsed {
    border-bottom: none;
    text-decoration: none;
    color: #767676;
    font-weight: 400
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #feature-section .container .row #accordion .card .card-header h3 .collapsed, .homepage #feature-section .container .row #accordionTwo .card .card-header h3 .collapsed, .homepage #feature-section .container .row #accordionThree .card .card-header h3 .collapsed, .homepage #feature-section .container .row #accordionFour .card .card-header h3 .collapsed {
        font-size: 14px
    }
}

.homepage #feature-section .container .row #accordion .card .card-header .fa-arrow-right, .homepage #feature-section .container .row #accordionTwo .card .card-header .fa-arrow-right, .homepage #feature-section .container .row #accordionThree .card .card-header .fa-arrow-right, .homepage #feature-section .container .row #accordionFour .card .card-header .fa-arrow-right {
    display: none
}

@media(max-width:767px) {
    .homepage #feature-section .container .row #accordion .card .card-header .fa-arrow-right, .homepage #feature-section .container .row #accordionTwo .card .card-header .fa-arrow-right, .homepage #feature-section .container .row #accordionThree .card .card-header .fa-arrow-right, .homepage #feature-section .container .row #accordionFour .card .card-header .fa-arrow-right {
        display: inline-block;
        color: #767676;
        font-size: 18px
    }
}

.homepage #feature-section .container .row #accordion .card .card-body, .homepage #feature-section .container .row #accordionTwo .card .card-body, .homepage #feature-section .container .row #accordionThree .card .card-body, .homepage #feature-section .container .row #accordionFour .card .card-body {
    margin: 0 !important;
    padding: 1rem 0 0
}

    .homepage #feature-section .container .row #accordion .card .card-body .card-body-img-mobile, .homepage #feature-section .container .row #accordionTwo .card .card-body .card-body-img-mobile, .homepage #feature-section .container .row #accordionThree .card .card-body .card-body-img-mobile, .homepage #feature-section .container .row #accordionFour .card .card-body .card-body-img-mobile {
        display: none
    }

@media(max-width:767px) {
    .homepage #feature-section .container .row #accordion .card .card-body .card-body-img-mobile, .homepage #feature-section .container .row #accordionTwo .card .card-body .card-body-img-mobile, .homepage #feature-section .container .row #accordionThree .card .card-body .card-body-img-mobile, .homepage #feature-section .container .row #accordionFour .card .card-body .card-body-img-mobile {
        display: block;
        margin-bottom: 2rem
    }
}

.homepage #black_cta {
    background-color: #000;
    color: #fff;
    margin-bottom: 8rem;
    padding-top: 3rem;
    padding-bottom: 5rem
}

    .homepage #black_cta .black_cta--text {
        display: flex;
        justify-content: center;
        flex-direction: column
    }

@media(min-width:768px) and (max-width:991px) {
    .homepage #black_cta .black_cta--text {
        padding-left: 2rem
    }
}

@media(min-width:1920px) {
    .homepage #black_cta .black_cta--text {
        padding-left: 25rem
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .homepage #black_cta .black_cta--text {
        padding-left: 17rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #black_cta .black_cta--text {
        padding-left: 6rem
    }
}

.homepage #black_cta .black_cta--text h2 {
    font-size: 48px;
    padding-bottom: 2rem;
    font-weight: 700
}

@media(max-width:767px) {
    .homepage #black_cta .black_cta--text h2 {
        font-size: 36px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #black_cta .black_cta--text h2 {
        margin-right: -10rem
    }
}

.homepage #black_cta .black_cta--text p {
    font-size: 18px
}

@media(max-width:767px) {
    .homepage #black_cta .black_cta--text p {
        font-size: 16px;
        padding-right: 2rem
    }
}

.homepage #black_cta .black_cta--text a {
    width: fit-content
}

@media(max-width:767px) {
    .homepage #black_cta .black_cta--text a {
        width: unset;
        margin: 2rem 3rem;
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #black_cta .black_cta--text a {
        margin: 4rem 0
    }
}

.homepage #black_cta .black_cta--img {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

@media(max-width:767px) {
    .homepage #black_cta .black_cta--img {
        margin-top: 2rem
    }
}

.homepage #black_cta .black_cta--img img {
    margin-bottom: -17rem;
    width: 70%
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #black_cta .black_cta--img img {
        width: 90%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #black_cta .black_cta--img img {
        width: 130%;
        margin-bottom: -30rem
    }
}

@media(max-width:767px) {
    .homepage #black_cta .black_cta--img img {
        width: 100%;
        margin-bottom: -8rem
    }
}

@media(max-width:767px) {
    .homepage #integrations .container .row .col-lg-5 {
        text-align: left !important
    }
}

.homepage #integrations .container .row .col-lg-5 p {
    margin-top: 2rem;
    font-weight: 400
}

.homepage #integrations .container .row .col-lg-5 .special-paragraph {
    font-size: 14px;
    color: #ffc502;
    font-weight: 700;
    margin-top: 0;
    text-align: left;
    text-transform: uppercase;
    margin-bottom: 2rem
}

@media(max-width:767px) {
    .homepage #integrations .container .row .col-lg-5 .special-paragraph {
        text-align: left
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #integrations .container .row .col-lg-5 .special-paragraph {
        text-align: center
    }
}

.homepage #integrations .container .row .col-lg-5 a.plugin_buttons {
    font-size: 1rem;
    border-radius: 40px;
    padding: 15px 40px
}

@media(max-width:767px) {
    .homepage #integrations .container .row .col-lg-5 a.plugin_buttons {
        padding: 12px 40px;
        width: 90%
    }
}

@media(max-width:767px) {
    .homepage #integrations .container .row .col-lg-5 .btn-check-integrations {
        padding-bottom: 0
    }
}

.homepage #big_cta {
    padding-bottom: 0;
    padding-top: 0;
    position: relative;
    overflow: hidden;
    top: -3rem
}

@media(max-width:767px) {
    .homepage #big_cta {
        font-size: 13px;
        margin: 0 1rem
    }
}

@media(max-width:767px) {
    .homepage #big_cta img {
        display: none
    }
}

.homepage #big_cta .container {
    background-color: #f7b801;
    border-radius: 20px;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container {
        overflow-x: hidden
    }
}

.homepage #big_cta .container .row {
    justify-content: center;
    padding: 2rem 0;
    background-image: url(/img/landing-page/time-tracking-biz/group-9.png);
    background-repeat: no-repeat;
    background-position: right
}

@media(max-width:767px) {
    .homepage #big_cta .container .row {
        background-size: 75%;
        background-position: 200% 25%;
        margin-right: 0;
        margin-left: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container .row {
        background-image: url(/img/landing-page/banner-icon-ppc.png);
        padding-left: 1rem;
        background-size: 50%;
        background-position: 130%
    }
}

.homepage #big_cta .container .row .text-cta {
    display: flex;
    position: relative;
    text-align: center;
    z-index: 1;
    flex-direction: column;
    justify-content: center;
    padding-left: 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container .row .text-cta {
        padding-left: 1rem;
        padding-bottom: 2rem
    }
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta {
        overflow-x: hidden;
        padding-left: 1rem
    }
}

.homepage #big_cta .container .row .text-cta h2 {
    font-size: 48px;
    font-weight: 700
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta h2 {
        font-size: 36px;
        padding-top: 2rem;
        padding-right: 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container .row .text-cta h2 {
        padding-top: 2rem
    }
}

.homepage #big_cta .container .row .text-cta p {
    font-size: 18px;
    font-weight: 600;
    padding: 1rem 0
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta p {
        font-size: 16px;
        padding-right: 0;
        line-height: 36px
    }
}

.homepage #big_cta .container .row .text-cta .icon-ppc-top {
    display: none
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta .icon-ppc-top {
        display: block;
        position: absolute;
        right: -5rem;
        top: 8rem;
        width: 60%;
        z-index: -1
    }
}

.homepage #big_cta .container .row .text-cta .form .form-wrapper input[type=email] {
    border: none;
    width: 60%;
    outline: none;
    font-size: 14px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta .form .form-wrapper input[type=email] {
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container .row .text-cta .form .form-wrapper input[type=email] {
        width: 60%
    }
}

.homepage #big_cta .container .row .text-cta .form .form-wrapper button {
    padding: 12px 10px;
    color: #fff;
    width: 35%;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #ffc502;
    position: relative;
    background-color: #ffc502;
    left: -3rem;
    margin-top: 0
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta .form .form-wrapper button {
        left: unset;
        right: 0;
        width: 100%;
        padding: 10px 0;
        margin-top: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container .row .text-cta .form .form-wrapper button {
        padding: 14px 7px
    }
}

.homepage #big_cta .container .row .text-cta .form .form-wrapper .terms-submission {
    margin: 20px 0;
    font-size: 14px;
    color: #767676;
    opacity: .6;
    padding-left: 2rem
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta .form .form-wrapper .terms-submission {
        padding: 0 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container .row .text-cta .form .form-wrapper .terms-submission {
        padding-right: 0
    }
}

.homepage #big_cta .container .row .text-cta .form .form-wrapper .terms-submission a {
    margin: 0 2px;
    color: #1b1b20
}

.homepage #big_cta .container .row .text-cta .form .button-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta .form .button-wrapper {
        flex-direction: column;
        align-items: center
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container .row .text-cta .form .button-wrapper {
        margin-left: 5rem
    }
}

.homepage #big_cta .container .row .text-cta .form .button-wrapper .button-wrapper__google {
    display: flex;
    align-items: center;
    margin-top: 1rem
}

@media(max-width:767px) {
    .homepage #big_cta .container .row .text-cta .form .button-wrapper .button-wrapper__google {
        display: block;
        margin-left: 0;
        text-align: center;
        margin-top: 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #big_cta .container .row .text-cta .form .button-wrapper .button-wrapper__google {
        margin-left: 0
    }
}

.homepage #big_cta .container .row .text-cta .form .button-wrapper .button-wrapper__google span {
    font-size: 1rem;
    color: #767676
}

.homepage #big_cta .container .row .text-cta .form .button-wrapper .button-wrapper__google img {
    margin-left: .2rem;
    width: 32px
}

.homepage .testimontials-head {
    text-align: center;
    margin-bottom: 2rem
}

@media(max-width:767px) {
    .homepage .testimontials-head {
        text-align: left
    }
}

.homepage .testimontials-head .special-paragraph {
    text-align: center
}

.homepage .testimontials-head h2 {
    font-size: 36px;
    font-weight: 700;
    padding: 0 20%
}

@media(max-width:767px) {
    .homepage .testimontials-head h2 {
        padding: 0 20% 0 0;
        line-height: 1.35;
        font-size: 28px
    }
}

.homepage .customer-review {
    text-align: center;
    margin-bottom: 5rem
}

    .homepage .customer-review .owl-dots {
        display: flex;
        align-items: center;
        justify-content: space-around
    }

        .homepage .customer-review .owl-dots .owl-dot {
            border: none;
            background-color: transparent
        }

            .homepage .customer-review .owl-dots .owl-dot:focus {
                outline: none
            }

        .homepage .customer-review .owl-dots .active {
            font-weight: 700;
            border-bottom: 2px solid #ffc502
        }

.homepage .testimonials {
    margin-bottom: 6rem
}

@media(max-width:767px) {
    .homepage .testimonials {
        margin-bottom: 2rem
    }
}

.homepage .testimonials .owl-carousel .owl-item {
    margin-right: 2rem
}

    .homepage .testimonials .owl-carousel .owl-item:nth-last-of-type(1) {
        display: none
    }

    .homepage .testimonials .owl-carousel .owl-item .item {
        position: relative;
        padding: 2rem;
        margin-right: 2rem
    }

        .homepage .testimonials .owl-carousel .owl-item .item p {
            font-size: 1rem;
            line-height: 1.63
        }

        .homepage .testimonials .owl-carousel .owl-item .item span {
            font-weight: 700
        }

        .homepage .testimonials .owl-carousel .owl-item .item .review-img {
            display: none;
            position: relative;
            top: -60px;
            width: 55px
        }

@media(max-width:767px) {
    .homepage .testimonials .owl-carousel .owl-item {
        margin-right: 0
    }
}

.homepage .testimonials .owl-carousel .active.center {
    background-color: #f3f3f3;
    border-radius: 26px
}

    .homepage .testimonials .owl-carousel .active.center .item .review-img {
        display: block
    }

    .homepage .testimonials .owl-carousel .active.center p {
        font-weight: 400
    }

.homepage .testimonials .owl-carousel .owl-stage-outer {
    height: 450px;
    padding-top: 35px
}

@media(max-width:767px) {
    .homepage .testimonials .owl-carousel .owl-stage-outer {
        max-height: 450px
    }
}

.homepage .testimonials .images-ratings {
    max-width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 4rem
}

@media(max-width:767px) {
    .homepage .testimonials .images-ratings {
        margin: 2rem 0;
        justify-content: space-evenly
    }
}

.homepage .testimonials .images-ratings img {
    width: 150px;
    height: 75px
}

@media(max-width:767px) {
    .homepage .testimonials .images-ratings img {
        width: 35%;
        height: auto;
        margin-bottom: 2rem
    }
}

.homepage #homepageTop {
    margin: 3rem 0
}

    .homepage #homepageTop .homepage__top {
        text-align: center;
        margin-bottom: 2rem
    }

        .homepage #homepageTop .homepage__top h1 {
            font-size: 52px;
            font-weight: 700;
            margin-bottom: 1rem
        }

        .homepage #homepageTop .homepage__top h3 {
            font-size: 20px;
            font-weight: 600;
            color: #767676;
            padding: 1rem 0
        }

        .homepage #homepageTop .homepage__top p {
            color: #767676;
            font-size: 14px;
            font-style: italic
        }

        .homepage #homepageTop .homepage__top .homepage__top--reviews {
            display: flex;
            justify-content: center
        }

            .homepage #homepageTop .homepage__top .homepage__top--reviews span a {
                font-size: 14px;
                color: #767676;
                margin-left: 1rem
            }

                .homepage #homepageTop .homepage__top .homepage__top--reviews span a:hover {
                    border-bottom: 1px solid #ffc502;
                    font-weight: 700;
                    width: 100px
                }

        .homepage #homepageTop .homepage__top .homepage__top--button {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            margin-top: 2rem
        }

            .homepage #homepageTop .homepage__top .homepage__top--button a.btn-filled {
                border-radius: 16px !important
            }

            .homepage #homepageTop .homepage__top .homepage__top--button h3 {
                font-size: 14px;
                font-weight: 600;
                color: #ffc502
            }

    .homepage #homepageTop .homepage__social {
        display: flex;
        align-items: center;
        justify-content: space-between
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .homepage #homepageTop .homepage__social {
        flex-wrap: wrap;
        gap: 25px;
        justify-content: space-around
    }
}

@media(min-width:768px) and (max-width:991px) and (max-width:767px),(max-width:767px) and (max-width:767px) {
    .homepage #homepageTop .homepage__social {
        gap: 20px 0
    }
}

.homepage #homepageTop .homepage__social img {
    width: 115%
}

@media(max-width:767px) {
    .homepage #homepageTop .homepage__social img {
        width: 85%
    }
}

.homepage #homepageTop .homepage__video {
    margin: 3rem 0 4rem
}

.homepage #productivity {
    margin-top: 5rem
}

    .homepage #productivity h2 {
        font-size: 36px;
        font-weight: 700;
        text-align: center;
        margin: 2rem 0
    }

@media(max-width:767px) {
    .homepage #productivity h2 {
        font-size: 28px;
        text-align: left;
        padding-right: 3rem
    }
}

.homepage #productivity .row {
    flex-direction: row;
    margin: 2rem 0;
    width: 100%
}

    .homepage #productivity .row:nth-of-type(2), .homepage #productivity .row:nth-of-type(3) {
        margin-bottom: 6rem
    }

@media(max-width:767px) {
    .homepage #productivity .row:nth-of-type(3) {
        flex-direction: column-reverse
    }
}

.homepage #productivity .row .time-tracking__text p {
    text-align: left
}

.homepage #productivity .row .time-tracking__text h5 {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffc502;
    margin: 2rem 0
}

.homepage #productivity .row .time-tracking__text:nth-of-type(2) p {
    padding-left: 2rem
}

@media(max-width:767px) {
    .homepage #productivity .row .time-tracking__text:nth-of-type(2) p {
        padding-left: 0
    }
}

.homepage #productivity .row .time-tracking__text:nth-of-type(2) h5 {
    padding-left: 2rem
}

@media(max-width:767px) {
    .homepage #productivity .row .time-tracking__text:nth-of-type(2) h5 {
        padding-left: 0
    }
}

.homepage #productivity .row .time-tracking__text:nth-of-type(2) .time-tracking__text--list {
    padding-left: 2rem
}

@media(max-width:767px) {
    .homepage #productivity .row .time-tracking__text:nth-of-type(2) .time-tracking__text--list {
        padding-left: 0
    }
}

.homepage #productivity .row .time-tracking__text .time-tracking__text--list h3 {
    font-size: 18px;
    font-weight: 700
}

.homepage #productivity .row .time-tracking__text .time-tracking__text--list h4 {
    font-size: 1rem;
    padding: 5px 0 25px
}

.homepage #productivity .row .time-tracking__img {
    display: flex;
    align-items: center;
    padding-top: 8rem
}

@media(max-width:767px) {
    .homepage #productivity .row .time-tracking__img {
        padding-top: 1rem
    }
}

.homepage #productivity .row .time-tracking__img img {
    width: 100%
}

.homepage #reviews .container .reviews__heading {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin: 2rem 0
}

    .homepage #reviews .container .reviews__heading h2 {
        font-size: 36px;
        font-weight: 700;
        margin: 2rem 0
    }

@media(max-width:767px) {
    .homepage #reviews .container .reviews__heading h2 {
        text-align: center;
        font-size: 28px
    }
}

.homepage #reviews .container .reviews__heading h3 {
    font-size: 20px;
    font-weight: 600;
    color: #767676
}

@media(max-width:767px) {
    .homepage #reviews .container .reviews__heading h3 {
        font-size: 18px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #apps .container {
        width: 580px
    }
}

.homepage #apps h2 {
    font-size: 36px;
    font-weight: 700;
    text-align: center;
    margin: 3rem 0
}

@media(max-width:767px) {
    .homepage #apps h2 {
        font-size: 28px
    }
}

.homepage #apps .row {
    flex-wrap: nowrap
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #apps .row {
        flex-wrap: wrap
    }
}

.homepage #apps .row .apps__box {
    background-color: #f3f3f3;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    margin-right: 15px;
    text-align: left;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #apps .row .apps__box {
        margin-bottom: 2rem
    }
}

@media(max-width:767px) {
    .homepage #apps .row .apps__box {
        margin: 0 1rem 2rem
    }
}

.homepage #apps .row .apps__box h2 {
    margin: 0 0 1rem;
    text-align: left;
    padding: 3rem 2rem 0 1rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #apps .row .apps__box h2 {
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .homepage #apps .row .apps__box .apps__box--img {
        text-align: center
    }
}

.homepage #apps .row .apps__box .apps__box--img img {
    width: 100%;
    margin-bottom: -8rem;
    padding: 1rem 0 0 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #apps .row .apps__box .apps__box--img img {
        padding: 1rem 2rem 0 5rem
    }
}

@media(max-width:767px) {
    .homepage #apps .row .apps__box .apps__box--img img {
        margin-bottom: -3rem;
        padding: 1rem 0 0 2rem
    }
}

.homepage #apps .row .apps__box img {
    width: 100%;
    margin-bottom: -7rem;
    padding: 1rem 0 0 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #apps .row .apps__box img {
        margin-bottom: -4rem;
        padding: 1rem 5rem 0 7rem
    }
}

@media(max-width:767px) {
    .homepage #apps .row .apps__box img {
        margin-bottom: -3rem;
        padding: 1rem 2rem 0 3rem
    }
}

.homepage #apps .row .apps__box .apps__box--icons {
    display: flex;
    align-items: center;
    flex: 1;
    margin-bottom: 1rem;
    padding: 0 1rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #apps .row .apps__box .apps__box--icons {
        justify-content: center;
        padding: 0
    }
}

.homepage #apps .row .apps__box .apps__box--icons img {
    width: inherit;
    margin-bottom: 0;
    padding: 0
}

.homepage #apps .row .apps__box .apps__box--icons span {
    font-size: 1rem;
    color: #767676;
    padding: 0 1rem 0 .5rem
}

@media(max-width:767px) {
    .homepage #apps .row .apps__box .apps__box--icons span {
        font-size: 14px
    }
}

.homepage #apps .row .apps__button {
    display: flex;
    margin: 5rem auto
}

    .homepage #apps .row .apps__button .btn-filled {
        border-radius: 16px;
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
    }

@media(max-width:767px) {
    .homepage #apps .row .apps__button {
        margin: 3rem auto
    }
}

.homepage #about h2 {
    font-size: 36px;
    font-weight: 700;
    text-align: center;
    margin: 3rem 0
}

.homepage #about .row {
    border-bottom: 1px solid #f3f3f3
}

    .homepage #about .row:nth-last-of-type(1) {
        border-bottom: none
    }

    .homepage #about .row .about__box {
        padding: 20px 95px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .homepage #about .row .about__box {
        padding: 2rem
    }
}

.homepage #about .row .about__box h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 2rem 0 1rem
}

.homepage #about .row .about__box h4 {
    font-size: 1rem;
    padding-bottom: 2rem
}

.homepage #about .row .about__box:nth-of-type(1) {
    border-right: 1px solid #f3f3f3
}

.homepage #bottomCtaHompage {
    background-color: #f3f3f3
}

    .homepage #bottomCtaHompage .bottomCtaHomepage__content {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        padding: 10rem;
        margin: 5rem auto
    }

@media(min-width:768px) and (max-width:991px) {
    .homepage #bottomCtaHompage .bottomCtaHomepage__content {
        padding: 10rem 1rem
    }
}

@media(max-width:767px) {
    .homepage #bottomCtaHompage .bottomCtaHomepage__content {
        padding: 4rem 2rem
    }
}

.homepage #bottomCtaHompage .bottomCtaHomepage__content h1 {
    font-size: 36px;
    font-weight: 700;
    text-align: center;
    padding: 0 5rem
}

@media(max-width:767px) {
    .homepage #bottomCtaHompage .bottomCtaHomepage__content h1 {
        padding: 0
    }
}

.homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content__check {
    margin: 2rem 0;
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: center
}

    .homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content__check .bottomCtaHomepage__content__check--box {
        display: flex;
        align-items: center
    }

        .homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content__check .bottomCtaHomepage__content__check--box:nth-of-type(3) span {
            padding-right: 0
        }

@media(min-width:768px) and (max-width:991px) {
    .homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content__check .bottomCtaHomepage__content__check--box:nth-of-type(3) span {
        padding-right: 10px
    }
}

.homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content__check .bottomCtaHomepage__content__check--box span {
    color: #767676;
    font-size: 20px;
    padding: 0 3rem 0 10px;
    font-family: nunito sans,sans-serif
}

@media(max-width:767px) {
    .homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content__check .bottomCtaHomepage__content__check--box span {
        width: 200px;
        padding: 0 0 0 10px
    }
}

@media(max-width:767px) {
    .homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content__check {
        flex-direction: column
    }
}

.homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content--buttons {
    margin: 2rem 0;
    text-align: center
}

    .homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content--buttons a {
        border-radius: 16px
    }

    .homepage #bottomCtaHompage .bottomCtaHomepage__content .bottomCtaHomepage__content--buttons h3 {
        margin-top: 2rem;
        font-size: 14px;
        font-weight: 600;
        color: #ffc502
    }

@media(max-width:767px) {
    .homepage #bannerBookaDemoBlack {
        margin: -2rem 1rem 5rem
    }
}

.homepage #bannerBookaDemoBlack .container .text-cta {
    display: flex;
    padding: 3rem 4rem;
    align-items: center;
    flex-direction: row
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #bannerBookaDemoBlack .container .text-cta {
        padding: 3rem;
        position: static
    }
}

@media(max-width:767px) {
    .homepage #bannerBookaDemoBlack .container .text-cta {
        padding: 2rem;
        flex-direction: column
    }
}

.homepage #bannerBookaDemoBlack .container .text-cta h2 {
    font-size: 28px;
    font-weight: 700
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #bannerBookaDemoBlack .container .text-cta h2 {
        padding-right: 1rem
    }
}

@media(max-width:767px) {
    .homepage #bannerBookaDemoBlack .container .text-cta h2 {
        padding-right: 0
    }
}

.homepage #top-new {
    padding-bottom: 4rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-new {
        padding-bottom: 0;
        padding-left: 1.5rem;
        padding-right: 1.5rem
    }
}

@media(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .homepage #top-new {
        padding-left: 5rem !important
    }
}

.homepage #top-new .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 10%;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1rem
}

@media(max-width:767px) {
    .homepage #top-new .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #top-new .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .homepage #top-new .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .homepage #top-new .container--custom {
        width: 100%
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom {
        padding: 0
    }
}

.homepage #top-new .container--custom .heading {
    margin-bottom: 3rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

    .homepage #top-new .container--custom .heading h1 {
        font-size: 55px;
        font-weight: 800;
        text-transform: uppercase;
        margin: 2.5rem 0
    }

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom .heading h1 {
        margin: 2.5rem 0 1rem
    }
}

.homepage #top-new .container--custom .content {
    width: 100%;
    display: flex
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom .content {
        flex-direction: column
    }
}

.homepage #top-new .container--custom .content-left {
    width: 40%;
    display: flex;
    flex-direction: column;
    padding-right: 3rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom .content-left {
        width: 100%;
        padding-right: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom .content-left--clasic {
        display: none
    }
}

@media(max-width:767px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .homepage #top-new .container--custom .content-left--tablet {
        display: none
    }
}

.homepage #top-new .container--custom .content-left h2 {
    font-size: 20px;
    margin-bottom: 1rem
}

.homepage #top-new .container--custom .content-left .green {
    font-size: 18px
}

.homepage #top-new .container--custom .content-left .button-wrapper {
    margin-top: 3rem;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

    .homepage #top-new .container--custom .content-left .button-wrapper span {
        margin-left: 1rem
    }

@media(max-width:767px) {
    .homepage #top-new .container--custom .content-left .button-wrapper {
        flex-direction: column
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom .content-left .button-wrapper {
        justify-content: center
    }
}

@media(max-width:767px) {
    .homepage #top-new .container--custom .content-left .button-wrapper__google {
        margin-top: 1.5rem
    }
}

.homepage #top-new .container--custom .content-left .paragraphgreen {
    margin-top: 2rem;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(min-width:1920px) {
    .homepage #top-new .container--custom .content-left .paragraphgreen {
        width: 70%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom .content-left .paragraphgreen {
        margin-bottom: 2.5rem
    }
}

.homepage #top-new .container--custom .content-left .paragraphgreen p {
    color: #00bf71;
    font-weight: 700
}

.homepage #top-new .container--custom .content-right {
    width: 60%;
    margin-top: -1rem
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom .content-right {
        width: 100%
    }
}

@media(max-width:767px) {
    .homepage #top-new .container--custom .content-right {
        display: none
    }
}

.homepage #top-new .container--custom .content-right img {
    width: 100%;
    margin-left: 1rem;
    border-radius: 15px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #top-new .container--custom .content-right img {
        margin-left: 0
    }
}

.homepage #top-new .container--custom .review {
    width: 100%;
    display: flex;
    flex-direction: row;
    margin-top: 4rem
}

.homepage #top-new .container--custom .review-img {
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center
}

    .homepage #top-new .container--custom .review-img img {
        width: 45%
    }

.homepage #top-new .container--custom .review-content {
    width: 40%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center
}

    .homepage #top-new .container--custom .review-content p {
        font-size: 22px;
        font-style: italic;
        margin: 0;
        text-align: left;
        width: 70%
    }

    .homepage #top-new .container--custom .review-content span {
        margin-left: 7rem;
        font-size: 18px;
        font-weight: 800
    }

    .homepage #top-new .container--custom .review-content img {
        width: 35%;
        margin-top: 1.5rem
    }

.homepage #greyBoxes .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto
}

@media(max-width:767px) {
    .homepage #greyBoxes .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #greyBoxes .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #greyBoxes .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .homepage #greyBoxes .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .homepage #greyBoxes .container--custom {
        width: 1440px
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #greyBoxes .container--custom {
        padding: 0
    }
}

.homepage #greyBoxes .container--custom .greyBoxes {
    box-sizing: border-box;
    width: 100%;
    display: flex;
    justify-content: space-between
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #greyBoxes .container--custom .greyBoxes {
        flex-direction: column
    }
}

.homepage #greyBoxes .container--custom .greyBoxes-box {
    background-color: #f3f3f3;
    margin: 0 1rem;
    padding: 2.5rem;
    border-radius: 25px;
    max-width: 30%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #greyBoxes .container--custom .greyBoxes-box {
        min-width: 100% !important;
        margin: 1rem 0
    }
}

.homepage #greyBoxes .container--custom .greyBoxes-box p {
    font-size: 26px
}

.homepage #greyBoxes .container--custom .greyBoxes-box span:first-of-type {
    font-size: 56px;
    font-weight: 800;
    color: #ffc502;
    display: block;
    width: 100%
}

.homepage #greyBoxes .container--custom .greyBoxes-box span:last-of-type {
    font-weight: 800;
    font-size: 28px
}

.homepage #green_cta .container--custom {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    width: 100% !important;
    padding-top: 7rem
}

@media(max-width:767px) {
    .homepage #green_cta .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #green_cta .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #green_cta .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .homepage #green_cta .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .homepage #green_cta .container--custom {
        width: 1440px
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #green_cta .container--custom {
        padding: 0
    }
}

.homepage #green_cta .container--custom .green_cta {
    width: 80%;
    border-radius: 25px;
    padding: 2rem 3rem;
    display: flex;
    flex-direction: column
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #green_cta .container--custom .green_cta {
        padding: 2rem 0
    }
}

.homepage #green_cta .container--custom .green_cta .green {
    font-size: 18px
}

.homepage #green_cta .container--custom .green_cta h2 {
    font-weight: 800
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #green_cta .container--custom .green_cta h2 {
        margin-bottom: 2rem
    }
}

@media(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .homepage #green_cta .container--custom .green_cta h2 {
        text-align: center
    }
}

.homepage #green_cta .container--custom .green_cta p {
    font-size: 24px;
    margin-bottom: 2rem
}

@media(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .homepage #green_cta .container--custom .green_cta p {
        text-align: center
    }
}

.homepage #green_cta .container--custom .green_cta a {
    width: max-content
}

.homepage #green_cta .container--custom .green_cta .green {
    align-self: center;
    font-size: 18px
}

.homepage #green_cta .container--custom .green_cta-options {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 2rem 0 0
}

    .homepage #green_cta .container--custom .green_cta-options span {
        font-size: 20px
    }

    .homepage #green_cta .container--custom .green_cta-options .row {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .homepage #green_cta .container--custom .green_cta-options .checks {
        display: flex;
        align-items: center;
        justify-content: center
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #green_cta .container--custom .green_cta-options .checks {
        margin-bottom: 1rem;
        justify-content: flex-start
    }
}

.homepage #green_cta .container--custom .green_cta-options .checks p {
    font-size: 20px;
    margin: 0;
    padding-left: 1rem
}

.homepage #badges .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .homepage #badges .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .homepage #badges .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .homepage #badges .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .homepage #badges .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .homepage #badges .container--custom {
        width: 1440px
    }
}

.homepage #badges .container--custom .badges__heading {
    display: flex;
    align-items: center;
    justify-content: center
}

    .homepage #badges .container--custom .badges__heading h2 {
        font-weight: 700
    }

.homepage #badges .container--custom .badges__content {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2rem
}

    .homepage #badges .container--custom .badges__content .row {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 60%
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #badges .container--custom .badges__content .row {
        width: 85%
    }
}

.homepage #badges .container--custom .badges__content .row div {
    display: flex;
    align-items: center;
    justify-content: center
}

    .homepage #badges .container--custom .badges__content .row div img {
        width: 75%
    }

@media(max-width:767px) {
    .homepage #badges .container--custom .badges__content .row div img {
        width: 95%
    }
}

.homepage #homepageScroll .onScroll__stepScroll--stepsProcess-title-step {
    font-size: 42px !important;
    font-weight: 700 !important
}

.homepage #homepageScroll .onScroll__stepScroll--stepsProcess-text-step {
    font-size: 20px !important;
    line-height: 1.7 !important
}

.homepage #homepageScroll .benefitScroll__button {
    margin-top: -2.5rem;
    margin-bottom: 7rem;
    z-index: 99 !important
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #homepageScroll .benefitScroll__button {
        margin-top: 0
    }
}

.homepage #homepageScroll .benefitScroll__button .btn-filled {
    font-size: 20px !important
}

.homepage #homepageScroll #onScrollMobile {
    overflow: hidden !important
}

    .homepage #homepageScroll #onScrollMobile .onScrollMobile-titleStep {
        font-size: 24px !important
    }

.homepage #integrated_apps {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin: 4rem 0 8rem
}

    .homepage #integrated_apps .integrated_apps-heading {
        width: 100%;
        text-align: center
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #integrated_apps .integrated_apps-heading {
        width: 80%
    }
}

.homepage #integrated_apps .integrated_apps-heading h2 {
    line-height: 1.4;
    font-size: 28px
}

    .homepage #integrated_apps .integrated_apps-heading h2:first-of-type {
        font-size: 32px
    }

.homepage #integrated_apps .integrated_apps-content {
    width: 100%;
    padding: 1rem;
    margin-top: 3rem;
    display: flex;
    align-items: center;
    justify-content: center
}

    .homepage #integrated_apps .integrated_apps-content .row {
        display: flex;
        align-items: center;
        justify-content: center
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #integrated_apps .integrated_apps-content .row {
        margin: 0 1rem
    }
}

.homepage #integrated_apps .integrated_apps-content a {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    border-radius: 25px;
    padding: 1.5rem;
    margin: 1rem
}

    .homepage #integrated_apps .integrated_apps-content a img {
        width: 70%
    }

.homepage #integrated_apps .integrated_apps-button {
    margin-top: 5rem;
    font-size: 18px
}

.homepage #posts {
    background-color: transparent
}

    .homepage #posts .special-paragraph {
        display: none
    }

    .homepage #posts .btn-filled {
        font-size: 20px
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .homepage #posts .header-text h2 {
        font-size: 42px !important
    }
}

.homepage #posts .col-md-6 {
    margin-bottom: 2rem !important
}

.homepage #values .header {
    font-size: 42px !important
}

.homepage #loading {
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: fixed;
    background: rgba(255,255,255,.68);
    top: 0;
    right: 0;
    width: 100%;
    height: 100%
}

    .homepage #loading p {
        margin-top: 1rem;
        color: #ffc502;
        font-weight: 600;
        font-size: 16px
    }

    .homepage #loading .lds-roller {
        display: inline-block;
        position: relative;
        width: 80px;
        height: 80px
    }

        .homepage #loading .lds-roller div {
            animation: lds-roller 1.2s cubic-bezier(.5,0,.5,1) infinite;
            transform-origin: 40px 40px
        }

            .homepage #loading .lds-roller div:after {
                content: " ";
                display: block;
                position: absolute;
                width: 7px;
                height: 7px;
                border-radius: 50%;
                background: #ffc502;
                margin: -4px 0 0 -4px
            }

            .homepage #loading .lds-roller div:nth-child(1) {
                animation-delay: -.036s
            }

                .homepage #loading .lds-roller div:nth-child(1):after {
                    top: 63px;
                    left: 63px
                }

            .homepage #loading .lds-roller div:nth-child(2) {
                animation-delay: -.072s
            }

                .homepage #loading .lds-roller div:nth-child(2):after {
                    top: 68px;
                    left: 56px
                }

            .homepage #loading .lds-roller div:nth-child(3) {
                animation-delay: -.108s
            }

                .homepage #loading .lds-roller div:nth-child(3):after {
                    top: 71px;
                    left: 48px
                }

            .homepage #loading .lds-roller div:nth-child(4) {
                animation-delay: -.144s
            }

                .homepage #loading .lds-roller div:nth-child(4):after {
                    top: 72px;
                    left: 40px
                }

            .homepage #loading .lds-roller div:nth-child(5) {
                animation-delay: -.18s
            }

                .homepage #loading .lds-roller div:nth-child(5):after {
                    top: 71px;
                    left: 32px
                }

            .homepage #loading .lds-roller div:nth-child(6) {
                animation-delay: -.216s
            }

                .homepage #loading .lds-roller div:nth-child(6):after {
                    top: 68px;
                    left: 24px
                }

            .homepage #loading .lds-roller div:nth-child(7) {
                animation-delay: -.252s
            }

                .homepage #loading .lds-roller div:nth-child(7):after {
                    top: 63px;
                    left: 17px
                }

            .homepage #loading .lds-roller div:nth-child(8) {
                animation-delay: -.288s
            }

                .homepage #loading .lds-roller div:nth-child(8):after {
                    top: 56px;
                    left: 12px
                }

@keyframes lds-roller {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.hipaa_dcaa #top--HD {
    margin: 6rem 0 4.6rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #top--HD {
        margin: 5rem 0 1rem
    }
}

.hipaa_dcaa #top--HD .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto
}

@media(max-width:767px) {
    .hipaa_dcaa #top--HD .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #top--HD .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .hipaa_dcaa #top--HD .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .hipaa_dcaa #top--HD .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .hipaa_dcaa #top--HD .container--custom {
        width: 1440px
    }
}

.hipaa_dcaa #top--HD .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center
}

    .hipaa_dcaa #top--HD .container--custom .row .top__integration {
        display: flex;
        flex-direction: column;
        align-items: center
    }

        .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--top-img {
            margin-top: -4rem
        }

            .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--top-img img {
                width: 90px;
                height: 90px
            }

                .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--top-img img:nth-of-type(2) {
                    margin-top: 6rem
                }

        .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            text-align: center;
            width: 100%;
            margin-top: 2rem
        }

@media(max-width:767px) {
    .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description {
        align-items: flex-start
    }
}

.hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description h1, .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description span {
    font-size: 52px;
    line-height: 1.1;
    display: inline;
    width: 100%;
    font-weight: 700
}

@media(max-width:767px) {
    .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description h1, .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description span {
        font-size: 48px
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description {
        text-align: left
    }
}

.hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description p {
    width: 65%;
    font-size: 18px;
    font-weight: 600;
    color: #767676
}

@media(max-width:767px) {
    .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--description p {
        text-align: left;
        width: 100%
    }
}

.hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 4rem 5rem
}

@media(max-width:767px) {
    .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--buttons {
        flex-direction: column;
        padding: 2rem 0 0
    }
}

.hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--buttons .underlineButton {
    margin-left: 2rem;
    text-decoration: underline;
    font-size: 16px;
    font-weight: 700
}

@media(max-width:767px) {
    .hipaa_dcaa #top--HD .container--custom .row .top__integration .top__integration--buttons .underlineButton {
        margin: 1.5rem 0 0
    }
}

.hipaa_dcaa #compliance {
    margin: 6rem 0 3rem;
    text-align: center
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance {
        margin: 0 0 3rem
    }
}

.hipaa_dcaa #compliance .features__heading {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance .features__heading {
        justify-content: flex-start
    }
}

.hipaa_dcaa #compliance .features__heading h2 {
    font-size: 36px;
    font-weight: 700;
    margin: 2rem 0;
    padding: 0 8rem
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance .features__heading h2 {
        padding: 0 1rem 0 0;
        font-size: 28px;
        text-align: left
    }
}

.hipaa_dcaa #compliance .features__boxes {
    display: flex;
    flex-wrap: wrap
}

    .hipaa_dcaa #compliance .features__boxes .col-6 {
        flex: 0 0 48%;
        max-width: 48%
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #compliance .features__boxes .col-6 {
        flex: 0 0 100%;
        max-width: 100%
    }
}

.hipaa_dcaa #compliance .features__boxes .features__boxes--single {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 4rem 3rem 0;
    height: 460px;
    overflow: hidden;
    background-color: #f3f3f3;
    border-radius: 20px;
    margin: 10px;
    position: relative
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance .features__boxes .features__boxes--single {
        margin: 0 0 10px;
        padding: 2rem 0 0 1rem
    }
}

.hipaa_dcaa #compliance .features__boxes .features__boxes--single img {
    width: 64px;
    margin-bottom: 3rem
}

.hipaa_dcaa #compliance .features__boxes .features__boxes--single h2 {
    margin-bottom: 1.5rem;
    font-size: 36px;
    font-weight: 700
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance .features__boxes .features__boxes--single h2 {
        text-align: left
    }
}

.hipaa_dcaa #compliance .features__boxes .features__boxes--single p {
    text-align: left;
    font-size: 16px
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance .features__boxes .features__boxes--single p {
        padding-right: 1rem
    }
}

.hipaa_dcaa #compliance .features__button {
    width: 100%;
    margin: 2rem 0
}

.hipaa_dcaa #compliance--dcaa {
    margin: 6rem 0 3rem;
    text-align: center
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa {
        margin: 0 0 3rem
    }
}

.hipaa_dcaa #compliance--dcaa .features__heading {
    width: 100%;
    margin-bottom: 3rem
}

    .hipaa_dcaa #compliance--dcaa .features__heading h2 {
        font-size: 36px;
        font-weight: 700;
        margin: 2rem 0;
        padding: 0 8rem
    }

@media(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa .features__heading h2 {
        padding: 0 1rem 0 0;
        font-size: 28px;
        text-align: left
    }
}

.hipaa_dcaa #compliance--dcaa .features__boxes {
    display: flex;
    flex-wrap: wrap
}

    .hipaa_dcaa #compliance--dcaa .features__boxes .col-6 {
        flex: 0 0 48%;
        max-width: 48%
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .col-6 {
        flex: 0 0 100%;
        max-width: 100%
    }
}

.hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single {
    padding: 4rem 3rem 0;
    overflow: hidden;
    background-color: #f3f3f3;
    border-radius: 20px;
    margin: 10px
}

    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(1) img {
        margin: -4rem -8rem -6rem 0
    }

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(1) img {
        margin: 0 -9rem -8rem 0
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(1) img {
        margin: 0 -3rem -6.3rem 0
    }
}

.hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(2) img {
    margin: 0 -7rem -5.6rem 0
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(2) img {
        margin-bottom: -7.6rem
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(2) img {
        margin: 0 -4rem -5.9rem 0
    }
}

.hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(3) img {
    margin: 0 -7rem -15rem 0
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(3) img {
        margin-bottom: -7rem
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(3) img {
        margin: 0 -3rem -6rem 0
    }
}

.hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(4) img {
    margin: 0 -9.6rem -6rem 0
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(4) img {
        margin: 0 -10.6rem -8rem 0
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single:nth-of-type(4) img {
        margin: 0 -3.5rem -6.3rem 0
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single {
        margin: 0 0 20px;
        padding: 2rem 0 0 1rem
    }
}

.hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single h2 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 1rem;
    text-align: left
}

.hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single .features__boxes--special-paragraph {
    margin-bottom: 4rem
}

.hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single p {
    margin-bottom: 2rem;
    text-align: left;
    padding-right: 20px
}

@media(max-width:767px) {
    .hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single p {
        padding-right: 0
    }
}

.hipaa_dcaa #compliance--dcaa .features__boxes .features__boxes--single img {
    width: 100%
}

.hipaa_dcaa #compliance--dcaa .features__button {
    width: 100%;
    margin: 2rem 0
}

.hipaa_dcaa #features {
    margin-top: 5rem;
    width: 100%
}

    .hipaa_dcaa #features .features__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 3rem;
        margin-bottom: 4rem
    }

@media(max-width:767px) {
    .hipaa_dcaa #features .features__heading {
        align-items: flex-start;
        justify-content: flex-start;
        padding-left: 1.5rem;
        margin: 1.5rem 0
    }
}

.hipaa_dcaa #features .row {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0 !important;
    margin: 0
}

    .hipaa_dcaa #features .row:first-of-type {
        margin-top: 3rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #features .row:nth-of-type(2), .hipaa_dcaa #features .row:nth-of-type(4) {
        flex-direction: column !important
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #features .row:nth-of-type(3), .hipaa_dcaa #features .row:nth-of-type(5) {
        flex-direction: column-reverse !important
    }
}

.hipaa_dcaa #features .row:not(:last-of-type) {
    margin-bottom: 10rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #features .row:not(:last-of-type) {
        margin-bottom: 7rem
    }
}

.hipaa_dcaa #features .row .features__single {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 5% 0 20%
}

@media(min-width:992px) and (max-width:1440px) {
    .hipaa_dcaa #features .row .features__single {
        padding-left: 12%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #features .row .features__single {
        width: 100%;
        padding: 0 5rem
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #features .row .features__single {
        width: 100%;
        padding: 0 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #features .row .features__single a {
        display: none
    }
}

.hipaa_dcaa #features .row .features__single--right {
    width: 50%;
    padding: 0 10%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #features .row .features__single--right a {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #features .row .features__single--right {
        width: 100%;
        padding: 0 5rem
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #features .row .features__single--right {
        width: 100%;
        padding: 0 1.5rem
    }
}

.hipaa_dcaa #features .row h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 3rem
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #features .row h2 {
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #features .row h2 {
        text-align: left
    }
}

.hipaa_dcaa #features .row p {
    font-size: 16px;
    margin-bottom: 2rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #features .row p {
        margin-bottom: 3rem
    }
}

.hipaa_dcaa #features .features__img {
    width: 50%;
    display: flex;
    justify-content: flex-end;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #features .features__img {
        width: 100%;
        padding: 0 0 0 2rem
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #features .features__img {
        width: 100%;
        padding: 0
    }
}

.hipaa_dcaa #features .features__img img {
    width: 100%;
    margin-right: -3rem
}

@media(max-width:767px) {
    .hipaa_dcaa #features .features__img img {
        margin-right: -1.5rem
    }
}

.hipaa_dcaa #features .features__img--left {
    width: 50%;
    display: flex;
    justify-content: flex-start;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #features .features__img--left {
        justify-content: flex-end;
        width: 100%;
        padding: 0 0 0 1rem
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #features .features__img--left {
        width: 100%;
        padding: 0
    }
}

.hipaa_dcaa #features .features__img--left img {
    width: 100%;
    margin-left: -2rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #features .features__img--left img {
        margin-left: 1.5rem;
        margin-right: -3rem
    }
}

.hipaa_dcaa #features .showOnTabletAndMoble {
    display: none
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #features .showOnTabletAndMoble {
        display: flex;
        margin: 3rem 0 1rem
    }
}

.hipaa_dcaa #benefits .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto
}

@media(max-width:767px) {
    .hipaa_dcaa #benefits .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #benefits .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .hipaa_dcaa #benefits .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .hipaa_dcaa #benefits .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .hipaa_dcaa #benefits .container--custom {
        width: 1440px
    }
}

.hipaa_dcaa #benefits .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .hipaa_dcaa #benefits .container--custom .row .benefits__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-top: 6rem;
        text-align: center
    }

@media(max-width:767px) {
    .hipaa_dcaa #benefits .container--custom .row .benefits__heading {
        margin-top: 3rem;
        align-items: flex-start;
        text-align: left
    }
}

.hipaa_dcaa #benefits .container--custom .row .benefits__heading h2 {
    width: 70%;
    font-size: 36px;
    font-weight: 700;
    margin: 2rem 0
}

@media(max-width:767px) {
    .hipaa_dcaa #benefits .container--custom .row .benefits__heading h2 {
        width: 100%;
        margin: 1rem 0 2rem;
        font-size: 28px;
        text-align: left
    }
}

.hipaa_dcaa #benefits .container--custom .row .benefits__circle {
    display: flex;
    align-items: center;
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #benefits .container--custom .row .benefits__circle .row {
        width: 100%;
        justify-content: center
    }
}

.hipaa_dcaa #benefits .container--custom .row .benefits__circle .benefits__circle--column {
    display: flex;
    border-top: 1px solid #f3f3f3;
    justify-content: space-around
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #benefits .container--custom .row .benefits__circle .benefits__circle--column {
        border-top: 1px solid transparent
    }
}

.hipaa_dcaa #benefits .container--custom .row .benefits__circle .benefits__circle--column .benefits__circle--column-single {
    display: flex;
    align-items: center;
    margin: 1rem 0
}

    .hipaa_dcaa #benefits .container--custom .row .benefits__circle .benefits__circle--column .benefits__circle--column-single span {
        background-color: #ffc502;
        border-radius: 50%;
        padding: 10px 18px;
        color: #fff
    }

    .hipaa_dcaa #benefits .container--custom .row .benefits__circle .benefits__circle--column .benefits__circle--column-single p {
        font-size: 18px;
        padding-left: 1.5rem;
        width: 500px;
        padding-right: 2rem;
        margin-bottom: 0
    }

@media(max-width:767px) {
    .hipaa_dcaa #benefits .container--custom .row .benefits__circle .benefits__circle--column .benefits__circle--column-single p {
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #benefits .container--custom .row .benefits__circle .benefits__circle--column .benefits__circle--column-single {
        border-top: 1px solid #f3f3f3;
        padding: 10px 0;
        margin: 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .hipaa_dcaa #benefits .container--custom .row .benefits__circle .benefits__circle--column {
        flex-direction: column;
        display: block
    }
}

.hipaa_dcaa #social-proof {
    padding-bottom: 3rem
}

    .hipaa_dcaa #social-proof .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }

@media(max-width:767px) {
    .hipaa_dcaa #social-proof .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #social-proof .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .hipaa_dcaa #social-proof .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .hipaa_dcaa #social-proof .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .hipaa_dcaa #social-proof .container--custom {
        width: 1440px
    }
}

.hipaa_dcaa #social-proof .container--custom .row div {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 0
}

@media(max-width:767px) {
    .hipaa_dcaa #bannerBookaDemoBlack {
        margin: 3rem 0
    }
}

.hipaa_dcaa #bannerBookaDemoBlack .container .text-cta {
    display: flex;
    padding: 3rem 4rem;
    align-items: center;
    flex-direction: row
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #bannerBookaDemoBlack .container .text-cta {
        padding: 3rem;
        position: static
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #bannerBookaDemoBlack .container .text-cta {
        padding: 2rem;
        flex-direction: column
    }
}

.hipaa_dcaa #bannerBookaDemoBlack .container .text-cta h2 {
    font-size: 28px;
    font-weight: 700
}

@media(min-width:768px) and (max-width:991px) {
    .hipaa_dcaa #bannerBookaDemoBlack .container .text-cta h2 {
        padding-right: 1rem
    }
}

@media(max-width:767px) {
    .hipaa_dcaa #bannerBookaDemoBlack .container .text-cta h2 {
        padding-right: 0
    }
}

.hipaa_dcaa .section-integration-more-info h5 {
    font-weight: 700;
    font-size: 18px;
    padding: 1rem 0
}

.hipaa_dcaa .section-integration-more-info .greenText {
    color: #ffc502
}

    .hipaa_dcaa .section-integration-more-info .greenText:hover {
        text-decoration: underline
    }

.hipaa_dcaa .section-integration-more-info .limitHeight {
    height: 150px
}

.alternatives .col-12 {
    padding: 0
}

.alternatives #top {
    padding: 7.5rem 0;
    display: flex;
    justify-content: center
}

@media(max-width:767px) {
    .alternatives #top {
        padding: 2rem 0 7.5rem
    }
}

.alternatives #top .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 6rem
}

@media(max-width:767px) {
    .alternatives #top .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #top .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .alternatives #top .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .alternatives #top .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .alternatives #top .container--custom {
        width: 1440px
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #top .container--custom {
        padding: 0
    }
}

.alternatives #top .container--custom .row {
    width: 100%;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center
}

    .alternatives #top .container--custom .row .top__integration {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration {
        align-items: flex-start
    }
}

.alternatives #top .container--custom .row .top__integration .top__integration--img-azure {
    width: 100% !important
}

.alternatives #top .container--custom .row .top__integration .top__integration--description {
    text-align: center;
    width: 65%;
    margin-top: 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #top .container--custom .row .top__integration .top__integration--description {
        width: 80%
    }
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .top__integration--description {
        width: 100%
    }
}

.alternatives #top .container--custom .row .top__integration .top__integration--description h1, .alternatives #top .container--custom .row .top__integration .top__integration--description span {
    font-size: 52px;
    line-height: 1.1;
    display: inline;
    font-weight: 700
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .top__integration--description h1, .alternatives #top .container--custom .row .top__integration .top__integration--description span {
        font-size: 48px
    }
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .top__integration--description {
        text-align: left
    }
}

.alternatives #top .container--custom .row .top__integration .top__integration--description p {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    margin: 2rem 0;
    padding: 0 1rem
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .top__integration--description p {
        text-align: left;
        padding: 0
    }
}

.alternatives #top .container--custom .row .top__integration .top__integration--button {
    text-align: center
}

    .alternatives #top .container--custom .row .top__integration .top__integration--button a {
        margin: 1rem 0
    }

    .alternatives #top .container--custom .row .top__integration .top__integration--button h3 {
        font-size: 14px;
        color: #ffc502;
        font-weight: 600
    }

.alternatives #top .container--custom .row .top__integration .form .form-wrapper {
    margin-bottom: 2rem;
    padding-left: 10rem
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #top .container--custom .row .top__integration .form .form-wrapper {
        padding-left: 2rem
    }
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .form .form-wrapper {
        padding-left: 0
    }
}

.alternatives #top .container--custom .row .top__integration .form .form-wrapper input[type=email] {
    border: none;
    width: 35%;
    outline: none;
    font-size: 14px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .form .form-wrapper input[type=email] {
        width: 75%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #top .container--custom .row .top__integration .form .form-wrapper input[type=email] {
        width: 40%
    }
}

.alternatives #top .container--custom .row .top__integration .form .form-wrapper button {
    padding: 12px 10px;
    color: #fff;
    width: 25%;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #ffc502;
    position: relative;
    background-color: #ffc502;
    left: -3rem;
    margin-top: 0
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .form .form-wrapper button {
        left: unset;
        right: 0;
        width: 75%;
        padding: 10px 0;
        margin-top: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #top .container--custom .row .top__integration .form .form-wrapper button {
        padding: 14px 7px
    }
}

.alternatives #top .container--custom .row .top__integration .form .form-wrapper .terms-submission {
    margin: 20px 0;
    font-size: 13px;
    color: #1b1b20;
    opacity: .6;
    width: 100%;
    padding-left: 2rem
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .form .form-wrapper .terms-submission {
        width: 100%;
        padding: 0 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #top .container--custom .row .top__integration .form .form-wrapper .terms-submission {
        padding-right: 0
    }
}

.alternatives #top .container--custom .row .top__integration .form .form-wrapper .terms-submission a {
    margin: 0 2px;
    color: #ffc502
}

.alternatives #top .container--custom .row .top__integration .form .button-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .form .button-wrapper {
        flex-direction: column;
        align-items: center
    }
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .form .button-wrapper .signup_google_button {
        margin-top: 1rem
    }
}

.alternatives #top .container--custom .row .top__integration .form .button-wrapper span {
    font-size: 16px;
    color: #767676
}

.alternatives #top .container--custom .row .top__integration .form .button-wrapper img {
    margin-left: .2rem;
    width: 32px
}

.alternatives #top .container--custom .row .top__integration .form .button-wrapper .button-wrapper__google {
    display: flex;
    margin-top: 1rem;
    width: 75%;
    text-align: center
}

@media(max-width:767px) {
    .alternatives #top .container--custom .row .top__integration .form .button-wrapper .button-wrapper__google {
        display: block;
        margin-left: 0;
        text-align: center;
        margin-top: 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #top .container--custom .row .top__integration .form .button-wrapper .button-wrapper__google {
        margin-left: 0
    }
}

.alternatives #social-proof {
    padding-bottom: 3rem
}

    .alternatives #social-proof .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }

@media(max-width:767px) {
    .alternatives #social-proof .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #social-proof .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .alternatives #social-proof .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .alternatives #social-proof .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .alternatives #social-proof .container--custom {
        width: 1440px
    }
}

.alternatives #social-proof .container--custom .row div {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 0
}

.alternatives #comparison {
    display: flex;
    justify-content: center
}

    .alternatives #comparison .container--custom {
        width: 100%;
        padding-right: 5rem;
        padding-left: 5rem;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }

@media(max-width:767px) {
    .alternatives #comparison .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #comparison .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .alternatives #comparison .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .alternatives #comparison .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .alternatives #comparison .container--custom {
        width: 1440px
    }
}

.alternatives #comparison .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center
}

    .alternatives #comparison .container--custom .row .col-12 {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        text-align: center
    }

@media(max-width:767px) {
    .alternatives #comparison .container--custom .row .col-12 {
        align-items: flex-start;
        text-align: left
    }
}

.alternatives #comparison .container--custom .row h2 {
    font-size: 36px;
    font-weight: 700
}

.alternatives #comparison .container--custom .row .comparison__table {
    width: 100%;
    margin: 4rem 0 3rem
}

    .alternatives #comparison .container--custom .row .comparison__table table {
        width: 100%
    }

        .alternatives #comparison .container--custom .row .comparison__table table thead tr td {
            text-align: center;
            padding: 1rem 0
        }

            .alternatives #comparison .container--custom .row .comparison__table table thead tr td .comparison__table--logo {
                max-width: 125px
            }

@media(max-width:767px) {
    .alternatives #comparison .container--custom .row .comparison__table table thead tr td .comparison__table--logo {
        display: none
    }
}

.alternatives #comparison .container--custom .row .comparison__table table thead tr td .comparison__table--logo-mobile {
    max-width: 60px
}

@media(min-width:1920px),(min-width:1441px) and (max-width:1919px),(min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:991px) {
    .alternatives #comparison .container--custom .row .comparison__table table thead tr td .comparison__table--logo-mobile {
        display: none
    }
}

.alternatives #comparison .container--custom .row .comparison__table table tbody tr {
    border-top: 1px solid #f3f3f3;
    border-bottom: 1px solid #f3f3f3
}

    .alternatives #comparison .container--custom .row .comparison__table table tbody tr td {
        padding: 1rem 0;
        font-size: 18px;
        font-weight: 700
    }

        .alternatives #comparison .container--custom .row .comparison__table table tbody tr td:nth-of-type(2) {
            border: 1px solid #f3f3f3
        }

        .alternatives #comparison .container--custom .row .comparison__table table tbody tr td:nth-of-type(3) {
            color: #767676
        }

        .alternatives #comparison .container--custom .row .comparison__table table tbody tr td:nth-of-type(2), .alternatives #comparison .container--custom .row .comparison__table table tbody tr td:nth-of-type(3) {
            text-align: center;
            width: 33%
        }

            .alternatives #comparison .container--custom .row .comparison__table table tbody tr td:nth-of-type(2) p, .alternatives #comparison .container--custom .row .comparison__table table tbody tr td:nth-of-type(3) p {
                padding: 0;
                margin: 0
            }

@media(max-width:767px) {
    .alternatives #comparison .container--custom .row .comparison__table table tbody tr td:nth-of-type(2), .alternatives #comparison .container--custom .row .comparison__table table tbody tr td:nth-of-type(3) {
        width: 15%
    }
}

.alternatives #comparison .container--custom .row .comparison__button a {
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

.alternatives #benefits {
    display: flex;
    justify-content: center
}

    .alternatives #benefits .container--custom {
        width: 100%;
        padding-right: 5rem;
        padding-left: 5rem;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }

@media(max-width:767px) {
    .alternatives #benefits .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #benefits .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .alternatives #benefits .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .alternatives #benefits .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .alternatives #benefits .container--custom {
        width: 1440px
    }
}

.alternatives #benefits .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center
}

    .alternatives #benefits .container--custom .row .benefits__header {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-bottom: 3rem
    }

@media(max-width:767px) {
    .alternatives #benefits .container--custom .row .benefits__header {
        align-items: flex-start;
        margin-bottom: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #benefits .container--custom .row .benefits__header {
        margin-bottom: 0
    }
}

.alternatives #benefits .container--custom .row .benefits__header h2 {
    width: 75%;
    text-align: center
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #benefits .container--custom .row .benefits__header h2 {
        width: 100%
    }
}

@media(max-width:767px) {
    .alternatives #benefits .container--custom .row .benefits__header h2 {
        text-align: left
    }
}

.alternatives #benefits .container--custom .row .col-8 h2 {
    width: 40%
}

.alternatives #benefits .container--custom .row .col-8 p {
    font-size: 18px;
    font-weight: 400;
    padding-right: 8rem
}

.alternatives #benefits .container--custom .row h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 3rem
}

.alternatives #benefits .container--custom .row img {
    width: 100%
}

.alternatives #benefits .container--custom .row .benefits__firstTextBox {
    padding-right: 10rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #benefits .container--custom .row .benefits__firstTextBox {
        padding-right: 0;
        margin: 3rem 0 1rem
    }
}

.alternatives #benefits .container--custom .row .benefits__firstTextBox p {
    font-size: 18px;
    font-weight: 400
}

.alternatives #benefits .container--custom .row .benefits__grayBox {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 3rem;
    background-color: #f3f3f3;
    border-radius: 26px
}

    .alternatives #benefits .container--custom .row .benefits__grayBox h2 {
        margin: 0
    }

    .alternatives #benefits .container--custom .row .benefits__grayBox span {
        color: #ffc502
    }

.alternatives #benefits .container--custom .row .benefits__textBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-right: 10rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px) {
    .alternatives #benefits .container--custom .row .benefits__textBox {
        padding-right: 0
    }
}

.alternatives #benefits .container--custom .row .benefits__textBox h2 {
    text-align: left
}

.alternatives #benefits .container--custom .row .benefits__textBox p {
    font-size: 18px;
    font-weight: 400;
    padding-right: 8rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #benefits .container--custom .row .benefits__textBox p {
        padding-right: 0
    }
}

.alternatives #benefits .container--custom .row .benefits__img {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 3rem 0 7rem
}

    .alternatives #benefits .container--custom .row .benefits__img img {
        width: 80%
    }

@media(max-width:767px) {
    .alternatives #benefits .container--custom .row .benefits__img img {
        width: 100%
    }
}

.alternatives #benefits .container--custom .row .benefits__button {
    margin-top: -4rem
}

    .alternatives #benefits .container--custom .row .benefits__button a {
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
    }

.alternatives #freeDemoYoutube .special__paragraph-heading {
    margin-bottom: 5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #freeDemoYoutube .special__paragraph-heading {
        margin-bottom: 2.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .alternatives #freeDemoYoutube .special__paragraph-heading {
        margin-bottom: 0
    }
}

.alternatives #freeDemoYoutube .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto
}

@media(max-width:767px) {
    .alternatives #freeDemoYoutube .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #freeDemoYoutube .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .alternatives #freeDemoYoutube .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .alternatives #freeDemoYoutube .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .alternatives #freeDemoYoutube .container--custom {
        width: 1440px
    }
}

.alternatives #freeDemoYoutube .container--custom .video-youtube__container {
    margin-bottom: 0;
    width: 100%;
    height: 700px
}

    .alternatives #freeDemoYoutube .container--custom .video-youtube__container iframe {
        width: 85%;
        border-radius: 14px
    }

    .alternatives #freeDemoYoutube .container--custom .video-youtube__container img {
        width: 85%
    }

@media(min-width:768px) and (max-width:991px) {
    .alternatives #freeDemoYoutube .container--custom .video-youtube__container {
        margin: 0 !important;
        height: 400px
    }
}

@media(max-width:767px) {
    .alternatives #freeDemoYoutube .container--custom .video-youtube__container {
        margin: 0 !important;
        height: 250px
    }
}

.alternatives #howToStart {
    text-align: center
}

    .alternatives #howToStart .container--custom {
        width: 100%;
        padding-right: 1rem;
        padding-left: 1rem;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }

@media(max-width:767px) {
    .alternatives #howToStart .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #howToStart .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .alternatives #howToStart .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .alternatives #howToStart .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .alternatives #howToStart .container--custom {
        width: 1440px
    }
}

.alternatives #howToStart .container--custom .features__heading {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    .alternatives #howToStart .container--custom .features__heading {
        align-items: flex-start
    }
}

.alternatives #howToStart .container--custom .features__heading h2 {
    font-size: 36px;
    font-weight: 700;
    margin: 0;
    padding: 0 8rem
}

@media(max-width:767px) {
    .alternatives #howToStart .container--custom .features__heading h2 {
        padding: 0 1rem 0 0;
        font-size: 28px;
        text-align: left
    }
}

.alternatives #howToStart .container--custom .features__boxes {
    display: flex;
    justify-content: space-between;
    margin: 1rem 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #howToStart .container--custom .features__boxes {
        flex-direction: column
    }
}

.alternatives #howToStart .container--custom .features__boxes .features__boxes--single {
    display: flex;
    width: 49%;
    height: 100%;
    padding: 4rem 3rem 2rem;
    overflow: hidden;
    background-color: #f3f3f3;
    border-radius: 20px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    position: relative
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #howToStart .container--custom .features__boxes .features__boxes--single {
        width: 100%
    }

        .alternatives #howToStart .container--custom .features__boxes .features__boxes--single:first-of-type {
            margin-bottom: 2.2rem
        }
}

.alternatives #howToStart .container--custom .features__boxes .features__boxes--single .numberImg p {
    margin-top: -1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffc502;
    width: 65px;
    height: 65px;
    border-radius: 100px;
    color: #fff;
    font-size: 20px;
    font-weight: 700
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #howToStart .container--custom .features__boxes .features__boxes--single .numberImg p {
        margin-top: 0
    }
}

.alternatives #howToStart .container--custom .features__boxes .features__boxes--single .textBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    margin-left: 2rem
}

@media(max-width:767px) {
    .alternatives #howToStart .container--custom .features__boxes .features__boxes--single .textBox {
        margin: 0 1rem
    }
}

.alternatives #howToStart .container--custom .features__boxes .features__boxes--single .textBox h2 {
    font-size: 36px;
    font-weight: 700;
    text-align: left
}

.alternatives #howToStart .container--custom .features__boxes .features__boxes--single .textBox p {
    font-size: 18px;
    font-weight: 400;
    text-align: left
}

@media(max-width:767px) {
    .alternatives #howToStart .container--custom .features__boxes .features__boxes--single {
        margin: 0 0 10px;
        padding: 2rem 0 0 1rem
    }
}

.alternatives #howToStart .features__button {
    width: 100%;
    margin: 2rem 0 0
}

    .alternatives #howToStart .features__button a {
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
    }

.alternatives #howToStart--grid {
    text-align: center
}

    .alternatives #howToStart--grid .container--custom {
        width: 100%;
        padding-right: 1rem;
        padding-left: 1rem;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }

@media(max-width:767px) {
    .alternatives #howToStart--grid .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .alternatives #howToStart--grid .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .alternatives #howToStart--grid .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .alternatives #howToStart--grid .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .alternatives #howToStart--grid .container--custom {
        width: 1440px
    }
}

.alternatives #howToStart--grid .container--custom .features__heading {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    margin-bottom: 5rem
}

@media(max-width:767px) {
    .alternatives #howToStart--grid .container--custom .features__heading {
        align-items: flex-start
    }
}

.alternatives #howToStart--grid .container--custom .features__heading h2 {
    font-size: 36px;
    font-weight: 700;
    margin: 0;
    padding: 0 8rem
}

@media(max-width:767px) {
    .alternatives #howToStart--grid .container--custom .features__heading h2 {
        padding: 0 1rem 0 0;
        font-size: 28px;
        text-align: left
    }
}

.alternatives #howToStart--grid .container--custom .features__boxes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem 2rem;
    grid-template-areas: "paragraph-1 paragraph-2" "paragraph-3 paragraph-2" "paragraph-3 paragraph-4" "paragraph-5 paragraph-4" "paragraph-5 paragraph-6" "paragraph-7 paragraph-6" "paragraph-7 paragraph-8" ". paragraph-8"
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #howToStart--grid .container--custom .features__boxes {
        grid-template-columns: 1fr;
        gap: 2rem;
        grid-template-areas: "paragraph-1" "paragraph-2" "paragraph-3" "paragraph-4" "paragraph-5" "paragraph-6" "paragraph-7" "paragraph-8"
    }
}

.alternatives #howToStart--grid .container--custom .paragraph-1 {
    grid-area: paragraph-1
}

.alternatives #howToStart--grid .container--custom .paragraph-2 {
    grid-area: paragraph-2
}

.alternatives #howToStart--grid .container--custom .paragraph-3 {
    grid-area: paragraph-3
}

.alternatives #howToStart--grid .container--custom .paragraph-4 {
    grid-area: paragraph-4
}

.alternatives #howToStart--grid .container--custom .paragraph-5 {
    grid-area: paragraph-5
}

.alternatives #howToStart--grid .container--custom .paragraph-6 {
    grid-area: paragraph-6
}

.alternatives #howToStart--grid .container--custom .paragraph-7 {
    grid-area: paragraph-7
}

.alternatives #howToStart--grid .container--custom .paragraph-8 {
    grid-area: paragraph-8
}

.alternatives #howToStart--grid .container--custom .features__boxes--single {
    display: flex;
    padding: 4rem 3rem 2rem;
    overflow: hidden;
    background-color: #f3f3f3;
    border-radius: 20px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    position: relative;
    height: 100%
}

    .alternatives #howToStart--grid .container--custom .features__boxes--single .numberImg p {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -1rem;
        background-color: #ffc502;
        width: 65px;
        height: 65px;
        border-radius: 100px;
        color: #fff;
        font-size: 20px;
        font-weight: 700
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .alternatives #howToStart--grid .container--custom .features__boxes--single .numberImg p {
        margin-top: 0
    }
}

.alternatives #howToStart--grid .container--custom .features__boxes--single .textBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    margin-left: 2rem
}

@media(max-width:767px) {
    .alternatives #howToStart--grid .container--custom .features__boxes--single .textBox {
        margin: 0 1rem
    }
}

.alternatives #howToStart--grid .container--custom .features__boxes--single .textBox h2 {
    font-size: 36px;
    font-weight: 700;
    text-align: left
}

.alternatives #howToStart--grid .container--custom .features__boxes--single .textBox p {
    font-size: 18px;
    font-weight: 400;
    text-align: left
}

@media(max-width:767px) {
    .alternatives #howToStart--grid .container--custom .features__boxes--single {
        margin: 0 0 10px;
        padding: 2rem 0 0 1rem
    }
}

.alternatives #howToStart--grid .features__button {
    width: 100%;
    margin: 2rem 0 0
}

    .alternatives #howToStart--grid .features__button a {
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
    }

@media(max-width:767px) {
    .alternatives #benefitScroll {
        margin-top: 1rem !important
    }
}

.alternatives #benefitScroll .benefitScroll__button {
    margin-top: -5rem;
    z-index: 9999
}

.alternatives .form-wrapper {
    margin-bottom: 4rem !important
}

    .alternatives .form-wrapper .button-wrapper {
        width: 850px
    }

@media(min-width:768px) and (max-width:991px) {
    .alternatives .form-wrapper .button-wrapper {
        width: 700px !important
    }
}

@media(max-width:767px) {
    .alternatives .form-wrapper .button-wrapper {
        width: 350px
    }
}

.alternatives .inline-form-tc {
    margin-bottom: 5rem
}

    .alternatives .inline-form-tc .button-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between
    }

        .alternatives .inline-form-tc .button-wrapper .btn-filled {
            margin-right: 3rem;
            box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
        }

#footer {
    margin-top: 6rem;
    font-family: nunito sans,sans-serif !important
}

    #footer .container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

    #footer .footer-top {
        display: grid;
        gap: 2rem;
        grid-template-columns: repeat(5,1fr);
        width: 100%
    }

@media only screen and (max-width:1400px) {
    #footer .footer-top {
        grid-template-columns: repeat(2,1fr);
        text-align: center
    }

        #footer .footer-top div:last-of-type {
            grid-column: 1/-1
        }
}

@media(max-width:767px) {
    #footer .footer-top {
        grid-template-columns: 1fr;
        text-align: center
    }
}

#footer .footer-top h2 {
    font-family: inherit;
    font-weight: 900;
    font-size: 18px;
    margin: 0
}

#footer .footer-top ul {
    padding: 0;
    margin-top: 1.5rem
}

    #footer .footer-top ul li {
        padding: 6px 0;
        list-style: none
    }

        #footer .footer-top ul li .dropDown {
            position: relative;
            width: 100%;
            display: flex;
            align-items: center;
            flex-direction: column
        }

        #footer .footer-top ul li .dropDown-button {
            align-self: flex-start;
            font-size: 16px;
            font-weight: 600;
            color: #6b6b6b
        }

@media only screen and (max-width:1400px) {
    #footer .footer-top ul li .dropDown-button {
        align-self: center
    }
}

#footer .footer-top ul li .dropDown-button:hover {
    color: #f7b801;
    cursor: pointer
}

    #footer .footer-top ul li .dropDown-button:hover + .dropDown-list {
        display: block
    }

#footer .footer-top ul li .dropDown-button::after {
    content: "";
    margin-left: .4rem;
    top: 9px;
    position: absolute;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid #6b6b6b;
    transform: rotate(180deg)
}

#footer .footer-top ul li .dropDown-button:hover::after {
    border-bottom: 6px solid #f7b801
}

#footer .footer-top ul li .dropDown-list {
    z-index: 999;
    position: absolute;
    display: none;
    min-width: 210px;
    width: max-content;
    border: 1px solid #e9e9e9;
    background-color: #fff;
    border-radius: 13px;
    padding: 1rem;
    text-align: left
}

    #footer .footer-top ul li .dropDown-list:hover {
        display: block
    }

    #footer .footer-top ul li .dropDown-list li a {
        font-size: 16px;
        font-weight: 600;
        color: #6b6b6b
    }

        #footer .footer-top ul li .dropDown-list li a:hover {
            color: #f7b801;
            cursor: pointer
        }

#footer .footer-top ul li a {
    position: relative;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    color: #6b6b6b
}

    #footer .footer-top ul li a:hover {
        color: #f7b801
    }

#footer .border-line {
    height: 1px;
    background-color: #e9e9e9;
    margin: 2rem 0;
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

#footer .footer-bottom {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

#footer .footer-bottom__headers {
    display: grid;
    gap: 2rem;
    width: 100%;
    grid-template-columns: repeat(5,1fr)
}

@media only screen and (max-width:1400px) {
    #footer .footer-bottom__headers {
        grid-template-columns: repeat(1,1fr);
        text-align: center
    }
}

#footer .footer-bottom__headers .button-active {
    font-weight: 900;
    color: #000
}

    #footer .footer-bottom__headers .button-active::after {
        transform: rotate(0deg);
        border-bottom: 6px solid #000
    }

#footer .footer-bottom__headers button {
    padding: 0 !important;
    font-family: inherit;
    font-weight: 600;
    font-size: 16px;
    color: #6b6b6b;
    outline: 0;
    border: none;
    background-color: #fff;
    transition: all .05s ease-in-out;
    position: relative
}

    #footer .footer-bottom__headers button::after {
        content: "";
        margin-left: .4rem;
        top: 6px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #6b6b6b;
        transform: rotate(180deg)
    }

#footer .footer-bottom__headers ul {
    padding: 0;
    margin-top: 1.5rem;
    display: grid;
    column-gap: 2rem;
    text-align: left;
    grid-template-columns: repeat(4,1fr)
}

@media only screen and (max-width:1150px) {
    #footer .footer-bottom__headers ul {
        grid-template-columns: repeat(3,1fr);
        column-gap: 1rem;
        text-align: left
    }
}

@media(min-width:768px) and (max-width:991px) {
    #footer .footer-bottom__headers ul {
        grid-template-columns: repeat(2,1fr);
        column-gap: 1rem;
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #footer .footer-bottom__headers ul {
        grid-template-columns: repeat(1,1fr);
        text-align: center
    }
}

#footer .footer-bottom__headers ul li {
    padding: .7rem 0;
    list-style: none
}

    #footer .footer-bottom__headers ul li:last-of-type {
        padding: .7rem 0 0
    }

    #footer .footer-bottom__headers ul li a {
        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        color: #6b6b6b
    }

        #footer .footer-bottom__headers ul li a:hover {
            color: #f7b801
        }

#footer .footer-bottom__content {
    margin-top: 2rem;
    width: 100%
}

    #footer .footer-bottom__content ul {
        position: relative;
        display: grid;
        column-gap: 2rem;
        padding: 0;
        grid-template-columns: repeat(5,1fr)
    }

@media only screen and (max-width:1400px) {
    #footer .footer-bottom__content ul {
        grid-template-columns: repeat(2,1fr);
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #footer .footer-bottom__content ul {
        grid-template-columns: 1fr;
        text-align: center
    }
}

#footer .footer-bottom__content ul li {
    padding: .5rem 0;
    list-style: none;
    height: 60px;
    max-width: 100%
}

    #footer .footer-bottom__content ul li a {
        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        color: #6b6b6b
    }

        #footer .footer-bottom__content ul li a:hover {
            color: #f7b801
        }

#footer .socials {
    margin-top: 3rem
}

    #footer .socials a {
        padding: 1.2rem
    }

#footer .dropdown {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 1rem;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    #footer .dropdown {
        justify-content: center
    }
}

#footer .dropdown button.btn-highlighted {
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
    background: #fff;
    font-weight: 600;
    border: 1px solid #1b1b20;
    color: #1b1b20
}

    #footer .dropdown button.btn-highlighted:hover, #footer .dropdown button.btn-highlighted:focus {
        border: 1px solid #000
    }

#footer .copy .container .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 14px;
    font-weight: 600;
    opacity: .6;
    margin-top: 1.5rem
}

    #footer .copy .container .row p.cookies {
        text-align: center;
        font-size: 11px;
        font-weight: 400;
        opacity: .6
    }

        #footer .copy .container .row p.cookies a {
            font-weight: 700
        }

            #footer .copy .container .row p.cookies a:hover {
                color: #dfa601
            }

#footer-redesign {
    margin-top: 6rem;
    font-family: nunito sans,sans-serif !important
}

    #footer-redesign * {
        font-family: sans-serif,sans-serif
    }

    #footer-redesign .container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

        #footer-redesign .container ul li a {
            font-weight: 400 !important;
            color: #323333
        }

            #footer-redesign .container ul li a:hover {
                color: #ffc502 !important
            }

    #footer-redesign .footer-top {
        display: flex;
        margin-bottom: 4rem;
        justify-content: space-between;
        width: 100%
    }

    #footer-redesign .footer-top__content {
        display: grid;
        grid-template-columns: repeat(5,182px);
        gap: 62px
    }

@media only screen and (max-width:1400px) {
    #footer-redesign .footer-top__content {
        width: 100%;
        gap: 2rem;
        grid-template-columns: repeat(3,1fr)
    }
}

@media(max-width:767px) {
    #footer-redesign .footer-top__content {
        width: 100%;
        gap: 2rem;
        grid-template-columns: repeat(2,1fr)
    }
}

#footer-redesign .footer-top .social-pictograms {
    display: flex;
    gap: 18px;
    justify-content: flex-end;
    height: fit-content
}

@media only screen and (min-width:1400px) and (max-width:1919px) {
    #footer-redesign .footer-top .social-pictograms {
        justify-content: flex-start;
        flex-direction: column
    }
}

@media only screen and (max-width:1400px) {
    #footer-redesign .footer-top .social-pictograms {
        display: grid;
        justify-content: flex-start;
        grid-template-columns: repeat(3,40px);
        gap: 18px;
        height: fit-content
    }
}

#footer-redesign .footer-top h2 {
    font-family: inherit;
    font-weight: 700;
    font-size: 18px;
    color: #222324;
    margin: 0
}

#footer-redesign .footer-top ul {
    padding: 0;
    margin-top: 1.5rem
}

    #footer-redesign .footer-top ul li {
        padding: 6px 0;
        list-style: none
    }

        #footer-redesign .footer-top ul li .dropDown {
            position: relative;
            width: 100%;
            display: flex;
            align-items: center;
            flex-direction: column
        }

        #footer-redesign .footer-top ul li .dropDown-button {
            align-self: flex-start;
            font-size: 16px;
            font-weight: 600;
            color: #323333
        }

            #footer-redesign .footer-top ul li .dropDown-button:hover {
                color: #ffc502;
                cursor: pointer
            }

                #footer-redesign .footer-top ul li .dropDown-button:hover + .dropDown-list {
                    display: block
                }

            #footer-redesign .footer-top ul li .dropDown-button::after {
                content: "";
                top: 9px;
                right: -15px;
                position: absolute;
                width: 0;
                height: 0;
                border-left: 4px solid transparent;
                border-right: 4px solid transparent;
                border-bottom: 6px solid #323333;
                transform: rotate(180deg)
            }

            #footer-redesign .footer-top ul li .dropDown-button:hover::after {
                border-bottom: 6px solid #ffc502
            }

        #footer-redesign .footer-top ul li .dropDown-list {
            z-index: 999;
            position: absolute;
            display: none;
            min-width: 210px;
            width: max-content;
            border: 1px solid #e9e9e9;
            background-color: #fff;
            border-radius: 13px;
            padding: 1rem;
            text-align: left
        }

            #footer-redesign .footer-top ul li .dropDown-list:hover {
                display: block
            }

            #footer-redesign .footer-top ul li .dropDown-list li a {
                font-size: 16px;
                font-weight: 600;
                color: #323333
            }

                #footer-redesign .footer-top ul li .dropDown-list li a:hover {
                    color: #ffc502;
                    cursor: pointer
                }

        #footer-redesign .footer-top ul li a {
            position: relative;
            font-family: inherit;
            font-size: 16px;
            font-weight: 600;
            color: #323333
        }

            #footer-redesign .footer-top ul li a:hover {
                color: #ffc502
            }

#footer-redesign .footer-bottom {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column
}

#footer-redesign .footer-bottom__headers {
    display: grid;
    gap: 62px;
    grid-template-columns: repeat(5,182px)
}

@media only screen and (max-width:1400px) {
    #footer-redesign .footer-bottom__headers {
        gap: 2rem;
        grid-template-columns: repeat(1,1fr)
    }
}

#footer-redesign .footer-bottom__headers .button-active {
    font-weight: 700;
    color: #000
}

    #footer-redesign .footer-bottom__headers .button-active::after {
        transform: rotate(0deg);
        border-bottom: 6px solid #000
    }

#footer-redesign .footer-bottom__headers button {
    text-align: left;
    width: max-content;
    padding: 0 !important;
    font-family: inherit;
    font-weight: 400;
    font-size: 16px;
    color: #323333;
    outline: 0;
    border: none;
    background-color: #fff;
    transition: all .05s ease-in-out;
    position: relative
}

    #footer-redesign .footer-bottom__headers button::after {
        content: "";
        margin-left: .4rem;
        top: 6px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #323333;
        transform: rotate(180deg)
    }

#footer-redesign .footer-bottom__headers ul {
    padding: 0;
    margin-top: 1.5rem;
    display: grid;
    column-gap: 2rem;
    text-align: left;
    grid-template-columns: repeat(4,1fr)
}

@media only screen and (max-width:1150px) {
    #footer-redesign .footer-bottom__headers ul {
        grid-template-columns: repeat(3,1fr);
        column-gap: 1rem;
        text-align: left
    }
}

@media(min-width:768px) and (max-width:991px) {
    #footer-redesign .footer-bottom__headers ul {
        grid-template-columns: repeat(3,1fr);
        column-gap: 1rem
    }
}

@media(max-width:767px) {
    #footer-redesign .footer-bottom__headers ul {
        grid-template-columns: repeat(2,1fr)
    }
}

#footer-redesign .footer-bottom__headers ul li {
    padding: .7rem 0;
    list-style: none
}

    #footer-redesign .footer-bottom__headers ul li:last-of-type {
        padding: .7rem 0 0
    }

    #footer-redesign .footer-bottom__headers ul li a {
        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        color: #323333
    }

        #footer-redesign .footer-bottom__headers ul li a:hover {
            color: #ffc502
        }

#footer-redesign .footer-bottom__content {
    margin-top: 2rem;
    width: 100%
}

    #footer-redesign .footer-bottom__content ul {
        position: relative;
        display: grid;
        column-gap: 62px;
        padding: 0;
        grid-template-columns: repeat(5,182px)
    }

@media only screen and (max-width:1400px) {
    #footer-redesign .footer-bottom__content ul {
        grid-template-columns: repeat(2,1fr);
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #footer-redesign .footer-bottom__content ul {
        grid-template-columns: 1fr;
        text-align: center
    }
}

#footer-redesign .footer-bottom__content ul li {
    padding: .5rem 0;
    list-style: none;
    height: 60px;
    max-width: 100%
}

    #footer-redesign .footer-bottom__content ul li a {
        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        color: #323333
    }

        #footer-redesign .footer-bottom__content ul li a:hover {
            color: #ffc502
        }

#footer-redesign .dropdown {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 1rem;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    #footer-redesign .dropdown {
        justify-content: center
    }
}

#footer-redesign .dropdown button.btn-highlighted {
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
    background: #fff;
    font-weight: 600;
    border: 1px solid #1b1b20;
    color: #1b1b20
}

    #footer-redesign .dropdown button.btn-highlighted:hover, #footer-redesign .dropdown button.btn-highlighted:focus {
        border: 1px solid #000
    }

#footer-redesign .copy .container .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 14px;
    font-weight: 600;
    opacity: .6;
    margin-top: 1.5rem
}

    #footer-redesign .copy .container .row p.cookies {
        text-align: center;
        font-size: 11px;
        font-weight: 400;
        opacity: .6
    }

        #footer-redesign .copy .container .row p.cookies a {
            font-weight: 700
        }

            #footer-redesign .copy .container .row p.cookies a:hover {
                color: #dfa601
            }

#footer-planner .container {
    margin-top: 3rem;
    font-family: nunito sans,sans-serif !important;
    display: flex;
    justify-content: center;
    flex-direction: column
}

    #footer-planner .container .footer-top {
        border-top: 1px solid #323333;
        padding-top: 44px;
        display: grid;
        gap: 2rem;
        grid-template-columns: repeat(6,1fr)
    }

@media(min-width:768px) and (max-width:991px) {
    #footer-planner .container .footer-top {
        grid-template-columns: repeat(3,1fr);
        text-align: left
    }

        #footer-planner .container .footer-top div:last-of-type {
            grid-column: auto
        }
}

@media(max-width:767px) {
    #footer-planner .container .footer-top {
        grid-template-columns: repeat(2,1fr);
        text-align: left
    }
}

#footer-planner .container .footer-top h2 {
    font-family: inherit;
    font-weight: 900;
    font-size: 18px;
    margin: 0;
    color: #d1d0d1
}

#footer-planner .container .footer-top ul {
    padding: 0;
    margin-top: 1.5rem
}

    #footer-planner .container .footer-top ul li {
        padding: 6px 0;
        list-style: none
    }

        #footer-planner .container .footer-top ul li .dropDown {
            position: relative;
            width: 100%;
            display: flex;
            align-items: center;
            flex-direction: column
        }

        #footer-planner .container .footer-top ul li .dropDown-button {
            align-self: flex-start;
            font-size: 16px;
            font-weight: 600;
            color: #6b6b6b
        }

@media only screen and (max-width:1400px) {
    #footer-planner .container .footer-top ul li .dropDown-button {
        align-self: center
    }
}

#footer-planner .container .footer-top ul li .dropDown-button:hover {
    color: #fff;
    cursor: pointer
}

    #footer-planner .container .footer-top ul li .dropDown-button:hover + .dropDown-list {
        display: block
    }

#footer-planner .container .footer-top ul li .dropDown-button::after {
    content: "";
    margin-left: .4rem;
    top: 9px;
    position: absolute;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid #6b6b6b;
    transform: rotate(180deg)
}

#footer-planner .container .footer-top ul li .dropDown-button:hover::after {
    border-bottom: 6px solid #f7b801
}

#footer-planner .container .footer-top ul li .dropDown-list {
    z-index: 999;
    position: absolute;
    display: none;
    width: 210px;
    border: 1px solid #e9e9e9;
    background-color: #fff;
    border-radius: 13px;
    padding: 1rem;
    text-align: left
}

    #footer-planner .container .footer-top ul li .dropDown-list:hover {
        display: block
    }

    #footer-planner .container .footer-top ul li .dropDown-list li a {
        font-size: 16px;
        font-weight: 600;
        color: #6b6b6b
    }

        #footer-planner .container .footer-top ul li .dropDown-list li a:hover {
            color: #fff;
            cursor: pointer
        }

#footer-planner .container .footer-top ul li a {
    position: relative;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    color: #6b6b6b
}

    #footer-planner .container .footer-top ul li a:hover {
        color: #fff
    }

#footer-planner .container .border-line {
    width: 100%;
    padding-right: 6rem;
    padding-left: 6rem;
    margin-left: auto;
    margin-right: auto;
    height: 1px;
    background-color: #e9e9e9;
    margin: 2rem 0;
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

@media(max-width:767px) {
    #footer-planner .container .border-line {
        padding: 0 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #footer-planner .container .border-line {
        width: 767px;
        padding: 0 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    #footer-planner .container .border-line {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    #footer-planner .container .border-line {
        width: 1400px
    }
}

@media(min-width:1920px) {
    #footer-planner .container .border-line {
        width: 1440px
    }
}

#footer-planner .container .footer-bottom {
    width: 100%;
    margin-top: 3rem;
    display: flex;
    justify-content: center;
    flex-direction: column
}

#footer-planner .container .footer-bottom__headers {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(6,1fr)
}

@media(min-width:768px) and (max-width:991px) {
    #footer-planner .container .footer-bottom__headers {
        grid-template-columns: repeat(3,1fr);
        text-align: left
    }
}

@media(max-width:767px) {
    #footer-planner .container .footer-bottom__headers {
        grid-template-columns: repeat(2,1fr);
        text-align: left
    }
}

#footer-planner .container .footer-bottom__headers .button-active {
    font-weight: 900;
    color: #fff
}

    #footer-planner .container .footer-bottom__headers .button-active::after {
        transform: rotate(0deg);
        border-bottom: 6px solid #fff
    }

#footer-planner .container .footer-bottom__headers button {
    padding: 0 !important;
    font-family: inherit;
    font-weight: 600;
    font-size: 16px;
    color: #6b6b6b;
    outline: 0;
    border: none;
    background-color: transparent;
    transition: all .05s ease-in-out;
    position: relative
}

    #footer-planner .container .footer-bottom__headers button::after {
        content: "";
        margin-left: .4rem;
        top: 6px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #6b6b6b;
        transform: rotate(180deg)
    }

#footer-planner .container .footer-bottom__headers ul {
    padding: 0;
    margin-top: 1.5rem;
    display: grid;
    column-gap: 2rem;
    text-align: left;
    grid-template-columns: repeat(6,1fr)
}

@media(min-width:768px) and (max-width:991px) {
    #footer-planner .container .footer-bottom__headers ul {
        grid-template-columns: repeat(1,1fr);
        column-gap: 1rem;
        text-align: left
    }
}

@media(max-width:767px) {
    #footer-planner .container .footer-bottom__headers ul {
        grid-template-columns: repeat(1,1fr);
        column-gap: 1rem;
        text-align: left
    }
}

#footer-planner .container .footer-bottom__headers ul li {
    padding: .7rem 0;
    list-style: none
}

    #footer-planner .container .footer-bottom__headers ul li:last-of-type {
        padding: .7rem 0 0
    }

    #footer-planner .container .footer-bottom__headers ul li a {
        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        color: #6b6b6b
    }

        #footer-planner .container .footer-bottom__headers ul li a:hover {
            color: #fff
        }

#footer-planner .container .footer-bottom__content {
    margin-top: 2rem
}

    #footer-planner .container .footer-bottom__content ul {
        position: relative;
        display: grid;
        column-gap: 2rem;
        padding: 0;
        grid-template-columns: repeat(6,1fr)
    }

@media(min-width:768px) and (max-width:991px) {
    #footer-planner .container .footer-bottom__content ul {
        grid-template-columns: repeat(1,1fr);
        text-align: left
    }
}

@media(max-width:767px) {
    #footer-planner .container .footer-bottom__content ul {
        grid-template-columns: repeat(1,1fr);
        text-align: left
    }
}

#footer-planner .container .footer-bottom__content ul li {
    padding: .5rem 0;
    list-style: none;
    min-height: 50px;
    max-width: 100%
}

    #footer-planner .container .footer-bottom__content ul li a {
        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        color: #6b6b6b
    }

        #footer-planner .container .footer-bottom__content ul li a:hover {
            color: #fff
        }

#footer-planner .container .socials a {
    padding: 1.2rem
}

#footer-planner .container .dropdown {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 1rem;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    #footer-planner .container .dropdown {
        padding: 0 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #footer-planner .container .dropdown {
        width: 767px;
        padding: 0 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    #footer-planner .container .dropdown {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    #footer-planner .container .dropdown {
        width: 1400px
    }
}

@media(min-width:1920px) {
    #footer-planner .container .dropdown {
        width: 1440px
    }
}

@media(max-width:767px) {
    #footer-planner .container .dropdown {
        justify-content: center
    }
}

#footer-planner .container .dropdown button.btn-highlighted {
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
    background: #fff;
    font-weight: 600;
    border: 1px solid #1b1b20;
    color: #1b1b20
}

    #footer-planner .container .dropdown button.btn-highlighted:hover, #footer-planner .container .dropdown button.btn-highlighted:focus {
        border: 1px solid #000
    }

#footer-planner .container .copy .container .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 14px;
    font-weight: 600;
    opacity: .6;
    margin-top: 1.5rem;
    color: #fff
}

    #footer-planner .container .copy .container .row p.cookies {
        text-align: center;
        font-size: 11px;
        font-weight: 400;
        opacity: .6
    }

        #footer-planner .container .copy .container .row p.cookies a {
            font-weight: 700;
            color: #fff
        }

            #footer-planner .container .copy .container .row p.cookies a:hover {
                color: #dfa601
            }

#trapezoid {
    padding-top: 2rem;
    margin-left: auto;
    position: relative;
    z-index: 1000;
    opacity: .95
}

@media(max-width:767px) {
    #trapezoid {
        padding-top: 0
    }
}

@media(max-width:767px) {
    #trapezoid {
        margin-top: 0;
        padding-top: 0
    }
}

#trapezoid .row {
    margin-top: 0;
    text-align: left;
    margin-bottom: 3rem;
    justify-content: flex-end
}

#trapezoid .row__planner {
    justify-content: center !important
}

@media(max-width:767px) {
    #trapezoid .row {
        justify-content: center
    }
}

#trapezoid .row .fixed-centered {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

#trapezoid .row .center-items {
    display: flex;
    align-items: center;
    flex-direction: column
}

#trapezoid .row .col-lg-2, #trapezoid .row .col-lg-12 {
    padding-top: 40px
}

@media(max-width:767px) {
    #trapezoid .row .col-lg-2, #trapezoid .row .col-lg-12 {
        width: 100%;
        max-width: 100%;
        flex: unset;
        margin: auto
    }

        #trapezoid .row .col-lg-2 .btn, #trapezoid .row .col-lg-12 .btn {
            min-width: 0
        }
}

@media(max-width:991px) {
    #trapezoid .row .col-lg-2, #trapezoid .row .col-lg-12 {
        text-align: center
    }
}

#trapezoid .row .centered {
    text-align: center
}

    #trapezoid .row .centered .socials {
        margin-top: 3rem
    }

        #trapezoid .row .centered .socials a {
            padding: 1rem
        }

    #trapezoid .row .centered .cr {
        font-size: 14px;
        font-weight: 600;
        opacity: .6;
        margin-top: 1.5rem
    }

        #trapezoid .row .centered .cr p.cookies {
            font-size: 11px;
            font-weight: 400;
            opacity: .6
        }

            #trapezoid .row .centered .cr p.cookies a {
                font-weight: 700
            }

                #trapezoid .row .centered .cr p.cookies a:hover {
                    color: #dfa601
                }

@media(max-width:767px) {
    #trapezoid .row .centered .cr {
        padding: 10px 15px;
        font-size: 12px;
        text-align: center;
        width: 100%
    }
}

@media(min-width:1000px) {
    #trapezoid .row .centered .cr br {
        display: none
    }
}

#trapezoid .row p {
    font-weight: 800;
    font-size: 18px;
    margin-bottom: 0;
    color: #1b1b20
}

@media(max-width:767px) {
    #trapezoid .row p {
        margin-top: 15px;
        font-size: 18px
    }
}

#trapezoid .row ul {
    list-style: none;
    padding-left: 0;
    margin-top: 30px;
    font-size: 15px;
    font-weight: 600;
    opacity: .6
}

@media(max-width:767px) {
    #trapezoid .row ul {
        margin-top: 15px;
        font-size: 14px
    }
}

#trapezoid .row ul li {
    margin-top: 12px
}

    #trapezoid .row ul li:first-child {
        margin-top: 0
    }

    #trapezoid .row ul li a {
        font-size: 15px;
        font-weight: 600
    }

        #trapezoid .row ul li a:focus, #trapezoid .row ul li a:hover {
            color: #f7b801;
            text-decoration: none
        }

#trapezoid .flex-row {
    padding: 1.5rem 0;
    justify-content: flex-end
}

@media(max-width:767px) {
    #trapezoid .flex-row {
        justify-content: center
    }
}

@media(min-width:768px) and (max-width:1000px) {
    #trapezoid .flex-row {
        align-items: unset
    }
}

@media(max-width:767px) {
    #trapezoid .flex-row {
        padding: 25px 0
    }
}

#trapezoid div.dropdown button.btn-highlighted {
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
    background: #fff;
    font-weight: 600;
    border: 1px solid #1b1b20;
    color: #1b1b20
}

    #trapezoid div.dropdown button.btn-highlighted:hover, #trapezoid div.dropdown button.btn-highlighted:focus {
        border: 1px solid #000
    }

.signup-box {
    margin-top: 100px
}

    .signup-box input {
        min-width: 250px;
        border-color: #fff
    }

    .signup-box button {
        padding-left: 40px;
        padding-right: 40px
    }

    .signup-box .signup-additional-info {
        margin-top: 7px
    }

        .signup-box .signup-additional-info a {
            color: rgba(255,255,255,.7)
        }

div.extra_bar {
    position: relative;
    z-index: 123123;
    text-align: center;
    padding: 1em;
    background-color: #ffc502;
    color: #fff
}

    div.extra_bar a {
        color: #fff;
        text-decoration: underline;
        font-weight: 700
    }

#mainNav {
    background-color: #fff;
    padding: 1.25rem 1rem;
    box-shadow: -1px 4px 10px 0 rgba(0,0,0,.1);
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    transition: all .2s
}

@media(min-width:991px) and (max-width:1200px) {
    #mainNav .container {
        max-width: 1140px
    }
}

#mainNav .navbar-brand img {
    max-width: 140px
}

#mainNav .navbar-toggler-right {
    border: none
}

    #mainNav .navbar-toggler-right:focus {
        outline: none
    }

#mainNav .navbar-collapse {
    text-align: center
}

#mainNav .navbar-nav {
    align-items: center
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #mainNav .navbar-nav {
        align-items: flex-start
    }
}

#mainNav .navbar-nav > li.nav-item > a.nav-link, #mainNav .navbar-nav > li.nav-item > a.nav-link:focus {
    font-size: 16px;
    font-weight: 600;
    color: #1b1b20
}

@media(max-width:767px) {
    #mainNav .navbar-nav > li.nav-item > a.nav-link, #mainNav .navbar-nav > li.nav-item > a.nav-link:focus {
        border-bottom: none
    }
}

#mainNav .navbar-nav > li.nav-item a.nav-link:hover {
    color: #1da44c
}

#mainNav .navbar-nav > li.nav-item a.nav-link-planner:hover {
    color: #2d80eb !important
}

#mainNav .navbar-nav > li.nav-item a.nav-link-planner:after {
    margin-left: .6rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #mainNav .navbar-nav > li.nav-item {
        width: 100%;
        text-align: left
    }
}

#mainNav .navbar-nav .dropdown-hover {
    position: relative
}

@media(min-width:768px) and (max-width:991px) {
    #mainNav .navbar-nav .dropdown-hover {
        width: fit-content !important
    }
}

#mainNav .navbar-nav .dropdown-hover .btn:focus {
    box-shadow: none
}

#mainNav .navbar-nav .dropdown-hover .dropdown-menu {
    left: 0;
    top: 2rem !important;
    border-radius: 8px;
    border: none;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    padding: 0 !important;
    width: 250px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #mainNav .navbar-nav .dropdown-hover .dropdown-toggle {
        text-align: left;
        margin: 10px 0 !important;
        padding: 0 !important
    }
}

#mainNav .navbar-nav .dropdown-hover .dropdown-box {
    display: flex;
    align-items: center;
    max-height: 40px;
    padding: .25rem 2rem .25rem .3rem
}

    #mainNav .navbar-nav .dropdown-hover .dropdown-box img {
        width: 50px;
        height: 50px
    }

    #mainNav .navbar-nav .dropdown-hover .dropdown-box:hover {
        background-color: #ffc502;
        border-radius: 8px
    }

        #mainNav .navbar-nav .dropdown-hover .dropdown-box:hover span {
            color: #fff
        }

#mainNav .navbar-nav .dropdown-hover img {
    padding: 1rem
}

#mainNav .navbar-nav .dropdown-hover .dropdown-toggle {
    background-color: transparent !important;
    border: none !important;
    cursor: pointer
}

    #mainNav .navbar-nav .dropdown-hover .dropdown-toggle::after {
        margin-left: 15px !important;
        vertical-align: inherit !important
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #mainNav .navbar-nav .dropdown-hover #isLoggedHeader {
        width: 100%
    }
}

#mainNav .navbar-nav .dropdown-planner-hover:hover .dropdown-menu-planner {
    display: flex !important
}

#mainNav .navbar-nav .dropdown-menu-planner {
    display: none;
    position: absolute;
    background: #fff;
    padding: 0;
    border-radius: 10px;
    box-shadow: -1px 4px 10px 0 rgba(0,0,0,.1);
    max-width: 430px;
    flex-wrap: wrap
}

@media(max-width:767px) {
    #mainNav .navbar-nav .dropdown-menu-planner {
        max-width: 200px
    }
}

#mainNav .navbar-nav .dropdown-menu-planner li {
    width: 50%;
    list-style: none;
    text-align: left
}

@media(max-width:767px) {
    #mainNav .navbar-nav .dropdown-menu-planner li {
        width: 100%
    }
}

#mainNav .navbar-nav .dropdown-menu-planner .dropdown-box-planner {
    display: flex;
    align-items: center;
    max-height: 80px !important;
    padding: .7rem 2rem .7rem 1.5rem !important
}

    #mainNav .navbar-nav .dropdown-menu-planner .dropdown-box-planner:hover {
        background-color: #eaf2fd;
        border-radius: 8px
    }

        #mainNav .navbar-nav .dropdown-menu-planner .dropdown-box-planner:hover span {
            color: #fff
        }

@media(min-width:992px) {
    #mainNav.navbar-shrink {
        background-color: #fff
    }

        #mainNav.navbar-shrink .navbar-brand:focus, #mainNav.navbar-shrink .navbar-brand:hover {
            color: #000
        }
}

#mainNav .menu-1 {
    margin-left: unset;
    margin: auto
}

@media(max-width:767px) {
    #mainNav .menu-1 {
        margin-top: 10%
    }
}

#mainNav .menu-2 {
    margin-left: unset !important
}

@media(max-width:767px) {
    #mainNav .menu-2 {
        flex-direction: column;
        margin-top: 0;
        align-items: flex-start
    }
}

#mainNav .menu-2 .booking-border-menu {
    border-right: 1px solid #ffc502;
    margin: 6px 0
}

#mainNav .menu-2 .booking-border-menu-planner {
    border-right: 1px solid #e3e3e3
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #mainNav .menu-2 .booking-border-menu {
        border: none;
        margin: 0
    }
}

#mainNav .menu-2 .booking-border-menu a {
    padding-right: 20px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #mainNav .menu-2 .booking-border-menu a {
        padding: 0
    }
}

#mainNav .menu-2 li.nav-item {
    margin-left: 10px;
    display: flex;
    align-items: center
}

    #mainNav .menu-2 li.nav-item .selective {
        background-color: #f7b801
    }

        #mainNav .menu-2 li.nav-item .selective:hover {
            background-color: #dfa601
        }

    #mainNav .menu-2 li.nav-item a.nav-link {
        border-radius: 26px
    }

@media(max-width:767px) {
    #mainNav .menu-2 li.nav-item a.nav-link {
        margin-right: 30px;
        text-align: left
    }
}

@media(min-width:768px) and (max-width:991px) {
    #mainNav .menu-2 li.nav-item a.nav-link {
        text-align: left
    }
}

#mainNav .menu-2 li.nav-item a.nav-link:focus, #mainNav .menu-2 li.nav-item a.nav-link:active {
    text-decoration: none;
    color: inherit
}

#mainNav .menu-2 li.nav-item a.nav-link.btn-menu-register {
    padding: 15px 40px;
    color: #fff;
    font-weight: 700
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #mainNav .menu-2 li.nav-item a.nav-link.btn-menu-register {
        text-align: center;
        width: 100%
    }
}

#mainNav .menu-2 li.nav-item a.nav-link.btn-menu-login {
    padding: 10px;
    border: none
}

    #mainNav .menu-2 li.nav-item a.nav-link.btn-menu-login:hover {
        border: none
    }

@media(max-width:991px) {
    #mainNav .menu-2 li.nav-item a.nav-link.btn-menu-login {
        padding: .5rem 0 !important;
        border: unset
    }
}

@media(min-width:991px) and (max-width:1200px) {
    #mainNav .menu-2 li.nav-item a.nav-link.btn-menu-login {
        padding: 2px 8px !important
    }
}

#mainNav .navbar-nav li.nav-item {
    margin-left: .7rem
}

    #mainNav .navbar-nav li.nav-item.is_logged {
        display: none
    }

    #mainNav .navbar-nav li.nav-item .no-border {
        border: 1px solid transparent
    }

    #mainNav .navbar-nav li.nav-item .btn-outline-success {
        padding-left: 30px;
        padding-right: 30px
    }

nav + .container {
    margin-top: 60px
}

#footer-planner-transparent .container {
    margin-top: 3rem;
    font-family: nunito sans,sans-serif !important;
    display: flex;
    justify-content: center;
    flex-direction: column
}

    #footer-planner-transparent .container .footer-top {
        border-top: 1px solid #323333;
        padding-top: 44px;
        display: grid;
        gap: 2rem;
        grid-template-columns: repeat(6,1fr)
    }

@media(min-width:768px) and (max-width:991px) {
    #footer-planner-transparent .container .footer-top {
        grid-template-columns: repeat(3,1fr);
        text-align: left
    }

        #footer-planner-transparent .container .footer-top div:last-of-type {
            grid-column: auto
        }
}

@media(max-width:767px) {
    #footer-planner-transparent .container .footer-top {
        grid-template-columns: repeat(2,1fr);
        text-align: left
    }
}

#footer-planner-transparent .container .footer-top h2 {
    font-family: inherit;
    font-weight: 900;
    font-size: 18px;
    margin: 0;
    color: #f3f3f3
}

#footer-planner-transparent .container .footer-top ul {
    padding: 0;
    margin-top: 1.5rem
}

    #footer-planner-transparent .container .footer-top ul li {
        padding: 6px 0;
        list-style: none
    }

        #footer-planner-transparent .container .footer-top ul li .dropDown {
            position: relative;
            width: 100%;
            display: flex;
            align-items: center;
            flex-direction: column
        }

        #footer-planner-transparent .container .footer-top ul li .dropDown-button {
            align-self: flex-start;
            font-size: 16px;
            font-weight: 600;
            color: #a3a3a3
        }

@media only screen and (max-width:1400px) {
    #footer-planner-transparent .container .footer-top ul li .dropDown-button {
        align-self: center
    }
}

#footer-planner-transparent .container .footer-top ul li .dropDown-button:hover {
    color: #fff;
    cursor: pointer
}

    #footer-planner-transparent .container .footer-top ul li .dropDown-button:hover + .dropDown-list {
        display: block
    }

#footer-planner-transparent .container .footer-top ul li .dropDown-button::after {
    content: "";
    margin-left: .4rem;
    top: 9px;
    position: absolute;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid #a3a3a3;
    transform: rotate(180deg)
}

#footer-planner-transparent .container .footer-top ul li .dropDown-button:hover::after {
    border-bottom: 6px solid #f7b801
}

#footer-planner-transparent .container .footer-top ul li .dropDown-list {
    z-index: 999;
    position: absolute;
    display: none;
    width: 210px;
    border: 1px solid #e9e9e9;
    background-color: #fff;
    border-radius: 13px;
    padding: 1rem;
    text-align: left
}

    #footer-planner-transparent .container .footer-top ul li .dropDown-list:hover {
        display: block
    }

    #footer-planner-transparent .container .footer-top ul li .dropDown-list li a {
        font-size: 16px;
        font-weight: 600;
        color: #a3a3a3
    }

        #footer-planner-transparent .container .footer-top ul li .dropDown-list li a:hover {
            color: #fff;
            cursor: pointer
        }

#footer-planner-transparent .container .footer-top ul li a {
    position: relative;
    font-family: inherit;
    font-size: 16px;
    font-weight: 600;
    color: #a3a3a3
}

    #footer-planner-transparent .container .footer-top ul li a:hover {
        color: #fff
    }

#footer-planner-transparent .container .border-line {
    width: 100%;
    padding-right: 6rem;
    padding-left: 6rem;
    margin-left: auto;
    margin-right: auto;
    height: 1px;
    background-color: #e9e9e9;
    margin: 2rem 0;
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

@media(max-width:767px) {
    #footer-planner-transparent .container .border-line {
        padding: 0 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #footer-planner-transparent .container .border-line {
        width: 767px;
        padding: 0 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    #footer-planner-transparent .container .border-line {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    #footer-planner-transparent .container .border-line {
        width: 1400px
    }
}

@media(min-width:1920px) {
    #footer-planner-transparent .container .border-line {
        width: 1440px
    }
}

#footer-planner-transparent .container .footer-bottom {
    width: 100%;
    margin-top: 3rem;
    display: flex;
    justify-content: center;
    flex-direction: column
}

#footer-planner-transparent .container .footer-bottom__headers {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(6,1fr)
}

@media(min-width:768px) and (max-width:991px) {
    #footer-planner-transparent .container .footer-bottom__headers {
        grid-template-columns: repeat(3,1fr);
        text-align: left
    }
}

@media(max-width:767px) {
    #footer-planner-transparent .container .footer-bottom__headers {
        grid-template-columns: repeat(2,1fr);
        text-align: left
    }
}

#footer-planner-transparent .container .footer-bottom__headers .button-active {
    font-weight: 900;
    color: #fff
}

    #footer-planner-transparent .container .footer-bottom__headers .button-active::after {
        transform: rotate(0deg);
        border-bottom: 6px solid #fff
    }

#footer-planner-transparent .container .footer-bottom__headers button {
    padding: 0 !important;
    font-family: inherit;
    font-weight: 600;
    font-size: 16px;
    color: #a3a3a3;
    outline: 0;
    border: none;
    background-color: transparent;
    transition: all .05s ease-in-out;
    position: relative
}

    #footer-planner-transparent .container .footer-bottom__headers button::after {
        content: "";
        margin-left: .4rem;
        top: 6px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #a3a3a3;
        transform: rotate(180deg)
    }

#footer-planner-transparent .container .footer-bottom__headers ul {
    padding: 0;
    margin-top: 1.5rem;
    display: grid;
    column-gap: 2rem;
    text-align: left;
    grid-template-columns: repeat(6,1fr)
}

@media(min-width:768px) and (max-width:991px) {
    #footer-planner-transparent .container .footer-bottom__headers ul {
        grid-template-columns: repeat(1,1fr);
        column-gap: 1rem;
        text-align: left
    }
}

@media(max-width:767px) {
    #footer-planner-transparent .container .footer-bottom__headers ul {
        grid-template-columns: repeat(1,1fr);
        column-gap: 1rem;
        text-align: left
    }
}

#footer-planner-transparent .container .footer-bottom__headers ul li {
    padding: .7rem 0;
    list-style: none
}

    #footer-planner-transparent .container .footer-bottom__headers ul li:last-of-type {
        padding: .7rem 0 0
    }

    #footer-planner-transparent .container .footer-bottom__headers ul li a {
        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        color: #a3a3a3
    }

        #footer-planner-transparent .container .footer-bottom__headers ul li a:hover {
            color: #fff
        }

#footer-planner-transparent .container .footer-bottom__content {
    margin-top: 2rem
}

    #footer-planner-transparent .container .footer-bottom__content ul {
        position: relative;
        display: grid;
        column-gap: 2rem;
        padding: 0;
        grid-template-columns: repeat(6,1fr)
    }

@media(min-width:768px) and (max-width:991px) {
    #footer-planner-transparent .container .footer-bottom__content ul {
        grid-template-columns: repeat(1,1fr);
        text-align: left
    }
}

@media(max-width:767px) {
    #footer-planner-transparent .container .footer-bottom__content ul {
        grid-template-columns: repeat(1,1fr);
        text-align: left
    }
}

#footer-planner-transparent .container .footer-bottom__content ul li {
    padding: .5rem 0;
    list-style: none;
    min-height: 50px;
    max-width: 100%
}

    #footer-planner-transparent .container .footer-bottom__content ul li a {
        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        color: #a3a3a3
    }

        #footer-planner-transparent .container .footer-bottom__content ul li a:hover {
            color: #fff
        }

#footer-planner-transparent .container .socials a {
    padding: 1.2rem
}

#footer-planner-transparent .container .dropdown {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 1rem;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    #footer-planner-transparent .container .dropdown {
        padding: 0 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #footer-planner-transparent .container .dropdown {
        width: 767px;
        padding: 0 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    #footer-planner-transparent .container .dropdown {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    #footer-planner-transparent .container .dropdown {
        width: 1400px
    }
}

@media(min-width:1920px) {
    #footer-planner-transparent .container .dropdown {
        width: 1440px
    }
}

@media(max-width:767px) {
    #footer-planner-transparent .container .dropdown {
        justify-content: center
    }
}

#footer-planner-transparent .container .dropdown button.btn-highlighted {
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
    background: #fff;
    font-weight: 600;
    border: 1px solid #1b1b20;
    color: #1b1b20
}

    #footer-planner-transparent .container .dropdown button.btn-highlighted:hover, #footer-planner-transparent .container .dropdown button.btn-highlighted:focus {
        border: 1px solid #000
    }

#footer-planner-transparent .container .copy .container .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 14px;
    font-weight: 600;
    opacity: .6;
    margin-top: 1.5rem;
    color: #fff
}

    #footer-planner-transparent .container .copy .container .row p.cookies {
        text-align: center;
        font-size: 11px;
        font-weight: 400;
        opacity: .6
    }

        #footer-planner-transparent .container .copy .container .row p.cookies a {
            font-weight: 700;
            color: #fff
        }

            #footer-planner-transparent .container .copy .container .row p.cookies a:hover {
                color: #dfa601
            }

.pricing section#top {
    background-color: #f3f3f3;
    padding: 6rem 0 4rem
}

    .pricing section#top .container .row .col-sm-12 {
        text-align: center
    }

        .pricing section#top .container .row .col-sm-12 h1 {
            font-size: 36px;
            font-weight: 800;
            margin: 0 auto 3.5rem;
            width: 82%
        }

        .pricing section#top .container .row .col-sm-12 p {
            font-size: 20px;
            font-weight: 400;
            width: 77%;
            margin: 0 auto
        }

.pricing section#social-proof {
    padding-bottom: 5.5rem
}

.pricing section#big_cta {
    padding-bottom: 7rem
}

    .pricing section#big_cta .container .row .col-sm-12 p {
        margin-bottom: 0
    }

    .pricing section#big_cta .container .row .col-sm-12 .btn-filled {
        margin-top: 1rem
    }

.pricing section#customer-story {
    padding-top: 4.5rem;
    background-color: #fafffd
}

    .pricing section#customer-story .container {
        position: relative
    }

        .pricing section#customer-story .container .row {
            justify-content: space-evenly
        }

            .pricing section#customer-story .container .row .col-sm-12 h2 {
                font-size: 41px;
                font-weight: 800;
                text-align: center;
                margin-bottom: 6rem
            }

            .pricing section#customer-story .container .row .story {
                border-radius: 10px;
                box-shadow: 20px 20px 40px 0 rgba(0,0,0,.1);
                background-color: #fff;
                padding: 0 2rem
            }

@media(max-width:991px) {
    .pricing section#customer-story .container .row .story {
        display: flex;
        flex-direction: column;
        margin-bottom: 2rem
    }
}

.pricing section#customer-story .container .row .story h2 {
    font-size: 20px;
    font-weight: 800;
    font-family: nunito sans,sans-serif;
    margin: 4rem auto 1.5rem
}

.pricing section#customer-story .container .row .story p {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 3rem
}

.pricing section#customer-story .container .row .story .wrapper {
    margin-bottom: 3.5rem;
    justify-content: right;
    display: flex
}

    .pricing section#customer-story .container .row .story .wrapper img {
        border-radius: 50%;
        margin-right: 1.5rem
    }

    .pricing section#customer-story .container .row .story .wrapper .text p {
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 0
    }

        .pricing section#customer-story .container .row .story .wrapper .text p span {
            font-weight: 700
        }

.pricing section#sign-up-cta {
    margin-top: 5rem
}

.pricing section#prizes {
    margin-bottom: 5rem
}

@media(max-width:767px) {
    .pricing section#prizes {
        margin-bottom: 0
    }
}

.pricing section#prizes .container .row .right .text p.blue {
    margin-top: 3rem;
    color: #3c91e6
}

.pricing section#values {
    margin: 0 auto;
    padding: 7rem 0 0;
    margin: 0 auto 7rem
}

    .pricing section#values .row {
        width: 80%;
        margin: 0 auto
    }

        .pricing section#values .row .col-lg-6 h2.header, .pricing section#values .row .col-lg-12 h2.header {
            text-align: center;
            margin: 0 auto 6rem
        }

.tc-td {
    border-left: 4px solid #868e96;
    border-right: 4px solid #868e96
}

.tc-td-top {
    border-top: 4px solid #868e96 !important;
    border-radius-topleft: 5px;
    border-radius-topright: 5px;
    color: #00bf71
}

.tc-td-bottom {
    border-bottom: 4px solid #868e96 !important;
    border-radius-bottomleft: 5px;
    border-radius-bottomright: 5px;
    border-radius: 10px
}

.compare table th {
    border-top: 0
}

.compare table tr:last-child {
    background: 0 0
}

    .compare table tr:last-child:hover {
        background: 0 0
    }

.compare table .compare-icon {
    color: #00bf71;
    background: rgba(255,255,255,.5);
    border-radius: 5px
}

.compare table .text-left {
    font-weight: 500
}

.grayscale {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    filter: grayscale(100%);
    transition: all 300ms ease-in-out
}

    .grayscale:hover {
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        filter: grayscale(0)
    }

.compare-logos {
    margin-bottom: 40px
}

    .compare-logos img {
        max-width: 150px;
        display: inline-block;
        margin-right: 15px
    }

.contact section#top {
    background-color: #fff
}

    .contact section#top .container .row .text {
        justify-content: center;
        display: flex;
        flex-direction: column
    }

        .contact section#top .container .row .text h1 {
            font-size: 48px;
            font-weight: 800;
            margin-bottom: 0
        }

        .contact section#top .container .row .text p {
            font-size: 18px;
            font-weight: 400;
            margin-top: 1rem
        }

    .contact section#top .container .row .ue-hero-main img {
        width: 100%
    }

.contact section#social-proof {
    background-color: #fff
}

    .contact section#social-proof .container .row {
        margin-top: 0;
        padding-top: 5rem
    }

.contact section#big_cta .container .row .col-sm-12 p {
    width: 70%;
    margin: 0 auto 2rem
}

.support {
    background-color: unset
}

    .support section#top {
        background: linear-gradient(90deg,#fff 63%,#1b1b20 50%)
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .support section#top {
        background: #fff
    }
}

.support section#top .container .row .text {
    display: flex;
    justify-content: center;
    flex-direction: column
}

    .support section#top .container .row .text h1 {
        font-size: 42px
    }

.support section#social-proof {
    padding-bottom: 5.5rem
}

    .support section#social-proof .container .row .col-sm-2 img {
        opacity: .35
    }

.support section#quick-look .container .row .col-lg-6 div.circle.big {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 98px;
    height: 98px;
    background-color: rgba(245,247,250,.66);
    border-radius: 50%
}

.support section#quick-look .container .row .col-lg-6 div.circle.small {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    width: 64px;
    height: 64px;
    box-shadow: 0 2px 3px 0 rgba(0,0,0,.06);
    border-radius: 50%
}

    .support section#quick-look .container .row .col-lg-6 div.circle.small img {
        height: 50%
    }

.support section#quick-look .container .row .col-lg-6 h2 {
    font-size: 28px;
    font-weight: 800
}

.support section#quick-look .container .row .col-lg-6 p {
    font-size: 16px;
    font-weight: 600;
    font-family: nunito sans,sans-serif;
    line-height: 1.9
}

.support section#steps {
    background-color: #f3f3f3;
    position: relative
}

.contact section#steps, .support section#steps {
    padding-top: 5rem;
    padding-bottom: 2rem
}

    .contact section#steps .container .row, .support section#steps .container .row {
        text-align: center;
        justify-content: space-evenly
    }

        .contact section#steps .container .row .col-lg-12, .support section#steps .container .row .col-lg-12 {
            margin-bottom: 4rem
        }

            .contact section#steps .container .row .col-lg-12 h2, .support section#steps .container .row .col-lg-12 h2 {
                font-size: 36px;
                font-weight: 800
            }

        .contact section#steps .container .row .col-lg-3, .support section#steps .container .row .col-lg-3 {
            color: #1b1b20;
            border: solid 1px transparent;
            border-radius: 10px;
            background-color: #fff
        }

            .contact section#steps .container .row .col-lg-3:hover, .support section#steps .container .row .col-lg-3:hover {
                text-decoration: none;
                color: #1b1b20;
                border: solid 1px #1b1b20;
                border-radius: 10px
            }

            .contact section#steps .container .row .col-lg-3 img, .support section#steps .container .row .col-lg-3 img {
                margin-top: 3.5rem;
                width: 20%
            }

            .contact section#steps .container .row .col-lg-3 p.bolder, .support section#steps .container .row .col-lg-3 p.bolder {
                font-size: 22px;
                font-weight: 800;
                margin: 1rem 0
            }

            .contact section#steps .container .row .col-lg-3 p, .support section#steps .container .row .col-lg-3 p {
                font-size: 14px;
                font-weight: 600;
                margin-bottom: 3.5rem
            }

.contact #contact {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    height: 100%;
    margin-bottom: 5rem;
    margin-top: 4rem
}

    .contact #contact .container .row h1 {
        color: #1b1b20;
        font-weight: 700;
        font-size: 52px;
        margin-bottom: 2rem;
        padding: 0 10rem
    }

@media(max-width:767px) {
    .contact #contact .container .row h1 {
        font-size: 36px;
        padding-right: 4rem;
        text-align: left;
        padding: 0 5rem 0 2rem
    }
}

.contact #contact .container .row .contact__wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    padding-right: 5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .contact #contact .container .row .contact__wrapper {
        margin-top: 2rem;
        padding: 0 2rem
    }
}

.contact #contact .container .row .contact__wrapper .contact__wrapper--headingText h1 {
    color: #1b1b20;
    font-weight: 700;
    font-size: 52px;
    margin-bottom: 2rem;
    padding: 0
}

@media(max-width:767px) {
    .contact #contact .container .row .contact__wrapper .contact__wrapper--headingText h1 {
        font-size: 42px;
        padding-right: 4rem
    }
}

.contact #contact .container .row .contact__wrapper .contact__wrapper--subHeadingText {
    color: #767676;
    font-weight: 600
}

    .contact #contact .container .row .contact__wrapper .contact__wrapper--subHeadingText p {
        font-size: 18px;
        margin-bottom: 0
    }

    .contact #contact .container .row .contact__wrapper .contact__wrapper--subHeadingText ul {
        padding: 10px 0 10px 20px;
        margin-bottom: 0
    }

        .contact #contact .container .row .contact__wrapper .contact__wrapper--subHeadingText ul li {
            padding-bottom: 10px
        }

.contact #contact .container .row .contact__wrapper .contact__wrapper--reviews-icons {
    display: flex;
    align-items: center;
    margin: 1rem 0;
    justify-content: space-evenly
}

    .contact #contact .container .row .contact__wrapper .contact__wrapper--reviews-icons img {
        width: 110px;
        height: 110px
    }

.contact #contact .container .row .contact__wrapper .contact__wrapper--textLinks {
    font-size: 14px;
    color: #767676;
    margin: 3rem 0
}

    .contact #contact .container .row .contact__wrapper .contact__wrapper--textLinks a {
        color: #ffc502
    }

.contact #contact .container .row .contact__form {
    display: flex;
    flex-direction: column;
    text-align: center;
    border-radius: 26px;
    padding: 3rem 0;
    width: 45%;
    padding: 1rem 3rem 0;
    box-shadow: 0 4px 10px 2px rgba(0,0,0,.17)
}

@media(max-width:767px) {
    .contact #contact .container .row .contact__form {
        width: 100%;
        padding: 1rem 2rem 0;
        margin: 0 1rem
    }
}

.contact #contact .container .row .contact__form h1 {
    font-size: 24px;
    font-weight: 700;
    color: #767676;
    margin: 1rem 0;
    padding: 0;
    text-align: center
}

.contact #contact .container .row .contact__form span {
    padding: 10px 0;
    font-size: 14px;
    color: #767676;
    text-align: left
}

.contact #contact .container .row .contact__form label {
    display: flex;
    justify-content: start;
    flex-direction: column;
    align-items: flex-start
}

    .contact #contact .container .row .contact__form label input {
        width: 100%;
        border-radius: 8px;
        padding: 5px;
        padding-left: 1rem;
        color: #767676;
        border: 1px solid #e9e9e9
    }

        .contact #contact .container .row .contact__form label input:focus-visible {
            outline: 1px solid #ffc502
        }

    .contact #contact .container .row .contact__form label select {
        background-color: #fff;
        width: 100%;
        border-radius: 8px;
        padding: 5px;
        padding-left: 1rem;
        color: #767676;
        border: 1px solid #e9e9e9
    }

        .contact #contact .container .row .contact__form label select:focus-visible {
            outline: 1px solid #ffc502
        }

        .contact #contact .container .row .contact__form label select option {
            color: inherit;
            background-color: #e9e9e9;
            outline: none
        }

    .contact #contact .container .row .contact__form label textarea {
        height: 100px;
        margin-bottom: 1rem;
        width: 100%;
        border-radius: 8px;
        padding: 5px;
        padding-left: 1rem;
        color: #767676;
        border: 1px solid #e9e9e9
    }

        .contact #contact .container .row .contact__form label textarea:focus-visible {
            outline: 1px solid #ffc502
        }

.contact #contact .container .row .contact__form .contact__form--upload-file {
    text-align: left
}

.contact #contact .container .row .contact__form .contact__form--upload-file-flex {
    display: flex
}

.contact #contact .container .row .contact__form .contact__form--attachments {
    padding: 5px 0;
    border-radius: 8px;
    margin: 1rem 0 2rem
}

    .contact #contact .container .row .contact__form .contact__form--attachments label {
        margin-bottom: 0
    }

    .contact #contact .container .row .contact__form .contact__form--attachments .contact__form--button {
        border-radius: 8px;
        background-color: #767676;
        border: 1px solid #767676;
        color: #e9e9e9;
        font-weight: 700;
        font-size: 14px;
        padding: 10px;
        margin: 0 5px
    }

        .contact #contact .container .row .contact__form .contact__form--attachments .contact__form--button:hover {
            background-color: transparent;
            color: #767676;
            cursor: pointer
        }

    .contact #contact .container .row .contact__form .contact__form--attachments:hover {
        cursor: pointer
    }

.contact #contact .container .row .contact__form .contact__form--button button {
    width: 100%
}

.contact #contact .container .row .contact__form .contact__form--button p {
    font-size: 14px;
    color: #767676;
    margin: 1rem 0
}

    .contact #contact .container .row .contact__form .contact__form--button p a {
        color: #ffc502
    }

.contact #contact__form--files-area {
    margin: 1rem 0 2rem 1rem
}

    .contact #contact__form--files-area span {
        padding: 0 !important
    }

    .contact #contact__form--files-area .contact__form--file-block {
        border-radius: 10px;
        margin: 5px;
        display: flex;
        align-items: center
    }

        .contact #contact__form--files-area .contact__form--file-block > .contact__form--file-name {
            padding-right: 10px;
            width: max-content;
            display: flex;
            color: #ffc502 !important
        }

    .contact #contact__form--files-area .contact__form--file-delete {
        display: flex;
        width: 24px;
        background-color: #6eb4ff00;
        justify-content: center;
        margin-right: 3px;
        cursor: pointer
    }

        .contact #contact__form--files-area .contact__form--file-delete img {
            width: 16px;
            height: 16px
        }

.contact .contact__form--success-message {
    width: 30%;
    padding: 1.5rem;
    text-align: center;
    position: absolute;
    display: none;
    top: 20%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 10px 2px rgba(0,0,0,.17)
}

.contact .contact__form--success-message--loading {
    background-color: transparent;
    box-shadow: none
}

@media(max-width:767px) {
    .contact .contact__form--success-message {
        width: 90%;
        padding: 20px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .contact .contact__form--success-message {
        width: 90%
    }
}

.contact .contact__form--success-message h1 {
    font-size: 2rem;
    margin-bottom: 2rem;
    color: #1b1b20;
    padding: 0;
    text-align: center
}

@media(max-width:767px) {
    .contact .contact__form--success-message h1 {
        font-size: 28px
    }
}

.contact .contact__form--success-message p {
    font-size: 1rem;
    margin-bottom: 2rem;
    color: #767676
}

    .contact .contact__form--success-message p a {
        color: #ffc502
    }

.contact #loading {
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .contact #loading p {
        margin-top: 1rem;
        color: #ffc502;
        font-weight: 600;
        font-size: 16px
    }

    .contact #loading .lds-roller {
        display: inline-block;
        position: relative;
        width: 80px;
        height: 80px
    }

        .contact #loading .lds-roller div {
            animation: lds-roller 1.2s cubic-bezier(.5,0,.5,1) infinite;
            transform-origin: 40px 40px
        }

            .contact #loading .lds-roller div:after {
                content: " ";
                display: block;
                position: absolute;
                width: 7px;
                height: 7px;
                border-radius: 50%;
                background: #ffc502;
                margin: -4px 0 0 -4px
            }

            .contact #loading .lds-roller div:nth-child(1) {
                animation-delay: -.036s
            }

                .contact #loading .lds-roller div:nth-child(1):after {
                    top: 63px;
                    left: 63px
                }

            .contact #loading .lds-roller div:nth-child(2) {
                animation-delay: -.072s
            }

                .contact #loading .lds-roller div:nth-child(2):after {
                    top: 68px;
                    left: 56px
                }

            .contact #loading .lds-roller div:nth-child(3) {
                animation-delay: -.108s
            }

                .contact #loading .lds-roller div:nth-child(3):after {
                    top: 71px;
                    left: 48px
                }

            .contact #loading .lds-roller div:nth-child(4) {
                animation-delay: -.144s
            }

                .contact #loading .lds-roller div:nth-child(4):after {
                    top: 72px;
                    left: 40px
                }

            .contact #loading .lds-roller div:nth-child(5) {
                animation-delay: -.18s
            }

                .contact #loading .lds-roller div:nth-child(5):after {
                    top: 71px;
                    left: 32px
                }

            .contact #loading .lds-roller div:nth-child(6) {
                animation-delay: -.216s
            }

                .contact #loading .lds-roller div:nth-child(6):after {
                    top: 68px;
                    left: 24px
                }

            .contact #loading .lds-roller div:nth-child(7) {
                animation-delay: -.252s
            }

                .contact #loading .lds-roller div:nth-child(7):after {
                    top: 63px;
                    left: 17px
                }

            .contact #loading .lds-roller div:nth-child(8) {
                animation-delay: -.288s
            }

                .contact #loading .lds-roller div:nth-child(8):after {
                    top: 56px;
                    left: 12px
                }

@keyframes lds-roller {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

body .container-narrow.how-many:last-child {
    padding-bottom: 6rem
}

.how-many h2 {
    margin-top: 40px
}

.how-many img {
    display: block;
    margin: 40px auto
}

.how-many-instruction {
    background: #59be7b;
    color: #fff;
    padding-top: 30px;
    padding-bottom: 20px;
    margin-top: 20px
}

    .how-many-instruction h2 {
        margin-top: 0
    }

    .how-many-instruction a {
        color: #fff;
        text-decoration: underline
    }

.margin-top-80 {
    margin-top: 80px
}

.nfnh {
    background: #ededed
}

.image-with-margin {
    margin-top: 10px;
    margin-bottom: 10px
}

.w37 {
    width: 37px
}

.inth1 {
    font-weight: 400;
    margin-bottom: 20px
}

.m10p {
    margin: 10%
}

@media(max-width:768px) {
    .m10p {
        margin: unset;
        text-align: center
    }

        .m10p .img-circle {
            margin-bottom: 20px;
            float: unset !important;
            margin-left: unset !important
        }

        .m10p .form-inline {
            justify-content: center
        }

            .m10p .form-inline .form-group {
                width: 100%
            }

                .m10p .form-inline .form-group input {
                    width: 100% !important
                }

            .m10p .form-inline button {
                width: 100%
            }
}

.m10p .integrations-youtube-container {
    margin-bottom: 40px
}

.m10p .col-xs-12 {
    width: 100%;
    flex-basis: unset
}

@media(min-width:900px) {
    .container-narrow {
        max-width: 800px;
        margin: auto
    }
}

.text-italic {
    font-style: italic
}

.margin-top-10 {
    margin-top: 10px
}

.margin-top-15 {
    margin-top: 15px
}

.margin-top-20 {
    margin-top: 20px
}

.margin-top-30 {
    margin-top: 30px
}

.margin-top-40 {
    margin-top: 40px
}

.margin-top-50 {
    margin-top: 50px
}

.margin-top-60 {
    margin-top: 60px
}

.margin-bottom-10 {
    margin-bottom: 10px
}

.margin-bottom-15 {
    margin-bottom: 15px
}

.margin-bottom-20 {
    margin-bottom: 20px
}

.margin-bottom-30 {
    margin-bottom: 30px
}

.margin-bottom-40 {
    margin-bottom: 40px
}

.margin-bottom-50 {
    margin-bottom: 50px
}

.margin-bottom-60 {
    margin-bottom: 60px
}

.img-left {
    float: left;
    margin-right: 10px
}

.img-right {
    float: right;
    margin-left: 10px
}

.lp-vs-h1 {
    margin-bottom: 0;
    opacity: .9;
    text-transform: uppercase;
    letter-spacing: -3px;
    font-size: 4rem;
    font-weight: 300
}

@media(max-width:768px) {
    .lp-vs-h1 {
        font-size: 3rem
    }
}

.btn-lp-fix {
    white-space: normal !important;
    word-wrap: break-word
}

.green-div {
    background: #21874a;
    color: #fff;
    padding: 30px 0;
    margin-top: 60px
}

.comparison {
    margin: auto
}

.comparison-desc {
    text-align: center;
    font-weight: 700
}

.comparison-state {
    font-weight: 700
}

@media(max-width:768px) {
    .comparison-state.comparison-title {
        padding: 0;
        word-wrap: break-word;
        font-size: 13px
    }
}

.comparison-state img {
    max-width: 30px
}

.comp-row {
    padding: 10px 0
}

.comparison .comp-row:nth-child(odd) {
    background: #f5f5f5
}

.comparison .comp-row:nth-child(even) {
    background: #fff
}

.template-excel-get-Timely {
    font-size: 24px
}

.margin-auto {
    margin: 25px auto
}

.mt30 {
    margin-top: 30px
}

.mt60 {
    margin-top: 60px
}

@media(min-width:1000px) {
    .pl0-desktop {
        padding-left: 0
    }

    .pr0-desktop {
        padding-right: 0
    }

    .right-br-desktop {
        border-radius: 0 .55rem .55rem 0
    }

    .left-br-desktop {
        border-radius: .55rem 0 0 .55rem
    }
}

.inth1 {
    font-weight: 400;
    margin-bottom: 20px
}

.bold {
    font-weight: 700
}

@media(min-width:1000px) {
    .vertical-align {
        display: flex;
        align-items: center
    }
}

.img65p {
    width: 65%
}

.fixed {
    position: fixed;
    top: 0;
    z-index: 999
}

.blockquote {
    font-style: italic;
    font-weight: 300
}

.tbs h1 {
    padding: 40px 0;
    text-align: center
}

.tbs .screenshot {
    margin: auto;
    display: block;
    width: 100%
}

.tbs .motto {
    font-size: 22px;
    font-style: italic;
    text-align: center
}

.tbs p {
    margin-top: 20px
}

    .tbs p.strong {
        font-weight: 700
    }

    .tbs p.tip {
        text-align: center;
        margin: 30px
    }

        .tbs p.tip span {
            font-size: 24px;
            font-weight: 700
        }

.tbs h2, .tbs h3 {
    padding: 30px 0;
    text-align: center
}

.tbs .middle-row {
    margin: 15px 0
}

.tbs .cta {
    margin-top: 40px
}

@media(min-width:1024px) {
    .row.margin-top-30 .col-md-offset-3 {
        margin-left: 25%
    }
}

.landing-page .banner {
    margin-top: 60px;
    height: 768px;
    position: relative
}

    .landing-page .banner.banner1 {
        background: url(../img/landing-page/your-employee-productivity-tracker.jpg)
    }

    .landing-page .banner.banner2 {
        background: url(../img/landing-page/your-attendance-tracker.jpg)
    }

    .landing-page .banner.banner3 {
        background: url(../img/landing-page/employee-time-tracker.jpg)
    }

    .landing-page .banner.banner4 {
        background: url(../img/landing-page/project-timesheet-software-2.jpg)
    }

    .landing-page .banner.banner5 {
        background: url(../img/landing-page/project-timesheet-software.jpg)
    }

    .landing-page .banner.banner6 {
        background: url(../img/landing-page/time-recording.jpg)
    }

    .landing-page .banner.banner7 {
        background: url(../img/landing-page/work-time-tracking.jpg)
    }

    .landing-page .banner .content {
        position: absolute;
        top: 30%;
        left: 50%;
        transform: translate(-50%,0%);
        color: #fff;
        font-weight: 700;
        font-size: 36px;
        text-align: center;
        width: 40%
    }

@media(max-width:768px) {
    .landing-page .banner .content {
        top: 10%;
        width: 70%
    }
}

.landing-page .banner .content h1 {
    color: #fff;
    font-weight: 700;
    text-transform: uppercase
}

    .landing-page .banner .content h1 .dark {
        color: #333
    }

@media(max-width:768px) {
    .landing-page .banner .content h1 {
        margin: 25px 0
    }
}

.landing-page .banner .content p {
    color: #fff;
    font-weight: 400;
    font-size: 15px
}

    .landing-page .banner .content p .dark {
        color: #333
    }

@media(max-width:768px) {
    .landing-page .banner .content p {
        margin-bottom: 25px
    }
}

.landing-page .banner .content .btn-success {
    zoom: 1.2;
    white-space: normal
}

@media(min-width:768px) {
    .landing-page .columns .margin-top-40-md {
        margin-top: 40px
    }
}

.landing-page .columns .col-md-4 {
    padding: 0
}

@media(max-width:768px) {
    .landing-page .columns .col-md-4 {
        margin-top: 20px
    }
}

.landing-page .columns .col-md-4 h2 {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
    color: #55b761
}

.landing-page .columns .col-md-4 p, .landing-page .columns .col-md-4 p + a {
    padding: 0 10px;
    text-align: center
}

    .landing-page .columns .col-md-4 p a, .landing-page .columns .col-md-4 p + a a {
        color: #55b761
    }

@media(max-width:768px) {
    .landing-page .columns .col {
        flex-basis: unset
    }
}

.landing-page .bottom-cta {
    margin-top: 60px
}

    .landing-page .bottom-cta h3, .landing-page .bottom-cta p {
        text-align: center
    }

    .landing-page .bottom-cta .compare-plans {
        text-align: center;
        margin-top: 30px
    }

        .landing-page .bottom-cta .compare-plans p {
            font-size: 20px;
            margin-top: 20px
        }

@media(max-width:768px) {
    .landing-page .bottom-cta .pricing .col-md-4 {
        margin-top: 20px
    }

        .landing-page .bottom-cta .pricing .col-md-4:first-child {
            margin-top: 0
        }
}

@media(min-width:768px) {
    .landing-page .row.equal {
        display: flex;
        flex-wrap: wrap
    }
}

.landing-page2 .banner {
    margin-top: -16px;
    position: relative;
    background: #00bf71;
    padding-top: 5%
}

    .landing-page2 .banner .container {
        text-align: center;
        color: #fff
    }

        .landing-page2 .banner .container h1 {
            color: #fff;
            font-weight: 700;
            text-transform: uppercase;
            font-size: 72px;
            margin: auto
        }

@media(min-width:900px) and (max-width:1366px) {
    .landing-page2 .banner .container h1 {
        font-size: 62px
    }
}

@media(min-width:769px) and (max-width:899px) {
    .landing-page2 .banner .container h1 {
        font-size: 52px
    }
}

@media(max-width:768px) {
    .landing-page2 .banner .container h1 {
        font-size: 40px
    }
}

.landing-page2 .banner .container h1.desktop-app {
    font-size: 55px;
    margin: auto
}

@media(min-width:900px) and (max-width:1366px) {
    .landing-page2 .banner .container h1.desktop-app {
        font-size: 45px
    }
}

@media(min-width:769px) and (max-width:899px) {
    .landing-page2 .banner .container h1.desktop-app {
        font-size: 40px
    }
}

@media(max-width:768px) {
    .landing-page2 .banner .container h1.desktop-app {
        font-size: 35px
    }
}

.landing-page2 .banner .container p {
    font-weight: 400;
    font-size: 20px;
    width: 75%;
    margin: 30px auto 0
}

@media(min-width:900px) and (max-width:1366px) {
    .landing-page2 .banner .container p {
        font-size: 19px
    }
}

@media(min-width:769px) and (max-width:899px) {
    .landing-page2 .banner .container p {
        font-size: 18px
    }
}

@media(max-width:768px) {
    .landing-page2 .banner .container p {
        font-size: 17px
    }
}

.landing-page2 .banner .container a {
    color: #fff;
    background: red;
    text-transform: uppercase;
    white-space: normal;
    margin: 45px 0
}

.landing-page2 .banner .container img {
    width: 100%
}

.landing-page2 .banner + .container {
    margin-bottom: 70px;
    margin-top: 50px
}

@media(max-width:768px) {
    .landing-page2 .bubbles .col {
        flex-basis: unset
    }
}

.landing-page2 .bubbles .bubble {
    margin-top: 40px
}

    .landing-page2 .bubbles .bubble span, .landing-page2 .bubbles .bubble .content {
        display: inline
    }

        .landing-page2 .bubbles .bubble .content .title {
            font-weight: 700;
            font-size: 18px
        }

        .landing-page2 .bubbles .bubble .content .dsc {
            font-size: 15px
        }

    .landing-page2 .bubbles .bubble span {
        float: left;
        background-color: #3b8444;
        border-radius: 50%;
        color: #fff;
        height: 56px;
        min-width: 56px;
        padding: 10px;
        text-align: center;
        margin-right: 20px;
        font-size: 25px
    }

.landing-page2 .successes {
    background: #67678a;
    position: relative;
    padding: 45px 0;
    margin: 30px 0;
    transform: skewY(-2deg)
}

    .landing-page2 .successes h2 {
        color: #d2d2db
    }

    .landing-page2 .successes .signup-box {
        margin: 0;
        margin-bottom: 40px
    }

    .landing-page2 .successes .floating-circle img {
        left: 14px
    }

    .landing-page2 .successes .container {
        transform: skewY(2deg)
    }

.landing-page2 .stripes4 {
    background: linear-gradient(150deg,#94dc77 15%,rgba(199,241,204,0.35) 70%,#dbffcc 84%);
    background: linear-gradient(150deg,#67678a 15%,#67678a 70%,#67678a 84%);
    height: 500px;
    width: 100vw;
    transform: skewY(-2deg);
    display: flex;
    transform-origin: 0;
    top: 40px;
    z-index: -1;
    position: absolute;
    top: 120px
}

@media(max-width:768px) {
    .landing-page2 .stripes4 {
        top: 70px;
        height: 930px
    }
}

.landing-page2 .stripes4 span {
    height: 175px;
    width: 33.33333%
}

.landing-page2 .home-reviews a {
    margin: 5px
}

.landing-page2 .warwick {
    margin-top: 60px
}

    .landing-page2 .warwick img {
        width: 70%;
        margin: auto
    }

@media(max-width:768px) {
    .landing-page2 .warwick img {
        margin-bottom: 30px
    }
}

@media(max-width:768px) {
    .landing-page2 .pricing .col-md-4 {
        margin-top: 20px
    }

        .landing-page2 .pricing .col-md-4:first-child {
            margin-top: 40px
        }
}

.landing-page2 .bottom-cta h3, .landing-page2 .bottom-cta p {
    text-align: center
}

.landing-page2 .bottom-cta h3 {
    margin-top: 80px
}

@media(max-width:768px) {
    .landing-page2 .bottom-cta .icons {
        display: none
    }
}

#page {
    padding: 6rem 0
}

.integration-pics-container {
    padding-bottom: 6rem
}

.harvest-more {
    width: 70%;
    margin: auto;
    margin-top: 50px
}

@media(max-width:768px) {
    .harvest-more {
        width: 100%
    }
}

.harvest-more .alternative-section {
    text-align: center
}

    .harvest-more .alternative-section h3 {
        font-size: 40px;
        font-weight: 700
    }

    .harvest-more .alternative-section p {
        margin: 30px 0
    }

    .harvest-more .alternative-section iframe {
        width: 100%;
        height: 400px;
        margin: auto
    }

    .harvest-more .alternative-section .client-logo {
        margin: 80px auto 50px;
        display: flex;
        align-items: center;
        justify-content: center
    }

.harvest-more .differences-section {
    margin-top: 50px
}

    .harvest-more .differences-section h3 {
        font-size: 30px;
        font-weight: 400;
        text-align: center
    }

    .harvest-more .differences-section .link {
        text-align: center;
        display: block;
        margin-top: 30px;
        font-size: 18px;
        color: #00bf71
    }

.harvest-more .vs-section h3 {
    font-size: 30px;
    font-weight: 400;
    text-align: center
}

.harvest-more .vs-section p {
    text-align: center
}

.harvest-more .vs-section .pricing-vs {
    display: flex;
    flex-direction: column;
    margin-top: 50px
}

    .harvest-more .vs-section .pricing-vs .row {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        border-bottom: 1px solid #333
    }

        .harvest-more .vs-section .pricing-vs .row .col {
            padding: 15px
        }

            .harvest-more .vs-section .pricing-vs .row .col:first-child {
                max-width: 150px
            }

            .harvest-more .vs-section .pricing-vs .row .col:nth-child(2) {
                border-left: 1px solid #333;
                border-right: 1px solid #333
            }

.harvest-more .switch-section h3 {
    font-size: 30px;
    font-weight: 400;
    text-align: center
}

.harvest-more .switch-section .link {
    text-align: center;
    display: block;
    margin-top: 30px;
    font-size: 18px;
    color: #00bf71
}

.harvest-more .switch-section h4 {
    font-size: 26px;
    font-weight: 400;
    text-align: center;
    margin-bottom: 30px
}

.harvest-more .switch-section .kamil-sentence {
    display: flex;
    margin-top: 30px;
    justify-content: center;
    align-items: center
}

    .harvest-more .switch-section .kamil-sentence p {
        margin-bottom: 0
    }

        .harvest-more .switch-section .kamil-sentence p span {
            display: block;
            margin-top: 15px
        }

.harvest-more .switch-section .cta-bottom {
    text-align: center
}

    .harvest-more .switch-section .cta-bottom p {
        padding: 30px 0 20px;
        margin: 0
    }

.support form, .qb-disconnected form {
    padding: 4rem 0
}

.bottom-padding, .landing-page2 {
    padding-bottom: 6rem
}

.clickupfix h4 {
    font-size: 16px;
    line-height: 21px;
    padding-top: 10px
}

    .clickupfix h4 img {
        float: left;
        margin-right: 10px;
        margin-top: -8px
    }

.myImg {
    border-radius: 5px;
    cursor: pointer;
    transition: .3s
}

    .myImg:hover {
        opacity: .7
    }

.modal {
    display: none;
    position: fixed;
    z-index: 1050;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: #000;
    background-color: rgba(0,0,0,.9)
}

.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 1000px
}

#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px
}

.modal-content, #caption {
    -webkit-animation-name: zoom;
    -webkit-animation-duration: .6s;
    animation-name: zoom;
    animation-duration: .6s
}

@-webkit-keyframes zoom {
    from {
        -webkit-transform: scale(0)
    }

    to {
        -webkit-transform: scale(1)
    }
}

@keyframes zoom {
    from {
        transform: scale(0)
    }

    to {
        transform: scale(1)
    }
}

.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: 700;
    transition: .3s
}

    .close:hover, .close:focus {
        color: #bbb;
        text-decoration: none;
        cursor: pointer
    }

@media only screen and (max-width:700px) {
    .modal-content {
        width: 100%
    }
}

@media(max-width:767px) {
    .row {
        margin-left: 0;
        margin-right: 0
    }
}

#buttons {
    background-color: #fff;
    padding: 4rem 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #buttons {
        padding-bottom: 0
    }
}

#buttons .container {
    display: flex;
    justify-content: center;
    position: relative
}

@media(max-width:767px) {
    #buttons .container:nth-of-type(2) {
        display: none
    }
}

#buttons .container div:nth-of-type(8) {
    padding: 0
}

#buttons .container .search-box {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #buttons .container .search-box {
        padding: 0 0 64px
    }
}

@media(max-width:767px) {
    #buttons .container .search-box {
        justify-content: center;
        margin-left: -5px
    }
}

#buttons .container .search-box input {
    width: 100%;
    height: 5.3rem;
    border: none;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff;
    border-radius: 300px;
    padding: 0 4rem;
    font-size: 20px;
    color: #767676
}

@media(max-width:767px) {
    #buttons .container .search-box input {
        width: 80%;
        padding: 0 1.5rem
    }
}

#buttons .container .search-box input:focus {
    outline: none;
    box-shadow: 0 4px 10px 4px rgba(0,0,0,.12);
    color: #000
}

#buttons .container .search-box button {
    margin-left: -70px;
    background-color: #fff;
    border: none
}

@media(max-width:767px) {
    #buttons .container .search-box button {
        margin-left: -55px
    }
}

#buttons .container .search-box button:focus {
    outline: none
}

#buttons .container .search-box__error {
    padding: 48px 0 0;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #buttons .container .search-box__error {
        padding: 0 4rem 2rem;
        text-align: center
    }
}

#buttons .container .search-box__error p {
    color: #767676;
    font-size: 14px
}

#buttons .container .search-box__error span {
    font-size: inherit;
    font-weight: 700;
    color: #ffc502
}

#buttons .container .hide {
    display: none;
    padding: 0
}

#buttons .container .row {
    width: 100%;
    justify-content: space-between
}

#buttons .container .col-lg-1, #buttons .container .col-md-4 {
    padding: 0;
    display: flex;
    justify-content: center;
    margin-bottom: 7rem
}

    #buttons .container .col-lg-1 button.working, #buttons .container .col-md-4 button.working {
        box-shadow: none;
        transform: scale(1.07);
        border: solid 1px #1b1b20;
        outline: none
    }

        #buttons .container .col-lg-1 button.working span, #buttons .container .col-md-4 button.working span {
            font-weight: 700 !important;
            color: #1b1b20 !important;
            transform: scale(1.07)
        }

    #buttons .container .col-lg-1 .filtering-buttons, #buttons .container .col-md-4 .filtering-buttons {
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        z-index: 1;
        transition: all .2s ease-in-out;
        width: 80px;
        height: 80px;
        border: solid 1px rgba(33,31,45,.5);
        background-color: #fff;
        border-radius: 50%
    }

        #buttons .container .col-lg-1 .filtering-buttons:hover, #buttons .container .col-lg-1 .filtering-buttons.active, #buttons .container .col-lg-1 .filtering-buttons:focus, #buttons .container .col-md-4 .filtering-buttons:hover, #buttons .container .col-md-4 .filtering-buttons.active, #buttons .container .col-md-4 .filtering-buttons:focus {
            box-shadow: none;
            transform: scale(1.07);
            border: solid 1px #1b1b20;
            outline: none
        }

            #buttons .container .col-lg-1 .filtering-buttons:hover > span, #buttons .container .col-lg-1 .filtering-buttons.active > span, #buttons .container .col-lg-1 .filtering-buttons:focus > span, #buttons .container .col-md-4 .filtering-buttons:hover > span, #buttons .container .col-md-4 .filtering-buttons.active > span, #buttons .container .col-md-4 .filtering-buttons:focus > span {
                font-weight: 700;
                color: #1b1b20;
                transform: scale(1.07);
                outline: none
            }

        #buttons .container .col-lg-1 .filtering-buttons span, #buttons .container .col-md-4 .filtering-buttons span {
            font-weight: 400;
            font-size: 16px;
            position: absolute;
            top: 6rem;
            color: rgba(33,31,45,.5)
        }

#buttons .container .col-sm-6 {
    margin-bottom: 7rem;
    padding: 0
}

.integrations {
    background-color: #fafffd
}

@media(max-width:767px) {
    .integrations .container {
        padding-left: 0;
        padding-right: 0
    }
}

.integrations #top {
    background-color: #fff
}

    .integrations #top .img-container {
        position: absolute;
        top: 15rem;
        left: 0
    }

@media(max-width:767px) {
    .integrations #top .img-container {
        display: none
    }
}

.integrations #top .img-container img {
    width: 50%;
    opacity: .37
}

.integrations #top .container .row {
    justify-content: center
}

    .integrations #top .container .row .col-lg-6 {
        display: flex;
        flex-direction: column
    }

        .integrations #top .container .row .col-lg-6 h1 {
            font-size: 42px;
            font-weight: 800;
            line-height: 1.25;
            margin-bottom: 2rem;
            margin-right: 3rem
        }

        .integrations #top .container .row .col-lg-6 p {
            font-size: 18px;
            font-weight: 400;
            line-height: 1.38;
            margin-top: 0;
            margin-bottom: 1rem
        }

@media(max-width:767px) {
    .integrations #top .container .row .col-lg-6 p {
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .integrations #top .container .row .ue-hero-main {
        display: none
    }
}

.integrations #integrations-list {
    background-color: #fcfcfc;
    padding-top: 2rem
}

    .integrations #integrations-list .show {
        display: block !important
    }

    .integrations #integrations-list .container .row {
        justify-content: center
    }

        .integrations #integrations-list .container .row .col-lg-4 {
            padding-right: 2rem;
            position: relative;
            padding-left: 2rem;
            margin-bottom: 5rem;
            display: none;
            transition: all .2s ease-in-out
        }

            .integrations #integrations-list .container .row .col-lg-4 .logo {
                text-align: center;
                padding: 3rem 0;
                background-color: #fff;
                box-shadow: 0 25px 50px 0 rgba(101,105,167,.04)
            }

@media(max-width:767px) {
    .integrations #integrations-list .container .row .col-lg-4 .logo {
        width: 80%;
        margin: 15px auto
    }
}

.integrations #integrations-list .container .row .col-lg-4 .logo img {
    width: auto;
    height: 55px
}

@media(max-width:767px) {
    .integrations #integrations-list .container .row .col-lg-4 .logo img {
        height: 50px
    }
}

.integrations #integrations-list .container .row .col-lg-4 .text {
    margin-top: 1.5rem;
    text-align: center
}

@media(max-width:767px) {
    .integrations #integrations-list .container .row .col-lg-4 .text {
        width: 54%;
        margin: 0 auto
    }
}

.integrations #integrations-list .container .row .col-lg-4 .text h2 {
    font-size: 22px;
    font-weight: 800
}

.integrations #integrations-list .container .row .col-lg-4 .text p {
    font-size: 14px;
    font-weight: 600;
    margin-top: 1.2rem
}

.integrations #integrations-list .container .row .col-lg-4 .text .name {
    cursor: pointer
}

.integrations #integrations-list .container .row .col-lg-4:hover {
    transform: scale(1.07)
}

.singleIntegration section#top {
    padding: 6rem 0 8rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .singleIntegration section#top {
        padding: 4rem 0
    }
}

.singleIntegration section#top .container .row .col-lg-12 {
    text-align: center
}

    .singleIntegration section#top .container .row .col-lg-12 .wrapper {
        display: flex;
        justify-content: center
    }

        .singleIntegration section#top .container .row .col-lg-12 .wrapper .img-content {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100px;
            height: 100px;
            border-radius: 50%;
            box-shadow: 2px 2px 29px 0 rgba(37,38,94,.13);
            border: solid 4px #fff;
            background-color: #fff;
            margin-right: 1rem;
            margin-left: 1rem
        }

            .singleIntegration section#top .container .row .col-lg-12 .wrapper .img-content img {
                height: 40px
            }

            .singleIntegration section#top .container .row .col-lg-12 .wrapper .img-content .fixed-width {
                width: 100%
            }

    .singleIntegration section#top .container .row .col-lg-12 h1 {
        font-size: 36px;
        font-weight: 800;
        margin-bottom: 2rem;
        width: 100%;
        text-align: center
    }

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12 h1 {
        margin-bottom: 0
    }
}

.singleIntegration section#top .container .row .col-lg-12 h1.ppcHeader {
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 2rem;
    width: 100%;
    text-align: center
}

    .singleIntegration section#top .container .row .col-lg-12 h1.ppcHeader span {
        font-weight: 700
    }

.singleIntegration section#top .container .row .col-lg-12 p {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.38;
    margin: 0 auto 4rem;
    text-align: center;
    width: 80%
}

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12 p {
        width: 100%
    }
}

.singleIntegration section#top .container .row .col-lg-12 p.ppcPara {
    margin: 2rem auto 3rem
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles {
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: center
}

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles {
        display: inline
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .img-content {
    box-shadow: 2px 2px 29px 0 rgba(37,38,94,.07);
    border: solid 4px #fff;
    background-color: #fff;
    margin: 0 1rem 2rem 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    border-radius: unset
}

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .img-content {
        box-shadow: none;
        margin: 1rem 0;
        width: 100%
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .img-content img {
    width: 80px
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .img-content .fixed-width {
    width: 100%
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper {
    flex-direction: column
}

    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper h1 {
        font-size: 25px;
        font-weight: 700;
        text-align: left;
        margin-bottom: 1rem
    }

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper h1 {
        text-align: center
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper p {
    font-size: 17px;
    margin: 0;
    text-align: left
}

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper p {
        text-align: center
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form {
    margin-top: 2rem
}

    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper input[type=email] {
        border: none;
        width: 65%;
        outline: none;
        font-size: 14px;
        border-radius: 26px;
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
        background-color: #fff
    }

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper input[type=email] {
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper input[type=email] {
        width: 60%
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper button {
    padding: 12px 10px;
    color: #fff;
    width: 30%;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #ffc502;
    position: relative;
    background-color: #ffc502;
    left: -3rem;
    margin-top: 0
}

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper button {
        left: unset;
        right: 0;
        width: 75%;
        padding: 10px 0;
        margin-top: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper button {
        padding: 14px 7px
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper .terms-submission {
    margin: 20px 0;
    font-size: 13px;
    color: #1b1b20;
    opacity: .6;
    width: 60%;
    padding-left: 2rem
}

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper .terms-submission {
        width: 100%;
        padding: 0 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper .terms-submission {
        padding-right: 0
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .form-wrapper .terms-submission a {
    margin: 0 2px;
    color: #ffc502
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .button-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .button-wrapper {
        flex-direction: column;
        align-items: center
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .button-wrapper .button-wrapper__google {
    display: flex;
    align-items: center;
    margin-top: 1rem
}

@media(max-width:767px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .button-wrapper .button-wrapper__google {
        display: block;
        margin-left: 0;
        text-align: center;
        margin-top: 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .button-wrapper .button-wrapper__google {
        margin-left: 0
    }
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .button-wrapper .button-wrapper__google span {
    font-size: 1rem;
    color: #767676
}

.singleIntegration section#top .container .row .col-lg-12.integrations-sites-styles .wrapper .form .button-wrapper .button-wrapper__google img {
    margin-left: .2rem;
    width: 32px
}

.singleIntegration section#social-proof {
    padding-bottom: 4.5rem
}

    .singleIntegration section#social-proof .container .row .col-sm-2 img {
        opacity: .35
    }

.singleIntegration section#top.second {
    padding-top: 0;
    padding-bottom: 0;
    background-color: #f3f3f3
}

    .singleIntegration section#top.second .container .row .text {
        padding-top: 4rem;
        padding-left: 4.5rem;
        padding-right: 7.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin: 0 0 3rem
    }

@media(max-width:991px) {
    .singleIntegration section#top.second .container .row .text {
        text-align: center
    }
}

@media(max-width:767px) {
    .singleIntegration section#top.second .container .row .text {
        padding-left: 15px;
        padding-right: 15px
    }
}

.singleIntegration section#top.second .container .row .text h2 {
    font-size: 41px;
    font-weight: 800;
    margin-bottom: 2rem
}

.singleIntegration section#top.second .container .row .text p {
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    width: 80%;
    margin: 0 auto
}

.singleIntegration section#top.second .container .row .text .plugin_buttons {
    margin: 2rem auto 0;
    width: 34%
}

@media(max-width:767px) {
    .singleIntegration section#top.second .container .row .text .plugin_buttons {
        width: 100%
    }
}

.singleIntegration section#top.second .container .row .text .feature-wrapper {
    display: flex;
    flex-direction: row;
    margin-bottom: 5rem
}

    .singleIntegration section#top.second .container .row .text .feature-wrapper .col-sm-12 {
        display: flex
    }

        .singleIntegration section#top.second .container .row .text .feature-wrapper .col-sm-12 .features h2 {
            text-align: left;
            font-size: 16px;
            font-weight: 700;
            width: 90%;
            margin: 0 auto 1rem
        }

        .singleIntegration section#top.second .container .row .text .feature-wrapper .col-sm-12 .features p {
            font-weight: 600;
            font-size: 17px;
            width: 90%;
            margin: 0 auto 1rem;
            text-align: left
        }

        .singleIntegration section#top.second .container .row .text .feature-wrapper .col-sm-12 img {
            width: 40px;
            height: 40px
        }

.singleIntegration section#top.second .container .row .img {
    padding: 0;
    background-color: transparent;
    justify-content: center;
    flex-direction: column;
    display: flex
}

    .singleIntegration section#top.second .container .row .img img {
        cursor: pointer
    }

        .singleIntegration section#top.second .container .row .img img:nth-of-type(1) {
            width: 100%;
            transition: transform .2s
        }

            .singleIntegration section#top.second .container .row .img img:nth-of-type(1):hover {
                transform: scale(1.2)
            }

.singleIntegration section#top.second .container .row .col-sm-12 {
    margin-top: 5rem
}

    .singleIntegration section#top.second .container .row .col-sm-12 h2 {
        font-size: 41px;
        font-weight: 800;
        margin-bottom: 2rem;
        text-align: center
    }

    .singleIntegration section#top.second .container .row .col-sm-12 .wrapper {
        display: flex;
        margin-bottom: 1rem
    }

        .singleIntegration section#top.second .container .row .col-sm-12 .wrapper .content {
            width: 30%;
            margin: 0 auto
        }

.singleIntegration section#steps {
    padding: 4rem 0
}

    .singleIntegration section#steps a, .singleIntegration section#steps a:hover, .singleIntegration section#steps a:focus, .singleIntegration section#steps a:active {
        color: #00bf71
    }

    .singleIntegration section#steps .container .row {
        justify-content: center
    }

        .singleIntegration section#steps .container .row .col-lg-12 {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-bottom: 4.5rem
        }

            .singleIntegration section#steps .container .row .col-lg-12 h2 {
                font-size: 36px;
                font-weight: 700;
                margin: 1rem 0
            }

            .singleIntegration section#steps .container .row .col-lg-12 p {
                font-size: 18px;
                font-weight: 600;
                text-align: center;
                margin-bottom: 0;
                width: 65%
            }

                .singleIntegration section#steps .container .row .col-lg-12 p.first-para {
                    margin-top: 1rem
                }

    .singleIntegration section#steps .container .row_container {
        flex-direction: row
    }

        .singleIntegration section#steps .container .row_container .col-sm-3 {
            display: flex;
            flex-direction: column;
            justify-content: center
        }

            .singleIntegration section#steps .container .row_container .col-sm-3 img {
                width: 100%
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleIntegration section#steps .container .row_container .col-sm-3 {
        display: none
    }
}

.singleIntegration section#steps .container .row_container .steps_wrapper {
    display: flex;
    flex-flow: inherit
}

    .singleIntegration section#steps .container .row_container .steps_wrapper .col-sm-12 {
        margin-bottom: 4rem;
        display: flex;
        align-items: center;
        flex-direction: row;
        justify-content: space-evenly
    }

@media(max-width:767px) {
    .singleIntegration section#steps .container .row_container .steps_wrapper .col-sm-12 {
        flex-direction: column
    }
}

.singleIntegration section#steps .container .row_container .steps_wrapper .col-sm-12 .circle {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background-color: #f3f3f3;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: unset
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleIntegration section#steps .container .row_container .steps_wrapper .col-sm-12 .circle {
        margin: 0 auto 2rem
    }
}

.singleIntegration section#steps .container .row_container .steps_wrapper .col-sm-12 p.green {
    font-size: 24px;
    font-weight: 900;
    color: #00bf71;
    margin: 0;
    width: unset;
    position: relative;
    z-index: 1
}

.singleIntegration section#steps .container .row_container .steps_wrapper .col-sm-12 img {
    width: 100%;
    border-radius: 13px;
    border: 2px solid #1b1b20;
    margin-bottom: 1.5rem
}

.singleIntegration section#steps .container .row_container .steps_wrapper .col-sm-12 p {
    text-align: left;
    font-size: 17px;
    font-weight: 500;
    width: 60%;
    margin-bottom: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleIntegration section#steps .container .row_container .steps_wrapper .col-sm-12 p {
        text-align: center;
        width: 80%;
        margin: 0 auto 1rem
    }
}

.singleIntegration section#steps .container .row_container .wrapper {
    margin-top: 6rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

    .singleIntegration section#steps .container .row_container .wrapper h3 {
        font-weight: 800;
        font-size: 28px;
        text-align: center;
        width: 80%;
        margin: 0 auto 1rem
    }

    .singleIntegration section#steps .container .row_container .wrapper p {
        text-align: center;
        font-size: 20px;
        font-weight: 600;
        width: 80%;
        margin: 0 auto 1rem
    }

    .singleIntegration section#steps .container .row_container .wrapper .wrapping-table {
        display: flex;
        margin-top: 4rem
    }

        .singleIntegration section#steps .container .row_container .wrapper .wrapping-table p {
            width: 100%
        }

        .singleIntegration section#steps .container .row_container .wrapper .wrapping-table .right {
            width: 50%;
            margin-left: auto
        }

.singleIntegration #values {
    margin: 0 auto 5rem
}

    .singleIntegration #values .bs-example {
        padding-top: 0
    }

    .singleIntegration #values .row .col-sm-12 h2.header {
        font-size: 36px;
        font-weight: 800;
        text-align: center;
        margin: 2rem 0 10rem
    }

.ppc-integration .section-integration-more-info {
    margin-top: 5rem
}

.ppc-integration #top {
    padding: 2rem 0
}

    .ppc-integration #top .buttons {
        display: flex;
        gap: 24px;
        margin: 28px 0 96px
    }

        .ppc-integration #top .buttons .singleButton span {
            font-family: sans-serif;
            font-size: 18px;
            font-weight: 400;
            line-height: 21.6px;
            text-align: left;
            color: #323333
        }

@media(max-width:767px) {
    .ppc-integration #top .buttons {
        margin: 28px 0 40px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 24px
    }
}

.ppc-integration #top .container .row .top__integration {
    display: flex;
    flex-direction: column;
    align-items: center
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .top__integration--img-large {
        display: none
    }
}

.ppc-integration #top .container .row .top__integration .top__integration--img-azure {
    width: 80% !important
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .top__integration--img-azure {
        display: none
    }
}

.ppc-integration #top .container .row .top__integration .top__integration--img-mobile {
    display: none
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .top__integration--img-mobile {
        display: block
    }
}

.ppc-integration #top .container .row .top__integration img {
    width: 100%
}

.ppc-integration #top .container .row .top__integration .top__integration--top-img img {
    width: 90px;
    height: 90px
}

    .ppc-integration #top .container .row .top__integration .top__integration--top-img img:nth-of-type(2) {
        margin-top: 4rem
    }

.ppc-integration #top .container .row .top__integration .top__integration--all-top-img {
    width: 204px !important
}

.ppc-integration #top .container .row .top__integration .top__integration--description {
    text-align: center;
    width: 100%;
    margin-top: 2rem
}

    .ppc-integration #top .container .row .top__integration .top__integration--description h1, .ppc-integration #top .container .row .top__integration .top__integration--description span {
        font-size: 52px;
        line-height: 1.1;
        display: inline;
        width: 100%;
        font-weight: 700
    }

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .top__integration--description h1, .ppc-integration #top .container .row .top__integration .top__integration--description span {
        font-size: 48px
    }
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .top__integration--description {
        text-align: left
    }
}

.ppc-integration #top .container .row .top__integration .top__integration--description p {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    margin: 2rem 0
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .top__integration--description p {
        text-align: left
    }
}

.ppc-integration #top .container .row .top__integration .top__integration--button {
    text-align: center
}

    .ppc-integration #top .container .row .top__integration .top__integration--button a {
        margin: 1rem 0
    }

    .ppc-integration #top .container .row .top__integration .top__integration--button h3 {
        font-size: 14px;
        color: #ffc502;
        font-weight: 600
    }

.ppc-integration #top .container .row .top__integration .form .form-wrapper {
    margin-bottom: 2rem;
    padding-left: 10rem
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #top .container .row .top__integration .form .form-wrapper {
        padding-left: 2rem
    }
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .form .form-wrapper {
        padding-left: 0
    }
}

.ppc-integration #top .container .row .top__integration .form .form-wrapper input[type=email] {
    border: none;
    width: 35%;
    outline: none;
    font-size: 14px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .form .form-wrapper input[type=email] {
        width: 75%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #top .container .row .top__integration .form .form-wrapper input[type=email] {
        width: 40%
    }
}

.ppc-integration #top .container .row .top__integration .form .form-wrapper button {
    padding: 12px 10px;
    color: #fff;
    width: 25%;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #ffc502;
    position: relative;
    background-color: #ffc502;
    left: -3rem;
    margin-top: 0
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .form .form-wrapper button {
        left: unset;
        right: 0;
        width: 75%;
        padding: 10px 0;
        margin-top: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #top .container .row .top__integration .form .form-wrapper button {
        padding: 14px 7px
    }
}

.ppc-integration #top .container .row .top__integration .form .form-wrapper .terms-submission {
    margin: 20px 0;
    font-size: 13px;
    color: #1b1b20;
    opacity: .6;
    width: 100%;
    padding-left: 2rem
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .form .form-wrapper .terms-submission {
        width: 100%;
        padding: 0 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #top .container .row .top__integration .form .form-wrapper .terms-submission {
        padding-right: 0
    }
}

.ppc-integration #top .container .row .top__integration .form .form-wrapper .terms-submission a {
    margin: 0 2px;
    color: #ffc502
}

.ppc-integration #top .container .row .top__integration .form .button-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .form .button-wrapper {
        flex-direction: column;
        align-items: center
    }
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .form .button-wrapper .signup_google_button {
        margin-top: 1rem
    }
}

.ppc-integration #top .container .row .top__integration .form .button-wrapper span {
    font-size: 1rem;
    color: #767676
}

.ppc-integration #top .container .row .top__integration .form .button-wrapper img {
    margin-left: .2rem;
    width: 32px
}

.ppc-integration #top .container .row .top__integration .form .button-wrapper .button-wrapper__google {
    display: flex;
    margin-top: 1rem;
    width: 75%;
    text-align: center
}

@media(max-width:767px) {
    .ppc-integration #top .container .row .top__integration .form .button-wrapper .button-wrapper__google {
        display: block;
        margin-left: 0;
        text-align: center;
        margin-top: 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #top .container .row .top__integration .form .button-wrapper .button-wrapper__google {
        margin-left: 0
    }
}

.ppc-integration #social-proof {
    background-color: #ffc502;
    width: 100%;
    padding-bottom: 0 !important
}

    .ppc-integration #social-proof .row {
        border-bottom: none !important
    }

@media(max-width:767px) {
    .ppc-integration #social-proof .row .social-proof__heading {
        padding-right: 30px;
        padding-left: 30px
    }
}

.ppc-integration #social-proof .row .social-proof__heading h3 {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    font-family: nunito sans,sans-serif;
    text-align: center
}

@media(max-width:767px) {
    .ppc-integration #social-proof .row .social-proof__heading h3 {
        line-height: 34px
    }
}

.ppc-integration #benefits .benefits__heading {
    margin-top: 6rem;
    text-align: center
}

    .ppc-integration #benefits .benefits__heading h2 {
        font-size: 36px;
        font-weight: 700;
        margin: 2rem 0
    }

@media(max-width:767px) {
    .ppc-integration #benefits .benefits__heading h2 {
        font-size: 28px;
        text-align: left
    }
}

.ppc-integration #benefits .benefits__heading h3 {
    color: #767676;
    font-size: 18px;
    padding: 0 15rem;
    line-height: 1.89
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #benefits .benefits__heading h3 {
        padding: 0 2rem
    }
}

@media(max-width:767px) {
    .ppc-integration #benefits .benefits__heading h3 {
        font-size: 16px;
        padding: 0;
        text-align: left
    }
}

.ppc-integration #benefits .benefits__heading img {
    margin: 2rem 0;
    width: 100%
}

.ppc-integration #benefits .benefits__heading--imgSmall {
    width: 80% !important
}

.ppc-integration #benefits .benefits__circle {
    display: flex;
    align-items: center;
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #benefits .benefits__circle .row {
        width: 100%;
        justify-content: center
    }
}

.ppc-integration #benefits .benefits__circle .benefits__circle--column {
    display: flex;
    border-top: 1px solid #f3f3f3;
    justify-content: space-around
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #benefits .benefits__circle .benefits__circle--column {
        border-top: 1px solid transparent
    }
}

.ppc-integration #benefits .benefits__circle .benefits__circle--column .benefits__circle--column-single {
    display: flex;
    align-items: center;
    margin: 1rem 0
}

    .ppc-integration #benefits .benefits__circle .benefits__circle--column .benefits__circle--column-single span {
        background-color: #ffc502;
        border-radius: 50%;
        padding: 10px 18px;
        color: #fff
    }

    .ppc-integration #benefits .benefits__circle .benefits__circle--column .benefits__circle--column-single p {
        font-size: 18px;
        padding-left: 1.5rem;
        width: 500px;
        padding-right: 2rem;
        margin-bottom: 0
    }

@media(max-width:767px) {
    .ppc-integration #benefits .benefits__circle .benefits__circle--column .benefits__circle--column-single p {
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #benefits .benefits__circle .benefits__circle--column .benefits__circle--column-single {
        border-top: 1px solid #f3f3f3;
        padding: 10px 0;
        margin: 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #benefits .benefits__circle .benefits__circle--column {
        flex-direction: column;
        display: block
    }
}

.ppc-integration #benefits .benefits__circle .benefits__button {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 2rem 0
}

    .ppc-integration #benefits .benefits__circle .benefits__button .fa-arrow-right {
        margin-left: 10px;
        display: inline-block;
        color: #fff;
        font-size: 18px
    }

.ppc-integration #videoHowWorks {
    margin-bottom: 8rem
}

    .ppc-integration #videoHowWorks .benefits__heading {
        margin-top: 6rem;
        text-align: center;
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }

        .ppc-integration #videoHowWorks .benefits__heading p {
            margin-bottom: -.2rem
        }

        .ppc-integration #videoHowWorks .benefits__heading h2 {
            font-size: 36px;
            font-weight: 700;
            margin: 2rem 0 2.5rem;
            width: 60%
        }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc-integration #videoHowWorks .benefits__heading h2 {
        width: 100%
    }
}

@media(max-width:767px) {
    .ppc-integration #videoHowWorks .benefits__heading h2 {
        font-size: 28px;
        text-align: left
    }
}

.ppc-integration #videoHowWorks .benefits__heading img {
    margin: 2rem 0;
    width: 100%
}

.ppc-integration #videoHowWorks .benefits__circle {
    display: flex;
    align-items: center;
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #videoHowWorks .benefits__circle .row {
        width: 100%;
        justify-content: center
    }
}

.ppc-integration #videoHowWorks .benefits__circle .benefits__circle--column {
    display: flex;
    border-top: 1px solid #f3f3f3;
    justify-content: space-around
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #videoHowWorks .benefits__circle .benefits__circle--column {
        border-top: 1px solid transparent
    }
}

.ppc-integration #videoHowWorks .benefits__circle .benefits__circle--column .benefits__circle--column-single {
    display: flex;
    align-items: center;
    margin: 1rem 0
}

    .ppc-integration #videoHowWorks .benefits__circle .benefits__circle--column .benefits__circle--column-single span {
        background-color: #ffc502;
        border-radius: 50%;
        padding: 10px 18px;
        color: #fff
    }

    .ppc-integration #videoHowWorks .benefits__circle .benefits__circle--column .benefits__circle--column-single p {
        font-size: 18px;
        padding-left: 1.5rem;
        width: 500px;
        padding-right: 2rem;
        margin-bottom: 0
    }

@media(max-width:767px) {
    .ppc-integration #videoHowWorks .benefits__circle .benefits__circle--column .benefits__circle--column-single p {
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #videoHowWorks .benefits__circle .benefits__circle--column .benefits__circle--column-single {
        border-top: 1px solid #f3f3f3;
        padding: 10px 0;
        margin: 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #videoHowWorks .benefits__circle .benefits__circle--column {
        flex-direction: column;
        display: block
    }
}

.ppc-integration #videoHowWorks .benefits__circle .benefits__button {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 2rem 0
}

    .ppc-integration #videoHowWorks .benefits__circle .benefits__button .fa-arrow-right {
        margin-left: 10px;
        display: inline-block;
        color: #fff;
        font-size: 18px
    }

.ppc-integration #videoHowWorks .video--img-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    width: 150px;
    height: 150px
}

@media(max-width:767px) {
    .ppc-integration #videoHowWorks .video--img-button {
        width: 52px;
        height: 52px
    }
}

.ppc-integration #videoHowWorks .video-youtube__container {
    box-shadow: rgba(99,99,99,.5) 0 2px 8px 0;
    border-radius: 30px;
    margin: 0
}

.ppc-integration #features {
    margin: 6rem 0 3rem;
    text-align: center
}

    .ppc-integration #features .features__heading h2 {
        font-size: 36px;
        font-weight: 700;
        margin: 2rem 0;
        padding: 0 8rem
    }

@media(max-width:767px) {
    .ppc-integration #features .features__heading h2 {
        padding: 0 1rem 0 0;
        font-size: 28px;
        text-align: left
    }
}

.ppc-integration #features .features__boxes {
    display: flex;
    flex-wrap: wrap
}

    .ppc-integration #features .features__boxes .col-6 {
        flex: 0 0 48%;
        max-width: 48%
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #features .features__boxes .col-6 {
        flex: 0 0 100%;
        max-width: 100%
    }
}

.ppc-integration #features .features__boxes .features__boxes--single {
    padding: 4rem 3rem 0;
    overflow: hidden;
    background-color: #f3f3f3;
    border-radius: 20px;
    margin: 10px
}

@media(max-width:767px) {
    .ppc-integration #features .features__boxes .features__boxes--single {
        margin: 0 0 10px;
        padding: 2rem 0 0 1rem
    }
}

.ppc-integration #features .features__boxes .features__boxes--single h2 {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 1rem;
    text-align: left
}

.ppc-integration #features .features__boxes .features__boxes--single .features__boxes--special-paragraph {
    margin-bottom: 4rem
}

.ppc-integration #features .features__boxes .features__boxes--single p {
    margin-bottom: 2rem;
    text-align: left;
    padding-right: 20px
}

@media(max-width:767px) {
    .ppc-integration #features .features__boxes .features__boxes--single p {
        padding-right: 0
    }
}

.ppc-integration #features .features__boxes .features__boxes--single img {
    width: 100%;
    margin-bottom: -2rem
}

.ppc-integration #features .features__boxes .special__box--img {
    height: 440px;
    padding: 4rem 0 0 1rem
}

    .ppc-integration #features .features__boxes .special__box--img h2 {
        margin-left: 3rem
    }

@media(max-width:767px) {
    .ppc-integration #features .features__boxes .special__box--img h2 {
        margin-left: 0
    }
}

@media(max-width:767px) {
    .ppc-integration #features .features__boxes .special__box--img {
        height: fit-content;
        padding: 2rem 0 0 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #features .features__boxes .special__box--img {
        height: fit-content
    }
}

.ppc-integration #features .features__boxes .special__box--img p {
    padding-right: 5rem;
    margin-left: 3rem
}

@media(max-width:767px) {
    .ppc-integration #features .features__boxes .special__box--img p {
        padding-right: 0;
        margin-left: 0
    }
}

.ppc-integration #features .features__boxes .special__box--img img {
    margin-right: -6rem
}

@media(max-width:767px) {
    .ppc-integration #features .features__boxes .special__box--img img {
        margin-right: -3rem
    }
}

.ppc-integration #features .features__button {
    width: 100%;
    margin: 2rem 0
}

.ppc-integration #howToStart {
    margin-top: 7rem;
    text-align: center
}

    .ppc-integration #howToStart .container .features__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        width: 100%;
        margin-bottom: 3rem
    }

@media(max-width:767px) {
    .ppc-integration #howToStart .container .features__heading {
        align-items: flex-start
    }
}

.ppc-integration #howToStart .container .features__heading h2 {
    font-size: 36px;
    font-weight: 700;
    margin: 2rem 0;
    padding: 0 8rem
}

@media(max-width:767px) {
    .ppc-integration #howToStart .container .features__heading h2 {
        padding: 0 1rem 0 0;
        font-size: 28px;
        text-align: left
    }
}

.ppc-integration #howToStart .container .features__heading h3 {
    color: #767676;
    font-size: 18px;
    padding: 0 8rem;
    line-height: 1.89
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #howToStart .container .features__heading h3 {
        padding: 0 2rem
    }
}

@media(max-width:767px) {
    .ppc-integration #howToStart .container .features__heading h3 {
        font-size: 16px;
        padding: 0;
        text-align: left
    }
}

.ppc-integration #howToStart .container .features__boxes {
    display: flex;
    justify-content: space-between;
    margin: 1rem 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc-integration #howToStart .container .features__boxes {
        flex-direction: column
    }
}

.ppc-integration #howToStart .container .features__boxes .features__boxes--single {
    display: flex;
    width: 49%;
    height: 100%;
    padding: 4rem 3rem 2rem;
    overflow: hidden;
    background-color: #f3f3f3;
    border-radius: 20px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    position: relative
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc-integration #howToStart .container .features__boxes .features__boxes--single {
        width: 100%
    }

        .ppc-integration #howToStart .container .features__boxes .features__boxes--single:first-of-type {
            margin-bottom: 2.2rem
        }
}

.ppc-integration #howToStart .container .features__boxes .features__boxes--single .numberImg p {
    margin-top: -1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffc502;
    width: 65px;
    height: 65px;
    border-radius: 100px;
    color: #fff;
    font-size: 20px;
    font-weight: 700
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc-integration #howToStart .container .features__boxes .features__boxes--single .numberImg p {
        margin-top: 0
    }
}

.ppc-integration #howToStart .container .features__boxes .features__boxes--single .textBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    margin-left: 2rem
}

@media(max-width:767px) {
    .ppc-integration #howToStart .container .features__boxes .features__boxes--single .textBox {
        margin: 0 1rem
    }
}

.ppc-integration #howToStart .container .features__boxes .features__boxes--single .textBox h2 {
    font-size: 36px;
    font-weight: 700;
    text-align: left
}

.ppc-integration #howToStart .container .features__boxes .features__boxes--single .textBox p {
    font-size: 18px;
    font-weight: 400;
    text-align: left
}

@media(max-width:767px) {
    .ppc-integration #howToStart .container .features__boxes .features__boxes--single {
        margin: 0 0 10px;
        padding: 2rem 0 0 1rem
    }
}

.ppc-integration #howToStart .features__button {
    width: 100%;
    margin: 2rem 0
}

    .ppc-integration #howToStart .features__button a {
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
    }

.ppc-integration #howWorks {
    text-align: center;
    margin: 6rem 0
}

    .ppc-integration #howWorks .howWorks__heading h2 {
        font-size: 36px;
        font-weight: 700;
        margin: 2rem 0;
        padding: 0 8rem 2.2rem
    }

@media(max-width:767px) {
    .ppc-integration #howWorks .howWorks__heading h2 {
        padding: 0 1rem 0 0;
        font-size: 28px;
        text-align: left
    }
}

.ppc-integration #howWorks .howWorks__content {
    display: flex;
    justify-content: center
}

@media(max-width:767px) {
    .ppc-integration #howWorks .howWorks__content {
        flex-direction: column
    }
}

.ppc-integration #howWorks .howWorks__content__paragraph {
    text-align: left;
    width: 33%
}

@media(max-width:767px) {
    .ppc-integration #howWorks .howWorks__content__paragraph {
        width: 100%
    }
}

.ppc-integration #howWorks .howWorks__content__paragraph:first-child {
    padding: 0 1.5rem 0 0
}

@media(max-width:767px) {
    .ppc-integration #howWorks .howWorks__content__paragraph:first-child {
        padding: 0 1.5rem
    }
}

.ppc-integration #howWorks .howWorks__content__paragraph:nth-child(2) {
    padding: 0 1.5rem
}

.ppc-integration #howWorks .howWorks__content__paragraph:last-child {
    padding: 0 0 0 1.5rem
}

@media(max-width:767px) {
    .ppc-integration #howWorks .howWorks__content__paragraph:last-child {
        padding: 0 1.5rem
    }
}

.ppc-integration #howWorks .howWorks__content__paragraph p {
    font-size: 18px
}

.ppc-integration #howWorks .howWorks__content__paragraph:not(:last-child) {
    border-right: 1px solid #f3f3f3
}

@media(max-width:767px) {
    .ppc-integration #howWorks .howWorks__content__paragraph:not(:last-child) {
        border-right: 0
    }
}

.ppc-integration #howWorks .howWorks__content__paragraph-img {
    margin-bottom: 24px
}

    .ppc-integration #howWorks .howWorks__content__paragraph-img img {
        width: 52px
    }

.ppc-integration #reviews .container {
    padding-right: 0;
    padding-left: 0
}

    .ppc-integration #reviews .container .reviews__heading h2 {
        font-size: 36px;
        font-weight: 700;
        margin: 2rem 0;
        text-align: center
    }

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #reviews .container .reviews__heading h2 {
        text-align: center
    }
}

@media(max-width:767px) {
    .ppc-integration #reviews .container .reviews__heading h2 {
        font-size: 28px;
        text-align: left
    }
}

@media(max-width:767px) {
    .ppc-integration #reviews .container .reviews__heading {
        padding: 0 2rem
    }
}

.ppc-integration #chromeExtension {
    margin: 6rem 0 3rem;
    padding-bottom: 8rem;
    text-align: center;
    overflow: hidden;
    position: relative;
    background: linear-gradient(to top,#edeff5,#fff 115%)
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #chromeExtension {
        padding-bottom: 12rem
    }
}

.ppc-integration #chromeExtension .chromeExtension__heading h2 {
    font-size: 36px;
    font-weight: 700;
    margin: 2rem 0;
    padding: 0 8rem
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #chromeExtension .chromeExtension__heading h2 {
        padding: 0;
        text-align: center
    }
}

@media(max-width:767px) {
    .ppc-integration #chromeExtension .chromeExtension__heading h2 {
        padding: 0;
        font-size: 28px;
        text-align: left
    }
}

.ppc-integration #chromeExtension .chromeExtension__content {
    display: flex
}

@media(max-width:767px) {
    .ppc-integration #chromeExtension .chromeExtension__content {
        flex-direction: column-reverse
    }
}

.ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--descripton {
    text-align: left;
    margin-top: 6rem;
    display: flex;
    flex-direction: column
}

    .ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--descripton h2 {
        font-size: 36px;
        font-weight: 700;
        margin-bottom: 2rem
    }

@media(max-width:767px) {
    .ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--descripton h2 {
        font-size: 28px
    }
}

.ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--descripton p {
    margin-bottom: 2rem;
    padding-right: 10rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--descripton p {
        padding-right: 0
    }
}

.ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--descripton .btn-filled {
    width: 60%;
    padding: 10px 26px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--descripton .btn-filled {
        width: 100%
    }
}

.ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--descripton img {
    width: 30px;
    margin-right: 15px
}

.ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--image img {
    width: 100%
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--image img {
        display: none
    }
}

.ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--image-tablet {
    display: none
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #chromeExtension .chromeExtension__content .chromeExtension__content--image-tablet {
        position: absolute;
        display: block;
        width: 60%;
        right: -60px
    }
}

.ppc-integration #bannerBookaDemoBlack {
    margin-top: -8rem
}

    .ppc-integration #bannerBookaDemoBlack .bannerBookaDemoBlack--marginTop {
        margin-top: 8rem !important
    }

    .ppc-integration #bannerBookaDemoBlack .text-cta {
        padding-left: 0;
        text-align: center;
        padding: 7rem 7rem 0
    }

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #bannerBookaDemoBlack .text-cta {
        position: static !important;
        padding: 5rem 5rem 3rem !important
    }
}

@media(max-width:767px) {
    .ppc-integration #bannerBookaDemoBlack .text-cta .paragraph-text {
        margin: 2rem 0 0 !important;
        padding-right: 0 !important
    }
}

@media(max-width:767px) {
    .ppc-integration #bannerBookaDemoBlack .text-cta {
        font-size: 28px;
        padding: 0
    }
}

.ppc-integration #bannerBookaDemoBlack .text-cta h2 {
    padding-right: 0 !important
}

@media(max-width:767px) {
    .ppc-integration #bannerBookaDemoBlack .text-cta h2 {
        font-size: 28px;
        padding-top: 2rem
    }
}

.ppc-integration #bannerBookaDemoBlack .text-cta .links-cta {
    margin-top: 5rem;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    .ppc-integration #bannerBookaDemoBlack .text-cta .links-cta {
        display: flex;
        flex-direction: column
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-integration #bannerBookaDemoBlack .text-cta .links-cta {
        padding-bottom: 0 !important
    }
}

.ppc-integration #bannerBookaDemoBlack .text-cta .links-cta a:nth-of-type(2) {
    color: #fff;
    margin: 0 0 1rem 2rem;
    border-bottom: 1px solid #fff
}

@media(max-width:767px) {
    .ppc-integration #bannerBookaDemoBlack .text-cta .links-cta a:nth-of-type(2) {
        margin: 2rem 5rem;
        display: inline-block;
        font-size: 1rem
    }
}

.ppc-integration #bannerBookaDemoBlack .text-cta .links-cta a:nth-of-type(2):hover {
    color: #ffc502;
    font-weight: 600;
    border-bottom: 1px solid #ffc502
}

.integrations-chrome-plugin #chromePlugin {
    background-color: #f3f3f3;
    margin: 2rem 0;
    padding: 4rem 0
}

@media(min-width:768px) and (max-width:991px) {
    .integrations-chrome-plugin #chromePlugin {
        margin-bottom: 1rem;
        padding-bottom: 2rem
    }
}

@media(max-width:767px) {
    .integrations-chrome-plugin #chromePlugin .container {
        padding: 0
    }
}

.integrations-chrome-plugin #chromePlugin .container .row {
    margin-bottom: 6rem;
    flex-wrap: nowrap;
    align-items: center;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .integrations-chrome-plugin #chromePlugin .container .row {
        flex-direction: column;
        margin-bottom: 3rem
    }

        .integrations-chrome-plugin #chromePlugin .container .row:nth-of-type(2) {
            flex-direction: column-reverse
        }
}

.integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description {
    padding-right: 7rem
}

@media(min-width:768px) and (max-width:991px) {
    .integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description {
        text-align: center;
        padding: 0 3rem;
        margin-bottom: 2rem
    }
}

@media(max-width:767px) {
    .integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description {
        text-align: center;
        padding: 0 1rem;
        margin-bottom: 2rem
    }
}

.integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description h2 {
    font-size: 36px;
    font-weight: 700;
    text-align: left;
    margin-bottom: 0
}

.integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description h4 {
    font-size: 16px;
    text-align: left;
    padding: 3rem 0;
    font-family: nunito sans,sans-serif;
    line-height: 1.75
}

@media(max-width:767px) {
    .integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description h4 {
        padding-right: 1rem
    }
}

.integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description a {
    margin: 1rem 1rem 0 0
}

    .integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description a img {
        width: 32px;
        height: 32px;
        margin-right: 1rem
    }

@media(max-width:767px) {
    .integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__description a {
        padding: 15px 20px
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .integrations-chrome-plugin #chromePlugin .container .row .margin-left {
        margin-left: 5rem
    }
}

@media(max-width:767px) {
    .integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__img:nth-of-type(2) {
        margin-top: 2rem;
        margin-right: 2rem
    }
}

@media(max-width:767px) {
    .integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__img:nth-of-type(2) img {
        width: 125%
    }
}

.integrations-chrome-plugin #chromePlugin .container .row .chromePlugin__img img {
    width: 100%
}

.integrations-chrome-plugin #bannerBookaDemoBlack {
    margin: 5rem 0
}

@media(max-width:767px) {
    .integrations-chrome-plugin #bannerBookaDemoBlack {
        margin: -2rem 1rem 5rem
    }
}

.integrations-chrome-plugin #bannerBookaDemoBlack .container .text-cta {
    display: flex;
    padding: 3rem 4rem;
    align-items: center;
    flex-direction: row
}

@media(min-width:768px) and (max-width:991px) {
    .integrations-chrome-plugin #bannerBookaDemoBlack .container .text-cta {
        padding: 3rem !important;
        position: static
    }
}

@media(max-width:767px) {
    .integrations-chrome-plugin #bannerBookaDemoBlack .container .text-cta {
        padding: 2rem;
        flex-direction: column
    }
}

.integrations-chrome-plugin #bannerBookaDemoBlack .container .text-cta h2 {
    font-size: 28px;
    font-weight: 700;
    padding-right: 6rem !important;
    text-align: left
}

@media(min-width:768px) and (max-width:991px) {
    .integrations-chrome-plugin #bannerBookaDemoBlack .container .text-cta h2 {
        padding-right: 1rem !important
    }
}

@media(max-width:767px) {
    .integrations-chrome-plugin #bannerBookaDemoBlack .container .text-cta h2 {
        margin-bottom: 2rem;
        padding-top: 0 !important;
        padding-right: 0 !important
    }
}

.integrations-chrome-plugin #bannerBookaDemoBlack .container .text-cta .links-cta {
    margin: 0
}

.industries section#top {
    padding: 12rem 0 6rem;
    background-color: #fff
}

@media(max-width:767px) {
    .industries section#top {
        padding: 0 0 6rem
    }
}

.industries section#top .container .row .col {
    text-align: center
}

    .industries section#top .container .row .col h1 {
        font-size: 48px;
        font-weight: 800;
        width: 65%;
        margin: 0 auto 5rem
    }

@media(max-width:767px) {
    .industries section#top .container .row .col h1 {
        width: 100%
    }
}

.industries section#top .container .row .col p {
    font-size: 18px;
    font-weight: 600;
    width: 60%;
    margin: auto
}

.industries section#social-proof {
    padding-bottom: 5.5rem
}

.industries section#industries-list {
    margin-top: 8rem
}

    .industries section#industries-list .container .row {
        display: flex;
        justify-content: space-evenly
    }

        .industries section#industries-list .container .row .col-lg-4 {
            padding-right: 1rem;
            box-shadow: 0 25px 50px 0 rgba(101,105,167,.04);
            background-color: #fff;
            margin-bottom: 6.5rem;
            transition: all .2s ease-in-out
        }

            .industries section#industries-list .container .row .col-lg-4 img {
                margin-bottom: 4rem;
                width: 100%
            }

            .industries section#industries-list .container .row .col-lg-4 .text {
                padding: 0 1.5rem
            }

                .industries section#industries-list .container .row .col-lg-4 .text h2 {
                    min-height: 50px;
                    font-size: 24px;
                    font-weight: 800;
                    margin-bottom: 1rem
                }

                .industries section#industries-list .container .row .col-lg-4 .text p {
                    font-size: 16px;
                    font-weight: 700;
                    min-height: 100px
                }

            .industries section#industries-list .container .row .col-lg-4 p.more {
                font-size: 16px;
                font-weight: 700;
                color: #3c91e6;
                text-align: right;
                margin-right: 2rem
            }

                .industries section#industries-list .container .row .col-lg-4 p.more:hover {
                    color: #1b78d4
                }

            .industries section#industries-list .container .row .col-lg-4:hover {
                transform: scale(1.07)
            }

.industries #bannerBookaDemoBlack .container .row .text-cta {
    flex-direction: column
}

    .industries #bannerBookaDemoBlack .container .row .text-cta .paragraph-text {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding-right: 0
    }

        .industries #bannerBookaDemoBlack .container .row .text-cta .paragraph-text h2 {
            padding: 0;
            font-size: 48px;
            width: 75%;
            text-align: center
        }

@media(max-width:767px) {
    .industries #bannerBookaDemoBlack .container .row .text-cta .paragraph-text h2 {
        width: 100%
    }
}

.industries #bannerBookaDemoBlack .container .row .text-cta .paragraph-text p {
    color: #fff;
    font-size: 24px;
    margin-top: 2rem;
    width: 60%;
    text-align: center
}

@media(max-width:767px) {
    .industries #bannerBookaDemoBlack .container .row .text-cta .paragraph-text p {
        width: 100%
    }
}

.industries #bannerBookaDemoBlack .container .row .text-cta .links-cta {
    margin-top: 3rem
}

@media(max-width:767px) {
    .industries #bannerBookaDemoBlack .container .row .text-cta .links-cta {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }
}

.industries #bannerBookaDemoBlack .container .row .text-cta .links-cta a:nth-of-type(2) {
    color: #e9e9e9;
    border-bottom: 1px solid #e9e9e9;
    margin-left: 1.5rem
}

@media(max-width:767px) {
    .industries #bannerBookaDemoBlack .container .row .text-cta .links-cta a:nth-of-type(2) {
        margin-left: 0;
        margin-top: 2rem
    }
}

.industries #bannerBookaDemoBlack .container .row .text-cta .links-cta a:nth-of-type(2):hover {
    color: #1da44c;
    border-bottom: 1px solid #1da44c
}

.industries section#contact-us {
    margin-bottom: 7rem
}

    .industries section#contact-us .container .row .col-sm-12 {
        text-align: center
    }

        .industries section#contact-us .container .row .col-sm-12 h2 {
            font-size: 22px;
            font-weight: 800;
            font-family: nunito sans,sans-serif;
            margin-bottom: 1rem
        }

        .industries section#contact-us .container .row .col-sm-12 p {
            font-size: 18px;
            font-weight: 700
        }

            .industries section#contact-us .container .row .col-sm-12 p a, .industries section#contact-us .container .row .col-sm-12 p a:hover {
                color: #00bf71
            }

.single-industry section#top.accountants {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/accountants-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.accountants {
        background-image: none
    }
}

.single-industry section#top.agencies {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/agencies-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.agencies {
        background-image: none
    }
}

.single-industry section#top.architects-and-engineers {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/architects-and-engineers-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.architects-and-engineers {
        background-image: none
    }
}

.single-industry section#top.attorneys {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/attorneys-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.attorneys {
        background-image: none
    }
}

.single-industry section#top.constructions {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/constructions-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.constructions {
        background-image: none
    }
}

.single-industry section#top.education {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/education-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.education {
        background-image: none
    }
}

.single-industry section#top.healthcare {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/healthcare-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.healthcare {
        background-image: none
    }
}

.single-industry section#top.landscaping {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/landscaping-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.landscaping {
        background-image: none
    }
}

.single-industry section#top.manufacturing {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/manufacturing-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.manufacturing {
        background-image: none
    }
}

.single-industry section#top.non-profit-organizations {
    background-image: linear-gradient(90deg,#fff 58%,rgba(255,255,255,0) 75%),url("/img/greenbranding/industries/non-profit-organizations-hero.png")
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top.non-profit-organizations {
        background-image: none
    }
}

.single-industry section#top {
    background-position: right;
    background-repeat: no-repeat;
    background-size: contain
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top .container .row {
        text-align: center
    }
}

.single-industry section#top .container .row .col-lg-8 {
    left: -12rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top .container .row .col-lg-8 {
        left: 0
    }
}

.single-industry section#top .container .row .col-lg-8 h1.color-para {
    color: #00bf71;
    margin-bottom: 1rem;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0
}

.single-industry section#top .container .row .col-lg-8 h2 {
    font-size: 48px;
    font-weight: 800;
    position: relative;
    z-index: 12
}

.single-industry section#top .container .row .col-lg-8 p {
    margin: 1.5rem auto 3rem 0;
    font-size: 16px;
    font-weight: 400;
    width: 80%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top .container .row .col-lg-8 p {
        text-align: center;
        margin: 1.5rem auto 3rem
    }
}

.single-industry section#top .container .row .col-lg-8 .form-wrapper {
    display: flex;
    margin-bottom: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top .container .row .col-lg-8 .form-wrapper {
        justify-content: center;
        flex-direction: column
    }
}

.single-industry section#top .container .row .col-lg-8 .form-wrapper .btn-filled {
    padding: 12px 30px;
    margin-right: 1rem
}

@media(max-width:767px) {
    .single-industry section#top .container .row .col-lg-8 .form-wrapper .btn-filled {
        margin-right: 0
    }
}

.single-industry section#top .container .row .col-lg-8 .form-wrapper .btn-highlighted {
    border-radius: 26px;
    padding: 12px 30px
}

.single-industry section#top .container .row .col-lg-8 .checks-wrapper {
    padding: 0;
    display: flex
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .single-industry section#top .container .row .col-lg-8 .checks-wrapper {
        justify-content: center;
        flex-direction: column;
        align-items: center
    }
}

.single-industry section#top .container .row .col-lg-8 .checks-wrapper .checks {
    display: flex;
    align-items: baseline;
    margin-right: 1.5rem
}

    .single-industry section#top .container .row .col-lg-8 .checks-wrapper .checks i {
        margin-right: .5rem;
        font-size: 13px;
        color: #1b1b20
    }

    .single-industry section#top .container .row .col-lg-8 .checks-wrapper .checks p {
        font-size: 16px;
        margin-bottom: 0;
        width: 100%
    }

.single-industry section#feature-section .container {
    padding-top: 4rem
}

    .single-industry section#feature-section .container .col-sm-12 {
        margin-bottom: 4rem
    }

    .single-industry section#feature-section .container .row .text h2 {
        font-size: 36px;
        font-weight: 800
    }

    .single-industry section#feature-section .container .row .text p {
        color: #211f2d;
        font-size: 18px;
        font-weight: 600
    }

        .single-industry section#feature-section .container .row .text p.bolder {
            font-weight: 700
        }

    .single-industry section#feature-section .container .row .text .checks-wrapper {
        flex-direction: column
    }

        .single-industry section#feature-section .container .row .text .checks-wrapper .checks {
            flex-direction: row
        }

            .single-industry section#feature-section .container .row .text .checks-wrapper .checks p {
                text-align: left
            }

.single-industry section#values {
    margin: 8rem auto
}

    .single-industry section#values .row .col-sm-12 h2.header {
        font-size: 36px;
        font-weight: 800;
        text-align: center;
        margin: 2rem 0 10rem
    }

    .single-industry section#values .row .col-lg-12 .card .collapse .card-body .checks-wrapper {
        padding: 0;
        display: flex;
        flex-direction: column;
        margin-bottom: 1rem
    }

        .single-industry section#values .row .col-lg-12 .card .collapse .card-body .checks-wrapper .checks {
            display: flex;
            align-items: baseline;
            margin-right: 1.5rem
        }

            .single-industry section#values .row .col-lg-12 .card .collapse .card-body .checks-wrapper .checks i {
                margin-right: .5rem;
                font-size: 13px;
                color: #1b1b20
            }

            .single-industry section#values .row .col-lg-12 .card .collapse .card-body .checks-wrapper .checks p {
                font-size: 16px;
                margin-bottom: 0;
                width: 100%
            }

.single-industry section#integrations {
    margin-bottom: 3rem
}

.industries-agencies #top--industries {
    padding: 7.5rem 0;
    display: flex;
    justify-content: center
}

    .industries-agencies #top--industries .buttons {
        display: flex;
        gap: 24px;
        margin: 28px 0 96px
    }

        .industries-agencies #top--industries .buttons .singleButton span {
            font-family: sans-serif;
            font-size: 18px;
            font-weight: 400;
            line-height: 21.6px;
            text-align: left;
            color: #323333
        }

@media(max-width:767px) {
    .industries-agencies #top--industries .buttons {
        margin: 28px 0 40px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 24px
    }
}

@media(max-width:767px) {
    .industries-agencies #top--industries {
        padding: 2rem 0 7.5rem
    }
}

.industries-agencies #top--industries .cointainer--newGrid {
    margin: 0 13.38%
}

    .industries-agencies #top--industries .cointainer--newGrid .row {
        width: 100%;
        padding: 0 !important;
        margin: 0 !important;
        display: flex;
        align-items: center;
        justify-content: center
    }

        .industries-agencies #top--industries .cointainer--newGrid .row .top__integration {
            display: flex;
            flex-direction: column;
            align-items: center
        }

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--img-large {
        display: none
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--img-azure {
    width: 100% !important;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    border-radius: 13px;
    margin-top: 2rem;
    opacity: 0;
    transition: all 1s ease-in-out
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--img-azure-activeAnimation {
    margin-top: 0;
    opacity: 1
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--img-mobile {
    display: none
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--img-mobile {
        display: block
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration img {
    width: 100%
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--top-img img {
    width: 90px;
    height: 90px
}

    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--top-img img:nth-of-type(2) {
        margin-top: 4rem
    }

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--all-top-img {
    width: 204px !important
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description {
    position: relative;
    text-align: center;
    width: 80%;
    margin-top: 2rem
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description {
        text-align: left
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description h1, .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description h2, .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description span {
    font-size: 52px;
    line-height: 1.1;
    display: inline;
    width: 100%;
    font-weight: 700
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description h1, .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description h2, .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description span {
        font-size: 48px
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description p {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    margin: 2rem 0;
    padding: 0 6rem
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--description p {
        text-align: left;
        padding: 0
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--button {
    text-align: center
}

    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--button a {
        margin: 1rem 0
    }

    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .top__integration--button h3 {
        font-size: 14px;
        color: #ffc502;
        font-weight: 600
    }

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper {
    margin-bottom: 2rem;
    padding-left: 10rem
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper {
        padding-left: 2rem
    }
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper {
        padding-left: 0
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper input[type=email] {
    border: none;
    width: 35%;
    outline: none;
    font-size: 14px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper input[type=email] {
        width: 75%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper input[type=email] {
        width: 40%
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper button {
    padding: 12px 10px;
    color: #fff;
    width: 25%;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #ffc502;
    position: relative;
    background-color: #ffc502;
    left: -3rem;
    margin-top: 0
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper button {
        left: unset;
        right: 0;
        width: 75%;
        padding: 10px 0;
        margin-top: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper button {
        padding: 14px 7px
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper .terms-submission {
    margin: 20px 0;
    font-size: 13px;
    color: #1b1b20;
    opacity: .6;
    width: 100%;
    padding-left: 2rem
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper .terms-submission {
        width: 100%;
        padding: 0 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper .terms-submission {
        padding-right: 0
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .form-wrapper .terms-submission a {
    margin: 0 2px;
    color: #ffc502
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .button-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .button-wrapper {
        flex-direction: column;
        align-items: center
    }
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .button-wrapper .signup_google_button {
        margin-top: 1rem
    }
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .button-wrapper span {
    font-size: 16px;
    color: #767676
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .button-wrapper img {
    margin-left: .2rem;
    width: 32px
}

.industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .button-wrapper .button-wrapper__google {
    display: flex;
    margin-top: 1rem;
    width: 75%;
    text-align: center
}

@media(max-width:767px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .button-wrapper .button-wrapper__google {
        display: block;
        margin-left: 0;
        text-align: center;
        margin-top: 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #top--industries .cointainer--newGrid .row .top__integration .form .button-wrapper .button-wrapper__google {
        margin-left: 0
    }
}

.industries-agencies #youtube-video {
    margin: 140px 0 20px
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #youtube-video {
        margin: 120px 0 20px
    }
}

@media(max-width:767px) {
    .industries-agencies #youtube-video {
        margin: 96px 0 20px
    }
}

.industries-agencies #youtube-video .container .video-youtube {
    margin: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-agencies #youtube-video .container .video-youtube {
        width: 100%
    }
}

.industries-agencies #benefitScroll {
    margin-top: 6rem
}

    .industries-agencies #benefitScroll .cointainer--newGrid .row {
        justify-content: center
    }

        .industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__heading {
            text-align: center;
            width: 100%
        }

@media(max-width:767px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__heading {
        text-align: left;
        margin-left: 1rem
    }
}

.industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__heading h2 {
    font-size: 36px;
    font-weight: 700;
    margin: 2rem 0
}

@media(max-width:767px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__heading h2 {
        font-size: 28px;
        text-align: left
    }
}

.industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__heading h3 {
    color: #767676;
    font-size: 18px;
    padding: 0 15rem;
    line-height: 1.89
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__heading h3 {
        padding: 0 2rem
    }
}

@media(max-width:767px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__heading h3 {
        font-size: 16px;
        padding: 0;
        text-align: left
    }
}

.industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__heading img {
    margin: 2rem 0;
    width: 100%
}

.industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__Fixed {
    display: flex;
    flex-direction: row-reverse;
    height: 300vh
}

.industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__Fixed__leftSide {
    width: 585px !important;
    padding-right: 4rem
}

    .industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__Fixed__leftSide h3 {
        font-size: 18px;
        font-weight: 700;
        padding: 0 0 1rem
    }

    .industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__Fixed__leftSide p {
        font-size: 18px;
        padding: 0 0 1.5rem
    }

    .industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__Fixed__leftSide div {
        height: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: center
    }

.industries-agencies #benefitScroll .cointainer--newGrid .row .benefitScroll__Fixed__rightSide {
    width: 585px !important;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 !important
}

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll {
    width: 100%;
    position: relative;
    display: flex;
    margin-top: -10rem
}

@media(max-width:1300px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll {
        display: none
    }
}

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll .onScroll__stepScroll {
    width: 50%;
    padding-left: 15.46%;
    position: relative
}

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll .onScroll__stepScroll--stepsProcess {
    padding: 2rem 5rem 2rem 0;
    height: 90vh;
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin-top: 5rem;
    background-image: linear-gradient(transparent 12%,currentColor 30%,currentColor 70%,transparent 86%);
    background-clip: text;
    -webkit-background-clip: text;
    background-attachment: fixed
}

    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll .onScroll__stepScroll--stepsProcess h2 {
        margin-bottom: 4.75rem;
        font-size: 36px;
        font-weight: 700
    }

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll .onScroll__stepScroll--stepsProcess-title-step {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.44;
    color: transparent
}

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll .onScroll__stepScroll--stepsProcess-text-step {
    font-size: 18px;
    line-height: 1.44;
    color: transparent
}

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll .onScroll__stepImage {
    width: 50%;
    position: sticky;
    height: 100vh;
    top: 0
}

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll .onScroll__stepImage-imageStep {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: 0 !important;
    transform: translate(-50%,-35%);
    opacity: 0
}

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScroll .onScroll__stepImage-imageStepActive {
    opacity: 1;
    -webkit-transition: .4s ease;
    -moz-transition: .4s ease;
    -ms-transition: .4s ease;
    -o-transition: .4s ease;
    transition: .4s ease
}

.industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile {
    display: none
}

@media(max-width:1299px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile {
        display: flex;
        justify-content: center;
        flex-direction: column;
        width: 100%
    }
}

@media(max-width:1299px) and (max-width:767px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile {
        padding-left: 1rem
    }
}

@media(max-width:1299px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        overflow-x: hidden
    }

        .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile h2 {
            font-size: 36px;
            font-weight: 700;
            align-self: center !important;
            width: 60%;
            text-align: center;
            padding: 1.5rem 0 2rem
        }
}

@media(max-width:1299px) and (max-width:767px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile h2 {
        align-self: flex-start !important;
        text-align: left;
        width: 90%
    }
}

@media(max-width:1299px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile-titleStep {
        font-size: 18px;
        font-weight: 700;
        padding-right: 1rem
    }
}

@media(max-width:1299px) and (min-width:768px) and (max-width:991px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile-titleStep {
        padding: 0 4rem
    }
}

@media(max-width:1299px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile-textStep {
        font-size: 18px;
        font-weight: 400;
        padding: 0 1rem 1.5rem 0
    }
}

@media(max-width:1299px) and (min-width:768px) and (max-width:991px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile-textStep {
        padding: 0 4rem
    }
}

@media(max-width:1299px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile-img {
        width: 100% !important;
        margin: 1.5rem 0 7.5rem 2.5rem
    }
}

@media(max-width:1299px) and (max-width:767px) {
    .industries-agencies #benefitScroll .cointainer--newGrid .row #onScrollMobile .onScrollMobile-img {
        margin: 1.5rem 0 3rem 2.5rem
    }
}

.industries-agencies #integrations .cointainer--newGrid {
    margin: 0 15.46%
}

@media(max-width:767px) {
    .industries-agencies #integrations .cointainer--newGrid {
        margin-left: 2rem;
        margin-right: 2rem
    }
}

@media(max-width:991px) {
    .industries-agencies #integrations .cointainer--newGrid .row {
        flex-direction: column
    }
}

.industries-agencies #integrations .cointainer--newGrid .row .left-container {
    display: flex;
    align-items: flex-start
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: left !important;
    padding: 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 {
        padding: 0
    }
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 a.plugin_buttons {
    font-size: 16px;
    border-radius: 40px;
    padding: 15px 40px
}

@media(max-width:767px) {
    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 a.plugin_buttons {
        padding: 12px 40px;
        width: 90%
    }
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 .first-paragraph {
    padding-right: 5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 .first-paragraph {
        padding-right: 0
    }
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 .second-paragraph {
    margin-top: 3rem;
    padding-right: 5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 .second-paragraph {
        padding-right: 0
    }
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 p.green {
    color: #00bf71;
    margin-bottom: 1rem;
    font-size: 16px;
    font-weight: 600
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 h2 {
    font-size: 36px;
    font-weight: 700;
    position: relative;
    z-index: 1
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 p {
    margin: 1rem 0 0;
    font-size: 18px;
    font-weight: 600;
    color: #1b1b20
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 .btn-check-integrations {
    color: #00bf71;
    font-size: 16px;
    font-weight: 800;
    margin-top: 3rem;
    white-space: nowrap;
    padding-bottom: 2rem
}

    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 .btn-check-integrations:hover {
        text-decoration: underline;
        color: #008a51
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 {
        text-align: center
    }

        .industries-agencies #integrations .cointainer--newGrid .row .col-lg-5 h2 {
            width: 100%;
            margin: 1rem auto
        }
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 img {
    width: 52px;
    height: 52px
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .wrapper:nth-of-type(1) a:nth-of-type(2) img {
    width: 75px;
    height: 75px
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .wrapper:nth-of-type(2) a:nth-of-type(2) img {
    width: 46px;
    height: 54px
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .wrapper:nth-of-type(4) a:nth-of-type(2) img {
    width: 42px;
    height: 52px
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .white-bg {
    margin-bottom: 2.3rem;
    width: 135px;
    height: 135px;
    border-radius: 31px;
    transition: all .2s ease-in-out;
    background-color: #fff;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    position: relative;
    box-shadow: 4px 2px 16px 0 rgba(0,0,0,.06)
}

    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .white-bg:not(:nth-of-type(1)) {
        margin-left: 4.6rem
    }

    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .white-bg:hover {
        box-shadow: 2px -3px 26px 0 rgba(200,215,243,.5)
    }

        .industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .white-bg:hover > .integration-name {
            transform: scale(1.07)
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .white-bg {
        margin-left: 5px !important;
        margin-right: 5px !important
    }
}

.industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .wrapper {
        justify-content: space-evenly
    }

        .industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .wrapper:nth-of-type(1) {
            margin-top: 4rem
        }
}

@media(min-width:768px) and (max-width:991px) and (min-width:768px) and (max-width:991px),(max-width:767px) and (min-width:768px) and (max-width:991px) {
    .industries-agencies #integrations .cointainer--newGrid .row .col-lg-7 .wrapper {
        justify-content: space-evenly
    }
}

.industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid {
    margin: 0 13.38%;
    background-color: #1b1b20;
    border-radius: 26px;
    box-shadow: 0 4px 10px 2px rgba(0,0,0,.12);
    color: #fff;
    margin-bottom: 80px
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid {
        margin: 0 2rem 80px
    }
}

@media(max-width:767px) {
    .industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid {
        margin: 0 0 80px
    }
}

.industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid .row {
    margin: 0 !important
}

    .industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid .row .text-cta {
        display: flex;
        padding: 4rem;
        align-items: center;
        justify-content: space-around;
        flex-direction: row
    }

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid .row .text-cta {
        padding: 3rem;
        position: static
    }
}

@media(max-width:767px) {
    .industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid .row .text-cta {
        padding: 2rem;
        flex-direction: column
    }
}

.industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid .row .text-cta h2 {
    font-size: 28px;
    font-weight: 700;
    padding-right: 14rem
}

@media(max-width:1465px) {
    .industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid .row .text-cta h2 {
        padding-right: 4rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid .row .text-cta h2 {
        padding-right: 1rem
    }
}

@media(max-width:767px) {
    .industries-agencies #bannerBookaDemoBlack--industries .cointainer--newGrid .row .text-cta h2 {
        padding-right: 0
    }
}

.industries-agencies .special-paragraph {
    font-size: 14px !important;
    color: #ffc502 !important;
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
    margin-bottom: 2rem !important
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-agencies .special-paragraph {
        text-align: center
    }
}

.industries-agencies .form-wrapper {
    margin-bottom: 4rem !important
}

    .industries-agencies .form-wrapper .button-wrapper {
        width: 850px
    }

@media(min-width:768px) and (max-width:991px) {
    .industries-agencies .form-wrapper .button-wrapper {
        width: 700px !important
    }
}

@media(max-width:767px) {
    .industries-agencies .form-wrapper .button-wrapper {
        width: 350px
    }
}

.industries-agencies .startTrackingButton {
    margin-top: -5rem
}

@media(max-width:767px) {
    .industries-agencies .startTrackingButton {
        display: none !important
    }
}

.free-demo .free-demo__calendly {
    padding: 4rem 0
}

    .free-demo .free-demo__calendly .free-demo__calendly-wrapper {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding-left: 5rem
    }

@media(max-width:767px) {
    .free-demo .free-demo__calendly .free-demo__calendly-wrapper {
        padding-left: 1rem
    }
}

.free-demo .free-demo__calendly .free-demo__calendly-wrapper .free-demo__calendly-wrapper--head {
    position: relative
}

    .free-demo .free-demo__calendly .free-demo__calendly-wrapper .free-demo__calendly-wrapper--head h2 {
        font-size: 48px;
        font-weight: 800;
        margin-bottom: 2rem
    }

@media(max-width:767px) {
    .free-demo .free-demo__calendly .free-demo__calendly-wrapper .free-demo__calendly-wrapper--head h2 {
        font-size: 42px;
        margin-bottom: 3rem
    }
}

.free-demo .free-demo__calendly .free-demo__calendly-wrapper .free-demo__calendly-wrapper--head img {
    position: absolute;
    right: 30%;
    top: 50%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .free-demo .free-demo__calendly .free-demo__calendly-wrapper .free-demo__calendly-wrapper--head img {
        display: none
    }
}

.free-demo .free-demo__calendly .free-demo__calendly-wrapper .wrapper {
    display: flex;
    flex-direction: column
}

@media(max-width:767px) {
    .free-demo .free-demo__calendly .free-demo__calendly-wrapper .wrapper {
        padding-left: 3rem
    }
}

.free-demo .free-demo__calendly .free-demo__calendly-wrapper .wrapper h3 {
    font-size: 24px;
    font-weight: 800
}

.free-demo .free-demo__calendly .free-demo__calendly-wrapper .wrapper .free-demo__calendly--checks {
    display: flex;
    align-items: baseline;
    margin-right: 1.5rem
}

    .free-demo .free-demo__calendly .free-demo__calendly-wrapper .wrapper .free-demo__calendly--checks img {
        margin-left: -3rem;
        padding-right: 30px
    }

    .free-demo .free-demo__calendly .free-demo__calendly-wrapper .wrapper .free-demo__calendly--checks i {
        margin-right: .5rem;
        font-size: 13px;
        color: #1b1b20
    }

    .free-demo .free-demo__calendly .free-demo__calendly-wrapper .wrapper .free-demo__calendly--checks p {
        font-size: 19px;
        font-weight: 600;
        margin-bottom: 10px
    }

.free-demo .free-demo__calendly .free-demo__calendly-wrapper .free-demo__calendly--button p {
    margin: 0;
    padding: 1rem 0
}

.free-demo .free-demo__calendly .free-demo__calendly-wrapper .free-demo__calendly--button .btn-filled {
    color: #fff;
    display: inline-block
}

@media(max-width:767px) {
    .free-demo .free-demo__calendly .free-demo__calendly-wrapper .free-demo__calendly--button {
        text-align: center
    }
}

@media(max-width:767px) {
    .free-demo .free-demo__calendly .free-demo__calendly-widget {
        margin-top: 2rem
    }
}

.free-demo .free-demo__calendly .free-demo__calendly-widget .calendly-inline-widget iframe {
    box-shadow: 0 4px 10px 2px rgba(0,0,0,.17) !important;
    border-radius: 26px !important
}

.free-demo .free-demo__calendly .free-demo__calendly-widget .calendly-mobile {
    overflow-y: initial !important
}

.free-demo #social-proof {
    background-color: #ffc502;
    width: 100%;
    height: 390px;
    padding-bottom: 0 !important
}

@media(max-width:767px) {
    .free-demo #social-proof {
        height: 600px
    }
}

.free-demo #social-proof .row {
    border-bottom: none !important
}

@media(max-width:767px) {
    .free-demo #social-proof .row .social-proof__heading {
        padding-right: 30px;
        padding-left: 30px
    }
}

.free-demo #social-proof .row .social-proof__heading h3 {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    font-family: nunito sans,sans-serif;
    text-align: center
}

@media(max-width:767px) {
    .free-demo #social-proof .row .social-proof__heading h3 {
        line-height: 34px
    }
}

.free-demo #reviews {
    margin-bottom: 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .free-demo #reviews {
        height: 100%
    }
}

.free-demo #reviews .mobile-reviews {
    display: none
}

@media(max-width:767px) {
    .free-demo #reviews .mobile-reviews {
        display: block
    }
}

.free-demo #reviews .mobile-reviews .carousel-inner {
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

@media(max-width:767px) {
    .free-demo #reviews .mobile-reviews .carousel-inner {
        margin: 0 2rem;
        overflow: inherit
    }
}

@media(max-width:767px) {
    .free-demo #reviews .mobile-reviews .carousel-indicators {
        bottom: -5rem
    }
}

.free-demo #reviews .mobile-reviews .carousel-indicators li {
    border-radius: 50%;
    width: 10px;
    height: 10px;
    margin-right: 20px;
    background-color: #d9d9d9
}

.free-demo #reviews .mobile-reviews .carousel-indicators .active {
    background-color: #ffc502 !important
}

.free-demo #reviews .large-reviews {
    display: block
}

@media(max-width:767px) {
    .free-demo #reviews .large-reviews {
        display: none
    }
}

.free-demo #reviews .header h5 {
    position: relative;
    top: -15rem
}

.free-demo #reviews .header p {
    position: relative;
    top: -14rem;
    font-size: 36px;
    line-height: 40px;
    font-weight: 700;
    padding: 2rem 10rem;
    text-align: center
}

@media(max-width:767px) {
    .free-demo #reviews .header p {
        padding: 0;
        text-align: left;
        margin: 1rem 0;
        font-size: 28px;
        top: -16rem
    }
}

.free-demo #reviews .customer-review {
    position: relative;
    top: -10rem
}

@media(min-width:768px) and (max-width:991px) {
    .free-demo #reviews .customer-review {
        top: -4rem
    }
}

.free-demo #reviews .customer-review .green {
    font-size: 16px;
    padding: 22px 0;
    font-weight: 400
}

.free-demo #reviews .customer-review .col-lg-3 {
    max-width: 23%
}

@media(max-width:767px) {
    .free-demo #reviews .customer-review .col-lg-3 {
        max-width: 100%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .free-demo #reviews .customer-review .col-md-6 {
        max-width: 46%
    }
}

.free-demo #reviews .customer-review .box-reviews {
    border-radius: 26px;
    padding: 30px 35px;
    margin-right: 20px;
    height: fit-content;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

    .free-demo #reviews .customer-review .box-reviews:nth-of-type(1) .content {
        margin-top: -40px
    }

@media(max-width:767px) {
    .free-demo #reviews .customer-review .box-reviews:nth-of-type(1) .content {
        margin-top: 0
    }
}

@media(max-width:767px) {
    .free-demo #reviews .customer-review .box-reviews {
        margin-right: 0;
        padding: 25px;
        height: 450px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .free-demo #reviews .customer-review .box-reviews {
        margin-bottom: 20px
    }
}

@media(max-width:767px) {
    .free-demo #reviews .customer-review .box-reviews .content p {
        padding-right: 1rem
    }
}

.free-demo #reviews .customer-review .box-reviews .content .green {
    color: #767676
}

    .free-demo #reviews .customer-review .box-reviews .content .green span {
        font-weight: 700
    }

.free-demo #reviews .customer-review .box-reviews .card-img {
    width: 85%
}

@media(max-width:767px) {
    .free-demo #reviews .customer-review .box-reviews .card-img {
        width: 80%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .free-demo #reviews .customer-review .box-reviews .card-img {
        width: 70%
    }
}

.free-demo #reviews .customer-review .box-reviews .customer-review__img {
    text-align: center
}

.free-demo #reviews .customer-review .box-reviews .review-img {
    position: relative;
    top: -60px
}

.free-demo #freeDemoYoutube {
    margin-bottom: 5rem
}

    .free-demo #freeDemoYoutube .video-youtube__container {
        margin-top: 3rem !important;
        width: 100%;
        height: 540px
    }

@media(min-width:768px) and (max-width:991px) {
    .free-demo #freeDemoYoutube .video-youtube__container {
        margin: 0 !important
    }
}

@media(max-width:767px) {
    .free-demo #freeDemoYoutube .video-youtube__container {
        margin: 0 !important;
        height: 250px
    }
}

.free-demo #freeDemoYoutube .video-youtube__container iframe {
    border-radius: 14px
}

.free-demo #freeDemoYoutube h2 {
    font-size: 36px;
    font-family: lato,sans-serif;
    font-weight: 700;
    text-align: center;
    padding: 2rem 14rem
}

@media(max-width:767px) {
    .free-demo #freeDemoYoutube h2 {
        text-align: left;
        padding: 2rem 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .free-demo #freeDemoYoutube h2 {
        text-align: left;
        padding: 2rem 0
    }
}

.free-demo #mainSolution {
    margin: 3rem 0;
    background: linear-gradient(to top,#edeff5,#fff 115%)
}

    .free-demo #mainSolution .container .row .mainSolution__grid-container {
        display: flex;
        justify-content: center;
        margin-bottom: 3rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free-demo #mainSolution .container .row .mainSolution__grid-container {
        flex-wrap: wrap
    }
}

.free-demo #mainSolution .container .row .mainSolution__grid-container .mainSolution__grid-container--single {
    align-items: center;
    text-align: center;
    padding: 30px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(min-width:768px) and (max-width:991px) {
    .free-demo #mainSolution .container .row .mainSolution__grid-container .mainSolution__grid-container--single {
        margin: 0 2rem 2rem 0 !important
    }
}

@media(max-width:767px) {
    .free-demo #mainSolution .container .row .mainSolution__grid-container .mainSolution__grid-container--single {
        margin: 2rem 0;
        padding: 30px 60px
    }
}

.free-demo #mainSolution .container .row .mainSolution__grid-container .mainSolution__grid-container--single h3 {
    font-size: 24px;
    font-weight: 600;
    margin: 20px 0
}

.free-demo #mainSolution .container .row .mainSolution__grid-container .special-magin {
    margin-right: 1.5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free-demo #mainSolution .container .row .mainSolution__grid-container .special-magin {
        margin-right: 0
    }
}

.product_updates section#top .container .row .col-sm-12 img {
    position: absolute
}

@media(max-width:767px) {
    .product_updates section#top .container .row .col-sm-12 img {
        display: none
    }
}

.product_updates section#top .container .row .col-sm-12 .gear1 {
    left: 3rem;
    top: 1rem;
    width: 8%
}

@media(min-width:768px) and (max-width:991px) {
    .product_updates section#top .container .row .col-sm-12 .gear1 {
        left: 1rem
    }
}

.product_updates section#top .container .row .col-sm-12 .gear2 {
    width: 5%;
    left: 8rem;
    bottom: -2rem
}

@media(min-width:768px) and (max-width:991px) {
    .product_updates section#top .container .row .col-sm-12 .gear2 {
        left: 4rem;
        bottom: 1rem
    }
}

.product_updates section#top .container .row .col-sm-12 .gear3 {
    right: 4rem;
    bottom: 1rem;
    width: 10%
}

@media(min-width:768px) and (max-width:991px) {
    .product_updates section#top .container .row .col-sm-12 .gear3 {
        right: 0
    }
}

.product_updates section#top .container .row .col-sm-12 h1 {
    text-align: center;
    width: 100%;
    font-size: 38px;
    font-weight: 700;
    margin-bottom: 2rem
}

.product_updates section#top .container .row .col-sm-12 p {
    text-align: center;
    font-size: 16px;
    font-weight: 400
}

.product_updates section#product_updates_list a, .product_updates section#product_updates_list a:hover, .product_updates section#product_updates_list a:visited, .product_updates section#product_updates_list a:focus {
    color: #00bf71
}

.product_updates section#product_updates_list .container {
    margin: 3rem auto
}

    .product_updates section#product_updates_list .container .date {
        position: relative;
        z-index: 1;
        border-bottom: 2px solid #f3f3f3
    }

        .product_updates section#product_updates_list .container .date h2 {
            font-size: 28px;
            font-weight: 700;
            padding-bottom: 1rem;
            text-align: center
        }

        .product_updates section#product_updates_list .container .date.fixed {
            position: fixed;
            top: 90px;
            width: 60%;
            box-sizing: border-box;
            z-index: 123;
            background-color: #fff
        }

@media(max-width:767px) {
    .product_updates section#product_updates_list .container .date.fixed {
        top: 80px;
        width: 100%
    }
}

.product_updates section#product_updates_list .container .date.fixed.absolute {
    position: absolute
}

.product_updates section#product_updates_list .container .followWrap {
    width: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center
}

.product_updates section#product_updates_list .container .row {
    margin-bottom: 4rem;
    justify-content: space-evenly
}

    .product_updates section#product_updates_list .container .row span.label {
        font-size: 24px;
        font-weight: 700;
        margin-bottom: 2rem
    }

    .product_updates section#product_updates_list .container .row div.text h3 {
        margin: 2rem auto;
        font-size: 20px;
        font-weight: 600;
        text-align: center
    }

    .product_updates section#product_updates_list .container .row div.text li {
        text-align: center;
        list-style: inside
    }

    .product_updates section#product_updates_list .container .row div.text p {
        margin: 0 auto 2rem;
        text-align: center;
        width: 60%;
        font-size: 18px
    }

@media(max-width:767px) {
    .product_updates section#product_updates_list .container .row div.text p {
        width: 100%
    }
}

.product_updates section#product_updates_list .container .row div.img {
    text-align: center
}

    .product_updates section#product_updates_list .container .row div.img img {
        width: 100%;
        border-radius: 8px;
        box-shadow: 2px 2px 37px #d4d4d4
    }

.product_updates section#product_updates_list .container .row div.fixes {
    text-align: center;
    margin-top: 4rem
}

    .product_updates section#product_updates_list .container .row div.fixes ul li {
        list-style-position: inside;
        width: 80%;
        margin: .5rem auto;
        text-align: center
    }

@media(max-width:767px) {
    .product_updates section#product_updates_list .container .row div.fixes ul li {
        width: 100%
    }
}

.security #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link.btn-menu-login.btn-highlighted {
    background: 0 0;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset
}

.security a.link, .security a.link:visited, .security a.link:hover, .security a.link:focus, .security a.link:active {
    color: #00bf71
}

.security section#top {
    padding: 0;
    margin-top: 0
}

    .security section#top .top-section {
        display: flex;
        padding: 7rem 4rem;
        justify-content: space-around;
        background-color: #f3f3f3
    }

@media(max-width:767px) {
    .security section#top .top-section {
        padding: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .security section#top .top-section {
        padding: 4rem;
        flex-direction: column
    }
}

.security section#top .top-section .nav-menu-content {
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px) {
    .security section#top .top-section .nav-menu-content {
        display: flex;
        justify-content: space-between;
        flex-direction: row
    }
}

.security section#top .top-section .nav-menu-content a {
    display: block;
    margin-top: 1rem;
    font-size: 18px;
    color: #767676;
    font-weight: 700
}

.security section#top .top-section .nav-menu-content .active {
    color: #1b1b20;
    display: inline-block;
    border-bottom: 1px solid #ffc502
}

@media(max-width:767px) {
    .security section#top .top-section .nav-menu-content {
        display: none
    }
}

.security section#top .top-section .header-content {
    flex: .66
}

@media(max-width:767px) {
    .security section#top .top-section .header-content {
        flex: 1
    }
}

@media(min-width:768px) and (max-width:991px) {
    .security section#top .top-section .header-content {
        margin-top: 4rem
    }
}

.security section#top .top-section .header-content h1 {
    font-size: 52px;
    font-weight: 800;
    width: 50%
}

@media(max-width:767px) {
    .security section#top .top-section .header-content h1 {
        width: 100%;
        font-size: 42px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .security section#top .top-section .header-content h1 {
        width: 100%
    }
}

.security section#top .top-section .header-content p {
    font-size: 18px;
    width: 65%;
    padding: 1rem 0;
    color: #767676
}

@media(max-width:767px) {
    .security section#top .top-section .header-content p {
        width: 75%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .security section#top .top-section .header-content p {
        width: 100%
    }
}

.security section#top .row {
    margin-left: 14rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .security section#top .row {
        margin-left: 0
    }
}

.security section#top .row h2 {
    font-size: 36px;
    font-weight: 700;
    width: 85%
}

.security section#top .row .col-sm-12 {
    text-align: left
}

    .security section#top .row .col-sm-12 h1 {
        font-weight: 800;
        color: #1b1b20;
        font-size: 36px;
        width: 100%
    }

    .security section#top .row .col-sm-12 p {
        font-size: 16px;
        font-weight: 400;
        color: #1b1b20;
        margin: 2rem auto
    }

@media(max-width:767px) {
    .security section#top .row .col-sm-12 p {
        margin-right: 4rem
    }
}

.security section#top .row .col-sm-12 p span a {
    color: #ffc502;
    font-weight: 700
}

.security section#top .row .col-sm-12 .section-subtitle {
    font-size: 14px;
    font-weight: 700;
    color: #ffc502
}

.security section#top .row .col-sm-12 .heading-img {
    display: flex;
    align-items: center
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .security section#top .row .col-sm-12 .heading-img {
        flex-direction: column;
        align-items: flex-start
    }
}

.security section#top .row .col-sm-12 .heading-img h2 {
    margin-left: 1.8rem;
    margin-bottom: 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .security section#top .row .col-sm-12 .heading-img h2 {
        margin-left: 0
    }
}

.security section#top .row .col-sm-12 .heading-img img {
    margin-left: -6rem;
    width: 70px;
    height: 70px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .security section#top .row .col-sm-12 .heading-img img {
        margin-left: 0;
        margin-bottom: 1rem
    }
}

.bodyPress section#top {
    background-color: #fafffd;
    position: relative;
    padding: 6rem 0 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .bodyPress section#top {
        text-align: center
    }
}

.bodyPress section#top .img-container {
    position: absolute;
    top: 15rem;
    left: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .bodyPress section#top .img-container {
        text-align: left
    }
}

.bodyPress section#top .img-container img {
    width: 40%
}

.bodyPress section#top .container .row {
    display: flex;
    align-items: center;
    vertical-align: middle
}

    .bodyPress section#top .container .row h2 {
        font-size: 42px;
        font-weight: 800
    }

    .bodyPress section#top .container .row p {
        font-size: 18px;
        font-weight: 600
    }

.bodyPress section#download-content {
    padding: 4rem 0 0;
    background-color: #fafffd
}

    .bodyPress section#download-content .container .row .col-md-12 p {
        font-size: 24px;
        font-weight: 800;
        text-align: center;
        margin: 10rem auto 6rem
    }

    .bodyPress section#download-content .container .row .col-md-12 .icon, .bodyPress section#download-content .container .row .col-md-12 .logo, .bodyPress section#download-content .container .row .col-md-12 .transparent {
        height: 120px;
        border-radius: 31px;
        box-shadow: 4px 2px 16px 0 rgba(0,0,0,.06);
        display: flex;
        align-items: center;
        justify-content: center
    }

    .bodyPress section#download-content .container .row .col-md-12 .icon {
        width: 120px;
        background-color: #fff
    }

    .bodyPress section#download-content .container .row .col-md-12 .logo, .bodyPress section#download-content .container .row .col-md-12 .transparent {
        width: 100%
    }

    .bodyPress section#download-content .container .row .col-md-12 .transparent {
        background-color: #1b1b20
    }

    .bodyPress section#download-content .container .row .wrapper {
        display: flex;
        justify-content: space-evenly;
        margin-bottom: 2rem
    }

        .bodyPress section#download-content .container .row .wrapper img {
            width: 100%
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .bodyPress section#download-content .container .row .wrapper {
        flex-direction: column;
        align-items: center
    }

        .bodyPress section#download-content .container .row .wrapper a {
            margin-bottom: 2rem
        }
}

.bodyPress section#download-content .container .row .col-md-6 img {
    width: 100%;
    margin-bottom: 3rem;
    box-shadow: 4px 2px 16px 0 rgba(0,0,0,.06)
}

.bodyPress section#download {
    margin: 10rem auto 15rem;
    background-color: #fafffd
}

    .bodyPress section#download .container .row .col-md-12 {
        justify-content: center;
        align-items: center;
        display: flex;
        flex-direction: column
    }

        .bodyPress section#download .container .row .col-md-12 h1 {
            font-size: 24px;
            font-weight: 800
        }

        .bodyPress section#download .container .row .col-md-12 p {
            font-size: 18px;
            font-weight: 600;
            margin: 1rem auto 3rem
        }

        .bodyPress section#download .container .row .col-md-12 .btn-highlighted {
            padding: 15px 48px
        }

.mainCustomerStories .img {
    transition: all .2s ease-in-out;
    padding-right: 76px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .mainCustomerStories .img {
        margin-top: 2rem;
        padding-right: 15px
    }
}

.mainCustomerStories .img:hover > .text {
    background-color: #fff;
    box-shadow: 2px 2px 18px 0 rgba(212,229,234,.53)
}

    .mainCustomerStories .img:hover > .text > h2 {
        text-decoration: underline
    }

.mainCustomerStories .img:hover {
    transform: scale(1.02)
}

.mainCustomerStories .img img {
    width: 100%
}

.mainCustomerStories section#top {
    background-color: #f3f3f3
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .mainCustomerStories section#top .col-lg-6 {
        text-align: center
    }
}

.mainCustomerStories section#top .col-lg-6 p.date {
    font-size: 16px;
    font-weight: 600;
    color: #1b1b20;
    margin-top: 10%
}

.mainCustomerStories section#top .col-lg-6 h2, .mainCustomerStories section#top .col-lg-6 h1 {
    font-size: 30px;
    font-weight: 800;
    position: relative;
    z-index: 1;
    margin-bottom: 1rem
}

.mainCustomerStories section#top .col-lg-6 p.description {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.9;
    margin-bottom: 2rem
}

.mainCustomerStories section#top .col-lg-6 .button-container button.btn-highlighted {
    border: 2px solid #3c91e6;
    padding: .5rem 1.5rem
}

.mainCustomerStories section#top .white-bg {
    padding: 0 3rem
}

.mainCustomerStories section#two-cs .col-sm-12 {
    text-align: center;
    margin: 4rem 0 6rem
}

    .mainCustomerStories section#two-cs .col-sm-12 h1 {
        font-size: 41px;
        font-weight: 800
    }

.mainCustomerStories section#two-cs .col-lg-6 .text {
    padding-left: 2rem
}

    .mainCustomerStories section#two-cs .col-lg-6 .text h2 {
        font-size: 24px;
        font-weight: 800;
        padding: 1.5rem 0;
        position: relative;
        z-index: 1;
        width: 80%
    }

    .mainCustomerStories section#two-cs .col-lg-6 .text .company-name {
        text-transform: uppercase;
        color: #1b1b20;
        font-size: 15px;
        font-weight: 700;
        padding-bottom: 2rem
    }

.mainCustomerStories #customer-stories-list {
    margin-bottom: 3rem
}

    .mainCustomerStories #customer-stories-list .row {
        justify-content: center
    }

        .mainCustomerStories #customer-stories-list .row .col-sm-12 {
            text-align: center;
            margin: 4rem 0 6rem
        }

            .mainCustomerStories #customer-stories-list .row .col-sm-12 h2 {
                font-size: 41px;
                font-weight: 800
            }

        .mainCustomerStories #customer-stories-list .row .col-lg-3 {
            margin-bottom: 1rem;
            padding-right: 40px
        }

@media(max-width:991px) {
    .mainCustomerStories #customer-stories-list .row .col-lg-3 {
        padding-right: 15px
    }
}

.mainCustomerStories #customer-stories-list .row .col-lg-3 .text {
    padding-left: 1rem
}

    .mainCustomerStories #customer-stories-list .row .col-lg-3 .text h2 {
        font-size: 24px;
        font-weight: 800;
        padding: 1.5rem 0;
        line-height: 1.5;
        position: relative;
        z-index: 1
    }

    .mainCustomerStories #customer-stories-list .row .col-lg-3 .text .company-name {
        text-transform: uppercase;
        color: #1b1b20;
        font-size: 15px;
        font-weight: 700;
        padding-bottom: 2rem
    }

.mainCustomerStories .author {
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #1b1b20
}

    .mainCustomerStories .author img {
        border-radius: 50%
    }

    .mainCustomerStories .author p {
        margin: 0 0 0 .5rem;
        font-size: 14px;
        font-weight: 600
    }

.mainCustomerStories #case-studies .container--custom {
    width: 100%;
    padding-right: 3rem;
    padding-left: 3rem;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3rem !important
}

@media(max-width:767px) {
    .mainCustomerStories #case-studies .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .mainCustomerStories #case-studies .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .mainCustomerStories #case-studies .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .mainCustomerStories #case-studies .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .mainCustomerStories #case-studies .container--custom {
        width: 100%
    }
}

.mainCustomerStories #case-studies .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center
}

    .mainCustomerStories #case-studies .container--custom .row .case-studies__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        height: 70vw
    }

        .mainCustomerStories #case-studies .container--custom .row .case-studies__heading h1 {
            font-size: 52px;
            font-weight: 700
        }

        .mainCustomerStories #case-studies .container--custom .row .case-studies__heading h2 {
            font-size: 18px;
            font-weight: 600;
            line-height: 1.89;
            color: #767676
        }

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 2rem
    }

@media(min-width:768px) and (max-width:991px) {
    .mainCustomerStories #case-studies .container--custom .row .case-studies__content {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:767px) {
    .mainCustomerStories #case-studies .container--custom .row .case-studies__content {
        grid-template-columns: 1fr
    }
}

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case {
    margin-bottom: 4rem
}

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__img img {
    width: 100%;
    border-top-left-radius: 26px;
    border-top-right-radius: 26px
}

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__greenbar {
    background-color: #ffc502;
    display: flex
}

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__greenbar__element {
    width: 33.3%;
    padding: 1rem 0 1rem 1rem
}

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__greenbar__element p {
        margin-top: 1rem;
        font-size: 14px;
        font-weight: 700;
        color: #fff
    }

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__greenbar__element img {
        height: 35px
    }

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__content {
    height: 100%
}

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__content h3 {
        padding: 1.5rem 0;
        font-size: 36px;
        font-weight: 700
    }

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__content p {
        font-size: 18px;
        line-height: 1.44;
        margin-bottom: 2.5rem
    }

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__content a {
        padding: 1rem 2rem !important;
        color: #fff;
        font-weight: 700;
        font-size: 16px;
        background-color: #ffc502;
        border-radius: 26px;
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
    }

.singleCS section#top {
    background-color: #fff
}

    .singleCS section#top a, .singleCS section#top a:hover {
        color: #00bf71;
        text-decoration: none
    }

    .singleCS section#top .container .row .white-bg {
        background-color: #fff;
        display: flex;
        justify-content: center;
        flex-direction: column;
        position: relative;
        top: 2rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleCS section#top .container .row .white-bg {
        align-items: center
    }
}

.singleCS section#top .container .row .white-bg p.green {
    color: #00bf71;
    font-size: 14px;
    font-weight: 700
}

.singleCS section#top .container .row .white-bg h1 {
    font-size: 40px
}

.singleCS section#top .container .row .img {
    padding-left: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleCS section#top .container .row .img {
        padding-left: 15px;
        margin-top: 4rem
    }
}

.singleCS section#top .container .row .col-sm-12 {
    margin: 6rem 0 0;
    text-align: center
}

@media(max-width:767px) {
    .singleCS section#top .container .row .col-sm-12 {
        margin: 0
    }
}

.singleCS section#top .container .row .col-sm-12 img {
    width: 10rem;
    margin-top: 6rem
}

.singleCS section#top .container .row .about-company {
    font-weight: 700
}

    .singleCS section#top .container .row .about-company .company-name-green, .singleCS section#top .container .row .about-company .description {
        font-size: 22px;
        line-height: 1.2
    }

    .singleCS section#top .container .row .about-company .title {
        font-size: 14px;
        color: #1b1b20;
        margin-bottom: .5rem
    }

    .singleCS section#top .container .row .about-company .company-name-green {
        color: #00bf71
    }

    .singleCS section#top .container .row .about-company .description {
        color: #1b1b20
    }

.singleCS #content {
    margin-top: 5rem
}

    .singleCS #content a, .singleCS #content a:hover {
        color: #00bf71;
        text-decoration: none
    }

    .singleCS #content .container .row h2 {
        font-size: 25px;
        font-weight: 700;
        margin-bottom: 1.5rem
    }

    .singleCS #content .container .row p {
        font-size: 18px;
        font-weight: 600;
        line-height: 1.9
    }

        .singleCS #content .container .row p strong {
            font-weight: 700
        }

    .singleCS #content .container .row img {
        margin-top: 2rem;
        margin-bottom: 4rem;
        width: 100%
    }

@media(max-width:767px) {
    .singleCS #content .container .row .customer-second-img {
        height: 6%
    }
}

.singleCS #content .container .row blockquote {
    font-family: lato,sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.54;
    margin: 2rem 0
}

    .singleCS #content .container .row blockquote strong {
        font-weight: 700
    }

.singleCS #content .container .row .wrapper {
    width: 80%;
    margin: 0 auto
}

    .singleCS #content .container .row .wrapper h2 {
        margin-top: 2rem
    }

    .singleCS #content .container .row .wrapper .read-more {
        margin: 4rem 0;
        background-color: #f3f3f3;
        display: flex;
        align-items: center
    }

        .singleCS #content .container .row .wrapper .read-more .left {
            padding: 3rem 0 3rem 3rem
        }

            .singleCS #content .container .row .wrapper .read-more .left img {
                width: 100%;
                margin: 0
            }

        .singleCS #content .container .row .wrapper .read-more .right {
            padding: 3rem
        }

            .singleCS #content .container .row .wrapper .read-more .right p {
                margin-top: 3rem;
                text-align: right;
                font-weight: 700
            }

.singleCS #content .container .row .about {
    padding: 0 0 1rem 4rem;
    background-color: #f3f3f3;
    margin: 2rem 0 4rem;
    display: flex
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleCS #content .container .row .about {
        flex-direction: column;
        align-items: center;
        padding: 0 0 1rem
    }
}

.singleCS #content .container .row .about .left .name {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 0;
    margin-top: 1rem;
    margin-left: 2rem;
    line-height: normal
}

.singleCS #content .container .row .about .left .role {
    font-size: 16px;
    font-weight: 400;
    margin-left: 2rem
}

.singleCS #content .container .row .about .left img {
    width: 300px;
    margin-bottom: 0
}

.singleCS #content .container .row .about .right {
    width: 58%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-direction: column
}

    .singleCS #content .container .row .about .right h2 {
        position: relative;
        z-index: 1
    }

        .singleCS #content .container .row .about .right h2 p {
            font-size: 18px;
            font-weight: 600
        }

.singleCS #cs-carousel .container .row .col-sm-12 {
    margin-top: 8rem;
    margin-bottom: 5rem
}

    .singleCS #cs-carousel .container .row .col-sm-12 h2 {
        font-size: 36px;
        font-weight: 800;
        text-align: center
    }

.singleCS #cs-carousel .container .row .customer-stories-cards .row {
    margin: 0
}

.singleCS #cs-carousel .container .row .articles-container .col-sm-12 {
    width: 70%;
    margin: 0 auto 3rem
}

@media(max-width:440px) {
    .singleCS #cs-carousel .container .row .articles-container .col-sm-12 {
        width: 90%
    }
}

.singleCS #cs-carousel .container .row .articles-container .card {
    height: 100%;
    border: 1px solid #1b1b20;
    border: none;
    transition: all .2s ease-in-out
}

    .singleCS #cs-carousel .container .row .articles-container .card:hover {
        box-shadow: 2px -3px 26px 0 rgba(200,215,243,.5);
        transform: scale(1.07);
        cursor: pointer
    }

    .singleCS #cs-carousel .container .row .articles-container .card img {
        margin: 0
    }

    .singleCS #cs-carousel .container .row .articles-container .card .company-name {
        text-transform: uppercase;
        color: #3c91e6;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: 700
    }

    .singleCS #cs-carousel .container .row .articles-container .card .card-text {
        font-family: lato,sans-serif;
        font-size: 20px;
        font-weight: 800;
        color: #1b1b20;
        letter-spacing: .3px
    }

        .singleCS #cs-carousel .container .row .articles-container .card .card-text:hover {
            color: #1b1b20
        }

.singleCS #cs-carousel .container .row .articles-container a, .singleCS #cs-carousel .container .row .articles-container a:hover {
    color: #4bb063;
    text-align: left
}

.singleCS #cs-carousel .container .row .articles-container .line {
    width: 50px;
    height: 1px;
    background: #dadada;
    margin-top: auto
}

.newsingleCS .row {
    margin-left: 0 !important;
    margin-right: 0 !important
}

.newsingleCS #top .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0 !important
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #top .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #top .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #top .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .newsingleCS #top .container--custom {
        width: 100%
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .newsingleCS #top .container--custom {
        width: 100%;
        padding-right: 0 !important;
        padding-left: 0 !important
    }
}

.newsingleCS #top .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center
}

    .newsingleCS #top .container--custom .row .top__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-bottom: 4rem
    }

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__heading {
        margin-top: 7rem
    }
}

.newsingleCS #top .container--custom .row .top__heading__img {
    margin-top: -5rem;
    margin-bottom: 2rem
}

    .newsingleCS #top .container--custom .row .top__heading__img img:last-of-type {
        margin-top: 6rem;
        margin-left: 1.5rem
    }

.newsingleCS #top .container--custom .row .top__heading h1 {
    font-size: 52px;
    font-weight: 700
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__heading h1 {
        padding: 0 1.5rem;
        text-align: left
    }
}

.newsingleCS #top .container--custom .row .top__heading__text--mobile {
    padding: 0 1.5rem
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .newsingleCS #top .container--custom .row .top__heading__text--mobile {
        display: none
    }
}

.newsingleCS #top .container--custom .row .top__heading__text--mobile p {
    font-size: 18px;
    font-weight: 600;
    color: #767676
}

.newsingleCS #top .container--custom .row .top__heading__text--desktop {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__heading__text--desktop {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #top .container--custom .row .top__heading__text--desktop {
        width: 70%;
        text-align: center
    }
}

.newsingleCS #top .container--custom .row .top__heading__text--desktop p {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    margin-bottom: .4rem !important
}

.newsingleCS #top .container--custom .row .top__content__img img {
    width: 100%
}

.newsingleCS #top .container--custom .row .top__content__greenbar {
    background-color: #ffc502;
    display: flex;
    height: 230px
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__content__greenbar {
        flex-direction: column;
        height: 100%
    }
}

.newsingleCS #top .container--custom .row .top__content__greenbar__element {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 33.3%;
    padding: 1rem;
    position: relative
}

    .newsingleCS #top .container--custom .row .top__content__greenbar__element:first-of-type::after, .newsingleCS #top .container--custom .row .top__content__greenbar__element:nth-of-type(2)::after {
        content: "";
        display: block;
        top: 15%;
        right: 0;
        position: absolute;
        height: 70%;
        width: 1px;
        background-color: #fff
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__content__greenbar__element:first-of-type::after, .newsingleCS #top .container--custom .row .top__content__greenbar__element:nth-of-type(2)::after {
        display: none
    }
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__content__greenbar__element {
        width: 100%
    }
}

.newsingleCS #top .container--custom .row .top__content__greenbar__element p {
    margin-top: 1rem;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    line-height: 1.44;
    width: 35%
}

.newsingleCS #top .container--custom .row .top__content__greenbar__element img {
    width: 56px;
    margin-right: 1.5rem
}

.newsingleCS #green-banner .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 5rem !important
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #green-banner .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #green-banner .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #green-banner .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .newsingleCS #green-banner .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom {
        padding-right: 0 !important;
        padding-left: 0 !important
    }
}

.newsingleCS #green-banner .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%
}

    .newsingleCS #green-banner .container--custom .row .green-banner {
        background-color: #ffc502;
        padding: 4rem 4rem 2.5rem;
        margin-bottom: 3rem;
        width: 100%;
        border-radius: 26px;
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
        position: relative;
        display: flex
    }

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .green-banner {
        padding: 1.5rem 0 1.5rem 1.5rem
    }
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .green-banner__left {
        width: 70%
    }
}

.newsingleCS #green-banner .container--custom .row .green-banner__left h2 {
    font-size: 36px;
    font-weight: 700;
    color: #fff
}

.newsingleCS #green-banner .container--custom .row .green-banner__left ul {
    padding: 0 0 0 1.5rem
}

    .newsingleCS #green-banner .container--custom .row .green-banner__left ul li {
        color: #fff;
        font-size: 16px;
        padding: 1rem 0
    }

        .newsingleCS #green-banner .container--custom .row .green-banner__left ul li:first-of-type {
            font-weight: 700
        }

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .green-banner__right {
        width: 30%;
        display: flex;
        align-items: center;
        justify-content: center
    }
}

.newsingleCS #green-banner .container--custom .row .green-banner__right img {
    position: absolute;
    top: 10%;
    right: -1rem;
    height: 80%
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .green-banner__right img {
        height: 40%;
        top: 30%;
        right: -.5rem
    }
}

.newsingleCS #green-banner .container--custom .row .grey-banners {
    display: flex;
    justify-content: space-between;
    width: 100%
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .grey-banners {
        flex-direction: column
    }
}

.newsingleCS #green-banner .container--custom .row .grey-banners__banner {
    width: 48%;
    padding: 4rem 4rem 2.5rem;
    background-color: #f3f3f3;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    border-radius: 26px
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .grey-banners__banner {
        width: 100%;
        padding: 1.5rem
    }

        .newsingleCS #green-banner .container--custom .row .grey-banners__banner:first-of-type {
            margin-bottom: 3rem
        }
}

.newsingleCS #green-banner .container--custom .row .grey-banners__banner h2 {
    font-size: 36px;
    font-weight: 700
}

.newsingleCS #green-banner .container--custom .row .grey-banners__banner ul {
    margin-top: 1.5rem;
    padding: 0 0 0 1.5rem
}

    .newsingleCS #green-banner .container--custom .row .grey-banners__banner ul li {
        font-size: 16px
    }

.newsingleCS #content .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3rem !important
}

@media(max-width:767px) {
    .newsingleCS #content .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #content .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #content .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #content .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .newsingleCS #content .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .newsingleCS #content .container--custom {
        padding-right: 0 !important;
        padding-left: 0 !important
    }
}

.newsingleCS #content .container--custom .row {
    padding: 4rem;
    display: flex;
    flex-direction: column
}

@media(max-width:767px) {
    .newsingleCS #content .container--custom .row {
        padding: 1.5rem
    }
}

.newsingleCS #content .container--custom .row h2 {
    font-size: 36px;
    font-weight: 700;
    padding: 3rem 0
}

.newsingleCS #content .container--custom .row p {
    font-size: 18px;
    line-height: 1.44
}

.newsingleCS #content .container--custom .row span {
    font-weight: 500
}

.newsingleCS #content .container--custom .row .italic {
    font-style: italic !important
}

.newsingleCS #content .container--custom .row .bold {
    font-weight: 700
}

.newsingleCS #greenquota {
    background-color: #ffc502;
    position: relative
}

    .newsingleCS #greenquota .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        padding: 2rem 0
    }

@media(max-width:767px) {
    .newsingleCS #greenquota .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #greenquota .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #greenquota .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #greenquota .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .newsingleCS #greenquota .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .newsingleCS #greenquota .container--custom {
        padding-right: 0 !important;
        padding-left: 0 !important
    }
}

.newsingleCS #greenquota .container--custom .row {
    padding: 0 4rem;
    width: 80%
}

@media(max-width:767px) {
    .newsingleCS #greenquota .container--custom .row {
        padding: 0 1.5rem;
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #greenquota .container--custom .row {
        width: 100%
    }
}

.newsingleCS #greenquota .container--custom .row p {
    font-size: 28px;
    font-weight: 600;
    line-height: 1.5;
    color: #fff;
    margin-bottom: 2rem
}

.newsingleCS #greenquota .container--custom .row div {
    display: flex;
    width: 100%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .newsingleCS #greenquota .container--custom .row div {
        justify-content: space-between
    }
}

.newsingleCS #greenquota .container--custom .row div span {
    color: #fff;
    font-size: 18px
}

.newsingleCS #greenquota .container--custom .row div img {
    position: absolute;
    bottom: 3rem;
    right: 6rem;
    width: 8%
}

@media(max-width:767px) {
    .newsingleCS #greenquota .container--custom .row div img {
        position: relative;
        bottom: 0;
        right: 0;
        width: 60px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #greenquota .container--custom .row div img {
        position: relative;
        bottom: 0;
        right: 0;
        width: 120px
    }
}

.newsingleCS #content-with-banner .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto
}

@media(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #content-with-banner .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #content-with-banner .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #content-with-banner .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .newsingleCS #content-with-banner .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom {
        padding-right: 0 !important;
        padding-left: 0 !important;
        padding-top: 5rem !important
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #content-with-banner .container--custom {
        padding-top: 8rem !important
    }
}

.newsingleCS #content-with-banner .container--custom .row {
    padding: 0 4rem;
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row {
        flex-direction: column
    }
}

@media(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row {
        padding: 0
    }
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__content {
    width: 80%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__content {
        width: 100%;
        margin-bottom: 2rem
    }
}

@media(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__content {
        padding: 0 1.5rem
    }
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__content h2 {
    margin-bottom: 2rem;
    font-weight: 700
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__content p {
    font-size: 18px
}

    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__content p:not(:last-of-type) {
        margin-bottom: 2rem
    }

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__content .bold {
    font-weight: 700;
    margin-bottom: 1rem !important
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 47%;
    background-color: #f3f3f3;
    padding: 4rem;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner {
        width: 100%
    }
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner p {
    font-size: 28px;
    font-weight: 700;
    text-align: center
}

    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner p:first-of-type {
        margin-bottom: 1.5rem
    }

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner .green {
    color: #ffc502
}

.rebranding-case-studies #top {
    overflow: hidden
}

    .rebranding-case-studies #top .container {
        position: relative;
        margin-bottom: 5rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start
    }

        .rebranding-case-studies #top .container h1 {
            font-size: 52px;
            font-weight: 700
        }

        .rebranding-case-studies #top .container h2 {
            font-family: nunito sans,sans-serif;
            font-weight: 600;
            font-size: 18px;
            font-style: normal;
            line-height: normal;
            color: #767676;
            max-width: 406px;
            margin-bottom: 3.5rem
        }

@media(max-width:767px) {
    .rebranding-case-studies #top .container a {
        align-self: center;
        width: 100%
    }
}

.rebranding-case-studies #top .container img {
    position: absolute;
    top: -151px;
    right: -413px;
    max-width: 940px;
    z-index: -1
}

@media(min-width:992px) and (max-width:1440px) {
    .rebranding-case-studies #top .container img {
        max-width: 715px;
        top: -109px;
        right: -204px
    }
}

@media(min-width:992px) and (max-width:1199px) {
    .rebranding-case-studies #top .container img {
        max-width: 700px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-case-studies #top .container img {
        max-width: 615px;
        top: -75px;
        right: -306px
    }
}

@media(max-width:767px) {
    .rebranding-case-studies #top .container img {
        display: none
    }
}

.rebranding-case-studies #content .container {
    margin-top: 5rem
}

    .rebranding-case-studies #content .container .cards {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 7rem 1.5rem
    }

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .rebranding-case-studies #content .container .cards {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .rebranding-case-studies #content .container .cards {
        grid-template-columns: 1fr
    }
}

.rebranding-case-studies #content .container .cards__singleCard {
    border-radius: 26px;
    box-shadow: 4px 20px 24px -2px rgba(0,0,0,.12);
    padding: 6rem 2rem 2rem;
    position: relative
}

.rebranding-case-studies #content .container .cards__singleCard__circle {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100px;
    height: 100px;
    border-radius: 83px;
    box-shadow: 4px 20px 24px -2px rgba(0,0,0,.12);
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center
}

.rebranding-case-studies #content .container .cards__singleCard h2 {
    font-size: 36px;
    font-weight: 700;
    color: #222324;
    margin-bottom: 1.5rem
}

.rebranding-case-studies #content .container .cards__singleCard p {
    font-size: 18px;
    color: #222324;
    margin-bottom: 4rem;
    min-height: 135px
}

.rebranding-case-studies #content .container .cards__singleCard a {
    font-size: 18px;
    font-weight: 700;
    color: #ffc502
}

    .rebranding-case-studies #content .container .cards__singleCard a img {
        margin-left: .5rem;
        transition: all .2s ease-in-out
    }

    .rebranding-case-studies #content .container .cards__singleCard a:hover img {
        margin-left: .75rem
    }

.rebranding-case-studies #social-proof {
    margin: 0 0 5rem
}

@media(max-width:767px) {
    .rebranding-case-studies #social-proof {
        margin: 0
    }
}

.rebranding-case-studies #social-proof .container--custom {
    width: 100%;
    padding-right: 5rem;
    padding-left: 5rem;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3rem;
    padding-bottom: 2rem
}

@media(max-width:767px) {
    .rebranding-case-studies #social-proof .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-case-studies #social-proof .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .rebranding-case-studies #social-proof .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .rebranding-case-studies #social-proof .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .rebranding-case-studies #social-proof .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .rebranding-case-studies #social-proof .container--custom {
        padding-top: 0;
        padding-bottom: 0
    }
}

.rebranding-case-studies #social-proof .container--custom .row {
    border-bottom: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-case-studies #social-proof .container--custom .row {
        gap: 2rem 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-case-studies #social-proof .container--custom .col-6 {
        text-align: center
    }
}

.rebranding-case-studies #social-proof .container--custom .social-proof__heading {
    text-align: center
}

    .rebranding-case-studies #social-proof .container--custom .social-proof__heading h3 {
        font-family: nunito sans,sans-serif;
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 2.5rem;
        color: #6b6b6b
    }

.rebranding-single-case-studie .progressItem::after {
    width: 0;
    transition: all 1s ease-in-out
}

.rebranding-single-case-studie .progressItem-active::after {
    width: 80px
}

.rebranding-single-case-studie #top {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #top .container--custom {
        max-width: 2560px;
        width: 100%;
        margin-top: 10rem;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

@media(max-width:767px) {
    .rebranding-single-case-studie #top .container--custom {
        padding: 0 1rem
    }
}

.rebranding-single-case-studie #top img.shapeOnTop {
    position: absolute;
    top: -1.5rem;
    left: -15%;
    max-width: 1600px;
    width: 60vw;
    z-index: -1
}

@media(min-width:992px) and (max-width:1440px) {
    .rebranding-single-case-studie #top img.shapeOnTop {
        left: -12rem;
        width: 775px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #top img.shapeOnTop {
        left: -10rem;
        width: 650px
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #top img.shapeOnTop {
        left: -8rem;
        width: 500px
    }
}

.rebranding-single-case-studie #top img.shapeOnBottom {
    position: absolute;
    bottom: 3rem;
    right: 0;
    z-index: -1;
    width: 8%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #top img.shapeOnBottom {
        display: none
    }
}

.rebranding-single-case-studie #top h1 {
    color: #222324;
    font-size: 52px;
    font-weight: 700
}

.rebranding-single-case-studie #top h2 {
    max-width: 630px;
    text-align: center;
    color: var(--light-gray-600,#6b6b6b);
    font-family: nunito sans,sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 160%
}

.rebranding-single-case-studie #top .industrie-info {
    display: flex;
    gap: 2rem;
    margin-top: 10rem
}

@media(max-width:767px) {
    .rebranding-single-case-studie #top .industrie-info {
        margin-top: 4rem;
        flex-direction: column;
        gap: 3rem 0
    }
}

.rebranding-single-case-studie #top .industrie-info__singleInfo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column
}

    .rebranding-single-case-studie #top .industrie-info__singleInfo h3 {
        font-size: 16px;
        font-weight: 700;
        font-family: nunito sans,sans-serif;
        padding: 1rem 2rem;
        border-radius: 26px;
        background-color: #fff;
        box-shadow: 0 8px 32px 0 rgb(245 226 179)
    }

    .rebranding-single-case-studie #top .industrie-info__singleInfo p {
        color: var(--light-gray-600,#6b6b6b);
        font-size: 18px;
        line-height: 160%;
        max-width: 141px;
        text-align: center;
        margin-top: 1.5rem
    }

.rebranding-single-case-studie #main-goals {
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #main-goals .container--custom {
        max-width: 2560px;
        width: 100%
    }

    .rebranding-single-case-studie #main-goals .cards {
        width: 100%
    }

    .rebranding-single-case-studie #main-goals .cards__singleCard {
        background-color: #fff;
        padding: 4rem 0;
        border-top: 1px solid #e9e9e9;
        border-bottom: 1px solid #e9e9e9;
        transition: all .2s ease-in-out
    }

        .rebranding-single-case-studie #main-goals .cards__singleCard .container {
            display: grid;
            grid-template-columns: repeat(2,1fr)
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #main-goals .cards__singleCard .container {
        grid-template-columns: 1fr
    }
}

@media(min-width:1920px),(min-width:1441px) and (max-width:1919px),(min-width:992px) and (max-width:1440px),(min-width:992px) and (max-width:1199px) {
    .rebranding-single-case-studie #main-goals .cards__singleCard:hover {
        background: #f8f8f8;
        box-shadow: 0 6px 24px 0 rgba(0,0,0,.12)
    }
}

.rebranding-single-case-studie #main-goals .cards__singleCard div:first-of-type h2 {
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #main-goals .cards__singleCard div:first-of-type h2 {
        margin-left: 0;
        margin-bottom: 2rem
    }
}

.rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul {
    padding: 0
}

    .rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul li {
        list-style: none
    }

        .rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul li span {
            display: flex;
            align-items: center
        }

            .rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul li span img {
                margin-right: 1rem
            }

        .rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul li:not(:last-of-type) {
            padding-bottom: 1.3rem
        }

.rebranding-single-case-studie #case-implementation {
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #case-implementation .container--custom {
        width: 100%
    }

    .rebranding-single-case-studie #case-implementation .cards {
        width: 100%;
        position: relative;
        overflow: hidden
    }

        .rebranding-single-case-studie #case-implementation .cards img.frame-img {
            position: absolute;
            top: 0;
            left: 0
        }

    .rebranding-single-case-studie #case-implementation .cards__singleCard {
        background-color: #fff;
        padding: 6rem 0;
        transition: all .2s ease-in-out
    }

        .rebranding-single-case-studie #case-implementation .cards__singleCard:first-of-type {
            padding-top: 13rem
        }

        .rebranding-single-case-studie #case-implementation .cards__singleCard:only-of-type {
            padding-top: 10rem
        }

    .rebranding-single-case-studie #case-implementation .cards__singleCard--grey {
        background-color: #f8f8f8
    }

    .rebranding-single-case-studie #case-implementation .cards__singleCard .container {
        display: grid;
        grid-template-columns: 45% 55%
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard .container {
        grid-template-columns: 1fr
    }
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div h2 {
    position: relative;
    width: fit-content;
    z-index: 1
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div img {
    position: absolute;
    top: -1.5rem;
    right: -13.5rem;
    transform: translate(-50%,-50%);
    z-index: -1
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard div img {
        top: -1.5rem;
        right: -10.5rem;
        width: 75%
    }
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2 {
    max-width: 366px;
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase;
    position: relative
}

@media(min-width:1920px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2 {
        max-width: 100%
    }
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2::before {
    content: attr(number);
    position: absolute;
    top: -4rem;
    color: #ffc502
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1.5rem;
    max-width: 80px;
    height: 3px;
    background-color: #ffc502
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2 {
        margin-left: 0;
        margin-bottom: 2rem
    }
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div:last-of-type p {
    color: #222324;
    max-width: 651px;
    font-size: 18px;
    line-height: 160%
}

@media(min-width:992px) and (max-width:1199px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard div:last-of-type p {
        max-width: 451px
    }
}

.rebranding-single-case-studie #quote {
    background-color: #f8f8f8;
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #quote .container--custom {
        padding: 4.5rem 0;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #quote .container--custom {
        padding: 4.5rem 8rem
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #quote .container--custom {
        padding: 4.5rem 1.5rem
    }
}

.rebranding-single-case-studie #quote .container--custom p {
    max-width: 850px;
    text-align: center;
    color: #222324;
    font-size: 36px;
    line-height: 120%;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    .rebranding-single-case-studie #quote .container--custom p {
        font-size: 28px
    }
}

.rebranding-single-case-studie #quote .container--custom span {
    color: #222324;
    font-family: lato,sans-serif;
    font-size: 18px
}

.rebranding-single-case-studie #grid-content {
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #grid-content img {
        max-width: 1020px
    }

    .rebranding-single-case-studie #grid-content .container--custom {
        max-width: 2560px;
        width: 100%
    }

    .rebranding-single-case-studie #grid-content .cards {
        width: 100%;
        overflow: hidden
    }

    .rebranding-single-case-studie #grid-content .cards__singleCard {
        display: grid;
        grid-template-columns: 40% 60%;
        gap: 8.5rem;
        background-color: #fff;
        padding: 4rem 0;
        transition: all .2s ease-in-out
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard {
        grid-template-columns: 1fr;
        gap: 3rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard {
        padding: 1rem 4rem 5rem
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard {
        padding: 1rem 1rem 5rem
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard--grey {
    background-color: #f8f8f8
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard--grey {
        padding: 1rem 4rem 5rem !important
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard--grey {
        padding: 1rem 1rem 5rem !important
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div img {
    width: 100%
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type {
    align-items: flex-end
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type {
        padding-right: 0;
        margin-top: 4rem
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type p {
    position: relative;
    max-width: 366px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type p {
        max-width: 100%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type p.quote {
        margin-top: 2rem
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type p.quote::before {
    content: "“";
    position: absolute;
    top: -3rem;
    left: 0;
    color: #222324;
    font-family: lato,sans-serif;
    font-size: 52px;
    font-weight: 700;
    text-transform: uppercase
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type img {
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    border-radius: 13px
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type span {
    text-align: right
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:last-of-type {
    align-items: flex-start;
    overflow: hidden
}

    .rebranding-single-case-studie #grid-content .cards__singleCard div:last-of-type p {
        max-width: 651px
    }

@media(min-width:992px) and (max-width:1199px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div:last-of-type p {
        max-width: 451px
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div.text {
    display: flex;
    justify-content: center;
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div.text {
        align-items: center
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div.text p {
    color: #222324;
    font-size: 18px;
    line-height: 160%
}

.rebranding-single-case-studie #grid-content .cards__singleCard div.text span {
    color: #222324;
    font-size: 18px;
    line-height: 160%;
    margin-top: 3rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div.text span {
        margin-bottom: 4rem
    }
}

.rebranding-single-case-studie #black-banner {
    background-color: #000
}

    .rebranding-single-case-studie #black-banner .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        padding-top: 0 !important
    }

@media(max-width:767px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        width: 1440px
    }
}

.rebranding-single-case-studie #black-banner .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 9rem 0
}

@media(max-width:767px) {
    .rebranding-single-case-studie #black-banner .container--custom .row {
        padding: 3.5rem 0
    }
}

.rebranding-single-case-studie #black-banner .container--custom .row p {
    font-size: 36px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    width: 70%;
    margin-bottom: 2.5rem
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #black-banner .container--custom .row p {
        font-size: 32px;
        width: 100%
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #black-banner .container--custom .row p {
        font-size: 28px;
        width: 100%
    }
}

.industries-redesign #top {
    overflow: hidden;
    margin-top: 0 !important
}

    .industries-redesign #top .container {
        margin-bottom: 5rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative
    }

        .industries-redesign #top .container h1 {
            font-family: lato,sans-serif;
            font-size: 52px;
            font-weight: 700;
            max-width: 700px;
            color: #1b1b20
        }

            .industries-redesign #top .container h1 span {
                border-bottom: 4px solid #ffc502
            }

                .industries-redesign #top .container h1 span.planner {
                    border-bottom: 4px solid #2d80eb
                }

        .industries-redesign #top .container h2 {
            font-family: lato,sans-serif;
            font-weight: 400;
            font-size: 24px;
            font-style: normal;
            line-height: normal;
            color: #767676;
            max-width: 630px;
            margin-bottom: 3.5rem
        }

@media(max-width:767px) {
    .industries-redesign #top .container a {
        align-self: center;
        width: 100%
    }
}

.industries-redesign #top .container img {
    position: absolute;
    top: -263px;
    right: -462px;
    max-width: 758px;
    z-index: -1
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-redesign #top .container img {
        display: none
    }
}

.industries-redesign #top .container img.planner {
    position: absolute;
    top: -175px;
    right: -397px;
    width: 64%;
    z-index: -1
}

@media(min-width:992px) and (max-width:1440px) {
    .industries-redesign #top .container img.planner {
        top: -175px;
        right: -187px;
        width: 54%
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-redesign #top .container img.planner {
        display: none
    }
}

.industries-redesign #social-proof {
    margin: 0 0 5rem
}

@media(min-width:768px) and (max-width:991px) {
    .industries-redesign #social-proof {
        margin: -5rem 0 5rem
    }
}

@media(max-width:767px) {
    .industries-redesign #social-proof {
        margin: 0
    }
}

@media(max-width:767px) {
    .industries-redesign #social-proof .container {
        margin-top: -4.5rem;
        margin-bottom: -4.5rem;
        padding-top: 0;
        padding-bottom: 0
    }
}

.industries-redesign #social-proof .container .row {
    border-bottom: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-redesign #social-proof .container .row {
        gap: 2rem 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-redesign #social-proof .container .col-6 {
        text-align: center
    }
}

.industries-redesign #social-proof .container .social-proof__heading {
    text-align: center
}

    .industries-redesign #social-proof .container .social-proof__heading h3 {
        font-family: nunito sans,sans-serif;
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 2.5rem;
        color: #6b6b6b
    }

.industries-redesign #content .container {
    margin-top: 5rem
}

    .industries-redesign #content .container .cards {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 5rem 5rem
    }

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .industries-redesign #content .container .cards {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .industries-redesign #content .container .cards {
        grid-template-columns: 1fr
    }
}

.industries-redesign #content .container .cards img {
    width: 118px;
    height: 142px;
    margin-bottom: 1.5rem
}

.industries-redesign #content .container .cards h2 {
    font-size: 26px;
    font-weight: 700;
    color: #1b1b20;
    margin-bottom: 20px
}

.industries-redesign #content .container .cards p {
    font-size: 18px;
    font-weight: 400;
    color: #1b1b20;
    margin-bottom: 1.5rem;
    min-height: 81px
}

.industries-redesign #content .container .cards a {
    font-size: 18px;
    font-weight: 700;
    color: #2380e3;
    display: flex;
    align-items: center
}

    .industries-redesign #content .container .cards a img {
        width: 21px;
        height: 12px;
        margin: 0 0 0 .5rem !important;
        transition: all .2s ease-in-out
    }

    .industries-redesign #content .container .cards a:hover img {
        margin: 0 0 0 .75rem !important
    }

.features #top {
    margin-top: 0
}

    .features #top img {
        width: 100%
    }

    .features #top .features-top {
        display: flex
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .features #top .features-top {
        flex-direction: column
    }
}

.features #top .features-top .heading-features {
    padding-right: 5rem
}

@media(max-width:767px) {
    .features #top .features-top .heading-features {
        text-align: left !important;
        padding-right: 4rem;
        padding-top: 2rem;
        font-size: 52px !important
    }
}

@media(min-width:768px) and (max-width:991px) {
    .features #top .features-top .heading-features {
        padding-right: 10rem
    }
}

.features #top .features-top .wrapper:nth-of-type(1) {
    width: 60%
}

@media(min-width:768px) and (max-width:991px) {
    .features #top .features-top .wrapper:nth-of-type(1) {
        width: unset
    }
}

@media(max-width:767px) {
    .features #top .features-top .wrapper:nth-of-type(1) {
        width: 100%
    }
}

.features #top .features-top .wrapper:nth-of-type(2) {
    width: 65%
}

@media(max-width:767px) {
    .features #top .features-top .wrapper:nth-of-type(2) {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .features #top .features-top .wrapper:nth-of-type(2) {
        width: 85%;
        margin-top: 2rem;
        padding-left: 0
    }
}

.features #top .features-top .paragraph-features {
    font-size: 18px;
    font-family: nunito sans,sans-serif;
    font-weight: 600;
    margin: 2rem 0;
    padding-right: 10rem;
    color: #767676
}

@media(max-width:767px) {
    .features #top .features-top .paragraph-features {
        padding-right: 2rem;
        margin: 2rem 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .features #top .features-top .paragraph-features {
        padding-right: 10rem
    }
}

.features #top .form .form-wrapper input[type=email] {
    border: none;
    width: 60%;
    outline: none;
    font-size: 14px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(max-width:767px) {
    .features #top .form .form-wrapper input[type=email] {
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .features #top .form .form-wrapper input[type=email] {
        width: 60%
    }
}

.features #top .form .form-wrapper button {
    padding: 12px 10px;
    color: #fff;
    width: 36%;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #ffc502;
    position: relative;
    background-color: #ffc502;
    left: -3rem;
    margin-top: 0
}

@media(max-width:767px) {
    .features #top .form .form-wrapper button {
        left: unset;
        right: 0;
        width: 75%;
        padding: 10px 0;
        margin-top: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .features #top .form .form-wrapper button {
        padding: 14px 7px
    }
}

.features #top .form .form-wrapper .terms-submission {
    margin: 20px 0;
    font-size: 13px;
    color: #1b1b20;
    opacity: .6;
    width: 60%;
    padding-left: 2rem
}

@media(max-width:767px) {
    .features #top .form .form-wrapper .terms-submission {
        width: 100%;
        padding: 0 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .features #top .form .form-wrapper .terms-submission {
        padding-right: 0
    }
}

.features #top .form .form-wrapper .terms-submission a {
    margin: 0 2px;
    color: #ffc502
}

.features #top .form .button-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

@media(max-width:767px) {
    .features #top .form .button-wrapper {
        flex-direction: column;
        align-items: center
    }
}

.features #top .form .button-wrapper .button-wrapper__google {
    display: flex;
    align-items: center;
    margin-top: 1rem
}

@media(max-width:767px) {
    .features #top .form .button-wrapper .button-wrapper__google {
        display: block;
        margin-left: 0;
        text-align: center;
        margin-top: 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .features #top .form .button-wrapper .button-wrapper__google {
        margin-left: 0
    }
}

.features #top .form .button-wrapper .button-wrapper__google span {
    font-size: 1rem;
    color: #767676
}

.features #top .form .button-wrapper .button-wrapper__google img {
    margin-left: .2rem;
    width: 32px
}

.features #social-proof {
    background-color: #ffc502;
    width: 100%;
    padding-bottom: 0 !important
}

    .features #social-proof .row {
        border-bottom: none !important
    }

@media(max-width:767px) {
    .features #social-proof .row .social-proof__heading {
        padding-right: 30px;
        padding-left: 30px
    }
}

.features #social-proof .row .social-proof__heading h3 {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    font-family: nunito sans,sans-serif;
    text-align: center
}

@media(max-width:767px) {
    .features #social-proof .row .social-proof__heading h3 {
        line-height: 34px
    }
}

.features #feature-section .container {
    padding-top: 7rem;
    margin-top: 0
}

@media(max-width:767px) {
    .features #feature-section .container {
        padding-top: 2rem
    }
}

.features #feature-section .container .row .left {
    position: relative;
    left: -70px;
    text-align: start
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .features #feature-section .container .row .left {
        left: 0
    }
}

.features #feature-section .container .row .right {
    position: relative;
    right: -50px;
    text-align: end
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .features #feature-section .container .row .right {
        right: 0
    }
}

.features #feature-section .container .row .col-lg-6 .text, .features #feature-section .container .row .col-sm-12 .text {
    text-align: left
}

    .features #feature-section .container .row .col-lg-6 .text h2, .features #feature-section .container .row .col-sm-12 .text h2 {
        font-size: 36px;
        font-weight: 800;
        margin: 0 0 2rem
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .features #feature-section .container .row .col-lg-6 .text h2, .features #feature-section .container .row .col-sm-12 .text h2 {
        margin-bottom: 2rem;
        width: 100%
    }
}

.features #feature-section .container .row .col-lg-6 .text p, .features #feature-section .container .row .col-sm-12 .text p {
    font-size: 16px;
    font-weight: 600;
    color: #1b1b20;
    margin-bottom: 2rem
}

    .features #feature-section .container .row .col-lg-6 .text p.color-para, .features #feature-section .container .row .col-sm-12 .text p.color-para {
        font-family: nunito sans,sans-serif;
        color: #3c91e6;
        margin-bottom: 1rem;
        font-size: 14px;
        font-weight: 600;
        letter-spacing: 0
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .features #feature-section .container .row .col-lg-6 .text p.color-para, .features #feature-section .container .row .col-sm-12 .text p.color-para {
        text-align: center
    }
}

.features #feature-section .container .row .col-lg-6 .text .checks, .features #feature-section .container .row .col-sm-12 .text .checks {
    display: flex;
    flex-direction: column;
    color: #1b1b20
}

    .features #feature-section .container .row .col-lg-6 .text .checks .group, .features #feature-section .container .row .col-sm-12 .text .checks .group {
        display: flex;
        align-items: baseline
    }

    .features #feature-section .container .row .col-lg-6 .text .checks p, .features #feature-section .container .row .col-sm-12 .text .checks p {
        font-size: 19px;
        margin-left: 1rem;
        margin-bottom: 1rem
    }

.features section#quick-look {
    padding: 2rem 0 4rem;
    background-color: #fff
}

    .features section#quick-look .container .row {
        justify-content: center
    }

        .features section#quick-look .container .row [class*=col-] {
            text-align: center;
            padding: 3rem
        }

            .features section#quick-look .container .row [class*=col-] .circle {
                width: 66px;
                height: 66px;
                border-radius: 50%;
                background-color: #f3f3f3;
                display: flex;
                justify-content: center;
                align-items: center;
                margin: auto
            }

            .features section#quick-look .container .row [class*=col-] p.blue {
                font-size: 24px;
                font-weight: 900;
                color: #3c91e6;
                margin: 0
            }

            .features section#quick-look .container .row [class*=col-] .value-list {
                font-size: 20px;
                font-weight: 700;
                margin: 1.5rem auto;
                font-family: nunito sans,sans-serif
            }

            .features section#quick-look .container .row [class*=col-] p {
                font-size: 14px;
                font-weight: 600
            }

.features section#demo-cta {
    padding: 4rem 0
}

    .features section#demo-cta .container .row {
        position: relative
    }

        .features section#demo-cta .container .row .greenSmallSkewCircle, .features section#demo-cta .container .row .redSmallCircle, .features section#demo-cta .container .row .blueSmallCircle, .features section#demo-cta .container .row .greenSmallCircle {
            position: absolute;
            z-index: 1
        }

@media(max-width:767px) {
    .features section#demo-cta .container .row .greenSmallSkewCircle, .features section#demo-cta .container .row .redSmallCircle, .features section#demo-cta .container .row .blueSmallCircle, .features section#demo-cta .container .row .greenSmallCircle {
        display: none
    }
}

.features section#demo-cta .container .row .greenSmallSkewCircle {
    top: -1rem;
    left: 19rem
}

.features section#demo-cta .container .row .redSmallCircle {
    top: -1rem;
    right: 3rem
}

.features section#demo-cta .container .row .blueSmallCircle {
    left: 4rem;
    bottom: 0
}

.features section#demo-cta .container .row .greenSmallCircle {
    right: 5rem;
    bottom: -1rem
}

.features section#demo-cta .container .row .col-sm-12 {
    padding: 2rem;
    border-radius: 10px;
    background-color: #f3f3f3;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .features section#demo-cta .container .row .col-sm-12 {
        flex-direction: column
    }
}

.features section#demo-cta .container .row .col-sm-12 img {
    padding: 2rem 0
}

@media(max-width:991px) {
    .features section#demo-cta .container .row .col-sm-12 .text {
        text-align: center
    }
}

.features section#demo-cta .container .row .col-sm-12 .text h2 {
    font-size: 20px;
    font-weight: 700;
    margin: 1rem 0 .5rem;
    color: #1b1b20;
    font-family: nunito sans,sans-serif;
    letter-spacing: 0
}

.features section#demo-cta .container .row .col-sm-12 .text p {
    color: #1b1b20;
    font-size: 16px;
    font-weight: 400
}

.features section#demo-cta .container .row .col-lg-4 img {
    width: 100%;
    border-radius: 13px;
    border: 2px solid #1b1b20;
    margin-bottom: 1.5rem
}

.features section#demo-cta .container .row .col-lg-4 p {
    text-align: center;
    font-size: 20px;
    font-weight: 800
}

.features #top-header {
    background-color: #fff;
    padding: 5rem 0 6rem
}

    .features #top-header .col-sm-12 h2 {
        font-size: 48px;
        font-weight: 800;
        line-height: 1.33;
        text-align: center
    }

@media(max-width:767px) {
    .features #top-header {
        padding: 5rem 0 6rem
    }
}

.features section#features-perks .container .row div.buttons {
    display: flex;
    flex-direction: column;
    justify-content: center
}

    .features section#features-perks .container .row div.buttons .btn {
        white-space: normal;
        text-align: left
    }

        .features section#features-perks .container .row div.buttons .btn:nth-of-type(2) {
            margin: 1.5rem auto
        }

    .features section#features-perks .container .row div.buttons .filtering-buttons h3 {
        font-size: 24px;
        font-weight: 700;
        font-family: nunito sans,sans-serif;
        padding-left: 1rem
    }

    .features section#features-perks .container .row div.buttons .filtering-buttons p {
        font-size: 14px;
        font-weight: 400;
        line-height: 1.5;
        padding-left: 1rem
    }

    .features section#features-perks .container .row div.buttons .working {
        box-shadow: 2px 2px 23px 0 rgba(200,215,243,.5);
        border-left-width: 7px;
        border-left-style: solid;
        border-left-color: #00bf71;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        outline: none
    }

.features section#features-perks .container .row .carousel .carousel-item .perk-content img {
    width: 100%;
    position: relative;
    padding-left: 2rem
}

@media(max-width:991px) {
    .features section#features-perks .container .row .carousel .carousel-item .perk-content img {
        display: block
    }
}

@media(max-width:767px) {
    .features section#features-perks .container .row .carousel .carousel-item .perk-content img {
        margin-top: 5rem
    }
}

.features section#features-perks .container .row .carousel .carousel-item .perk-content div.text {
    border: 2px solid #f7b801;
    border-radius: 56.5px;
    position: absolute;
    display: flex;
    padding: 1rem .5rem 0 1rem;
    width: 60%;
    left: 11rem;
    top: 6rem
}

@media(max-width:767px) {
    .features section#features-perks .container .row .carousel .carousel-item .perk-content div.text {
        width: 100%;
        left: 0;
        top: 0;
        position: fixed
    }
}

.features section#features-perks .container .row .carousel .carousel-item .perk-content div.text p {
    font-size: 14px;
    font-weight: 600;
    color: #1b1b20;
    padding: 0 1.5rem
}

    .features section#features-perks .container .row .carousel .carousel-item .perk-content div.text p:before {
        content: none
    }

.features section#features-perks .container .row .carousel .carousel-item .perk-content .left_arrow, .features section#features-perks .container .row .carousel .carousel-item .perk-content .right_arrow, .features section#features-perks .container .row .carousel .carousel-item .perk-content .down_arrow {
    position: absolute
}

@media(max-width:767px) {
    .features section#features-perks .container .row .carousel .carousel-item .perk-content .left_arrow, .features section#features-perks .container .row .carousel .carousel-item .perk-content .right_arrow, .features section#features-perks .container .row .carousel .carousel-item .perk-content .down_arrow {
        display: none
    }
}

.features section#features-perks .container .row .carousel .carousel-item .perk-content .left_arrow {
    left: 13rem;
    top: 5rem;
    width: 17%
}

.features section#features-perks .container .row .carousel .carousel-item .perk-content .right_arrow {
    left: 12rem;
    top: 4rem;
    width: 12%
}

.features section#features-perks .container .row .carousel .carousel-item .perk-content .down_arrow {
    left: 19rem;
    top: 10rem;
    width: 8%
}

.features section#features-perks .container .row .carousel .carousel-item .perk-content div.text.text-profitability {
    left: 6rem;
    top: 0
}

@media(max-width:767px) {
    .features section#features-perks .container .row .carousel .carousel-item .perk-content div.text.text-profitability {
        left: 0;
        top: 0
    }
}

.features section#features-perks .container .row .carousel .carousel-item .perk-content div.text.text-performance {
    top: 1rem;
    left: 13rem
}

@media(max-width:767px) {
    .features section#features-perks .container .row .carousel .carousel-item .perk-content div.text.text-performance {
        left: 0;
        top: 0
    }
}

@media(max-width:767px) {
    .features section#features-perks .container .row .carousel .carousel-item .perk-content div.text.text-productivity {
        left: 0;
        top: 0
    }
}

.features #feature-section .container {
    margin-top: 0
}

    .features #feature-section .container .row .col-lg-5 .text, .features #feature-section .container .row .col-sm-12 .text {
        text-align: left
    }

@media(max-width:991px) {
    .features #feature-section .container .row .col-lg-5 .text, .features #feature-section .container .row .col-sm-12 .text {
        text-align: center
    }
}

.features #feature-section .container .row .col-lg-5 .text p, .features #feature-section .container .row .col-sm-12 .text p {
    line-height: 1.8
}

.features section#reviews .container .row .col-sm-12 {
    margin: 5rem 0 0
}

    .features section#reviews .container .row .col-sm-12 h2 {
        font-size: 48px;
        font-weight: 800;
        text-align: center
    }

    .features section#reviews .container .row .col-sm-12 .carousel-item .customer-review img {
        box-shadow: 26px 16px 20px 0 rgba(33,31,45,.04);
        width: auto
    }

    .features section#reviews .container .row .col-sm-12 .carousel-item .customer-review .text {
        padding: 0 3rem 0 5rem
    }

        .features section#reviews .container .row .col-sm-12 .carousel-item .customer-review .text .customer-review-text:before {
            top: -12rem
        }

    .features section#reviews .container .row .col-sm-12 .carousel-item .customer-review .customer-review-text {
        color: #1b1b20;
        font-size: 24px;
        font-weight: 700;
        font-family: nunito sans,sans-serif
    }

.features section#integrations {
    padding: 7rem 0
}

.features #singleFeatures #top {
    padding: 7rem 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .features #singleFeatures #top {
        padding: 4rem 0
    }
}

.features #singleFeatures #top .container .row .text {
    margin: auto 0;
    padding-right: 5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .features #singleFeatures #top .container .row .text {
        text-align: center;
        padding-right: 15px
    }
}

.features #singleFeatures #top .container .row .text h1 {
    font-size: 36px;
    margin-bottom: 2rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .features #singleFeatures #top .container .row .text h1 {
        width: 100%
    }
}

.features #singleFeatures #top .container .row .text p {
    font-size: 18px;
    margin-bottom: 3rem
}

.features #singleFeatures #top .container .row .text .links {
    display: flex
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .features #singleFeatures #top .container .row .text .links {
        justify-content: center;
        margin-bottom: 2rem
    }
}

.features #singleFeatures #top .container .row .text .links p {
    color: #3c91e6;
    font-size: 15px;
    font-weight: 800;
    margin-left: 2rem;
    margin-top: 0;
    margin-bottom: 0
}

    .features #singleFeatures #top .container .row .text .links p:hover {
        text-decoration: underline
    }

.features #singleFeatures #top .container .row .text .links a {
    display: flex;
    align-items: center
}

.features #singleFeatures #steps {
    position: relative
}

    .features #singleFeatures #steps .container {
        background-color: #1b1b20;
        border-radius: 6px
    }

        .features #singleFeatures #steps .container .row {
            padding: 3rem 0;
            border-radius: 6px;
            position: relative;
            z-index: 1;
            justify-content: center
        }

            .features #singleFeatures #steps .container .row .col-lg-4 .group {
                text-align: center;
                margin: auto;
                display: flex;
                justify-content: center;
                flex-direction: column;
                width: 59%
            }

                .features #singleFeatures #steps .container .row .col-lg-4 .group .value-stats {
                    font-size: 42px;
                    font-weight: 800;
                    color: #00bf71
                }

                .features #singleFeatures #steps .container .row .col-lg-4 .group p {
                    font-size: 16px;
                    font-weight: 600;
                    color: #00bf71
                }

.features #singleFeatures section#values.container .row .right img {
    width: 100%
}

.features #singleFeatures #other-features {
    background-color: #fff;
    padding: 7rem 0
}

    .features #singleFeatures #other-features .container .row .col-lg-4 {
        margin: auto 0
    }

        .features #singleFeatures #other-features .container .row .col-lg-4 h2 {
            font-family: lato,sans-serif;
            font-size: 36px;
            font-weight: 800;
            position: relative;
            z-index: 1;
            margin-bottom: 2rem;
            width: 77%
        }

        .features #singleFeatures #other-features .container .row .col-lg-4 p {
            font-size: 16px;
            font-weight: 600;
            color: #1b1b20
        }

    .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 {
        display: flex;
        justify-content: space-around;
        margin-bottom: 2rem
    }

        .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group {
            transition: all .2s ease-in-out;
            text-align: center;
            background-color: #f3f3f3;
            margin: 0;
            padding: 2rem 1rem
        }

            .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:active, .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:focus, .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:hover {
                background-color: #fff
            }

                .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:active > .circle, .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:focus > .circle, .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:hover > .circle {
                    background-color: #f3f3f3
                }

                    .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:active > .circle > img, .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:focus > .circle > img, .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:hover > .circle > img {
                        opacity: 1;
                        transform: 1.02
                    }

                .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:active > p, .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:focus > p, .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group:hover > p {
                    opacity: 1;
                    color: #1b1b20;
                    transform: scale(1.02)
                }

            .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group .circle {
                width: 92px;
                height: 92px;
                background-color: #fff;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                margin: auto
            }

                .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group .circle img {
                    opacity: .5;
                    height: 50%
                }

            .features #singleFeatures #other-features .container .row .col-lg-8 .col-lg-12 .group p {
                font-size: 14px;
                font-weight: 700;
                color: #1b1b20;
                margin-top: 2rem
            }

.applications .shows {
    display: flex !important;
    justify-content: center
}

.applications #top {
    padding: 5rem 0 0
}

    .applications #top .container .row .col-lg-6 h1 {
        font-size: 43px;
        font-weight: 800
    }

    .applications #top .container .row .col-lg-6 p {
        font-size: 26px;
        font-weight: 400;
        margin: 2rem 0
    }

    .applications #top .container .row .col-lg-6 .special-wrapper-desktop {
        justify-content: center
    }

@media(min-width:768px) and (max-width:991px) {
    .applications #top .container .row .col-lg-6 .special-wrapper-desktop {
        margin-right: 2rem
    }
}

.applications #top .container .row .col-lg-6 .heading {
    font-size: 48px !important
}

.applications #top .container .row .col-lg-6 .paragraph {
    font-size: 21px !important;
    width: 90%
}

.applications #top .container .row .col-lg-6 .wrapper {
    display: flex;
    flex-direction: row;
    margin-top: 4rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #top .container .row .col-lg-6 .wrapper {
        justify-content: center;
        margin-bottom: 2rem;
        flex-direction: column;
        align-items: center
    }
}

.applications #top .container .row .col-lg-6 .wrapper .content {
    margin-left: 1rem
}

    .applications #top .container .row .col-lg-6 .wrapper .content:first-of-type {
        margin-left: 0
    }

@media(max-width:767px) {
    .applications #top .container .row .col-lg-6 .wrapper .content {
        margin-right: 0;
        margin-left: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .applications #top .container .row .col-lg-6 .wrapper .content {
        margin-left: 0;
        margin-right: 2rem
    }
}

.applications #top .container .row .col-lg-6 .wrapper .content button.working {
    background-color: #fff;
    border: solid 1px #1b1b20;
    outline: none
}

.applications #top .container .row .col-lg-6 .wrapper .content .filtering-buttons {
    width: 140px;
    height: 146px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 2rem;
    margin-bottom: 1rem;
    border-radius: 6px;
    border: solid 1px rgba(33,31,45,.15);
    background-color: rgba(255,255,255,.48)
}

    .applications #top .container .row .col-lg-6 .wrapper .content .filtering-buttons:active, .applications #top .container .row .col-lg-6 .wrapper .content .filtering-buttons:hover, .applications #top .container .row .col-lg-6 .wrapper .content .filtering-buttons:focus {
        background-color: #fff;
        border: solid 1px #1b1b20;
        outline: none
    }

        .applications #top .container .row .col-lg-6 .wrapper .content .filtering-buttons:active > span, .applications #top .container .row .col-lg-6 .wrapper .content .filtering-buttons:hover > span {
            color: #1b1b20
        }

    .applications #top .container .row .col-lg-6 .wrapper .content .filtering-buttons img {
        width: 46px;
        height: 46px;
        margin-top: 1.5rem
    }

    .applications #top .container .row .col-lg-6 .wrapper .content .filtering-buttons span {
        padding: 1rem;
        color: #1b1b20
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #top .container .row .col-lg-6 {
        text-align: center
    }
}

.applications #top .container .row .ue-hero-main {
    display: flex;
    align-items: center;
    justify-content: center
}

    .applications #top .container .row .ue-hero-main img {
        width: 60%
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #top .container .row .ue-hero-main {
        display: none
    }
}

.applications #top .container .row .ue-hero-desktopApp {
    display: flex;
    align-items: center;
    justify-content: center
}

    .applications #top .container .row .ue-hero-desktopApp img {
        width: 120%
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #top .container .row .ue-hero-desktopApp {
        display: none
    }
}

.applications #topDesktopApp {
    padding: 5rem 0 3rem
}

    .applications #topDesktopApp .container .row .col-lg-6 h1 {
        font-size: 43px;
        font-weight: 800
    }

    .applications #topDesktopApp .container .row .col-lg-6 p {
        font-size: 26px;
        font-weight: 400;
        margin: 2rem 0
    }

    .applications #topDesktopApp .container .row .col-lg-6 .special-wrapper-desktop {
        justify-content: center
    }

@media(min-width:768px) and (max-width:991px) {
    .applications #topDesktopApp .container .row .col-lg-6 .special-wrapper-desktop {
        margin-right: 2rem
    }
}

.applications #topDesktopApp .container .row .col-lg-6 .heading {
    font-size: 48px !important
}

.applications #topDesktopApp .container .row .col-lg-6 .paragraph {
    font-size: 21px !important;
    width: 90%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #topDesktopApp .container .row .col-lg-6 .paragraph {
        width: 100%
    }
}

.applications #topDesktopApp .container .row .col-lg-6 .wrapper {
    display: flex;
    flex-direction: row;
    margin-top: 4rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #topDesktopApp .container .row .col-lg-6 .wrapper {
        justify-content: center;
        margin-bottom: 2rem;
        flex-direction: column;
        align-items: center
    }
}

.applications #topDesktopApp .container .row .col-lg-6 .wrapper .content {
    margin-left: 1rem
}

@media(max-width:767px) {
    .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content {
        margin-right: 0;
        margin-left: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content {
        margin-left: 0;
        margin-right: 2rem
    }
}

.applications #topDesktopApp .container .row .col-lg-6 .wrapper .content button.working {
    background-color: #fff;
    border: solid 1px #1b1b20;
    outline: none
}

.applications #topDesktopApp .container .row .col-lg-6 .wrapper .content .filtering-buttons {
    width: 140px;
    height: 146px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 2rem;
    margin-bottom: 1rem;
    border-radius: 6px;
    border: solid 1px rgba(33,31,45,.15);
    background-color: rgba(255,255,255,.48)
}

    .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content .filtering-buttons:active, .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content .filtering-buttons:hover, .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content .filtering-buttons:focus {
        background-color: #fff;
        border: solid 1px #1b1b20;
        outline: none
    }

        .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content .filtering-buttons:active > span, .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content .filtering-buttons:hover > span {
            color: #1b1b20
        }

    .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content .filtering-buttons img {
        width: 46px;
        height: 46px;
        margin-top: 1.5rem
    }

    .applications #topDesktopApp .container .row .col-lg-6 .wrapper .content .filtering-buttons span {
        padding: 1rem;
        color: #1b1b20
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #topDesktopApp .container .row .col-lg-6 {
        text-align: center
    }
}

.applications #topDesktopApp .container .row .ue-hero-main {
    display: flex;
    align-items: center;
    justify-content: center
}

    .applications #topDesktopApp .container .row .ue-hero-main img {
        width: 60%
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #topDesktopApp .container .row .ue-hero-main {
        display: none
    }
}

.applications #topDesktopApp .container .row .ue-hero-desktopApp {
    display: flex;
    align-items: center;
    justify-content: center
}

    .applications #topDesktopApp .container .row .ue-hero-desktopApp img {
        width: 120%
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #topDesktopApp .container .row .ue-hero-desktopApp {
        display: none
    }
}

.applications #buttons {
    padding: 0 0 4rem
}

    .applications #buttons .container {
        justify-content: start
    }

        .applications #buttons .container .row {
            justify-content: left;
            margin-left: -6px
        }

@media(min-width:768px) and (max-width:991px) {
    .applications #buttons .container .row {
        justify-content: center
    }
}

@media(max-width:767px) {
    .applications #buttons .container .row {
        flex-direction: column;
        justify-content: space-between;
        align-items: center
    }
}

.applications #buttons .container .row .filterDiv {
    display: none;
    height: 45px;
    margin-right: 1rem;
    padding: 0
}

@media(max-width:767px) {
    .applications #buttons .container .row .filterDiv {
        margin-bottom: 2rem;
        margin-right: 5rem
    }
}

.applications #buttons .container .row .filterDiv img {
    width: 100%
}

.applications #buttons .container .row .desktop-div {
    margin-bottom: 0;
    margin-right: 1rem
}

@media(min-width:768px) and (max-width:991px) {
    .applications #buttons .container .row .desktop-div {
        margin-right: 2rem;
        margin-bottom: 0
    }
}

@media(max-width:767px) {
    .applications #buttons .container .row .desktop-div {
        margin-bottom: 1rem
    }
}

.applications #feature-section {
    margin-top: 2rem
}

    .applications #feature-section .container {
        padding-top: 0
    }

        .applications #feature-section .container .row {
            display: none
        }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #feature-section .container .row-reverse {
        flex-direction: column-reverse !important
    }
}

.applications #feature-section .container .row .desktop__paragraph {
    font-size: 21px;
    margin: 3rem 0 !important
}

    .applications #feature-section .container .row .desktop__paragraph p {
        margin-top: 2rem
    }

    .applications #feature-section .container .row .desktop__paragraph .special-paragraph {
        color: #ffc502
    }

.applications #feature-section .container .row .text-left {
    padding-right: 0 !important;
    padding-left: 5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #feature-section .container .row .text-left {
        padding-left: 0;
        text-align: center !important
    }
}

.applications #feature-section .container .row .col-sm-12 div.text h2 {
    font-size: 36px
}

.applications #feature-section .container .row .col-sm-12 div.text div.checks {
    margin-bottom: 1rem
}

    .applications #feature-section .container .row .col-sm-12 div.text div.checks div.group {
        display: flex;
        align-items: center
    }

        .applications #feature-section .container .row .col-sm-12 div.text div.checks div.group p {
            text-align: left;
            margin-bottom: 0;
            padding-left: 2rem;
            padding-right: 0
        }

.applications #feature-section .container .row .bottom-text h2 {
    font-family: nunito sans,sans-serif;
    font-size: 18px;
    font-weight: 800
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #feature-section .mobile-margin {
        margin-bottom: 0 !important
    }
}

@media(min-width:768px) and (max-width:991px) {
    .applications #feature-section .mobile-img img {
        width: 50% !important
    }
}

@media(max-width:767px) {
    .applications #feature-section .mobile-img img {
        width: 65% !important
    }
}

.applications section#bottomCta {
    padding-top: 8rem
}

.applications #desktop-app-table .row {
    margin-bottom: 5rem
}

.applications #desktop-app-table .desktopAppTable__header {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #desktop-app-table .desktopAppTable__header {
        padding: 3rem
    }
}

.applications #desktop-app-table .desktopAppTable__header h2 {
    font-size: 48px;
    font-weight: 700;
    color: inherit
}

.applications #desktop-app-table .desktopAppTable__row {
    display: flex;
    flex-direction: row
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #desktop-app-table .desktopAppTable__row {
        flex-direction: column
    }
}

.applications #desktop-app-table .desktopAppTable__row-column {
    width: 33.3%;
    padding: 0 2rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #desktop-app-table .desktopAppTable__row-column {
        width: 100%
    }

        .applications #desktop-app-table .desktopAppTable__row-column:not(:first-child) {
            margin-top: 6rem
        }
}

.applications #desktop-app-table .desktopAppTable__row-column p {
    font-size: 19px;
    padding: 1rem 0;
    margin: 0
}

.applications #desktop-app-table .desktopAppTable__row-column h3 {
    font-size: 26px;
    font-weight: 700
}

.applications #desktop-app-table .desktopAppTable__row-column:not(:first-child) {
    margin-left: 1rem;
    border-left: 1.5px solid #f3f3f3
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .applications #desktop-app-table .desktopAppTable__row-column:not(:first-child) {
        margin-left: 0;
        border-left: 0
    }
}

.privacyTermsSubprocessors #mainNav {
    background-color: #fff
}

    .privacyTermsSubprocessors #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link.btn-menu-login.btn-highlighted {
        background: 0 0;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: unset
    }

.privacyTermsSubprocessors section#content {
    margin-top: 4rem
}

    .privacyTermsSubprocessors section#content a, .privacyTermsSubprocessors section#content a:visited, .privacyTermsSubprocessors section#content a:hover, .privacyTermsSubprocessors section#content a:focus, .privacyTermsSubprocessors section#content a:active {
        color: #00bf71
    }

    .privacyTermsSubprocessors section#content .container {
        display: flex
    }

@media(min-width:768px) and (max-width:991px) {
    .privacyTermsSubprocessors section#content .container {
        flex-direction: column
    }
}

.privacyTermsSubprocessors section#content .container .nav-menu-content {
    flex-direction: column;
    flex: .2
}

    .privacyTermsSubprocessors section#content .container .nav-menu-content a {
        display: block;
        margin-top: 1rem;
        font-size: 18px;
        color: #767676;
        font-weight: 700
    }

    .privacyTermsSubprocessors section#content .container .nav-menu-content .active {
        color: #1b1b20;
        display: inline-block;
        border-bottom: 1px solid #ffc502
    }

@media(max-width:767px) {
    .privacyTermsSubprocessors section#content .container .nav-menu-content {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .privacyTermsSubprocessors section#content .container .nav-menu-content {
        display: flex;
        justify-content: space-between;
        flex-direction: row
    }
}

.privacyTermsSubprocessors section#content .container .row {
    flex: .8
}

@media(min-width:768px) and (max-width:991px) {
    .privacyTermsSubprocessors section#content .container .row {
        margin-top: 4rem
    }
}

.privacyTermsSubprocessors section#content .container .row .header {
    margin-bottom: 1.5rem
}

    .privacyTermsSubprocessors section#content .container .row .header h2 {
        font-size: 52px;
        font-weight: 700
    }

        .privacyTermsSubprocessors section#content .container .row .header h2.left {
            text-align: left
        }

    .privacyTermsSubprocessors section#content .container .row .header p {
        font-size: 18px;
        font-weight: 600;
        color: #767676;
        font-family: lato,sans-serif
    }

@media(max-width:767px) {
    .privacyTermsSubprocessors section#content .container .row .header p {
        font-size: 18px;
        line-height: 1.7
    }
}

.privacyTermsSubprocessors section#content .container .row .text p.paragraph {
    font-size: 18px;
    text-align: left
}

.privacyTermsSubprocessors section#content .container .row .text h2 {
    font-family: nunito sans,sans-serif;
    font-weight: 800;
    font-size: 36px;
    text-align: left;
    margin-bottom: 2rem
}

    .privacyTermsSubprocessors section#content .container .row .text h2.paragraph {
        text-align: left;
        font-size: 36px
    }

.privacyTermsSubprocessors section#content .container .row .text p {
    font-family: nunito sans,sans-serif;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 2rem
}

    .privacyTermsSubprocessors section#content .container .row .text p.bottom {
        margin-bottom: 0
    }

.privacyTermsSubprocessors footer#trapezoid {
    margin-top: 7rem
}

.privacyTermsSubprocessors .left-margin {
    margin-left: 2rem
}

.privacyTermsSubprocessorsPlanner ::selection {
    background: #deebfc !important
}

.privacyTermsSubprocessorsPlanner .nav-menu-content {
    flex-direction: column;
    flex: .2
}

    .privacyTermsSubprocessorsPlanner .nav-menu-content a {
        display: block;
        margin-top: 1rem;
        font-size: 18px;
        color: #767676;
        font-weight: 700
    }

    .privacyTermsSubprocessorsPlanner .nav-menu-content .active {
        color: #1b1b20;
        display: inline-block;
        border-bottom: 1px solid #2d80eb !important
    }

@media(max-width:767px) {
    .privacyTermsSubprocessorsPlanner .nav-menu-content {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .privacyTermsSubprocessorsPlanner .nav-menu-content {
        display: flex;
        justify-content: space-between;
        flex-direction: row
    }
}

.privacyTermsSubprocessorsPlanner .left-margin a {
    color: #2d80eb !important
}

.jobs #mainNav {
    background-color: #1b1b20
}

    .jobs #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link, .jobs #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link.btn-menu-login.btn-highlighted {
        color: #fff
    }

        .jobs #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link.btn-menu-login.btn-highlighted {
            background: 0 0;
            -webkit-background-clip: unset;
            -webkit-text-fill-color: unset
        }

.jobs section#top {
    background-image: url(/img/greenbranding/jobs/hero.png);
    padding: 24rem 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .jobs section#top {
        background-image: none;
        background-color: #1b1b20;
        opacity: .9
    }
}

.jobs section#top .container .row .col-sm-12 h1 {
    letter-spacing: 0
}

.jobs section#slide-buttons {
    margin-top: 2rem
}

@media(max-width:991px) {
    .jobs section#slide-buttons {
        display: none
    }
}

.jobs section#slide-buttons .container .row .col-sm-12 {
    flex-direction: row;
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap
}

    .jobs section#slide-buttons .container .row .col-sm-12 a {
        flex-direction: row;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1rem;
        text-decoration: none;
        border: solid 1px #1b1b20;
        border-radius: 26px;
        transition: all .2s ease-in-out
    }

        .jobs section#slide-buttons .container .row .col-sm-12 a p {
            margin: 0 0 0 .5rem;
            font-size: 16px;
            font-weight: 700;
            color: #1b1b20
        }

        .jobs section#slide-buttons .container .row .col-sm-12 a:hover {
            transform: scale(1.03);
            box-shadow: 2px -3px 26px 0 rgba(200,215,243,.5)
        }

.jobs section#about {
    padding-top: 7rem
}

    .jobs section#about .container .row .col-sm-9 h2 {
        font-size: 36px;
        font-weight: 800;
        margin-bottom: 3rem
    }

    .jobs section#about .container .row .col-sm-9 p {
        font-size: 24px;
        font-weight: 600
    }

.jobs section#values {
    background-color: #1b1b20;
    margin: 15rem auto 6rem
}

    .jobs section#values .container {
        margin-top: 13rem;
        position: relative
    }

        .jobs section#values .container img.top, .jobs section#values .container img.bottom {
            position: relative
        }

        .jobs section#values .container img.top {
            bottom: 4rem
        }

        .jobs section#values .container img.bottom {
            top: 4rem
        }

        .jobs section#values .container .row {
            background-color: #1b1b20;
            padding-bottom: 4rem
        }

@media(max-width:767px) {
    .jobs section#values .container .row .col-sm-6 {
        text-align: center
    }
}

.jobs section#values .container .row .col-sm-6 h2 {
    color: #fff;
    font-size: 36px;
    font-weight: 800;
    margin-top: 5rem
}

.jobs section#values .container .row .col-sm-6 p {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    margin-top: 2rem
}

.jobs section#perks {
    padding-top: 6rem;
    position: relative
}

    .jobs section#perks .container .row .col-sm-12 h2 {
        font-size: 41px;
        font-weight: 800;
        margin-bottom: 9.5rem;
        text-align: center
    }

    .jobs section#perks .container .row .col-lg-4 {
        flex-direction: row;
        display: flex;
        align-items: end;
        justify-content: center;
        margin-bottom: 11rem;
        padding-right: 4rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .jobs section#perks .container .row .col-lg-4 {
        flex-direction: column;
        margin-bottom: 6rem;
        padding-right: 4px
    }
}

.jobs section#perks .container .row .col-lg-4 .img-wrapper {
    margin: auto
}

    .jobs section#perks .container .row .col-lg-4 .img-wrapper img {
        margin-right: 2rem;
        width: 40px;
        height: 40px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .jobs section#perks .container .row .col-lg-4 .img-wrapper img {
        margin-right: 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .jobs section#perks .container .row .col-lg-4 .wrapper {
        width: 80%;
        margin: 3rem auto 0;
        text-align: center
    }
}

.jobs section#perks .container .row .col-lg-4 .wrapper h3 {
    font-size: 20px;
    font-weight: 800;
    font-family: nunito sans,sans-serif
}

.jobs section#perks .container .row .col-lg-4 .wrapper p {
    font-size: 14px;
    font-weight: 700
}

.jobs section#positions {
    background-color: #fafffd
}

    .jobs section#positions .container {
        position: relative
    }

        .jobs section#positions .container .row .col-sm-12 h2 {
            font-size: 41px;
            font-weight: 800;
            text-align: center
        }

        .jobs section#positions .container .header {
            margin-bottom: 7rem
        }

        .jobs section#positions .container .jobs {
            background-color: #fff;
            border-radius: 6px;
            border: solid 1px #1b1b20;
            padding: 0 1.5rem;
            position: relative
        }

            .jobs section#positions .container .jobs .col-sm-12 {
                flex-direction: row;
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding-bottom: .5rem;
                padding-top: 1.5rem;
                border-bottom: 1px solid #1b1b20
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .jobs section#positions .container .jobs .col-sm-12 {
        flex-direction: column;
        margin-bottom: 2rem
    }
}

.jobs section#positions .container .jobs .col-sm-12:last-of-type {
    border-bottom: none;
    margin-bottom: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .jobs section#positions .container .jobs .col-sm-12 .text {
        text-align: center
    }
}

.jobs section#positions .container .jobs .col-sm-12 .text h2 {
    font-size: 20px;
    font-weight: 700;
    text-align: left
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .jobs section#positions .container .jobs .col-sm-12 .text h2 {
        text-align: center
    }
}

.jobs section#positions .container .jobs .col-sm-12 .text p {
    font-size: 15px;
    font-weight: 600;
    width: 81%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .jobs section#positions .container .jobs .col-sm-12 .text p {
        margin: 0 auto 1rem
    }
}

.jobs section#contact {
    padding-top: 10.5rem;
    padding-bottom: 4.5rem
}

    .jobs section#contact .container .row {
        text-align: center
    }

        .jobs section#contact .container .row .col-sm-12 h2 {
            font-size: 22px;
            font-weight: 800
        }

        .jobs section#contact .container .row .col-sm-12 p {
            font-size: 18px;
            font-weight: 700;
            margin: 2rem auto 2.5rem
        }

        .jobs section#contact .container .row .col-sm-12 .btn-highlighted {
            padding: 1rem 2rem
        }

.affiliate #mainNav {
    color: #fff !important;
    background-color: #1b1b20
}

    .affiliate #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link, .affiliate #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link.btn-menu-login.btn-highlighted {
        color: #fff
    }

        .affiliate #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link.btn-menu-login.btn-highlighted {
            background: 0 0;
            -webkit-background-clip: unset;
            -webkit-text-fill-color: unset
        }

.affiliate section#top {
    background-image: url(/img/greenbranding/affiliate/hero.png);
    padding: 20rem 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .affiliate section#top {
        background-image: unset;
        background-color: #1b1b20;
        opacity: .95
    }
}

.affiliate section#top .container .row .col-sm-12 {
    text-align: center
}

    .affiliate section#top .container .row .col-sm-12 a {
        margin-top: 4rem
    }

.affiliate section#steps {
    padding-top: 10rem;
    background-color: #fafffd
}

    .affiliate section#steps .container .row .col-sm-12 h2 {
        font-size: 41px;
        font-weight: 800;
        margin-bottom: 9.5rem;
        text-align: center
    }

    .affiliate section#steps .container .row .col-lg-4 {
        margin-bottom: 11rem;
        padding-right: 4rem;
        text-align: left
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .affiliate section#steps .container .row .col-lg-4 {
        text-align: center
    }
}

.affiliate section#steps .container .row .col-lg-4 .circle {
    width: 66px;
    height: 66px;
    border-radius: 50%;
    background-color: #f3f3f3;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: unset
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .affiliate section#steps .container .row .col-lg-4 .circle {
        margin: 0 auto
    }
}

.affiliate section#steps .container .row .col-lg-4 p.blue {
    font-size: 24px;
    font-weight: 900;
    color: #3c91e6;
    margin: 0
}

.affiliate section#steps .container .row .col-lg-4 h2 {
    font-size: 23px;
    font-weight: 800;
    margin: 3rem 0 2rem
}

.affiliate section#steps .container .row .col-lg-4 p {
    font-size: 16px;
    font-weight: 700
}

.affiliate section#benefits {
    margin-bottom: 10rem
}

    .affiliate section#benefits .container .row .col-sm-12 h2 {
        font-size: 41px;
        font-weight: 800;
        margin: 4.5rem auto;
        text-align: center
    }

    .affiliate section#benefits .container .row .col-sm-6 {
        display: flex;
        align-items: center
    }

        .affiliate section#benefits .container .row .col-sm-6 img {
            width: 80%
        }

        .affiliate section#benefits .container .row .col-sm-6 p {
            font-size: 20px;
            font-weight: 600
        }

section#awards {
    padding-top: 6rem;
    padding-bottom: 2.6rem
}

    section#awards .container .row .col-lg-3 {
        justify-content: space-between;
        display: flex;
        flex-direction: column
    }

        section#awards .container .row .col-lg-3 img {
            margin: 0 auto 1.5rem;
            width: 143px;
            height: auto
        }

section#table {
    padding-top: 8rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

    section#table .toggleVisibility {
        width: 100%;
        margin-bottom: 80px;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center
    }

        section#table .toggleVisibility::before {
            content: "";
            position: absolute;
            width: 100%;
            height: 1px;
            background-color: #dbdbdb;
            top: 25px;
            left: 0;
            z-index: 0
        }

        section#table .toggleVisibility button {
            padding: 13px 35px 14px;
            border-radius: 26px;
            border: 1px solid #dbdbdb;
            background: #fff;
            color: #222324;
            text-align: center;
            font-size: 18px;
            font-weight: 700;
            z-index: 1
        }

            section#table .toggleVisibility button span {
                margin-left: 12px
            }

                section#table .toggleVisibility button span svg {
                    transition: all .2s ease-in-out
                }

                    section#table .toggleVisibility button span svg.rotate {
                        transform: rotate(180deg)
                    }

            section#table .toggleVisibility button:focus {
                outline: none
            }

    section#table .container.hide {
        display: none
    }

    section#table .container.show {
        display: block
    }

    section#table .container .row .col-sm-12 h2 {
        font-size: 41px;
        font-weight: 800;
        text-align: center;
        margin-bottom: 6rem
    }

    section#table .container .row .comparison {
        margin: 0 auto;
        font-size: 14px;
        font-weight: 700;
        text-align: center
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    section#table .container .row .comparison {
        overflow-x: scroll
    }
}

section#table .container .row .comparison .tick {
    color: #1b1b20
}

section#table .container .row .comparison table {
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    position: relative;
    min-width: 1310px
}

    section#table .container .row .comparison table.fixed-bar {
        position: sticky;
        position: -webkit-sticky;
        top: 5.5rem;
        background-color: #fff;
        z-index: 10
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    section#table .container .row .comparison table.fixed-bar {
        top: unset
    }
}

section#table .container .row .comparison table tr th:first-of-type, section#table .container .row .comparison table tr td:first-of-type {
    width: 300px
}

section#table .container .row .comparison table thead tr th {
    empty-cells: show;
    padding: 10px
}

    section#table .container .row .comparison table thead tr th.tl {
        border-bottom: none
    }

        section#table .container .row .comparison table thead tr th.tl::after {
            content: "";
            position: absolute;
            background-color: #fff;
            width: calc(100% + 7rem);
            height: 100%;
            top: 0;
            left: 0;
            z-index: -1;
            margin-left: -7rem
        }

    section#table .container .row .comparison table thead tr th.compare-heading {
        font-size: 14px;
        text-transform: uppercase;
        color: #ffc502;
        font-weight: 700;
        text-align: center;
        padding-top: 1rem;
        border-bottom: unset
    }

        section#table .container .row .comparison table thead tr th.compare-heading.red {
            color: #eb5160
        }

        section#table .container .row .comparison table thead tr th.compare-heading.yellow {
            color: #f7b801
        }

        section#table .container .row .comparison table thead tr th.compare-heading.green {
            color: #00bf71
        }

        section#table .container .row .comparison table thead tr th.compare-heading.blue {
            color: #3c91e6
        }

    section#table .container .row .comparison table thead tr th.price-info {
        text-align: center;
        border-bottom: none;
        padding: 0 10px
    }

        section#table .container .row .comparison table thead tr th.price-info .price-now {
            margin: 0 auto;
            font-family: Lato;
            font-size: 32px;
            font-weight: 700;
            line-height: 38px;
            letter-spacing: 0
        }

            section#table .container .row .comparison table thead tr th.price-info .price-now span.dolar {
                font-family: Nunito Sans;
                font-size: 16px;
                font-weight: 800;
                line-height: 22px;
                text-align: right
            }

        section#table .container .row .comparison table thead tr th.price-info .add-margin {
            margin-bottom: 47px
        }

        section#table .container .row .comparison table thead tr th.price-info .price-anually {
            font-family: Nunito Sans;
            font-size: 14px;
            font-weight: 400;
            line-height: 22px;
            letter-spacing: 0;
            text-align: center;
            margin: .5rem auto 12px;
            min-height: 44px
        }

        section#table .container .row .comparison table thead tr th.price-info a {
            margin-bottom: 1.5rem
        }

        section#table .container .row .comparison table thead tr th.price-info .btn-outline {
            padding: 15px 0;
            width: 100%;
            font-size: 16px;
            margin-top: .5rem
        }

section#table .container .row .comparison table tbody .head-row td {
    border: 0 !important
}

    section#table .container .row .comparison table tbody .head-row td:first-of-type {
        position: relative;
        font-size: 22px;
        padding: .3rem 10px;
        color: #fff;
        font-weight: 700;
        background-color: #ffc502
    }

@media(max-width:767px) {
    section#table .container .row .comparison table tbody .head-row td:first-of-type {
        font-size: 14px;
        font-weight: 700
    }
}

section#table .container .row .comparison table tbody .head-row td:first-of-type::after {
    content: "";
    position: absolute;
    background-color: #ffc502;
    width: calc(100% + 5rem);
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    margin-left: -7rem
}

section#table .container .row .comparison table tbody tr:first-of-type td {
    border: 0 !important
}

section#table .container .row .comparison table tbody tr:last-of-type td {
    border-bottom: 0
}

    section#table .container .row .comparison table tbody tr:last-of-type td:not(:last-of-type) {
        border-right: 1px solid #ddd
    }

section#table .container .row .comparison table tbody tr td {
    color: #222324;
    font-size: 16px;
    font-weight: 600;
    border-bottom: 1px solid #ddd;
    empty-cells: show;
    padding: 10px
}

    section#table .container .row .comparison table tbody tr td:not(:last-of-type) {
        border-right: 1px solid #ddd
    }

@media(max-width:767px) {
    section#table .container .row .comparison table tbody tr td {
        font-size: 12px;
        font-weight: 600;
        border-bottom: 1px solid #ddd
    }
}

section#table .container .row .comparison table tbody tr td p {
    margin: 0;
    font-size: 14px;
    text-transform: uppercase;
    color: #fff;
    background: #ffc502;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    border-radius: 8px;
    padding: .5rem 0
}

section#table .container .row .comparison table tbody tr td:first-child {
    text-align: left
}

@media(max-width:767px) {
    section#table .container .row .comparison tbody tr:nth-child(odd) {
        display: table-row
    }

    section#table .container .row .comparison .row {
        background: #fff
    }

    section#table .container .row .price-info {
        border-top: 0 !important
    }
}

@media(max-width:639px) {
    section#table .container .row .comparison .price-buy {
        padding: 5px 10px
    }

    section#table .container .row .comparison td, section#table .container .row .comparison th {
        padding: 10px 5px
    }

    section#table .container .row .comparison .price-now span {
        font-size: 16px
    }

    section#table .container .row .compare-heading {
        font-size: 13px
    }
}

.notFound section#top {
    background-color: unset;
    position: relative;
    margin-top: -9rem;
    height: 100vh
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .notFound section#top {
        height: auto
    }
}

@media(max-width:767px) {
    .notFound section#top {
        margin-top: -5rem
    }
}

.notFound section#top .container {
    max-width: 100%
}

    .notFound section#top .container .row .col-lg-6 h1 {
        font-size: 200px;
        font-weight: 700;
        text-align: center;
        color: #1b1b20;
        font-family: nunito sans,sans-serif;
        width: 100%
    }

@media(max-width:767px) {
    .notFound section#top .container .row .col-lg-6 h1 {
        font-size: 150px
    }
}

.notFound section#top .container .row .col-lg-6 p {
    font-size: 18px;
    font-weight: 600;
    font-family: nunito sans,sans-serif;
    text-align: left;
    line-height: 1.36;
    margin: 0 auto 1rem
}

@media(max-width:767px) {
    .notFound section#top .container .row .col-lg-6 p {
        text-align: center
    }
}

.notFound section#top .container .row .col-lg-6 .btn-highlighted {
    margin-top: 2rem;
    padding: 15px 88px;
    border: 2px solid #1b1b20
}

.notFound section#top .container .row .col-lg-6 img {
    width: 60%
}

.notFound section#top .container .row .left {
    align-items: center;
    display: flex;
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .notFound section#top .container .row .left {
        margin-bottom: 4rem
    }
}

.notFound section#top .container .row .right {
    text-align: center;
    margin-top: auto
}

.aboutUs #mainNav {
    background-color: #1b1b20
}

    .aboutUs #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link, .aboutUs #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link.btn-menu-login.btn-highlighted {
        color: #fff
    }

        .aboutUs #mainNav .container .collapse .navbar-nav li.nav-item a.nav-link.btn-menu-login.btn-highlighted {
            background: 0 0;
            -webkit-background-clip: unset;
            -webkit-text-fill-color: unset
        }

.aboutUs section#top {
    position: relative;
    background-image: url(/img/greenbranding/industries/agencies.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 15rem
}

@media(max-width:767px) {
    .aboutUs section#top {
        padding-top: 2rem
    }
}

.aboutUs section#top:before {
    position: absolute;
    background-color: #1b1b20;
    opacity: .97;
    top: 0;
    left: 0;
    content: "";
    height: 100%;
    width: 100%
}

.aboutUs section#top .container .row .col {
    text-align: center
}

    .aboutUs section#top .container .row .col h1 {
        font-size: 60px;
        font-weight: 800;
        color: #fff;
        width: 100%
    }

        .aboutUs section#top .container .row .col h1 span {
            color: #00bf71
        }

    .aboutUs section#top .container .row .col p {
        font-size: 24px;
        font-weight: 600;
        color: #fff
    }

.aboutUs section#top .container .row .col-lg-7 {
    align-items: center;
    display: flex
}

    .aboutUs section#top .container .row .col-lg-7 p {
        color: #fff;
        font-size: 21px;
        font-weight: 600;
        text-align: center;
        margin: 5rem auto
    }

.aboutUs section.did-you-know {
    margin: 4rem auto 2rem
}

    .aboutUs section.did-you-know .container .row {
        border: 2px solid #1b1b20;
        border-radius: 15px;
        padding: 3rem 0
    }

        .aboutUs section.did-you-know .container .row .col-sm-12 {
            display: flex;
            width: 100%
        }

            .aboutUs section.did-you-know .container .row .col-sm-12 .img-container {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 50%
            }

                .aboutUs section.did-you-know .container .row .col-sm-12 .img-container img {
                    object-fit: contain;
                    mix-blend-mode: darken
                }

            .aboutUs section.did-you-know .container .row .col-sm-12 .wrapper {
                display: flex;
                justify-content: center;
                flex-direction: column;
                align-items: center;
                width: 100%
            }

                .aboutUs section.did-you-know .container .row .col-sm-12 .wrapper h3 {
                    font-size: 24px;
                    font-weight: 800;
                    text-align: left;
                    width: 100%;
                    margin-bottom: 2rem
                }

                .aboutUs section.did-you-know .container .row .col-sm-12 .wrapper p {
                    font-size: 16px;
                    font-weight: 600;
                    text-align: left;
                    width: 94%;
                    margin-right: auto
                }

.aboutUs section#quick-look {
    background-color: #fafffd
}

    .aboutUs section#quick-look .container .row .col-lg-4 {
        text-align: left
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .aboutUs section#quick-look .container .row .col-lg-4 {
        text-align: center
    }
}

.aboutUs section#quick-look .container .row .col-lg-4 h2 {
    font-size: 28px;
    font-weight: 700;
    margin: 2rem auto
}

.aboutUs section#quick-look .container .row .col-lg-4 .circle {
    margin: auto
}

.aboutUs section#timeline-section {
    padding: 8rem 0 10rem;
    background-color: #1b1b20;
    opacity: .97
}

    .aboutUs section#timeline-section .container .row .col-lg-12.first {
        margin: 60px 0
    }

        .aboutUs section#timeline-section .container .row .col-lg-12.first .flex-parent {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%
        }

        .aboutUs section#timeline-section .container .row .col-lg-12.first .input-flex-container {
            display: flex;
            justify-content: space-around;
            align-items: center;
            width: 80vw;
            height: 100px;
            max-width: 1000px;
            position: relative;
            z-index: 0
        }

@media(max-width:767px) {
    .aboutUs section#timeline-section .container .row .col-lg-12.first .input-flex-container {
        display: none
    }
}

.aboutUs section#timeline-section .container .row .col-lg-12.first .input {
    width: 25px;
    height: 25px;
    background-color: #3c91e6;
    position: relative;
    border-radius: 50%;
    color: #fff;
    font-weight: 700
}

    .aboutUs section#timeline-section .container .row .col-lg-12.first .input:before, .aboutUs section#timeline-section .container .row .col-lg-12.first .input:after {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        top: 50%;
        transform: translateY(-50%);
        background-color: #3c91e6;
        width: 5vw;
        height: 5px;
        max-width: 62.5px
    }

    .aboutUs section#timeline-section .container .row .col-lg-12.first .input:before {
        left: calc(-5vw + 12.5px)
    }

    .aboutUs section#timeline-section .container .row .col-lg-12.first .input:after {
        right: calc(-5vw + 12.5px)
    }

    .aboutUs section#timeline-section .container .row .col-lg-12.first .input.active {
        background-color: #3c91e6
    }

        .aboutUs section#timeline-section .container .row .col-lg-12.first .input.active:before {
            background-color: #3c91e6
        }

        .aboutUs section#timeline-section .container .row .col-lg-12.first .input.active:after {
            background-color: #3c91e6
        }

    .aboutUs section#timeline-section .container .row .col-lg-12.first .input span {
        width: 1px;
        height: 1px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        visibility: hidden
    }

        .aboutUs section#timeline-section .container .row .col-lg-12.first .input span:before, .aboutUs section#timeline-section .container .row .col-lg-12.first .input span:after {
            visibility: visible;
            position: absolute;
            left: 50%
        }

        .aboutUs section#timeline-section .container .row .col-lg-12.first .input span:after {
            content: attr(data-down);
            top: 40px;
            transform: translateX(-50%);
            font-size: 14px
        }

        .aboutUs section#timeline-section .container .row .col-lg-12.first .input span:before {
            content: attr(data-up);
            top: -80px;
            width: 70px;
            transform: translateX(-50%);
            font-size: 14px
        }

.aboutUs section#timeline-section .container .row .col-lg-12.first .description-flex-container {
    width: 80vw;
    font-weight: 400;
    font-size: 22px;
    margin-top: 100px;
    max-width: 1000px;
    color: #fff
}

.aboutUs section#timeline-section .container .row .col-lg-12.first p {
    margin-top: 0;
    display: none;
    font-size: 18px;
    font-weight: 600
}

    .aboutUs section#timeline-section .container .row .col-lg-12.first p.active {
        display: block
    }

@media(min-width:1250px) {
    .aboutUs section#timeline-section .container .row .col-lg-12.first .input:before {
        left: -50px
    }

    .aboutUs section#timeline-section .container .row .col-lg-12.first .input:after {
        right: -50px
    }
}

@media(max-width:850px) {
    .aboutUs section#timeline-section .container .row .col-lg-12.first .input {
        width: 17px;
        height: 17px
    }

    .aboutUs section#timeline-section .container .row .col-lg-12.first:before, .aboutUs section#timeline-section .container .row .col-lg-12.first:after {
        height: 3px
    }

    .aboutUs section#timeline-section .container .row .col-lg-12.first:before {
        left: calc(-5vw + 8.5px)
    }

    .aboutUs section#timeline-section .container .row .col-lg-12.first:after {
        right: calc(-5vw + 8.5px)
    }
}

.aboutUs section#timeline-section .container .row .col-lg-12.second p {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    margin: 3.5rem auto 0;
    width: 64%
}

.aboutUs section.second .container .row .col-sm-12 .wrapper {
    margin-left: 5rem
}

    .aboutUs section.second .container .row .col-sm-12 .wrapper h3 {
        margin-bottom: 1rem
    }

    .aboutUs section.second .container .row .col-sm-12 .wrapper p a, .aboutUs section.second .container .row .col-sm-12 .wrapper p a:hover {
        color: #00bf71
    }

.aboutUs section#steps {
    margin-top: 9rem;
    margin-bottom: 4rem
}

    .aboutUs section#steps .container .row {
        text-align: center;
        justify-content: space-evenly
    }

        .aboutUs section#steps .container .row .col-lg-12 {
            margin-bottom: 6rem
        }

            .aboutUs section#steps .container .row .col-lg-12 h2 {
                font-size: 36px;
                font-weight: 800
            }

        .aboutUs section#steps .container .row .col-lg-3 {
            color: #1b1b20;
            border: solid 1px transparent;
            border-radius: 10px;
            background-color: #fafffd;
            padding-bottom: 3rem
        }

            .aboutUs section#steps .container .row .col-lg-3:hover {
                text-decoration: none;
                color: #1b1b20;
                border: solid 1px #1b1b20;
                border-radius: 10px
            }

            .aboutUs section#steps .container .row .col-lg-3 img {
                margin-top: 2rem;
                width: 25%
            }

            .aboutUs section#steps .container .row .col-lg-3 p {
                font-size: 20px;
                font-weight: 600;
                margin-top: 2rem
            }

                .aboutUs section#steps .container .row .col-lg-3 p span {
                    color: #00bf71;
                    font-weight: 700
                }

.ppcLP section#top .container .row .col-lg-12 .form form .form-wrapper button {
    margin-top: 0
}

.ppcLP section#top.second {
    background-image: none;
    background-repeat: unset;
    background-size: unset;
    background-position: unset;
    padding: 0
}

    .ppcLP section#top.second .container .row .col-sm-12 .main-wrapper {
        display: flex;
        flex-direction: row;
        margin: 0 auto 1rem;
        width: 60%;
        flex-wrap: wrap
    }

@media(max-width:991px) {
    .ppcLP section#top.second .container .row .col-sm-12 .main-wrapper {
        width: unset
    }
}

.ppcLP section#top.second .container .row .col-sm-12 .main-wrapper div.check-wrapper {
    justify-content: space-between;
    flex-direction: column;
    width: unset
}

    .ppcLP section#top.second .container .row .col-sm-12 .main-wrapper div.check-wrapper i {
        font-size: 21px
    }

    .ppcLP section#top.second .container .row .col-sm-12 .main-wrapper div.check-wrapper p {
        font-size: 21px;
        font-weight: 600
    }

    .ppcLP section#top.second .container .row .col-sm-12 .main-wrapper div.check-wrapper div.first {
        margin-bottom: 1.5rem
    }

@media(max-width:767px) {
    .ppcLP section#top.second .container .row .col-sm-12 .main-wrapper div.check-wrapper i, .ppcLP section#top.second .container .row .col-sm-12 .main-wrapper div.check-wrapper p {
        font-size: 18px
    }
}

.ppcLP section#top.second .container .row .col-sm-12 .extra-width {
    width: 100%
}

.ppcLP section#top.second .container .row .col-sm-12 img {
    width: 100%
}

.ppcLP section#top.second:before {
    content: unset
}

.time_tracking_system {
    background-color: #fcfcfd
}

    .time_tracking_system p.label {
        font-weight: 500;
        font-size: 16px;
        color: #a0a0a0
    }

    .time_tracking_system #mainNav {
        background: linear-gradient(180deg,#e9eff9 0%,rgba(246,249,250,0) 100%)
    }

        .time_tracking_system #mainNav .collapse .menu-1 li.nav-item {
            margin-left: 3rem
        }

        .time_tracking_system #mainNav .collapse .menu-2 li.nav-item a.btn-filled {
            color: #1b1b20;
            box-shadow: 0 15px 26px rgba(255,199,0,.3)
        }

            .time_tracking_system #mainNav .collapse .menu-2 li.nav-item a.btn-filled:hover {
                color: #1b1b20 !important;
                box-shadow: none;
                background-color: #f7b801
            }

        .time_tracking_system #mainNav.navbar-shrink {
            background: #fff;
            box-shadow: 0 4px 39px rgba(214,231,255,.7)
        }

    .time_tracking_system #top_test {
        background: linear-gradient(180deg,#e9eff9 0%,rgba(246,249,250,0) 100%);
        padding-top: 10rem
    }

        .time_tracking_system #top_test .container {
            padding: 4rem 0
        }

            .time_tracking_system #top_test .container .row .col-sm-12 h2 {
                margin: 0 auto 3rem;
                font-size: 44px;
                font-weight: 400;
                text-align: center;
                color: #0a1940;
                width: 65%
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system #top_test .container .row .col-sm-12 h2 {
        width: 90%
    }
}

.time_tracking_system #top_test .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    color: #1b1b20;
    margin: 0 auto 3rem;
    text-align: center
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system #top_test .container .row .col-sm-12 p {
        width: 88%
    }
}

.time_tracking_system #top_test .container .row .col-sm-12 .form {
    width: 50%;
    margin: 0 auto
}

    .time_tracking_system #top_test .container .row .col-sm-12 .form .form-wrapper input {
        outline: none
    }

        .time_tracking_system #top_test .container .row .col-sm-12 .form .form-wrapper input[type=email] {
            border-radius: 26px;
            border: 2px solid rgba(10,25,64,.2);
            box-shadow: none
        }

            .time_tracking_system #top_test .container .row .col-sm-12 .form .form-wrapper input[type=email]:hover {
                border: 2px solid rgba(0,191,113,.3);
                outline: none;
                box-shadow: none
            }

@media(max-width:767px) {
    .time_tracking_system #top_test .container .row .col-sm-12 .form .form-wrapper input[type=email] {
        margin-bottom: 1rem;
        width: 100%
    }
}

.time_tracking_system #top_test .container .row .col-sm-12 .form .form-wrapper button {
    padding: 16px 0;
    color: #fff;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #00bf71;
    position: relative;
    left: -3rem;
    border: 1px solid rgba(31,225,73,.3);
    box-shadow: 0 15px 32px rgba(57,82,62,.3)
}

@media(max-width:767px) {
    .time_tracking_system #top_test .container .row .col-sm-12 .form .form-wrapper button {
        left: 0
    }
}

.time_tracking_system #top_test .container .row .col-sm-12 .form .form-wrapper button:hover {
    color: #1b1b20;
    box-shadow: none;
    background-color: #00bf71
}

.time_tracking_system #top_test .container .row .col-sm-12 .form .terms-submission {
    margin: 8px 0;
    font-size: 11px;
    color: #1b1b20;
    opacity: .6;
    width: 100%;
    text-align: center
}

    .time_tracking_system #top_test .container .row .col-sm-12 .form .terms-submission label {
        display: flex
    }

@media(max-width:767px) {
    .time_tracking_system #top_test .container .row .col-sm-12 .form .terms-submission label {
        flex-wrap: wrap
    }
}

.time_tracking_system #top_test .container .row .col-sm-12 .form .terms-submission label:hover {
    cursor: pointer
}

.time_tracking_system #top_test .container .row .col-sm-12 .form .terms-submission label input {
    margin-right: .3rem
}

.time_tracking_system #top_test .container .row .col-sm-12 .form .terms-submission a {
    color: #1b1b20;
    text-decoration: underline;
    margin: 0 2px;
    font-weight: 600
}

.time_tracking_system #top_test .container .row .col-sm-12 img {
    width: 100%;
    margin-top: 2rem
}

.time_tracking_system .inline-form-tc input[type=email] {
    border: 1px solid #1b1b20;
    outline: none;
    font-size: 16px;
    padding: 16px 5px 16px 20px;
    color: #5a5a5a;
    width: 63%
}

    .time_tracking_system .inline-form-tc input[type=email]:hover, .time_tracking_system .inline-form-tc input[type=email]:focus, .time_tracking_system .inline-form-tc input[type=email]:active {
        box-shadow: 0 0 0 3px #f7b801
    }

@media(max-width:767px) {
    .time_tracking_system .inline-form-tc input[type=email] {
        font-size: 11px
    }
}

.time_tracking_system .inline-form-tc p {
    font-size: 13px;
    margin: .7rem 0
}

.time_tracking_system .inline-form-tc button {
    padding: 12px 50px;
    color: #fff;
    font-weight: 700;
    width: 35%
}

@media(max-width:767px) {
    .time_tracking_system .inline-form-tc button {
        width: 100%
    }
}

.time_tracking_system section#scroll .container .row .scrollLeft {
    position: absolute;
    top: 76rem;
    left: -2rem;
    transform: rotate(17.89deg)
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#scroll .container .row .scrollLeft {
        display: none
    }
}

.time_tracking_system section#scroll .container .row .col-sm-12 p.label {
    text-align: center
}

.time_tracking_system section#scroll .container .row .col-sm-12 h2 {
    width: 65%;
    text-align: center;
    margin: 0 auto 3rem;
    color: #0a1940
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#scroll .container .row .col-sm-12 h2 {
        width: 100%
    }
}

.time_tracking_system section#scroll .container .row .carousel .carousel-control-next, .time_tracking_system section#scroll .container .row .carousel .carousel-control-prev {
    filter: invert(100%)
}

.time_tracking_system section#scroll .container .row .carousel .carousel-control-prev {
    left: -5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#scroll .container .row .carousel .carousel-control-prev {
        left: -2rem
    }
}

@media(max-width:767px) {
    .time_tracking_system section#scroll .container .row .carousel .carousel-control-prev {
        margin-left: 1rem
    }
}

.time_tracking_system section#scroll .container .row .carousel .carousel-control-next {
    right: -5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#scroll .container .row .carousel .carousel-control-next {
        right: -2rem
    }
}

@media(max-width:767px) {
    .time_tracking_system section#scroll .container .row .carousel .carousel-control-next {
        margin-right: 1rem
    }
}

.time_tracking_system section#scroll .container .row .carousel .carousel-item.active, .time_tracking_system section#scroll .container .row .carousel .carousel-item.next, .time_tracking_system section#scroll .container .row .carousel .carousel-item.prev, .time_tracking_system section#scroll .container .row .carousel .carousel-item-next.carousel-item-left, .time_tracking_system section#scroll .container .row .carousel .carousel-item-prev.carousel-item-right {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}

.time_tracking_system section#scroll .container .row .carousel .col-md-6 {
    height: 100%;
    justify-content: center;
    align-items: center
}

@media(max-width:991px) {
    .time_tracking_system section#scroll .container .row .carousel .col-md-6 {
        height: auto
    }
}

.time_tracking_system section#scroll .container .row .carousel .col-md-6 div.content {
    flex-direction: column;
    justify-content: center;
    border: solid 1px rgba(27,27,32,.05);
    background-color: #fff;
    display: flex;
    align-items: center;
    text-align: center;
    padding: 2rem;
    border-radius: 8px;
    height: 70%
}

    .time_tracking_system section#scroll .container .row .carousel .col-md-6 div.content h3 {
        font-size: 24px;
        font-weight: 600;
        margin-bottom: 1rem;
        color: #0a1940
    }

    .time_tracking_system section#scroll .container .row .carousel .col-md-6 div.content p {
        font-size: 14px;
        font-weight: 400;
        opacity: .6
    }

.time_tracking_system section#scroll .container .row .carousel .col-md-6 div.signature {
    margin-top: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column
}

    .time_tracking_system section#scroll .container .row .carousel .col-md-6 div.signature p {
        font-size: 14px;
        font-weight: 400;
        opacity: .6
    }

    .time_tracking_system section#scroll .container .row .carousel .col-md-6 div.signature img {
        width: 40%;
        padding-bottom: 1rem
    }

@media(max-width:991px) {
    .time_tracking_system section#scroll .container .row .carousel .col-md-6 div.signature img {
        width: 20%
    }
}

.time_tracking_system section#scroll .container .row .carousel .img img {
    width: 100%
}

.time_tracking_system section#scroll .container .row.common div.img {
    width: 100%;
    height: 100vh;
    background-image: url(/img/greenbranding/new-index/1.png);
    background-size: 100% 100%;
    background-attachment: fixed;
    transition: 1000ms
}

.time_tracking_system section#feature-section {
    margin: 2rem 4rem
}

    .time_tracking_system section#feature-section .container {
        max-width: 100%
    }

        .time_tracking_system section#feature-section .container .col-sm-12 p.label {
            text-align: center
        }

        .time_tracking_system section#feature-section .container .col-sm-12 h2 {
            font-size: 32px;
            font-weight: 400;
            color: #0a1940
        }

        .time_tracking_system section#feature-section .container .row {
            justify-content: center
        }

            .time_tracking_system section#feature-section .container .row .hand_icon {
                position: absolute;
                top: 117rem;
                left: 5rem
            }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .time_tracking_system section#feature-section .container .row .hand_icon {
        display: none
    }
}

.time_tracking_system section#feature-section .container .row .billing_icon {
    position: absolute;
    left: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#feature-section .container .row .billing_icon {
        display: none
    }
}

.time_tracking_system section#feature-section .container .row .automated_tracker_icon {
    position: absolute;
    right: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#feature-section .container .row .automated_tracker_icon {
        display: none
    }
}

.time_tracking_system section#feature-section .container .row .col-sm-12 {
    margin-bottom: 0
}

    .time_tracking_system section#feature-section .container .row .col-sm-12 img {
        width: 100%
    }

    .time_tracking_system section#feature-section .container .row .col-sm-12 ul {
        list-style-type: none
    }

        .time_tracking_system section#feature-section .container .row .col-sm-12 ul li img {
            margin-right: 1rem;
            width: auto
        }

        .time_tracking_system section#feature-section .container .row .col-sm-12 ul.direction-row {
            display: flex;
            padding-left: 4.5rem;
            padding-right: 0;
            justify-content: space-between
        }

@media(max-width:767px) {
    .time_tracking_system section#feature-section .container .row .col-sm-12 ul.direction-row {
        flex-direction: column;
        padding-left: 0
    }
}

.time_tracking_system section#feature-section .container .row .col-sm-12 ul.direction-row li {
    align-items: center;
    display: flex
}

@media(max-width:767px) {
    .time_tracking_system section#feature-section .container .row .col-sm-12 ul.direction-row li {
        margin: 0 auto 2rem;
        text-align: left;
        width: 80%
    }
}

.time_tracking_system section#feature-section .container .row .col-sm-12 ul.direction-column {
    padding: 0
}

    .time_tracking_system section#feature-section .container .row .col-sm-12 ul.direction-column li {
        margin: 0 auto 2rem;
        text-align: left;
        width: 80%;
        align-items: center;
        display: flex
    }

.time_tracking_system section#feature-section .container .row .col-sm-12 div.text p.label {
    font-weight: 500;
    font-size: 16px;
    color: #a0a0a0
}

.time_tracking_system section#feature-section .container .row .col-lg-5 div.text h2 {
    margin: 1rem auto 2rem;
    width: 80%;
    font-size: 32px;
    font-weight: 400;
    color: #0a1940
}

.time_tracking_system section#feature-section .container .row .col-lg-5 div.text p {
    width: 80%;
    margin: 1rem auto 2rem;
    font-weight: 400;
    font-size: 18px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#feature-section .container .row .col-lg-5 div.text p {
        width: 100%
    }
}

.time_tracking_system section#feature-section .container .row .left ul.direction-column {
    width: 60%;
    margin: 0 auto
}

.time_tracking_system section#feature-section .container .row.silver {
    background: linear-gradient(178.21deg,#f2f8ff 1.51%,#f2f8ff 98.57%);
    border-radius: 98px;
    justify-content: center;
    padding-top: 6rem
}

.time_tracking_system section#big_cta {
    padding-bottom: 11rem;
    padding-top: 7rem
}

    .time_tracking_system section#big_cta .container .row {
        background: linear-gradient(98.7deg,#ffe876 20.93%,#f5cc63 95.8%);
        border-radius: 98px;
        position: relative
    }

        .time_tracking_system section#big_cta .container .row .col-sm-12 {
            text-align: left;
            background: 0 0
        }

            .time_tracking_system section#big_cta .container .row .col-sm-12 h2 {
                padding-top: 4rem;
                font-size: 32px;
                font-weight: 400;
                margin: auto auto 2rem 2rem;
                text-align: left;
                width: 100%;
                color: #0a1940
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#big_cta .container .row .col-sm-12 h2 {
        width: 80%;
        margin: 0 auto 2rem;
        text-align: center
    }
}

.time_tracking_system section#big_cta .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    margin: 3rem auto 3rem 2rem;
    padding-top: 0;
    text-align: left
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#big_cta .container .row .col-sm-12 p {
        text-align: center;
        margin: 3rem auto
    }
}

.time_tracking_system section#big_cta .container .row .col-sm-12 a {
    margin-bottom: 4rem;
    padding: 1rem
}

.time_tracking_system section#big_cta .container .row .col-sm-12 .btn-filled {
    padding: 1rem 2.5rem;
    margin-left: 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .time_tracking_system section#big_cta .container .row .col-sm-12 .btn-filled {
        width: 40%;
        margin-left: 0
    }
}

@media(max-width:767px) {
    .time_tracking_system section#big_cta .container .row .col-sm-12 .btn-filled {
        width: 100%;
        margin-left: 0
    }
}

.time_tracking_system section#big_cta .container .row .col-sm-12 a.btn-filled.green {
    box-shadow: 0 15px 48px rgba(90,72,13,.3)
}

    .time_tracking_system section#big_cta .container .row .col-sm-12 a.btn-filled.green:hover {
        box-shadow: none
    }

.time_tracking_system section#big_cta .container .row .col-sm-12 a.btn-filled.white {
    color: #f5cc63;
    box-shadow: 0 15px 61px rgba(170,137,17,.5)
}

    .time_tracking_system section#big_cta .container .row .col-sm-12 a.btn-filled.white:hover {
        box-shadow: none;
        background-color: #fff
    }

.time_tracking_system section#big_cta .container .row .col-sm-12 img {
    width: 100%;
    position: relative;
    top: 5rem
}

.time_tracking_system section#features_second .container .row .col-sm-12 {
    justify-content: center
}

    .time_tracking_system section#features_second .container .row .col-sm-12 p.label {
        font-weight: 500;
        font-size: 16px;
        color: #a0a0a0
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#features_second .container .row .col-sm-12 p.label {
        text-align: center
    }
}

.time_tracking_system section#features_second .container .row .col-sm-12 h2 {
    font-size: 32px;
    font-weight: 400;
    margin-bottom: 2rem;
    color: #0a1940
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#features_second .container .row .col-sm-12 h2 {
        text-align: center
    }
}

.time_tracking_system section#features_second .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system section#features_second .container .row .col-sm-12 p {
        text-align: center
    }
}

.time_tracking_system section#features_second .container .row .col-sm-12 ul {
    list-style-type: none
}

    .time_tracking_system section#features_second .container .row .col-sm-12 ul li {
        margin: 0 auto 2rem;
        text-align: left
    }

        .time_tracking_system section#features_second .container .row .col-sm-12 ul li img {
            margin-right: 1rem
        }

        .time_tracking_system section#features_second .container .row .col-sm-12 ul li:nth-of-type(2) img {
            margin-right: 1.7rem
        }

.time_tracking_system section#features_second .container .row .list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.time_tracking_system section#features_second .container .row .img {
    display: flex;
    justify-content: center;
    margin-bottom: 3rem
}

    .time_tracking_system section#features_second .container .row .img img {
        width: 100%
    }

.time_tracking_system #integrations {
    padding: 7rem 0 2rem;
    background-color: #fff;
    margin-bottom: 9rem
}

@media(max-width:991px) {
    .time_tracking_system #integrations .container .row {
        flex-direction: column
    }
}

.time_tracking_system #integrations .container .row .left-container {
    display: flex;
    align-items: center
}

.time_tracking_system #integrations .container .row .col-lg-5 {
    justify-content: center;
    display: flex;
    flex-direction: column
}

    .time_tracking_system #integrations .container .row .col-lg-5 p.label {
        font-weight: 500;
        font-size: 16px;
        color: #a0a0a0;
        margin: 0
    }

    .time_tracking_system #integrations .container .row .col-lg-5 p.green {
        color: #00bf71;
        margin-bottom: 1rem;
        font-size: 16px;
        font-weight: 600
    }

    .time_tracking_system #integrations .container .row .col-lg-5 h2 {
        font-size: 32px;
        font-weight: 400;
        position: relative;
        z-index: 1;
        margin: 1rem auto 2rem;
        color: #0a1940
    }

    .time_tracking_system #integrations .container .row .col-lg-5 p {
        margin: 0 0 2rem;
        font-size: 18px;
        font-weight: 600;
        color: #1b1b20
    }

    .time_tracking_system #integrations .container .row .col-lg-5 .btn-check-integrations {
        color: #00bf71;
        font-size: 16px;
        font-weight: 800;
        margin-top: 0;
        white-space: nowrap;
        padding-bottom: 2rem
    }

        .time_tracking_system #integrations .container .row .col-lg-5 .btn-check-integrations:hover {
            text-decoration: underline;
            color: #00bf71
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system #integrations .container .row .col-lg-5 {
        text-align: center
    }

        .time_tracking_system #integrations .container .row .col-lg-5 h2 {
            width: 100%;
            margin: 1rem auto
        }
}

.time_tracking_system #integrations .container .row .col-lg-7 img {
    width: 24px;
    height: 24px
}

.time_tracking_system #integrations .container .row .col-lg-7 .white-bg {
    margin-bottom: 2rem;
    margin-left: 4rem;
    width: 48px;
    height: 48px;
    border-radius: 8px;
    transition: all .2s ease-in-out;
    background-color: #fff;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    position: relative;
    box-shadow: 4px 2px 16px 0 rgba(0,0,0,.06)
}

    .time_tracking_system #integrations .container .row .col-lg-7 .white-bg:hover {
        transform: matrix(-1,0,0,1,0,0)
    }

        .time_tracking_system #integrations .container .row .col-lg-7 .white-bg:hover > .integration-name {
            transform: scale(1.07)
        }

.time_tracking_system #integrations .container .row .col-lg-7 .wrapper {
    display: flex;
    justify-content: flex-end
}

@media(max-width:767px) {
    .time_tracking_system #integrations .container .row .col-lg-7 .wrapper {
        flex-wrap: wrap
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system #integrations .container .row .col-lg-7 .white-bg {
        margin-left: 0
    }

    .time_tracking_system #integrations .container .row .col-lg-7 .wrapper {
        justify-content: space-evenly
    }

        .time_tracking_system #integrations .container .row .col-lg-7 .wrapper:nth-of-type(1) {
            margin-top: 4rem
        }
}

.time_tracking_system #integrations .container .row .icons {
    display: flex;
    justify-content: center;
    flex-direction: column
}

.time_tracking_system #integrations .container .row .integration_bottom {
    position: absolute;
    bottom: 197rem
}

    .time_tracking_system #integrations .container .row .integration_bottom.right {
        right: 15rem;
        bottom: 195rem
    }

    .time_tracking_system #integrations .container .row .integration_bottom.left {
        left: 15rem;
        bottom: 197rem
    }

.time_tracking_system section#features-perks .container .row p.label {
    text-align: center;
    margin-bottom: 1.5rem
}

.time_tracking_system section#features-perks .container .row div.header h2 {
    text-align: center;
    font-size: 32px;
    font-weight: 400;
    width: 100%;
    margin-bottom: 2rem;
    color: #0a1940
}

.time_tracking_system section#features-perks .container .row div.buttons {
    display: flex;
    flex-direction: column;
    justify-content: center
}

    .time_tracking_system section#features-perks .container .row div.buttons .btn {
        white-space: normal;
        text-align: left
    }

    .time_tracking_system section#features-perks .container .row div.buttons .filtering-buttons {
        border-radius: 99px;
        opacity: .4;
        display: flex;
        align-items: center;
        justify-content: end;
        border: none;
        padding: 1.5rem 1.75rem
    }

        .time_tracking_system section#features-perks .container .row div.buttons .filtering-buttons div.wrapper {
            display: flex;
            align-items: baseline;
            justify-content: end;
            flex-direction: column
        }

            .time_tracking_system section#features-perks .container .row div.buttons .filtering-buttons div.wrapper h3 {
                font-size: 24px;
                font-weight: 700;
                font-family: nunito sans,sans-serif;
                padding-left: 1rem;
                color: #0a1940
            }

            .time_tracking_system section#features-perks .container .row div.buttons .filtering-buttons div.wrapper p {
                font-size: 14px;
                font-weight: 400;
                line-height: 1.5;
                padding-left: 1rem;
                margin-bottom: 0
            }

        .time_tracking_system section#features-perks .container .row div.buttons .filtering-buttons img {
            border-radius: 50%;
            margin-right: 2rem
        }

    .time_tracking_system section#features-perks .container .row div.buttons .working {
        box-shadow: 2px 2px 23px 0 rgba(200,215,243,.5);
        border: none;
        outline: none;
        opacity: 1
    }

.time_tracking_system section#features-perks .container .row .carousel .carousel-item .perk-content {
    flex-direction: column;
    align-items: end;
    justify-content: center;
    padding-left: 2rem
}

    .time_tracking_system section#features-perks .container .row .carousel .carousel-item .perk-content img {
        width: auto;
        position: relative;
        margin-bottom: 3rem
    }

@media(max-width:991px) {
    .time_tracking_system section#features-perks .container .row .carousel .carousel-item .perk-content img {
        display: block
    }
}

@media(max-width:767px) {
    .time_tracking_system section#features-perks .container .row .carousel .carousel-item .perk-content img {
        margin-top: 5rem
    }
}

.time_tracking_system section#features-perks .container .row .carousel .carousel-item .perk-content h2 {
    font-size: 24px;
    font-weight: 400;
    text-align: left;
    margin-bottom: 1.5rem;
    color: #0a1940
}

.time_tracking_system section#features-perks .container .row .carousel .carousel-item .perk-content p {
    font-size: 18px;
    font-weight: 400;
    color: #1b1b20
}

    .time_tracking_system section#features-perks .container .row .carousel .carousel-item .perk-content p:before {
        content: none
    }

.time_tracking_system #social_proof_test {
    padding-bottom: 5rem
}

    .time_tracking_system #social_proof_test .container .row {
        padding-top: 2rem;
        padding-bottom: 1rem;
        display: flex;
        border-bottom: none
    }

        .time_tracking_system #social_proof_test .container .row .text p {
            font-size: 18px;
            font-weight: 400;
            text-align: center;
            color: #4a5673
        }

        .time_tracking_system #social_proof_test .container .row .col-md-4 {
            text-align: center;
            margin: 1rem 0;
            align-items: center;
            display: flex;
            justify-content: center;
            flex-direction: column
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system #social_proof_test .container .row .col-md-4 {
        margin: 20px 0
    }
}

@media(max-width:767px) {
    .time_tracking_system #social_proof_test .container .row .col-md-4 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }
}

.time_tracking_system #social_proof_test .container .row .col-md-4 .smaller {
    width: 60%
}

@media(max-width:767px) {
    .time_tracking_system #social_proof_test .container .row .col-md-4 .smaller {
        width: 30%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time_tracking_system #social_proof_test .container .row .col-md-4 .bigger, .time_tracking_system #social_proof_test .container .row .col-md-4 .usp, .time_tracking_system #social_proof_test .container .row .col-md-4 .dsv {
        width: 25%
    }
}

section#footer {
    padding: 2rem 0;
    background: #f2f8ff;
    border-radius: 98px 98px 0 0
}

    section#footer .container .row {
        justify-content: space-between
    }

        section#footer .container .row p {
            margin-bottom: 0;
            color: #4a5673
        }

        section#footer .container .row .socials a:nth-of-type(2) {
            margin: 0 1rem
        }

html {
    quotes: "“" "”";
    -webkit-font-smoothing: antialiased
}

.bold-header {
    font-size: 42px;
    font-weight: 800;
    letter-spacing: .009em;
    line-height: 1.125;
    font-family: sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif
}

.index_v2 {
    letter-spacing: .009em;
    font-family: sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif;
    background-color: #fcfcfd
}

    .index_v2 .is_logged {
        display: none
    }

    .index_v2 .modal {
        background-color: rgba(190,209,229,.6)
    }

        .index_v2 .modal .modal-content {
            border-radius: 30px;
            border: 0;
            text-align: center
        }

            .index_v2 .modal .modal-content h3 {
                font-size: 24px;
                line-height: 120%;
                color: #0a1940;
                margin: 40px 0 20px 0
            }

            .index_v2 .modal .modal-content p {
                font-weight: 400;
                font-size: 18px;
                line-height: 28px;
                text-align: center;
                color: #4a5673
            }

            .index_v2 .modal .modal-content img {
                width: 100%
            }

        .index_v2 .modal .close {
            color: #696969;
            font-size: 30px
        }

    .index_v2 section.budget-section h2 {
        margin-top: 45px;
        margin-bottom: 50px
    }

    .index_v2 section.budget-section h3 {
        color: #4a5673;
        font-size: 35px;
        margin: 50px 0;
        font-weight: 600;
        letter-spacing: .009em;
        font-family: -apple-system,sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif;
        line-height: 1.16667;
        color: #4a5673;
        line-height: 1.25;
        font-weight: 800
    }

    .index_v2 section.budget-section p {
        font-size: 22px;
        font-weight: 600;
        letter-spacing: .009em;
        font-family: -apple-system,sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif;
        line-height: 1.16667;
        color: #4a5673
    }

    .index_v2 section#badge .container .row .col-sm-12 {
        justify-content: center;
        display: flex;
        align-items: center;
        margin: 3rem auto 0
    }

    .index_v2 section.features-section h2 {
        margin-top: 125px;
        margin-bottom: 50px
    }

    .index_v2 section.features-section a.selection {
        background: #fff;
        box-shadow: 0 0 61px 10px rgba(232,232,255,.18);
        border-radius: 40px;
        font-size: 24px;
        line-height: 120%;
        color: #0a1940;
        padding: 30px 20px;
        display: block;
        margin-bottom: 20px;
        width: 100%
    }

        .index_v2 section.features-section a.selection .icon {
            background: linear-gradient(180deg,#ffc502 0%,#00BF71 100%);
            border-radius: 15px;
            padding: 20px;
            color: #fff;
            float: left;
            display: inline-block;
            margin-right: 22px;
            font-size: 30px
        }

        .index_v2 section.features-section a.selection .text {
            display: inline-block;
            position: relative;
            top: 5px;
            font-size: 22px
        }

        .index_v2 section.features-section a.selection:hover, .index_v2 section.features-section a.selection.selected {
            background: linear-gradient(180deg,#ffc502 0%,#00BF71 100%);
            color: #fff
        }

            .index_v2 section.features-section a.selection:hover .icon, .index_v2 section.features-section a.selection.selected .icon {
                background: #fff;
                color: #00bf71
            }

    .index_v2 section.features-horizontal-section h2 {
        margin-top: 125px;
        margin-bottom: 50px
    }

    .index_v2 section.features-horizontal-section img {
        width: 100%
    }

    .index_v2 section.features-horizontal-section .screen {
        margin-top: 45px
    }

    .index_v2 section.features-horizontal-section h3 {
        font-size: 35px;
        margin: 40px 0 20px;
        font-weight: 600;
        letter-spacing: .009em;
        font-family: -apple-system,sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif;
        line-height: 1.16667;
        line-height: 1.25;
        font-weight: 800
    }

    .index_v2 section.features-horizontal-section p {
        font-size: 22px;
        font-weight: 600;
        letter-spacing: .009em;
        font-family: -apple-system,sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif;
        line-height: 1.16667;
        color: #4a5673
    }

    .index_v2 section.features-horizontal-section a.selection {
        background: #fff;
        font-size: 24px;
        line-height: 120%;
        color: #0a1940;
        padding: 20px 0;
        display: inline-block;
        margin-right: 10px;
        width: 32%;
        background: #fff;
        box-shadow: 0 0 61px 10px rgba(232,232,255,.18);
        border-radius: 20px 20px 0 0;
        text-align: center
    }

        .index_v2 section.features-horizontal-section a.selection .text {
            display: inline-block;
            position: relative
        }

        .index_v2 section.features-horizontal-section a.selection:hover, .index_v2 section.features-horizontal-section a.selection.selected {
            background: linear-gradient(180deg,#ffc502 0%,#00BF71 100%);
            color: #fff
        }

    .index_v2 section.metrics-section h2 {
        margin-top: 125px;
        margin-bottom: 40px
    }

    .index_v2 section.metrics-section a.col-shadow {
        background: #fff;
        box-shadow: 0 0 61px 10px rgba(232,232,255,.18);
        border-radius: 40px;
        padding: 24px 14px 20px 24px;
        display: block
    }

        .index_v2 section.metrics-section a.col-shadow:hover {
            box-shadow: 0 12px 63px 8px rgba(170,184,239,.33)
        }

    .index_v2 section.metrics-section h5 {
        font-size: 24px;
        color: #0a1940;
        margin-top: 20px;
        margin-bottom: 15px;
        font-weight: 400;
        display: inline;
        position: relative;
        top: 27px;
        left: -4px;
        cursor: pointer
    }

    .index_v2 section.metrics-section p {
        font-weight: 400;
        font-size: 18px;
        color: #4a5673;
        line-height: 28px
    }

    .index_v2 section.metrics-section .img-hero {
        width: 110px;
        float: left;
        margin: 0 0 0 -20px
    }

    .index_v2 section.security-section h2 {
        margin-top: 105px;
        margin-bottom: 40px
    }

    .index_v2 section.security-section .col-shadow {
        background: #fff;
        box-shadow: 0 4px 17px rgba(214,231,255,.3);
        border-radius: 40px;
        padding: 40px 30px 20px 40px;
        margin-left: 20px
    }

    .index_v2 section.security-section h5 {
        font-size: 24px;
        color: #0a1940;
        margin-top: 20px;
        margin-bottom: 15px
    }

    .index_v2 section.security-section p {
        font-weight: 400;
        font-size: 18px;
        line-height: 26px;
        color: #4a5673
    }

    .index_v2 section.security-section .img-crown {
        width: 40px;
        position: absolute;
        top: 30px;
        right: 30px
    }

    .index_v2 section.security-section .img-security {
        width: 80px;
        margin: 0 0 20px 0
    }

    .index_v2 section#apps-section.index_v4 .container {
        margin-top: 0
    }

    .index_v2 section#apps-section .container {
        margin-top: 160px
    }

    .index_v2 section#apps-section h3 {
        margin-bottom: 20px
    }

    .index_v2 section#apps-section p {
        color: #4a5673;
        font-size: 22px;
        line-height: 1.16667;
        font-weight: 600;
        letter-spacing: .009em;
        font-family: sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif
    }

    .index_v2 section#apps-section a {
        color: #4a5673
    }

        .index_v2 section#apps-section a:hover {
            text-decoration: underline
        }

    .index_v2 section#apps-section img {
        width: 100%
    }

    .index_v2 section#apps-section ul {
        margin-top: -5px
    }

    .index_v2 section#apps-section li {
        font-size: 18px;
        line-height: 36px;
        color: #4a5673
    }

    .index_v2 section#apps-section i {
        width: 30px;
        color: #ffc502;
        margin-right: 6px;
        text-align: center
    }

    .index_v2 section.signup-promo .box {
        background: linear-gradient(98.7deg,#FFE876 20.93%,#F5CC63 95.8%);
        border-radius: 98px;
        padding: 50px;
        text-align: center;
        margin: 170px 0 70px;
        position: relative
    }

        .index_v2 section.signup-promo .box h1 {
            font-weight: 400;
            font-size: 40px;
            line-height: 130%;
            text-align: center;
            color: #0a1940
        }

        .index_v2 section.signup-promo .box div {
            font-weight: 400;
            font-size: 18px;
            line-height: 26px;
            text-align: center;
            color: #4a5673;
            width: 100%;
            margin-top: 15px
        }

        .index_v2 section.signup-promo .box a {
            background: linear-gradient(180deg,#ffc502 0%,#00BF71 100%);
            box-shadow: 0 15px 61px rgba(0,0,0,.2);
            border-radius: 32px;
            padding: 17px 30px;
            color: #fff;
            text-align: center;
            font-size: 18px;
            margin: 30px 0 0;
            display: inline-block;
            font-weight: 400
        }

            .index_v2 section.signup-promo .box a:hover {
                background: linear-gradient(180deg,#1da44c 0%,#008c53 100%)
            }

        .index_v2 section.signup-promo .box img {
            position: absolute;
            top: -150px;
            left: 45px;
            width: 280px
        }

    .index_v2 section#integrations2 h2 {
        margin: 150px 0 50px
    }

    .index_v2 section#integrations2 p {
        margin-top: 20px;
        font-weight: 400;
        font-size: 18px;
        line-height: 28px;
        color: #4a5673;
        font-size: 24px;
        line-height: 1.16667;
        font-weight: 600;
        letter-spacing: .009em;
        font-family: sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif
    }

    .index_v2 section#integrations2 .wrapper {
        text-align: center
    }

        .index_v2 section#integrations2 .wrapper a {
            background: #fff;
            box-shadow: 0 0 14px #e8e8ff;
            border-radius: 8px;
            width: 58px;
            height: 58px;
            margin: 23px;
            display: inline-block;
            transition: all .8s ease
        }

@keyframes spin {
    from {
        transform: scale(1,1)
    }

    to {
        transform: scale(1.5,1.5)
    }
}

.index_v2 section#integrations2 .wrapper a:hover {
    animation: spin 1s forwards
}

.index_v2 section#integrations2 .wrapper a img {
    width: 39px;
    max-height: 39px;
    margin-top: 10px
}

.index_v2 section#integrations2 a.btn-link-animated {
    color: #00bf71;
    font-weight: 400;
    margin-top: 20px;
    display: inline-block;
    transition: all .3s ease
}

    .index_v2 section#integrations2 a.btn-link-animated::after {
        font-family: "font awesome 5 free";
        font-weight: 900;
        content: "\f054";
        margin-left: 10px;
        display: inline-block;
        transition: all .3s ease;
        transform: translate(0,0px);
        transition: transform .25s ease-in,-webkit-transform .25s ease-in,-moz-transform .25s ease-in
    }

    .index_v2 section#integrations2 a.btn-link-animated .fa-chevron-right {
        margin-left: 10px
    }

    .index_v2 section#integrations2 a.btn-link-animated:hover {
        color: #008c53
    }

        .index_v2 section#integrations2 a.btn-link-animated:hover::after {
            transform: translate(6px,0px)
        }

.index_v2 #integrations {
    padding: 7rem 0 2rem;
    background-color: #fff;
    margin-bottom: 9rem;
    position: relative
}

    .index_v2 #integrations .container .row {
        justify-content: center
    }

@media(max-width:991px) {
    .index_v2 #integrations .container .row {
        flex-direction: column
    }
}

.index_v2 #integrations .container .row .left-container {
    display: flex;
    align-items: center
}

.index_v2 #integrations .container .row .col-md-6 {
    justify-content: center;
    display: flex;
    flex-direction: column
}

    .index_v2 #integrations .container .row .col-md-6 p.label {
        font-weight: 500;
        font-size: 16px;
        color: #a0a0a0;
        margin: 0;
        text-align: center
    }

    .index_v2 #integrations .container .row .col-md-6 p.green {
        color: #00bf71;
        margin-bottom: 1rem;
        font-size: 16px;
        font-weight: 600
    }

    .index_v2 #integrations .container .row .col-md-6 h2 {
        font-size: 32px;
        font-weight: 400;
        position: relative;
        z-index: 1;
        margin: 1rem auto 2rem;
        color: #0a1940
    }

    .index_v2 #integrations .container .row .col-md-6 p {
        margin: 0 0 2rem;
        font-size: 18px;
        font-weight: 600;
        color: #1b1b20
    }

    .index_v2 #integrations .container .row .col-md-6 .btn-check-integrations {
        color: #00bf71;
        font-size: 16px;
        font-weight: 800;
        margin-top: 0;
        white-space: nowrap;
        padding-bottom: 2rem
    }

        .index_v2 #integrations .container .row .col-md-6 .btn-check-integrations:hover {
            text-decoration: underline;
            color: #00bf71
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #integrations .container .row .col-md-6 {
        text-align: center
    }

        .index_v2 #integrations .container .row .col-md-6 h2 {
            width: 100%;
            margin: 1rem auto
        }
}

.index_v2 #integrations .container .row .img .carousel .carousel-control-next, .index_v2 #integrations .container .row .img .carousel .carousel-control-prev {
    filter: invert(100%)
}

.index_v2 #integrations .container .row .img .carousel .carousel-control-prev {
    left: -7rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #integrations .container .row .img .carousel .carousel-control-prev {
        left: -2rem
    }
}

@media(max-width:767px) {
    .index_v2 #integrations .container .row .img .carousel .carousel-control-prev {
        margin-left: 1rem
    }
}

.index_v2 #integrations .container .row .img .carousel .carousel-control-next {
    right: -7rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #integrations .container .row .img .carousel .carousel-control-next {
        right: -2rem
    }
}

@media(max-width:767px) {
    .index_v2 #integrations .container .row .img .carousel .carousel-control-next {
        margin-right: 1rem
    }
}

.index_v2 #integrations .container .row .img .carousel .carousel-item.active, .index_v2 #integrations .container .row .img .carousel .carousel-item.next, .index_v2 #integrations .container .row .img .carousel .carousel-item.prev, .index_v2 #integrations .container .row .img .carousel .carousel-item-next.carousel-item-left, .index_v2 #integrations .container .row .img .carousel .carousel-item-prev.carousel-item-right {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}

.index_v2 #integrations .container .row .img .carousel img {
    width: 918px;
    height: auto;
    border-radius: 8px
}

.index_v2 #integrations .container .row .integration_bottom {
    position: absolute;
    bottom: 197rem
}

@media(max-width:1200px) {
    .index_v2 #integrations .container .row .integration_bottom {
        display: none
    }
}

.index_v2 #integrations .container .row .integration_bottom.right {
    right: 1rem;
    bottom: 23rem
}

.index_v2 #integrations .container .row .integration_bottom.left {
    left: 1rem;
    bottom: 14rem
}

.index_v2 section.customers {
    margin: 80px 0;
    letter-spacing: 2px
}

    .index_v2 section.customers .line {
        border-bottom: 1px solid #969696;
        width: 70%;
        margin: auto;
        display: inline-block;
        margin-top: 40px;
        opacity: .3
    }

    .index_v2 section.customers h4 {
        margin-bottom: 30px;
        color: #555;
        text-transform: uppercase
    }

    .index_v2 section.customers span {
        color: #00bf71;
        font-weight: 800;
        letter-spacing: 2px
    }

    .index_v2 section.customers img {
        max-height: 38px;
        margin-right: 40px;
        display: inline-block;
        opacity: .9
    }

.index_v2 .pricing-section {
    margin-top: 130px
}

    .index_v2 .pricing-section h5 {
        margin-bottom: 50px;
        color: #4a5673
    }

    .index_v2 .pricing-section .col {
        padding-left: 8px;
        padding-right: 8px
    }

    .index_v2 .pricing-section .pricing-plan-name {
        font-size: 24px;
        color: #0a1940;
        padding: 30px 0 0
    }

    .index_v2 .pricing-section .pricing-price {
        font-weight: 700;
        font-size: 48px;
        color: #00bf71;
        margin-top: 10px
    }

        .index_v2 .pricing-section .pricing-price span {
            font-size: 20px;
            position: relative;
            top: -8px;
            display: inline-block;
            line-height: 27px;
            left: 8px
        }

    .index_v2 .pricing-section .pricing-price-info {
        font-size: 18px;
        line-height: 26px;
        color: #a0aac2
    }

    .index_v2 .pricing-section .pricing-subheader {
        font-size: 18px;
        line-height: 26px;
        text-align: center;
        color: #4a5673;
        padding: 10px
    }

    .index_v2 .pricing-section a {
        background: linear-gradient(180deg,#ffc502 0%,#00BF71 100%);
        box-shadow: 0 8px 34px rgba(188,209,238,.5);
        border-radius: 32px;
        color: #fff;
        font-weight: 700;
        font-size: 18px;
        padding: 15px;
        display: inline-block;
        width: 80%;
        margin: 20px 10px
    }

        .index_v2 .pricing-section a:hover {
            background: linear-gradient(180deg,#1da44c 0%,#008c53 100%)
        }

    .index_v2 .pricing-section .pricing-column {
        background: #fff;
        box-shadow: 0 4px 17px rgba(214,231,255,.3);
        border-radius: 40px;
        text-align: center
    }

    .index_v2 .pricing-section .pricing-compare {
        padding-bottom: 30px;
        color: #0a1940
    }

        .index_v2 .pricing-section .pricing-compare li {
            line-height: 33px
        }

        .index_v2 .pricing-section .pricing-compare .fa-check {
            color: #00bf71
        }

        .index_v2 .pricing-section .pricing-compare .fa-times {
            color: #e52f2f
        }

.index_v2 ::selection {
    background: #00bf71;
    color: #fff
}

.index_v2 .video-border {
    position: relative;
    width: 127%;
    border: 2.73175px solid #fff;
    box-shadow: 10px 10px 70px 0 #d6e7ff;
    background: rgba(220,234,255,.99);
    padding: 15px 15px 9px;
    border-radius: 25px
}

.index_v2 video::-webkit-media-controls {
    display: none
}

.index_v2 video {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent
}

    .index_v2 video:focus {
        outline: none !important
    }

.index_v2 strong {
    font-weight: 800
}

.index_v2 p.label {
    font-weight: 500;
    font-size: 16px;
    color: #4a5673
}

.index_v2 #mainNav {
    background: linear-gradient(180deg,#e9eff9 0%,rgba(246,249,250,0) 100%)
}

    .index_v2 #mainNav .collapse .menu-1 li.nav-item {
        margin-left: 1rem
    }

        .index_v2 #mainNav .collapse .menu-1 li.nav-item a.nav-link {
            color: #4a5673
        }

            .index_v2 #mainNav .collapse .menu-1 li.nav-item a.nav-link:hover {
                color: #0e1016
            }

    .index_v2 #mainNav .collapse .menu-2 li.nav-item a.btn-highlighted {
        border: 2px solid #4a5673;
        border-radius: 26px;
        color: #4a5673;
        font-weight: 700
    }

        .index_v2 #mainNav .collapse .menu-2 li.nav-item a.btn-highlighted:hover {
            color: #4a5673;
            border-color: #363f54;
            background: rgba(50,50,50,.05)
        }

    .index_v2 #mainNav .collapse .menu-2 li.nav-item a.btn-filled {
        color: #1b1b20;
        box-shadow: 0 15px 26px 0 rgba(255,199,0,.15);
        background: linear-gradient(180deg,#ffe876 20.93%,#f5cc63 95.8%)
    }

        .index_v2 #mainNav .collapse .menu-2 li.nav-item a.btn-filled:hover {
            background: linear-gradient(180deg,#ffdf43 20.93%,#f2bc33 95.8%);
            color: #1b1b20 !important
        }

    .index_v2 #mainNav.navbar-shrink {
        background: #fff;
        box-shadow: 0 4px 39px rgba(214,231,255,.7)
    }

.index_v2 a.navbar-shrink-button {
    background: linear-gradient(192.53deg,#FFE876 9.04%,#F5CC63 90.85%);
    box-shadow: 0 15px 26px rgba(255,199,0,.15);
    border-radius: 31px;
    border-color: #f5cc63 !important;
    transition: background-color 2s
}

    .index_v2 a.navbar-shrink-button:hover {
        background: linear-gradient(180deg,#ffdf43 20.93%,#f2bc33 95.8%) !important
    }

.index_v2 section#top_test.product_hunt, .index_v2 section#top_test.index_v4 {
    padding-top: 2rem
}

.index_v2 #top_test {
    background: linear-gradient(100.15deg,#e7f3ff 7%,#f3f9ff 98.51%);
    padding-top: 7rem;
    border-radius: 0 0 80px 80px
}

    .index_v2 #top_test .container {
        padding: 3rem 0 6rem
    }

        .index_v2 #top_test .container .row p.label {
            background: linear-gradient(98.7deg,#ffe876 20.93%,#f5cc63 95.8%);
            border-radius: 8px;
            font-size: 16px;
            font-weight: 400;
            margin: 0 auto 1.5rem 0;
            text-align: center;
            color: #4a5673;
            display: inline-block;
            padding: 2px 21px
        }

        .index_v2 #top_test .container .row h2 {
            margin: 0 auto 1.25rem;
            font-size: 64px;
            line-height: 70px;
            font-weight: 400;
            text-align: left;
            color: #0a1940;
            width: 100%
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #top_test .container .row h2 {
        width: 90%
    }
}

.index_v2 #top_test .container .row p {
    font-size: 18px;
    font-weight: 400;
    color: #4a5673;
    margin: 0 auto 2.25rem;
    text-align: left;
    line-height: 30px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #top_test .container .row p {
        width: 88%
    }
}

.index_v2 #top_test .container .row a {
    padding: 18px 44px;
    width: auto;
    display: inline-block;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    box-shadow: 0 0 0 3px #00bf71;
    border: 1px solid rgba(31,225,73,.3);
    box-shadow: 0 15px 32px #bcd1ee;
    border-radius: 32px;
    background: linear-gradient(180deg,#ffc502 0%,#00BF71 100%);
    box-shadow: 0 15px 61px #bcd1ee
}

@media(max-width:767px) {
    .index_v2 #top_test .container .row a {
        left: 0
    }
}

.index_v2 #top_test .container .row a:hover {
    background-color: #00a662;
    background: linear-gradient(180deg,#21b956 0%,#00a662 100%)
}

.index_v2 #top_test .container .row img {
    position: absolute;
    width: 125%;
    top: -3px
}

.index_v2 section#forever_free {
    position: relative;
    margin-top: 8rem
}

    .index_v2 section#forever_free .free_icon {
        position: absolute;
        left: 0;
        bottom: 1rem
    }

    .index_v2 section#forever_free .timePrecious_icon {
        position: absolute;
        left: 0;
        bottom: -16rem
    }

    .index_v2 section#forever_free .right_icon {
        position: absolute;
        right: 5rem
    }

    .index_v2 section#forever_free .container .row {
        justify-content: space-evenly
    }

        .index_v2 section#forever_free .container .row .col-sm-12.header {
            margin-bottom: 3rem
        }

            .index_v2 section#forever_free .container .row .col-sm-12.header h2 {
                text-align: center;
                font-size: 40px;
                font-weight: 400;
                color: #0a1940
            }

        .index_v2 section#forever_free .container .row .col-md-4 {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            background: #fff;
            box-shadow: 0 4px 17px rgba(214,231,255,.3);
            border-radius: 40px;
            padding: 1.75rem 0;
            background: linear-gradient(98.7deg,#FFE876 20.93%,#F5CC63 95.8%);
            box-shadow: 0 4px 17px rgba(214,231,255,.3);
            border-radius: 40px
        }

            .index_v2 section#forever_free .container .row .col-md-4 p.green {
                font-size: 18px;
                font-weight: 700;
                margin-top: .25rem
            }

            .index_v2 section#forever_free .container .row .col-md-4 p {
                margin-top: 1.313;
                font-size: 18px;
                font-weight: 400;
                text-align: center;
                color: #0a1940;
                margin-bottom: 0
            }

            .index_v2 section#forever_free .container .row .col-md-4 img {
                width: 20%;
                margin-bottom: 15px
            }

.index_v2 section#security {
    margin-top: 5rem
}

    .index_v2 section#security .container .row {
        justify-content: space-evenly
    }

        .index_v2 section#security .container .row .col-sm-12.header {
            margin-bottom: 1rem
        }

            .index_v2 section#security .container .row .col-sm-12.header h2 {
                text-align: center;
                font-size: 40px;
                font-weight: 400;
                color: #0a1940
            }

        .index_v2 section#security .container .row .col-md-5 {
            display: flex;
            flex-direction: column;
            background: #fff;
            box-shadow: 0 4px 17px rgba(214,231,255,.3);
            border-radius: 40px;
            padding: 3rem
        }

            .index_v2 section#security .container .row .col-md-5 p {
                font-size: 18px;
                font-weight: 400;
                margin-top: 0;
                color: #4a5673
            }

            .index_v2 section#security .container .row .col-md-5 h3 {
                margin: 0 0 1rem;
                font-size: 24px;
                font-weight: 400;
                text-align: left;
                color: #0a1940
            }

            .index_v2 section#security .container .row .col-md-5 img {
                width: 20%;
                margin-bottom: 2rem
            }

        .index_v2 section#security .container .row .feature {
            margin-top: 2rem;
            margin-bottom: 0
        }

            .index_v2 section#security .container .row .feature p {
                font-size: 18px;
                color: #4a5673;
                font-weight: 400
            }

            .index_v2 section#security .container .row .feature img {
                width: 100%
            }

            .index_v2 section#security .container .row .feature ul {
                list-style-type: none
            }

                .index_v2 section#security .container .row .feature ul li img {
                    margin-right: 1rem;
                    width: auto
                }

                .index_v2 section#security .container .row .feature ul.direction-column {
                    padding: 0
                }

                    .index_v2 section#security .container .row .feature ul.direction-column li {
                        margin: 0 auto 2rem 0;
                        text-align: left;
                        width: 80%;
                        align-items: center;
                        display: flex;
                        color: #4a5673
                    }

    .index_v2 section#security.is_logged .container .row .col-sm-12.header {
        margin-bottom: 3rem
    }

    .index_v2 section#security.is_logged .container .row .col-md-5 {
        padding: 2rem 3rem 0
    }

.index_v2 section#feature-section, .index_v2 section#feature-section-second {
    margin: 2rem 4rem
}

    .index_v2 section#feature-section .container:not(.is_logged), .index_v2 section#feature-section-second .container:not(.is_logged) {
        max-width: 100%
    }

    .index_v2 section#feature-section .container .col-sm-12, .index_v2 section#feature-section-second .container .col-sm-12 {
        margin-bottom: 0
    }

        .index_v2 section#feature-section .container .col-sm-12 h2, .index_v2 section#feature-section-second .container .col-sm-12 h2 {
            font-size: 40px;
            font-weight: 400;
            color: #0a1940;
            text-align: center
        }

    .index_v2 section#feature-section .container .row, .index_v2 section#feature-section-second .container .row {
        justify-content: center;
        padding-top: 0
    }

        .index_v2 section#feature-section .container .row .hand_icon, .index_v2 section#feature-section-second .container .row .hand_icon {
            position: absolute;
            top: 117rem;
            left: 5rem
        }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .index_v2 section#feature-section .container .row .hand_icon, .index_v2 section#feature-section-second .container .row .hand_icon {
        display: none
    }
}

.index_v2 section#feature-section .container .row .billing_icon, .index_v2 section#feature-section-second .container .row .billing_icon {
    position: absolute;
    left: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 section#feature-section .container .row .billing_icon, .index_v2 section#feature-section-second .container .row .billing_icon {
        display: none
    }
}

.index_v2 section#feature-section .container .row .automated_tracker_icon, .index_v2 section#feature-section-second .container .row .automated_tracker_icon {
    position: absolute;
    right: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 section#feature-section .container .row .automated_tracker_icon, .index_v2 section#feature-section-second .container .row .automated_tracker_icon {
        display: none
    }
}

.index_v2 section#feature-section .container .row .col-sm-12, .index_v2 section#feature-section-second .container .row .col-sm-12 {
    margin-bottom: 0
}

    .index_v2 section#feature-section .container .row .col-sm-12 img, .index_v2 section#feature-section-second .container .row .col-sm-12 img {
        width: 100%
    }

    .index_v2 section#feature-section .container .row .col-sm-12 ul, .index_v2 section#feature-section-second .container .row .col-sm-12 ul {
        list-style-type: none
    }

        .index_v2 section#feature-section .container .row .col-sm-12 ul li img, .index_v2 section#feature-section-second .container .row .col-sm-12 ul li img {
            margin-right: 1rem;
            width: auto
        }

        .index_v2 section#feature-section .container .row .col-sm-12 ul.direction-row, .index_v2 section#feature-section-second .container .row .col-sm-12 ul.direction-row {
            display: flex;
            padding: 0;
            width: 100%
        }

@media(max-width:767px) {
    .index_v2 section#feature-section .container .row .col-sm-12 ul.direction-row, .index_v2 section#feature-section-second .container .row .col-sm-12 ul.direction-row {
        flex-direction: column;
        padding-left: 0
    }
}

.index_v2 section#feature-section .container .row .col-sm-12 ul.direction-row li, .index_v2 section#feature-section-second .container .row .col-sm-12 ul.direction-row li {
    align-items: center;
    display: flex;
    color: #4a5673;
    width: 50%
}

@media(max-width:767px) {
    .index_v2 section#feature-section .container .row .col-sm-12 ul.direction-row li, .index_v2 section#feature-section-second .container .row .col-sm-12 ul.direction-row li {
        margin: 0 auto 2rem;
        text-align: left;
        width: 80%
    }
}

.index_v2 section#feature-section .container .row .col-sm-12 ul.direction-row li .icon_wrapper, .index_v2 section#feature-section-second .container .row .col-sm-12 ul.direction-row li .icon_wrapper {
    width: 30px;
    display: flex;
    justify-content: center;
    margin-right: 1rem
}

.index_v2 section#feature-section .container .row .col-sm-12 ul.direction-column, .index_v2 section#feature-section-second .container .row .col-sm-12 ul.direction-column {
    padding: 0
}

    .index_v2 section#feature-section .container .row .col-sm-12 ul.direction-column li, .index_v2 section#feature-section-second .container .row .col-sm-12 ul.direction-column li {
        margin: 0 auto 2rem;
        text-align: left;
        width: 80%;
        align-items: center;
        display: flex
    }

.index_v2 section#feature-section .container .row .col-sm-9, .index_v2 section#feature-section .container .row .col-sm-10, .index_v2 section#feature-section-second .container .row .col-sm-9, .index_v2 section#feature-section-second .container .row .col-sm-10 {
    text-align: center
}

.index_v2 section#feature-section .container .row .col-lg-5 div.text, .index_v2 section#feature-section-second .container .row .col-lg-5 div.text {
    width: 80%;
    margin: 0 auto
}

    .index_v2 section#feature-section .container .row .col-lg-5 div.text h3, .index_v2 section#feature-section-second .container .row .col-lg-5 div.text h3 {
        margin: 0 auto 2rem;
        width: 100%;
        font-size: 32px;
        font-weight: 400;
        color: #0a1940
    }

    .index_v2 section#feature-section .container .row .col-lg-5 div.text p, .index_v2 section#feature-section-second .container .row .col-lg-5 div.text p {
        width: 100%;
        margin: 1rem auto 2rem;
        font-weight: 400;
        font-size: 18px;
        color: #4a5673
    }

.index_v2 section#feature-section .container .row .left ul.direction-column, .index_v2 section#feature-section-second .container .row .left ul.direction-column {
    width: 100%;
    margin: 0 auto;
    padding: 0
}

.index_v2 section#feature-section.is_logged .container {
    border-radius: 98px;
    background: linear-gradient(178.21deg,#f2f8ff 1.51%,#f2f8ff 98.57%)
}

    .index_v2 section#feature-section.is_logged .container .col-sm-12 h2 {
        width: 35%;
        margin: 0 auto 1rem
    }

@media(max-width:767px) {
    .index_v2 section#feature-section.is_logged .container .col-sm-12 h2 {
        width: 100%
    }
}

.index_v2 section#feature-section.is_logged .container .row .col-sm-12 div.text {
    width: 70%
}

    .index_v2 section#feature-section.is_logged .container .row .col-sm-12 div.text div.ul-wrapper {
        margin: auto;
        width: 80%;
        display: flex;
        justify-content: space-between
    }

        .index_v2 section#feature-section.is_logged .container .row .col-sm-12 div.text div.ul-wrapper ul li {
            margin: 0 auto 2rem;
            width: 100%
        }

.index_v2 section#feature-section.is_logged .container .row #time-tracking.col-sm-12 h3 {
    margin: 1rem auto 2rem;
    width: 100%;
    font-size: 32px;
    font-weight: 400;
    color: #0a1940
}

.index_v2 section#feature-section.is_logged .container .row #time-tracking.col-sm-12 p {
    width: 40%;
    margin: 1rem auto 2rem;
    font-weight: 400;
    font-size: 18px;
    color: #4a5673
}

.index_v2 section#feature-section.is_logged .container .row .col-sm-7 img {
    width: 100%
}

.index_v2 section#feature-section-second.is_logged {
    position: relative;
    margin: 6rem auto 3rem
}

    .index_v2 section#feature-section-second.is_logged .attendance_left_icon {
        left: 0;
        top: -30rem;
        position: absolute
    }

    .index_v2 section#feature-section-second.is_logged .container .row .col-sm-12.full h3 {
        margin: 0 auto 2rem;
        width: 80%;
        font-size: 32px;
        font-weight: 400;
        color: #0a1940;
        text-align: center
    }

    .index_v2 section#feature-section-second.is_logged .container .row .col-sm-12.full p {
        width: 70%;
        margin: 1rem auto 2rem;
        font-weight: 400;
        font-size: 18px;
        text-align: center;
        color: #4a5673
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 section#feature-section-second.is_logged .container .row .col-sm-12.full p {
        width: 100%
    }
}

.index_v2 section#feature-section-second.is_logged .container .row #timesheets.col-sm-12 h2 {
    margin: 4rem auto 2rem;
    width: 100%;
    font-size: 40px;
    font-weight: 400;
    color: #0a1940;
    text-align: left
}

.index_v2 section#feature-section-second.is_logged .container .row #timesheets.col-sm-12 p {
    margin: 1rem auto 2rem;
    font-weight: 400;
    font-size: 18px;
    color: #4a5673
}

.index_v2 section#feature-section-second.is_logged .container .row #timesheets.col-sm-12 ul.direction-column li {
    margin: 0 auto 2rem 0
}

.index_v2 section#feature-section-second.is_logged .container .col-sm-12.header {
    margin: 0 auto 5rem
}

.index_v2 section#feature-section-second.is_logged .img {
    margin-top: 4rem
}

    .index_v2 section#feature-section-second.is_logged .img img {
        width: 100%
    }

.index_v2 section#big_cta {
    padding-bottom: 11rem;
    padding-top: 7rem
}

    .index_v2 section#big_cta .container .row {
        background: linear-gradient(98.7deg,#ffe876 20.93%,#f5cc63 95.8%);
        border-radius: 98px;
        position: relative
    }

        .index_v2 section#big_cta .container .row .col-sm-12 {
            text-align: left;
            background: 0 0
        }

            .index_v2 section#big_cta .container .row .col-sm-12 h2 {
                padding-top: 4rem;
                font-size: 32px;
                font-weight: 400;
                margin: auto auto 2rem 2rem;
                text-align: left;
                width: 100%;
                color: #0a1940
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 section#big_cta .container .row .col-sm-12 h2 {
        width: 80%;
        margin: 0 auto 2rem;
        text-align: center
    }
}

.index_v2 section#big_cta .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    margin: 3rem auto 3rem 2rem;
    padding-top: 0;
    text-align: left;
    color: #4a5673
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 section#big_cta .container .row .col-sm-12 p {
        text-align: center;
        margin: 3rem auto
    }
}

.index_v2 section#big_cta .container .row .col-sm-12 a {
    margin-bottom: 4rem;
    padding: 1rem
}

.index_v2 section#big_cta .container .row .col-sm-12 .btn-filled {
    padding: 1rem 2.5rem;
    margin-left: 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .index_v2 section#big_cta .container .row .col-sm-12 .btn-filled {
        width: 40%;
        margin-left: 0
    }
}

@media(max-width:767px) {
    .index_v2 section#big_cta .container .row .col-sm-12 .btn-filled {
        width: 100%;
        margin-left: 0
    }
}

.index_v2 section#big_cta .container .row .col-sm-12 a.btn-filled.green {
    box-shadow: 0 15px 48px rgba(90,72,13,.3)
}

    .index_v2 section#big_cta .container .row .col-sm-12 a.btn-filled.green:hover {
        box-shadow: none
    }

.index_v2 section#big_cta .container .row .col-sm-12 a.btn-filled.white {
    color: #f5cc63;
    box-shadow: 0 15px 61px rgba(170,137,17,.5)
}

    .index_v2 section#big_cta .container .row .col-sm-12 a.btn-filled.white:hover {
        box-shadow: none;
        background-color: #fff
    }

.index_v2 section#big_cta .container .row .col-sm-12 img {
    width: 100%;
    position: relative;
    top: 5rem
}

.index_v2 section#big_cta.is_logged {
    padding-top: 2rem;
    padding-bottom: 7rem
}

.index_v2 section#big_cta.second {
    padding-bottom: 3rem;
    padding-top: 2rem
}

.index_v2 section#features_second .container .row {
    justify-content: center
}

    .index_v2 section#features_second .container .row .col-sm-12 h3.center, .index_v2 section#features_second .container .row .col-sm-12 p.center {
        text-align: center;
        width: 90%;
        margin: 0 auto 2rem
    }

    .index_v2 section#features_second .container .row .col-sm-12 h3 {
        font-size: 32px;
        font-weight: 400;
        margin-bottom: 1rem;
        color: #0a1940;
        text-align: left
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 section#features_second .container .row .col-sm-12 h3 {
        text-align: center
    }
}

.index_v2 section#features_second .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    text-align: left;
    color: #4a5673
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 section#features_second .container .row .col-sm-12 p {
        text-align: center
    }
}

.index_v2 section#features_second .container .row .col-sm-12 ul {
    list-style-type: none;
    padding-left: 0
}

    .index_v2 section#features_second .container .row .col-sm-12 ul li {
        margin: 0 auto 2rem;
        text-align: left
    }

        .index_v2 section#features_second .container .row .col-sm-12 ul li img {
            margin-right: 1rem
        }

.index_v2 section#features_second .container .row .second img {
    width: 100%
}

.index_v2 section#features_second .container .row .list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.index_v2 section#features_second .container .row .img {
    display: flex;
    justify-content: center;
    margin-bottom: 4rem
}

    .index_v2 section#features_second .container .row .img img {
        width: 100%
    }

.index_v2 section#features_second .container .row.gps {
    justify-content: space-between
}

.index_v2 section#platforms.is_logged {
    margin-bottom: 5rem;
    margin-top: 2rem
}

    .index_v2 section#platforms.is_logged .container .row .col-sm-12.header h2 {
        font-size: 40px;
        font-weight: 400;
        width: 50%;
        text-align: center;
        margin: 0 auto 4rem;
        color: #0a1940
    }

    .index_v2 section#platforms.is_logged .container .row .col-sm-12.platforms {
        background: #fff;
        box-shadow: 0 4px 17px rgba(214,231,255,.3);
        border-radius: 40px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 2rem
    }

        .index_v2 section#platforms.is_logged .container .row .col-sm-12.platforms div.description {
            padding-left: 2rem
        }

            .index_v2 section#platforms.is_logged .container .row .col-sm-12.platforms div.description h3 {
                font-size: 24px;
                font-weight: 400;
                margin-bottom: 1.5rem;
                color: #0a1940
            }

            .index_v2 section#platforms.is_logged .container .row .col-sm-12.platforms div.description ul {
                margin-bottom: 2rem;
                padding-left: 0
            }

                .index_v2 section#platforms.is_logged .container .row .col-sm-12.platforms div.description ul li {
                    list-style-type: none;
                    margin-bottom: 1rem
                }

                    .index_v2 section#platforms.is_logged .container .row .col-sm-12.platforms div.description ul li img {
                        margin-right: 1rem
                    }

            .index_v2 section#platforms.is_logged .container .row .col-sm-12.platforms div.description div.buttons a img {
                padding-right: 1rem;
                margin-bottom: 1rem
            }

        .index_v2 section#platforms.is_logged .container .row .col-sm-12.platforms div.img img {
            width: 100%
        }

.index_v2 section#demo.is_logged {
    margin: 8rem auto
}

    .index_v2 section#demo.is_logged .container .row div.description p.label {
        background: linear-gradient(98.7deg,#ffe876 20.93%,#f5cc63 95.8%);
        border-radius: 8px;
        font-size: 16px;
        font-weight: 400;
        margin-bottom: 1.5rem;
        text-align: center;
        width: 23%;
        color: #0a1940
    }

    .index_v2 section#demo.is_logged .container .row div.description h2 {
        font-size: 40px;
        font-weight: 400;
        margin-bottom: 1rem;
        color: #0a1940
    }

    .index_v2 section#demo.is_logged .container .row div.description ul {
        margin-bottom: 2rem;
        padding-left: 0
    }

        .index_v2 section#demo.is_logged .container .row div.description ul li {
            list-style-type: none;
            margin-bottom: 1rem
        }

            .index_v2 section#demo.is_logged .container .row div.description ul li img {
                margin-right: 1rem
            }

    .index_v2 section#demo.is_logged .container .row div.description a.btn-filled {
        box-shadow: 0 15px 61px rgba(188,209,238,.5)
    }

    .index_v2 section#demo.is_logged .container .row div.img img {
        width: 100%
    }

.index_v2 #integrations {
    padding: 7rem 0 2rem;
    background-color: #fcfcfd;
    margin-bottom: 9rem
}

@media(max-width:991px) {
    .index_v2 #integrations .container .row {
        flex-direction: column
    }
}

.index_v2 #integrations .container .row .left-container {
    display: flex;
    align-items: center
}

.index_v2 #integrations .container .row .col-lg-5 {
    justify-content: center;
    display: flex;
    flex-direction: column
}

    .index_v2 #integrations .container .row .col-lg-5 p.green {
        color: #00bf71;
        margin-bottom: 1rem;
        font-size: 16px;
        font-weight: 600
    }

    .index_v2 #integrations .container .row .col-lg-5 h2 {
        font-size: 32px;
        font-weight: 400;
        position: relative;
        z-index: 1;
        margin: 1rem auto 2rem;
        color: #0a1940
    }

    .index_v2 #integrations .container .row .col-lg-5 p {
        margin: 0 0 2rem;
        font-size: 18px;
        font-weight: 600;
        color: #4a5673
    }

    .index_v2 #integrations .container .row .col-lg-5 .btn-check-integrations {
        color: #00bf71;
        font-size: 16px;
        font-weight: 800;
        margin-top: 0;
        white-space: nowrap;
        padding-bottom: 2rem
    }

        .index_v2 #integrations .container .row .col-lg-5 .btn-check-integrations:hover {
            text-decoration: underline;
            color: #00bf71
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #integrations .container .row .col-lg-5 {
        text-align: center
    }

        .index_v2 #integrations .container .row .col-lg-5 h2 {
            width: 100%;
            margin: 1rem auto
        }
}

.index_v2 #integrations .container .row .col-lg-7 img {
    width: 24px;
    height: 24px
}

.index_v2 #integrations .container .row .col-lg-7 .white-bg {
    margin-bottom: 2rem;
    margin-left: 3rem;
    width: 48px;
    height: 48px;
    border-radius: 8px;
    transition: all .2s ease-in-out;
    background-color: #fff;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    position: relative;
    box-shadow: 4px 2px 16px 0 rgba(0,0,0,.06)
}

    .index_v2 #integrations .container .row .col-lg-7 .white-bg:hover {
        transform: matrix(-1,0,0,1,0,0)
    }

        .index_v2 #integrations .container .row .col-lg-7 .white-bg:hover > .integration-name {
            transform: scale(1.07)
        }

.index_v2 #integrations .container .row .col-lg-7 .wrapper {
    display: flex;
    justify-content: flex-end
}

@media(max-width:767px) {
    .index_v2 #integrations .container .row .col-lg-7 .wrapper {
        flex-wrap: wrap
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #integrations .container .row .col-lg-7 .white-bg {
        margin-left: 0
    }

    .index_v2 #integrations .container .row .col-lg-7 .wrapper {
        justify-content: space-evenly
    }

        .index_v2 #integrations .container .row .col-lg-7 .wrapper:nth-of-type(1) {
            margin-top: 4rem
        }
}

.index_v2 #integrations .container .row .icons {
    display: flex;
    justify-content: center;
    flex-direction: column
}

.index_v2 #integrations .container .row .integration_bottom {
    position: absolute;
    bottom: 197rem
}

    .index_v2 #integrations .container .row .integration_bottom.right {
        right: 15rem;
        bottom: 195rem
    }

    .index_v2 #integrations .container .row .integration_bottom.left {
        left: 15rem;
        bottom: 197rem
    }

.index_v2 #integrations .container .row .buttons {
    text-align: center;
    margin-top: 4rem
}

    .index_v2 #integrations .container .row .buttons a.btn-filled {
        margin-right: 1rem
    }

    .index_v2 #integrations .container .row .buttons a.btn-highlighted {
        border: 2px solid #4a5673;
        border-radius: 26px;
        padding: 12px 37px
    }

.index_v2 section#posts.is_logged .container .row .col-sm-12 h2 {
    font-size: 40px;
    font-weight: 400;
    color: #0a1940
}

.index_v2 section#posts.is_logged .container .row .col-lg-4 div.text h2 {
    color: #0a1940;
    font-size: 18px;
    font-weight: 400
}

.index_v2 section#posts.is_logged .container .automated_render .img img {
    border-radius: 32px
}

.index_v2 section#features-perks .container .row {
    margin-top: 90px
}

    .index_v2 section#features-perks .container .row div.buttons {
        cursor: pointer;
        -webkit-appearance: unset
    }

    .index_v2 section#features-perks .container .row div.header h2 {
        text-align: center;
        width: 100%;
        font-size: 42px;
        font-weight: 600px;
        margin-bottom: 2rem
    }

    .index_v2 section#features-perks .container .row div.buttons {
        display: flex;
        flex-direction: column;
        justify-content: center
    }

        .index_v2 section#features-perks .container .row div.buttons .btn {
            white-space: normal;
            text-align: left;
            -webkit-appearance: unset
        }

        .index_v2 section#features-perks .container .row div.buttons .filtering-buttons, .index_v2 section#features-perks .container .row div.buttons .filtering-buttons-not-logged {
            border-radius: 99px;
            opacity: .4;
            display: flex;
            align-items: center;
            justify-content: end;
            border: none;
            padding: 1.5rem 1.75rem
        }

            .index_v2 section#features-perks .container .row div.buttons .filtering-buttons div.wrapper, .index_v2 section#features-perks .container .row div.buttons .filtering-buttons-not-logged div.wrapper {
                display: flex;
                align-items: baseline;
                justify-content: end;
                flex-direction: column
            }

                .index_v2 section#features-perks .container .row div.buttons .filtering-buttons div.wrapper h3, .index_v2 section#features-perks .container .row div.buttons .filtering-buttons-not-logged div.wrapper h3 {
                    font-size: 24px;
                    font-weight: 700;
                    font-family: nunito sans,sans-serif;
                    padding-left: 1rem;
                    color: #0a1940
                }

                .index_v2 section#features-perks .container .row div.buttons .filtering-buttons div.wrapper p, .index_v2 section#features-perks .container .row div.buttons .filtering-buttons-not-logged div.wrapper p {
                    font-size: 14px;
                    font-weight: 400;
                    line-height: 1.5;
                    padding-left: 1rem;
                    margin-bottom: 0;
                    color: #4a5673
                }

            .index_v2 section#features-perks .container .row div.buttons .filtering-buttons img, .index_v2 section#features-perks .container .row div.buttons .filtering-buttons-not-logged img {
                border-radius: 50%;
                margin-right: 2rem
            }

        .index_v2 section#features-perks .container .row div.buttons .working, .index_v2 section#features-perks .container .row div.buttons .displayed {
            box-shadow: 2px 2px 23px 0 rgba(200,215,243,.5);
            border: none;
            outline: none;
            opacity: 1;
            -webkit-appearance: unset
        }

    .index_v2 section#features-perks .container .row .carousel .carousel-item .perk-content {
        flex-direction: column;
        align-items: end;
        justify-content: center;
        padding-left: 2rem
    }

        .index_v2 section#features-perks .container .row .carousel .carousel-item .perk-content img {
            width: auto;
            position: relative;
            margin-bottom: 3rem
        }

@media(max-width:991px) {
    .index_v2 section#features-perks .container .row .carousel .carousel-item .perk-content img {
        display: block
    }
}

@media(max-width:767px) {
    .index_v2 section#features-perks .container .row .carousel .carousel-item .perk-content img {
        margin-top: 5rem
    }
}

.index_v2 section#features-perks .container .row .carousel .carousel-item .perk-content h2 {
    font-size: 24px;
    font-weight: 400;
    text-align: left;
    margin-bottom: 1.5rem;
    color: #0a1940;
    font-weight: 800
}

.index_v2 section#features-perks .container .row .carousel .carousel-item .perk-content p {
    font-size: 18px;
    font-weight: 400;
    color: #4a5673;
    font-size: 24px;
    line-height: 1.16667;
    font-weight: 600;
    letter-spacing: .009em;
    font-family: sf pro display,sf pro icons,helvetica neue,helvetica,arial,sans-serif
}

    .index_v2 section#features-perks .container .row .carousel .carousel-item .perk-content p:before {
        content: none
    }

.index_v2 #social_proof_test {
    padding-bottom: 5rem
}

    .index_v2 #social_proof_test .container .row {
        padding-top: 2rem;
        padding-bottom: 1rem;
        display: flex;
        border-bottom: none
    }

        .index_v2 #social_proof_test .container .row .text p {
            font-size: 18px;
            font-weight: 400;
            text-align: center;
            color: #4a5673
        }

        .index_v2 #social_proof_test .container .row .col-md-4 {
            text-align: center;
            margin: 1rem 0;
            align-items: center;
            display: flex;
            justify-content: center;
            flex-direction: column
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #social_proof_test .container .row .col-md-4 {
        margin: 20px 0
    }
}

@media(max-width:767px) {
    .index_v2 #social_proof_test .container .row .col-md-4 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }
}

.index_v2 #social_proof_test .container .row .col-md-4 .smaller {
    width: 60%
}

@media(max-width:767px) {
    .index_v2 #social_proof_test .container .row .col-md-4 .smaller {
        width: 30%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .index_v2 #social_proof_test .container .row .col-md-4 .bigger, .index_v2 #social_proof_test .container .row .col-md-4 .usp, .index_v2 #social_proof_test .container .row .col-md-4 .dsv {
        width: 25%
    }
}

section#footer {
    padding: 0 0 2rem;
    background: #f2f8ff;
    border-radius: 98px 98px 0 0;
    margin-top: 90px
}

    section#footer .row ul {
        opacity: 1
    }

    section#footer li a {
        color: #4a5673;
        display: inline-block;
        width: 100%
    }

        section#footer li a:hover {
            text-decoration: underline
        }

    section#footer .socials {
        margin-top: 0
    }

    section#footer .container .row {
        justify-content: space-between
    }

        section#footer .container .row p {
            margin-bottom: 0;
            color: #4a5673
        }

        section#footer .container .row .socials a:nth-of-type(2) {
            margin: 0 .3rem
        }

.all_features {
    background-color: #fcfcfd
}

    .all_features #mainNav {
        background: linear-gradient(180deg,#e9eff9 0%,rgba(246,249,250,0) 100%)
    }

        .all_features #mainNav .collapse .menu-1 li.nav-item {
            margin-left: .7rem
        }

        .all_features #mainNav .collapse .menu-2 li.nav-item a.btn-highlighted {
            border: 2px solid #4a5673;
            border-radius: 26px
        }

        .all_features #mainNav .collapse .menu-2 li.nav-item a.btn-filled {
            color: #1b1b20;
            box-shadow: 0 15px 26px rgba(255,199,0,.3);
            background: linear-gradient(98.7deg,#ffe876 20.93%,#f5cc63 95.8%)
        }

            .all_features #mainNav .collapse .menu-2 li.nav-item a.btn-filled:hover {
                color: #1b1b20 !important;
                box-shadow: none;
                background-color: #f7b801
            }

        .all_features #mainNav.navbar-shrink {
            background: #fff;
            box-shadow: 0 4px 39px rgba(214,231,255,.7)
        }

    .all_features section#table {
        padding-top: 0
    }

        .all_features section#table .container {
            max-width: 100%
        }

            .all_features section#table .container .row .comparison {
                margin: 0 auto;
                font-size: 14px;
                font-weight: 700;
                text-align: center;
                width: 100%
            }

                .all_features section#table .container .row .comparison .tick {
                    color: #00bf71
                }

                .all_features section#table .container .row .comparison .times {
                    color: #e52f2f
                }

                .all_features section#table .container .row .comparison table {
                    width: 82%;
                    margin: 0 auto;
                    border-collapse: collapse;
                    border-spacing: 0;
                    table-layout: fixed
                }

                    .all_features section#table .container .row .comparison table tbody tr:nth-child(2n) {
                        background-color: #f6f9ff
                    }

                    .all_features section#table .container .row .comparison table tbody tr td {
                        font-size: 18px;
                        font-weight: 400;
                        border: none;
                        empty-cells: show;
                        padding: 10px
                    }

@media(max-width:767px) {
    .all_features section#table .container .row .comparison table tbody tr td {
        font-size: 12px;
        font-weight: 600
    }
}

.all_features section#table .container .row .comparison table tbody tr td:first-child {
    text-align: left
}

.all_features section#table .container .row .comparison table tbody tr td.head-row {
    font-size: 16px;
    font-weight: 700;
    padding: 2rem 10px;
    text-decoration: underline;
    color: #00bf71
}

@media(max-width:767px) {
    .all_features section#table .container .row .comparison table tbody tr td.head-row {
        font-size: 14px;
        font-weight: 700
    }
}

@media(max-width:767px) {
    .all_features section#table .container .row .comparison tbody tr:nth-child(odd) {
        display: table-row;
        background: #f3f3f3
    }

    .all_features section#table .container .row .comparison .row {
        background: #fff
    }

    .all_features section#table .container .row .price-info {
        border-top: 0 !important
    }
}

@media(max-width:639px) {
    .all_features section#table .container .row .comparison .price-buy {
        padding: 5px 10px
    }

    .all_features section#table .container .row .comparison td, .all_features section#table .container .row .comparison th {
        padding: 10px 5px
    }

    .all_features section#table .container .row .comparison .price-now span {
        font-size: 16px
    }

    .all_features section#table .container .row .compare-heading {
        font-size: 13px
    }
}

.all_features section#feature-section {
    margin: 0
}

    .all_features section#feature-section .container .col-sm-12 {
        margin-bottom: 0
    }

        .all_features section#feature-section .container .col-sm-12 h2 {
            font-size: 40px;
            font-weight: 400;
            color: #0a1940;
            margin-bottom: 2rem
        }

        .all_features section#feature-section .container .col-sm-12 h3 {
            margin: 3rem auto 2rem;
            text-align: center;
            font-size: 28px;
            font-weight: 400;
            color: #0a1940
        }

    .all_features section#feature-section .container .row {
        justify-content: center;
        padding-top: 0
    }

        .all_features section#feature-section .container .row .col-sm-12 {
            margin-bottom: 0
        }

            .all_features section#feature-section .container .row .col-sm-12 p {
                font-size: 18px;
                color: #4a5673;
                font-weight: 400
            }

                .all_features section#feature-section .container .row .col-sm-12 p.budget_para {
                    margin: 1rem auto;
                    width: 55%
                }

            .all_features section#feature-section .container .row .col-sm-12 img {
                width: 100%
            }

            .all_features section#feature-section .container .row .col-sm-12 ul {
                list-style-type: none
            }

                .all_features section#feature-section .container .row .col-sm-12 ul.direction-row {
                    display: flex;
                    padding-left: 4.5rem;
                    padding-right: 0;
                    justify-content: space-between;
                    width: 70%
                }

@media(max-width:767px) {
    .all_features section#feature-section .container .row .col-sm-12 ul.direction-row {
        flex-direction: column;
        padding-left: 0
    }
}

.all_features section#feature-section .container .row .col-sm-12 ul.direction-row li {
    align-items: center;
    display: flex;
    color: #4a5673
}

@media(max-width:767px) {
    .all_features section#feature-section .container .row .col-sm-12 ul.direction-row li {
        margin: 0 auto 2rem;
        text-align: left;
        width: 80%
    }
}

.all_features section#feature-section .container .row .col-sm-12 ul.direction-column {
    padding: 0
}

    .all_features section#feature-section .container .row .col-sm-12 ul.direction-column li {
        margin: 0 auto 2rem;
        text-align: left;
        width: 80%;
        align-items: center;
        display: flex;
        color: #4a5673
    }

        .all_features section#feature-section .container .row .col-sm-12 ul.direction-column li div.icon {
            width: 30px;
            text-align: center;
            margin-right: 1rem
        }

            .all_features section#feature-section .container .row .col-sm-12 ul.direction-column li div.icon img {
                width: auto
            }

.all_features section#feature-section .container .row .col-sm-10 {
    text-align: center
}

.all_features section#feature-section .container .row .col-md-6 h3 {
    margin: 1rem auto 2rem;
    text-align: left;
    font-size: 32px;
    font-weight: 400;
    color: #0a1940
}

.all_features section#feature-section .container .row .col-md-6 p {
    text-align: left;
    margin: 1rem auto 2rem;
    font-weight: 400;
    font-size: 18px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all_features section#feature-section .container .row .col-md-6 p {
        width: 100%
    }
}

.all_features section#feature-section .container .row .left ul.direction-column {
    width: 60%;
    margin: 0 auto
}

    .all_features section#feature-section .container .row .left ul.direction-column li {
        color: #4a5673
    }

.all_features section#big_cta {
    padding-bottom: 6rem;
    padding-top: 7rem
}

    .all_features section#big_cta .container .row {
        background: linear-gradient(98.7deg,#ffe876 20.93%,#f5cc63 95.8%);
        border-radius: 98px;
        position: relative
    }

        .all_features section#big_cta .container .row .col-sm-12 {
            text-align: left;
            background: 0 0
        }

            .all_features section#big_cta .container .row .col-sm-12 h2 {
                padding-top: 4rem;
                font-size: 32px;
                font-weight: 400;
                margin: auto auto 2rem 2rem;
                text-align: left;
                width: 100%;
                color: #0a1940
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all_features section#big_cta .container .row .col-sm-12 h2 {
        width: 80%;
        margin: 0 auto 2rem;
        text-align: center
    }
}

.all_features section#big_cta .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    margin: 1rem auto 1rem 2rem;
    padding-top: 0;
    text-align: left
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all_features section#big_cta .container .row .col-sm-12 p {
        text-align: center;
        margin: 3rem auto
    }
}

.all_features section#big_cta .container .row .col-sm-12 a {
    margin-bottom: 4rem;
    padding: 1rem
}

.all_features section#big_cta .container .row .col-sm-12 .btn-filled {
    padding: 1rem 2.5rem;
    margin-left: 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .all_features section#big_cta .container .row .col-sm-12 .btn-filled {
        width: 40%;
        margin-left: 0
    }
}

@media(max-width:767px) {
    .all_features section#big_cta .container .row .col-sm-12 .btn-filled {
        width: 100%;
        margin-left: 0
    }
}

.all_features section#big_cta .container .row .col-sm-12 a.btn-filled.green {
    box-shadow: 0 15px 48px rgba(90,72,13,.3)
}

    .all_features section#big_cta .container .row .col-sm-12 a.btn-filled.green:hover {
        box-shadow: none
    }

.all_features section#big_cta .container .row .col-sm-12 a.btn-filled.white {
    color: #f5cc63;
    box-shadow: 0 15px 61px rgba(170,137,17,.5)
}

    .all_features section#big_cta .container .row .col-sm-12 a.btn-filled.white:hover {
        box-shadow: none;
        background-color: #fff
    }

.all_features section#big_cta .container .row .col-sm-12 img {
    width: 100%;
    position: relative;
    top: 5rem
}

.all_features section#forever_free {
    padding-top: 5rem
}

    .all_features section#forever_free .container .row {
        justify-content: space-evenly
    }

        .all_features section#forever_free .container .row .col-sm-12.header {
            margin-bottom: 3rem
        }

            .all_features section#forever_free .container .row .col-sm-12.header h2 {
                text-align: center;
                font-size: 40px;
                font-weight: 400
            }

        .all_features section#forever_free .container .row .col-md-5 {
            display: flex;
            flex-direction: column;
            background: #fff;
            box-shadow: 0 4px 17px rgba(214,231,255,.3);
            border-radius: 40px;
            padding: 2rem 3rem 0
        }

            .all_features section#forever_free .container .row .col-md-5 p {
                font-size: 18px;
                font-weight: 400;
                margin-top: 0;
                color: #4a5673
            }

            .all_features section#forever_free .container .row .col-md-5 h3 {
                margin: 0 0 1rem;
                font-size: 24px;
                font-weight: 400;
                text-align: left
            }

            .all_features section#forever_free .container .row .col-md-5 img {
                width: 20%;
                margin-bottom: 2rem
            }

        .all_features section#forever_free .container .row .feature {
            padding-top: 6rem;
            margin-bottom: 0
        }

            .all_features section#forever_free .container .row .feature p {
                font-size: 18px;
                color: #4a5673;
                font-weight: 400;
                margin: 1rem auto 2rem
            }

            .all_features section#forever_free .container .row .feature img {
                width: 100%
            }

            .all_features section#forever_free .container .row .feature ul {
                list-style-type: none
            }

                .all_features section#forever_free .container .row .feature ul li img {
                    margin-right: 1rem;
                    width: auto
                }

                .all_features section#forever_free .container .row .feature ul.direction-column {
                    padding: 0
                }

                    .all_features section#forever_free .container .row .feature ul.direction-column li {
                        margin: 0 auto 2rem 0;
                        text-align: left;
                        width: 80%;
                        align-items: center;
                        display: flex;
                        color: #4a5673
                    }

        .all_features section#forever_free .container .row .img {
            padding-top: 6rem
        }

            .all_features section#forever_free .container .row .img img {
                width: 100%
            }

.all_features section#big_cta.second {
    padding-bottom: 3rem;
    padding-top: 2rem
}

.all_features section#features_second {
    padding-top: 6rem
}

    .all_features section#features_second .container {
        background: linear-gradient(178.21deg,#f2f8ff 1.51%,#f2f8ff 98.57%);
        border-radius: 98px;
        max-width: 90%
    }

        .all_features section#features_second .container .row {
            justify-content: center
        }

            .all_features section#features_second .container .row .col-sm-12.header {
                margin: 2rem auto 4rem
            }

                .all_features section#features_second .container .row .col-sm-12.header h2 {
                    text-align: center;
                    font-size: 40px
                }

            .all_features section#features_second .container .row .col-sm-12 h3 {
                font-size: 32px;
                font-weight: 400;
                margin-bottom: 2rem;
                color: #0a1940;
                text-align: left
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all_features section#features_second .container .row .col-sm-12 h3 {
        text-align: center
    }
}

.all_features section#features_second .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    text-align: left
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all_features section#features_second .container .row .col-sm-12 p {
        text-align: center
    }
}

.all_features section#features_second .container .row .col-sm-12 ul {
    list-style-type: none;
    padding-left: 0
}

    .all_features section#features_second .container .row .col-sm-12 ul li {
        margin: 0 auto 2rem;
        text-align: left
    }

        .all_features section#features_second .container .row .col-sm-12 ul li img {
            margin-right: 1rem
        }

.all_features section#features_second .container .row .second img {
    width: 100%
}

.all_features section#features_second .container .row .list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.all_features section#features_second .container .row .img {
    display: flex;
    justify-content: center;
    margin-bottom: 3rem
}

    .all_features section#features_second .container .row .img img {
        width: 100%
    }

.all_features section#values.container {
    padding: 8rem 0 0;
    margin: 0 auto;
    background-color: inherit
}

    .all_features section#values.container .col-sm-12 h2.header {
        font-size: 40px;
        font-weight: 400;
        text-align: center
    }

    .all_features section#values.container .row .col-lg-12 .card {
        border: none;
        margin-bottom: 2rem;
        border-radius: 56px;
        box-shadow: 0 0 61px 10px rgba(232,232,255,.18)
    }

        .all_features section#values.container .row .col-lg-12 .card .card-header {
            border-radius: 56px;
            padding: 1rem 1rem 0
        }

            .all_features section#values.container .row .col-lg-12 .card .card-header h2 {
                padding-bottom: 1rem
            }

                .all_features section#values.container .row .col-lg-12 .card .card-header h2 button {
                    width: 100%;
                    display: flex;
                    justify-content: space-between;
                    text-decoration: none;
                    align-items: center
                }

                    .all_features section#values.container .row .col-lg-12 .card .card-header h2 button:hover {
                        text-decoration: none
                    }

        .all_features section#values.container .row .col-lg-12 .card .collapse .card-body p {
            border-top: 1px solid #d7e4fe;
            padding-top: 1rem
        }

.all_features #social_proof_test {
    padding-bottom: 5rem
}

    .all_features #social_proof_test .container .row {
        padding-top: 2rem;
        padding-bottom: 1rem;
        display: flex;
        border-bottom: none
    }

        .all_features #social_proof_test .container .row .text p {
            font-size: 18px;
            font-weight: 400;
            text-align: center;
            color: #4a5673
        }

        .all_features #social_proof_test .container .row .col-md-4 {
            text-align: center;
            margin: 1rem 0;
            align-items: center;
            display: flex;
            justify-content: center;
            flex-direction: column
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all_features #social_proof_test .container .row .col-md-4 {
        margin: 20px 0
    }
}

@media(max-width:767px) {
    .all_features #social_proof_test .container .row .col-md-4 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }
}

.all_features #social_proof_test .container .row .col-md-4 .smaller {
    width: 60%
}

@media(max-width:767px) {
    .all_features #social_proof_test .container .row .col-md-4 .smaller {
        width: 30%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all_features #social_proof_test .container .row .col-md-4 .bigger, .all_features #social_proof_test .container .row .col-md-4 .usp, .all_features #social_proof_test .container .row .col-md-4 .dsv {
        width: 25%
    }
}

section#footer {
    padding: 2rem 0;
    background: #f2f8ff;
    border-radius: 98px 98px 0 0
}

    section#footer .container .row {
        justify-content: space-between
    }

        section#footer .container .row p {
            margin-bottom: 0;
            color: #4a5673
        }

        section#footer .container .row .socials a:nth-of-type(2) {
            margin: 0 1rem
        }

.free_plan {
    background-color: #fcfcfd
}

    .free_plan p.label {
        font-weight: 500;
        font-size: 16px;
        color: #a0a0a0
    }

    .free_plan #mainNav {
        background: linear-gradient(180deg,#e9eff9 0%,rgba(246,249,250,0) 100%)
    }

        .free_plan #mainNav .collapse .menu-1 li.nav-item {
            margin-left: 3rem
        }

        .free_plan #mainNav .collapse .menu-2 li.nav-item a.btn-filled {
            color: #1b1b20;
            box-shadow: 0 15px 26px rgba(255,199,0,.3)
        }

            .free_plan #mainNav .collapse .menu-2 li.nav-item a.btn-filled:hover {
                color: #1b1b20 !important;
                box-shadow: none;
                background-color: #f7b801
            }

        .free_plan #mainNav.navbar-shrink {
            background: #fff;
            box-shadow: 0 4px 39px rgba(214,231,255,.7)
        }

    .free_plan #top_test {
        background: linear-gradient(180deg,#e9eff9 0%,rgba(246,249,250,0) 100%);
        padding-top: 10rem
    }

        .free_plan #top_test .container {
            padding: 4rem 0
        }

            .free_plan #top_test .container .row .col-sm-12 h2 {
                margin: 0 auto 3rem;
                font-size: 44px;
                font-weight: 400;
                text-align: center;
                color: #0a1940;
                width: 65%
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan #top_test .container .row .col-sm-12 h2 {
        width: 90%
    }
}

.free_plan #top_test .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    color: #1b1b20;
    margin: 0 auto 3rem;
    text-align: center
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan #top_test .container .row .col-sm-12 p {
        width: 88%
    }
}

.free_plan #top_test .container .row .col-sm-12 .form {
    width: 50%;
    margin: 0 auto
}

    .free_plan #top_test .container .row .col-sm-12 .form .form-wrapper input {
        outline: none
    }

        .free_plan #top_test .container .row .col-sm-12 .form .form-wrapper input[type=email] {
            border-radius: 26px;
            border: 2px solid rgba(10,25,64,.2);
            box-shadow: none
        }

            .free_plan #top_test .container .row .col-sm-12 .form .form-wrapper input[type=email]:hover {
                border: 2px solid rgba(0,191,113,.3);
                outline: none;
                box-shadow: none
            }

@media(max-width:767px) {
    .free_plan #top_test .container .row .col-sm-12 .form .form-wrapper input[type=email] {
        margin-bottom: 1rem;
        width: 100%
    }
}

.free_plan #top_test .container .row .col-sm-12 .form .form-wrapper button {
    padding: 16px 0;
    color: #fff;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #00bf71;
    position: relative;
    left: -3rem;
    border: 1px solid rgba(31,225,73,.3);
    box-shadow: 0 15px 32px rgba(57,82,62,.3)
}

@media(max-width:767px) {
    .free_plan #top_test .container .row .col-sm-12 .form .form-wrapper button {
        left: 0
    }
}

.free_plan #top_test .container .row .col-sm-12 .form .form-wrapper button:hover {
    color: #1b1b20;
    box-shadow: none;
    background-color: #00bf71
}

.free_plan #top_test .container .row .col-sm-12 .form .terms-submission {
    margin: 8px 0;
    font-size: 11px;
    color: #1b1b20;
    opacity: .6;
    width: 100%;
    text-align: center
}

    .free_plan #top_test .container .row .col-sm-12 .form .terms-submission label {
        display: flex
    }

@media(max-width:767px) {
    .free_plan #top_test .container .row .col-sm-12 .form .terms-submission label {
        flex-wrap: wrap
    }
}

.free_plan #top_test .container .row .col-sm-12 .form .terms-submission label:hover {
    cursor: pointer
}

.free_plan #top_test .container .row .col-sm-12 .form .terms-submission label input {
    margin-right: .3rem
}

.free_plan #top_test .container .row .col-sm-12 .form .terms-submission a {
    color: #1b1b20;
    text-decoration: underline;
    margin: 0 2px;
    font-weight: 600
}

.free_plan #top_test .container .row .col-sm-12 img {
    width: 100%;
    margin-top: 2rem
}

.free_plan section#badge .container .row .col-sm-12 {
    justify-content: center;
    display: flex;
    align-items: center;
    margin: 3rem auto 0
}

.free_plan .inline-form-tc input[type=email] {
    border: 1px solid #1b1b20;
    outline: none;
    font-size: 16px;
    padding: 16px 5px 16px 20px;
    color: #5a5a5a;
    width: 63%
}

    .free_plan .inline-form-tc input[type=email]:hover, .free_plan .inline-form-tc input[type=email]:focus, .free_plan .inline-form-tc input[type=email]:active {
        box-shadow: 0 0 0 3px #f7b801
    }

@media(max-width:767px) {
    .free_plan .inline-form-tc input[type=email] {
        font-size: 11px
    }
}

.free_plan .inline-form-tc p {
    font-size: 13px;
    margin: .7rem 0
}

.free_plan .inline-form-tc button {
    padding: 12px 50px;
    color: #fff;
    font-weight: 700;
    width: 35%
}

@media(max-width:767px) {
    .free_plan .inline-form-tc button {
        width: 100%
    }
}

.free_plan section#feature-section {
    margin: 2rem 4rem
}

    .free_plan section#feature-section .container {
        max-width: 100%
    }

        .free_plan section#feature-section .container .col-sm-12 p.label {
            text-align: center
        }

        .free_plan section#feature-section .container .col-sm-12 h2 {
            font-size: 32px;
            font-weight: 400;
            color: #0a1940
        }

        .free_plan section#feature-section .container .row {
            justify-content: center
        }

            .free_plan section#feature-section .container .row .hand_icon {
                position: absolute;
                top: 88rem;
                left: 8rem
            }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .free_plan section#feature-section .container .row .hand_icon {
        display: none
    }
}

.free_plan section#feature-section .container .row .billing_icon {
    position: absolute;
    left: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan section#feature-section .container .row .billing_icon {
        display: none
    }
}

.free_plan section#feature-section .container .row .automated_tracker_icon {
    position: absolute;
    right: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan section#feature-section .container .row .automated_tracker_icon {
        display: none
    }
}

.free_plan section#feature-section .container .row .col-sm-12 {
    margin-bottom: 0
}

    .free_plan section#feature-section .container .row .col-sm-12 img {
        width: 100%
    }

    .free_plan section#feature-section .container .row .col-sm-12 ul {
        list-style-type: none
    }

        .free_plan section#feature-section .container .row .col-sm-12 ul li img {
            margin-right: 1rem;
            width: auto
        }

        .free_plan section#feature-section .container .row .col-sm-12 ul.direction-row {
            display: flex;
            padding-left: 4.5rem;
            padding-right: 0;
            justify-content: space-between
        }

@media(max-width:767px) {
    .free_plan section#feature-section .container .row .col-sm-12 ul.direction-row {
        flex-direction: column;
        padding-left: 0
    }
}

.free_plan section#feature-section .container .row .col-sm-12 ul.direction-row li {
    align-items: center;
    display: flex
}

@media(max-width:767px) {
    .free_plan section#feature-section .container .row .col-sm-12 ul.direction-row li {
        margin: 0 auto 2rem;
        text-align: left;
        width: 80%
    }
}

.free_plan section#feature-section .container .row .col-sm-12 ul.direction-column {
    padding: 0
}

    .free_plan section#feature-section .container .row .col-sm-12 ul.direction-column li {
        margin: 0 auto 2rem;
        text-align: left;
        width: 80%;
        align-items: center;
        display: flex
    }

.free_plan section#feature-section .container .row .col-sm-12 div.text p.label {
    font-weight: 500;
    font-size: 16px;
    color: #a0a0a0
}

.free_plan section#feature-section .container .row .col-lg-5 div.text h2 {
    margin: 1rem auto 2rem;
    width: 80%;
    font-size: 32px;
    font-weight: 400;
    color: #0a1940
}

.free_plan section#feature-section .container .row .col-lg-5 div.text p {
    width: 80%;
    margin: 1rem auto 2rem;
    font-weight: 400;
    font-size: 18px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan section#feature-section .container .row .col-lg-5 div.text p {
        width: 100%
    }
}

.free_plan section#feature-section .container .row .left ul.direction-column {
    width: 60%;
    margin: 0 auto
}

.free_plan section#feature-section .container .row.silver {
    background: linear-gradient(178.21deg,#f2f8ff 1.51%,#f2f8ff 98.57%);
    border-radius: 98px;
    justify-content: center;
    padding-top: 6rem;
    margin-bottom: 4rem
}

.free_plan section#big_cta {
    padding-bottom: 11rem;
    padding-top: 7rem
}

    .free_plan section#big_cta .container .row {
        background: linear-gradient(98.7deg,#ffe876 20.93%,#f5cc63 95.8%);
        border-radius: 98px;
        position: relative
    }

        .free_plan section#big_cta .container .row .col-sm-12 {
            text-align: left;
            background: 0 0
        }

            .free_plan section#big_cta .container .row .col-sm-12 h2 {
                padding-top: 4rem;
                font-size: 32px;
                font-weight: 400;
                margin: auto auto 2rem 2rem;
                text-align: left;
                width: 100%;
                color: #0a1940
            }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan section#big_cta .container .row .col-sm-12 h2 {
        width: 80%;
        margin: 0 auto 2rem;
        text-align: center
    }
}

.free_plan section#big_cta .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    margin: 3rem auto 3rem 2rem;
    padding-top: 0;
    text-align: left
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan section#big_cta .container .row .col-sm-12 p {
        text-align: center;
        margin: 3rem auto
    }
}

.free_plan section#big_cta .container .row .col-sm-12 a {
    margin-bottom: 4rem;
    padding: 1rem
}

.free_plan section#big_cta .container .row .col-sm-12 .btn-filled {
    padding: 1rem 2.5rem;
    margin-left: 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .free_plan section#big_cta .container .row .col-sm-12 .btn-filled {
        width: 40%;
        margin-left: 0
    }
}

@media(max-width:767px) {
    .free_plan section#big_cta .container .row .col-sm-12 .btn-filled {
        width: 100%;
        margin-left: 0
    }
}

.free_plan section#big_cta .container .row .col-sm-12 a.btn-filled.green {
    box-shadow: 0 15px 48px rgba(90,72,13,.3)
}

    .free_plan section#big_cta .container .row .col-sm-12 a.btn-filled.green:hover {
        box-shadow: none
    }

.free_plan section#big_cta .container .row .col-sm-12 a.btn-filled.white {
    color: #f5cc63;
    box-shadow: 0 15px 61px rgba(170,137,17,.5)
}

    .free_plan section#big_cta .container .row .col-sm-12 a.btn-filled.white:hover {
        box-shadow: none;
        background-color: #fff
    }

.free_plan section#big_cta .container .row .col-sm-12 img {
    width: 100%;
    position: relative;
    top: 5rem
}

.free_plan section#features_second .container .row .col-sm-12 {
    justify-content: center
}

    .free_plan section#features_second .container .row .col-sm-12 p.label {
        font-weight: 500;
        font-size: 16px;
        color: #a0a0a0
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan section#features_second .container .row .col-sm-12 p.label {
        text-align: center
    }
}

.free_plan section#features_second .container .row .col-sm-12 h2 {
    font-size: 32px;
    font-weight: 400;
    margin-bottom: 2rem;
    color: #0a1940
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan section#features_second .container .row .col-sm-12 h2 {
        text-align: center
    }
}

.free_plan section#features_second .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan section#features_second .container .row .col-sm-12 p {
        text-align: center
    }
}

.free_plan section#features_second .container .row .col-sm-12 ul {
    list-style-type: none
}

    .free_plan section#features_second .container .row .col-sm-12 ul li {
        margin: 0 auto 2rem;
        text-align: left
    }

        .free_plan section#features_second .container .row .col-sm-12 ul li img {
            margin-right: 1rem
        }

        .free_plan section#features_second .container .row .col-sm-12 ul li:nth-of-type(2) img {
            margin-right: 1.7rem
        }

.free_plan section#features_second .container .row .list {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.free_plan section#features_second .container .row .img {
    display: flex;
    justify-content: center;
    margin-bottom: 3rem
}

    .free_plan section#features_second .container .row .img img {
        width: 100%
    }

.free_plan #integrations {
    padding: 7rem 0 2rem;
    background-color: #fff;
    margin-bottom: 9rem;
    position: relative
}

    .free_plan #integrations .container .row {
        justify-content: center
    }

@media(max-width:991px) {
    .free_plan #integrations .container .row {
        flex-direction: column
    }
}

.free_plan #integrations .container .row .left-container {
    display: flex;
    align-items: center
}

.free_plan #integrations .container .row .col-md-6 {
    justify-content: center;
    display: flex;
    flex-direction: column
}

    .free_plan #integrations .container .row .col-md-6 p.label {
        font-weight: 500;
        font-size: 16px;
        color: #a0a0a0;
        margin: 0;
        text-align: center
    }

    .free_plan #integrations .container .row .col-md-6 p.green {
        color: #00bf71;
        margin-bottom: 1rem;
        font-size: 16px;
        font-weight: 600
    }

    .free_plan #integrations .container .row .col-md-6 h2 {
        font-size: 32px;
        font-weight: 400;
        position: relative;
        z-index: 1;
        margin: 1rem auto 2rem;
        color: #0a1940
    }

    .free_plan #integrations .container .row .col-md-6 p {
        margin: 0 0 2rem;
        font-size: 18px;
        font-weight: 600;
        color: #1b1b20
    }

    .free_plan #integrations .container .row .col-md-6 .btn-check-integrations {
        color: #00bf71;
        font-size: 16px;
        font-weight: 800;
        margin-top: 0;
        white-space: nowrap;
        padding-bottom: 2rem
    }

        .free_plan #integrations .container .row .col-md-6 .btn-check-integrations:hover {
            text-decoration: underline;
            color: #00bf71
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan #integrations .container .row .col-md-6 {
        text-align: center
    }

        .free_plan #integrations .container .row .col-md-6 h2 {
            width: 100%;
            margin: 1rem auto
        }
}

.free_plan #integrations .container .row .img .carousel .carousel-control-next, .free_plan #integrations .container .row .img .carousel .carousel-control-prev {
    filter: invert(100%)
}

.free_plan #integrations .container .row .img .carousel .carousel-control-prev {
    left: -7rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan #integrations .container .row .img .carousel .carousel-control-prev {
        left: -2rem
    }
}

@media(max-width:767px) {
    .free_plan #integrations .container .row .img .carousel .carousel-control-prev {
        margin-left: 1rem
    }
}

.free_plan #integrations .container .row .img .carousel .carousel-control-next {
    right: -7rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan #integrations .container .row .img .carousel .carousel-control-next {
        right: -2rem
    }
}

@media(max-width:767px) {
    .free_plan #integrations .container .row .img .carousel .carousel-control-next {
        margin-right: 1rem
    }
}

.free_plan #integrations .container .row .img .carousel .carousel-item.active, .free_plan #integrations .container .row .img .carousel .carousel-item.next, .free_plan #integrations .container .row .img .carousel .carousel-item.prev, .free_plan #integrations .container .row .img .carousel .carousel-item-next.carousel-item-left, .free_plan #integrations .container .row .img .carousel .carousel-item-prev.carousel-item-right {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}

.free_plan #integrations .container .row .img .carousel img {
    width: 1110px;
    height: 605px
}

.free_plan #integrations .container .row .integration_bottom {
    position: absolute;
    bottom: 197rem
}

@media(max-width:1200px) {
    .free_plan #integrations .container .row .integration_bottom {
        display: none
    }
}

.free_plan #integrations .container .row .integration_bottom.right {
    right: 1rem;
    bottom: 23rem
}

.free_plan #integrations .container .row .integration_bottom.left {
    left: 1rem;
    bottom: 14rem
}

.free_plan section#features-perks .container .row p.label {
    text-align: center;
    margin-bottom: 1.5rem
}

.free_plan section#features-perks .container .row div.header h2 {
    text-align: center;
    font-size: 32px;
    font-weight: 400;
    width: 100%;
    margin-bottom: 2rem;
    color: #0a1940
}

.free_plan section#features-perks .container .row div.buttons {
    display: flex;
    flex-direction: column;
    justify-content: center
}

    .free_plan section#features-perks .container .row div.buttons .btn {
        white-space: normal;
        text-align: left
    }

    .free_plan section#features-perks .container .row div.buttons .filtering-buttons {
        border-radius: 99px;
        opacity: .4;
        display: flex;
        align-items: center;
        justify-content: end;
        border: none;
        padding: 1.5rem 1.75rem
    }

        .free_plan section#features-perks .container .row div.buttons .filtering-buttons div.wrapper {
            display: flex;
            align-items: baseline;
            justify-content: end;
            flex-direction: column
        }

            .free_plan section#features-perks .container .row div.buttons .filtering-buttons div.wrapper h3 {
                font-size: 24px;
                font-weight: 700;
                font-family: nunito sans,sans-serif;
                padding-left: 1rem;
                color: #0a1940
            }

            .free_plan section#features-perks .container .row div.buttons .filtering-buttons div.wrapper p {
                font-size: 14px;
                font-weight: 400;
                line-height: 1.5;
                padding-left: 1rem;
                margin-bottom: 0
            }

        .free_plan section#features-perks .container .row div.buttons .filtering-buttons img {
            border-radius: 50%;
            margin-right: 2rem
        }

    .free_plan section#features-perks .container .row div.buttons .working {
        box-shadow: 2px 2px 23px 0 rgba(200,215,243,.5);
        border: none;
        outline: none;
        opacity: 1
    }

.free_plan section#features-perks .container .row .carousel .carousel-item .perk-content {
    flex-direction: column;
    align-items: end;
    justify-content: center;
    padding-left: 2rem
}

    .free_plan section#features-perks .container .row .carousel .carousel-item .perk-content img {
        width: auto;
        position: relative;
        margin-bottom: 3rem
    }

@media(max-width:991px) {
    .free_plan section#features-perks .container .row .carousel .carousel-item .perk-content img {
        display: block
    }
}

@media(max-width:767px) {
    .free_plan section#features-perks .container .row .carousel .carousel-item .perk-content img {
        margin-top: 5rem
    }
}

.free_plan section#features-perks .container .row .carousel .carousel-item .perk-content h2 {
    font-size: 24px;
    font-weight: 400;
    text-align: left;
    margin-bottom: 1.5rem;
    color: #0a1940
}

.free_plan section#features-perks .container .row .carousel .carousel-item .perk-content p {
    font-size: 18px;
    font-weight: 400;
    color: #1b1b20
}

    .free_plan section#features-perks .container .row .carousel .carousel-item .perk-content p:before {
        content: none
    }

.free_plan .pricing-section {
    margin-top: 5rem;
    padding-top: 8rem
}

    .free_plan .pricing-section h5 {
        margin-bottom: 50px;
        color: #4a5673
    }

    .free_plan .pricing-section .col {
        padding-left: 8px;
        padding-right: 8px
    }

    .free_plan .pricing-section .pricing-plan-name {
        font-size: 24px;
        color: #0a1940;
        padding: 30px 0 0
    }

    .free_plan .pricing-section .pricing-price {
        font-weight: 700;
        font-size: 48px;
        color: #00bf71;
        margin-top: 10px
    }

        .free_plan .pricing-section .pricing-price span {
            font-size: 20px;
            position: relative;
            top: -8px;
            display: inline-block;
            line-height: 27px;
            left: 8px
        }

    .free_plan .pricing-section .pricing-price-info {
        font-size: 18px;
        line-height: 26px;
        color: #a0aac2
    }

    .free_plan .pricing-section .pricing-subheader {
        font-size: 18px;
        line-height: 26px;
        text-align: center;
        color: #4a5673;
        padding: 10px
    }

    .free_plan .pricing-section a {
        background: linear-gradient(180deg,#ffc502 0%,#00bf71 100%);
        box-shadow: 0 8px 34px rgba(188,209,238,.5);
        border-radius: 32px;
        color: #fff;
        font-weight: 700;
        font-size: 18px;
        padding: 15px;
        display: inline-block;
        width: 80%;
        margin: 20px 10px
    }

        .free_plan .pricing-section a:hover {
            background: linear-gradient(180deg,#1da44c 0%,#008c53 100%)
        }

    .free_plan .pricing-section .pricing-column {
        background: #fff;
        box-shadow: 0 4px 17px rgba(214,231,255,.3);
        border-radius: 40px;
        text-align: center
    }

    .free_plan .pricing-section .pricing-compare {
        padding-bottom: 30px;
        color: #0a1940
    }

        .free_plan .pricing-section .pricing-compare li {
            line-height: 33px
        }

        .free_plan .pricing-section .pricing-compare .fa-check {
            color: #00bf71
        }

        .free_plan .pricing-section .pricing-compare .fa-times {
            color: #e52f2f
        }

.free_plan #social_proof_test {
    padding-bottom: 5rem
}

    .free_plan #social_proof_test .container .row {
        padding-top: 2rem;
        padding-bottom: 1rem;
        display: flex;
        border-bottom: none
    }

        .free_plan #social_proof_test .container .row .text p {
            font-size: 18px;
            font-weight: 400;
            text-align: center;
            color: #4a5673
        }

        .free_plan #social_proof_test .container .row .col-md-4 {
            text-align: center;
            margin: 1rem 0;
            align-items: center;
            display: flex;
            justify-content: center;
            flex-direction: column
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan #social_proof_test .container .row .col-md-4 {
        margin: 20px 0
    }
}

@media(max-width:767px) {
    .free_plan #social_proof_test .container .row .col-md-4 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }
}

.free_plan #social_proof_test .container .row .col-md-4 .smaller {
    width: 60%
}

@media(max-width:767px) {
    .free_plan #social_proof_test .container .row .col-md-4 .smaller {
        width: 30%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free_plan #social_proof_test .container .row .col-md-4 .bigger, .free_plan #social_proof_test .container .row .col-md-4 .usp, .free_plan #social_proof_test .container .row .col-md-4 .dsv {
        width: 25%
    }
}

section#footer {
    padding: 2rem 0;
    background: #f2f8ff;
    border-radius: 98px 98px 0 0
}

    section#footer .container .row {
        justify-content: space-between
    }

        section#footer .container .row p {
            margin-bottom: 0;
            color: #4a5673
        }

        section#footer .container .row .socials a:nth-of-type(2) {
            margin: 0 1rem
        }

.ppc_section #mainNav .menu-2 {
    justify-content: center
}

@media(max-width:767px) {
    .ppc_section #mainNav .menu-2 {
        align-items: center
    }

        .ppc_section #mainNav .menu-2 .nav-item .btn-menu-register {
            padding: 14px 20px !important
        }
}

.ppc_section .row {
    margin-right: 15px;
    margin-left: 15px
}

.ppc_section p {
    line-height: 26px
}

.ppc_section .collapse {
    justify-content: flex-end
}

.ppc_section #top {
    background: linear-gradient(to bottom,#edeff5,#fff 75%);
    margin-top: 0
}

    .ppc_section #top img {
        width: 100%
    }

    .ppc_section #top .ppc_top {
        display: flex
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #top .ppc_top {
        flex-direction: column
    }
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top .ppcHeader {
        text-align: left;
        padding-right: 40px;
        padding-top: 3rem;
        font-size: 48px
    }
}

.ppc_section #top .ppc_top .wrapper:nth-of-type(1) {
    width: 50%
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #top .ppc_top .wrapper:nth-of-type(1) {
        width: 100%;
        padding-right: 5rem
    }
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top .wrapper:nth-of-type(1) {
        width: 100%
    }
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top .wrapper:nth-of-type(2) {
        margin-left: 0;
        display: none;
        margin-top: 3rem;
        width: 100%;
        padding-left: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #top .ppc_top .wrapper:nth-of-type(2) {
        width: 75%;
        padding-left: 0
    }
}

.ppc_section #top .ppc_top p {
    font-size: 18px;
    font-family: nunito sans,sans-serif;
    font-weight: 600;
    line-height: 1.89;
    margin: 2rem 0;
    color: #767676
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top p {
        padding-right: 5rem;
        margin: 2rem 0
    }
}

.ppc_section #top .ppc_top .form .form-wrapper input[type=email] {
    border: none;
    width: 60%;
    outline: none;
    font-size: 14px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top .form .form-wrapper input[type=email] {
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #top .ppc_top .form .form-wrapper input[type=email] {
        width: 60%
    }
}

.ppc_section #top .ppc_top .form .form-wrapper button {
    padding: 12px 10px;
    color: #fff;
    width: 35%;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #ffc502;
    position: relative;
    background-color: #ffc502;
    left: -3rem;
    margin-top: 0
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top .form .form-wrapper button {
        left: unset;
        right: 0;
        width: 75%;
        padding: 10px 0;
        margin-top: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #top .ppc_top .form .form-wrapper button {
        padding: 14px 7px
    }
}

.ppc_section #top .ppc_top .form .form-wrapper .terms-submission {
    margin: 20px 0;
    font-size: 13px;
    color: #1b1b20;
    opacity: .6;
    width: 60%;
    padding-left: 2rem
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top .form .form-wrapper .terms-submission {
        width: 100%;
        padding: 0 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #top .ppc_top .form .form-wrapper .terms-submission {
        padding-right: 0
    }
}

.ppc_section #top .ppc_top .form .form-wrapper .terms-submission a {
    margin: 0 2px;
    color: #ffc502
}

.ppc_section #top .ppc_top .form .button-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top .form .button-wrapper {
        flex-direction: column;
        align-items: center
    }
}

.ppc_section #top .ppc_top .form .button-wrapper .button-wrapper__google {
    display: flex;
    align-items: center;
    margin-top: 1rem
}

@media(max-width:767px) {
    .ppc_section #top .ppc_top .form .button-wrapper .button-wrapper__google {
        display: block;
        margin-left: 0;
        text-align: center;
        margin-top: 1rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #top .ppc_top .form .button-wrapper .button-wrapper__google {
        margin-left: 0
    }
}

.ppc_section #top .ppc_top .form .button-wrapper .button-wrapper__google span {
    font-size: 1rem;
    color: #767676
}

.ppc_section #top .ppc_top .form .button-wrapper .button-wrapper__google img {
    margin-left: .2rem;
    width: 32px
}

.ppc_section .check-wrapper {
    display: flex;
    justify-content: space-evenly;
    margin: 0 auto 3rem;
    width: 80%
}

@media(max-width:767px) {
    .ppc_section .check-wrapper {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between
    }
}

.ppc_section .check-wrapper .checks {
    display: flex;
    align-items: center
}

@media(max-width:767px) {
    .ppc_section .check-wrapper .checks {
        padding-top: 1rem
    }
}

.ppc_section .check-wrapper .checks p {
    font-size: 16px;
    color: #ffc502;
    margin-bottom: 0;
    margin-left: 10px
}

.ppc_section #social-proof {
    background-color: #ffc502;
    width: 100%;
    padding-bottom: 0 !important
}

    .ppc_section #social-proof .row {
        border-bottom: none !important
    }

@media(max-width:767px) {
    .ppc_section #social-proof .row .social-proof__heading {
        padding-right: 30px;
        padding-left: 30px
    }
}

.ppc_section #social-proof .row .social-proof__heading h3 {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    font-family: nunito sans,sans-serif;
    text-align: center
}

@media(max-width:767px) {
    .ppc_section #social-proof .row .social-proof__heading h3 {
        line-height: 34px
    }
}

.ppc_section #main-ppc {
    margin: 4rem 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #main-ppc {
        margin: 5rem 0
    }
}

.ppc_section #main-ppc .header {
    text-align: center
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #main-ppc .header {
        text-align: left;
        padding-left: 2rem
    }
}

.ppc_section #main-ppc .header h2 {
    font-size: 36px;
    font-family: lato,sans-serif;
    font-weight: 700;
    padding: 2rem 0
}

@media(max-width:767px) {
    .ppc_section #main-ppc .header h2 {
        font-size: 28px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #main-ppc .header h2 {
        padding-right: 12rem
    }
}

.ppc_section #main-ppc .integration-img {
    margin-top: 10px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #main-ppc .integration-img img {
        width: 100%
    }
}

.ppc_section #main-ppc .wrapper .row {
    margin-left: 0;
    margin-right: 0
}

.ppc_section #main-ppc .wrapper .integration-ppc .col-lg-12 {
    padding: 15px;
    flex-direction: row
}

    .ppc_section #main-ppc .wrapper .integration-ppc .col-lg-12 p {
        text-align: left;
        margin: 0 1rem 0 3rem
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #main-ppc .wrapper .integration-ppc .col-lg-12 p {
        margin: 0;
        padding-left: 2rem
    }
}

@media(max-width:767px) {
    .ppc_section #main-ppc .wrapper .integration-ppc {
        margin-bottom: 3rem
    }
}

.ppc_section #main-ppc .wrapper .integration-ppc .col-lg-5 img {
    padding-left: 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #main-ppc .wrapper .integration-ppc .col-lg-5 img {
        width: 15%
    }
}

.ppc_section #main-ppc .wrapper .box-integration {
    margin: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #main-ppc .wrapper .box-integration {
        padding: 20px;
        margin: 10px;
        flex-direction: row
    }
}

.ppc_section #main-ppc .wrapper .box-integration img {
    padding-left: 1rem
}

@media(max-width:767px) {
    .ppc_section #main-ppc .wrapper .box-integration img {
        width: 15%;
        padding-left: 0
    }
}

.ppc_section #main-ppc .wrapper .box-integration p {
    margin: 22px 0 0;
    text-align: center
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #main-ppc .wrapper .box-integration p {
        text-align: left;
        padding-left: 2rem;
        margin: 0
    }
}

@media(max-width:767px) {
    .ppc_section #main-ppc .wrapper .box-integration p {
        font-size: 12px
    }
}

.ppc_section #main-ppc .wrapper-img {
    display: flex;
    align-items: center
}

@media(max-width:767px) {
    .ppc_section #main-ppc .wrapper-img {
        width: 90%
    }
}

.ppc_section #reviews {
    background-color: #f3f3f3;
    margin-top: 20rem;
    margin-bottom: 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #reviews {
        height: 100%
    }
}

.ppc_section #reviews .mobile-reviews {
    display: none
}

@media(max-width:767px) {
    .ppc_section #reviews .mobile-reviews {
        display: block
    }
}

.ppc_section #reviews .mobile-reviews .carousel-inner {
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

@media(max-width:767px) {
    .ppc_section #reviews .mobile-reviews .carousel-inner {
        margin: 0 2rem;
        overflow: inherit
    }
}

@media(max-width:767px) {
    .ppc_section #reviews .mobile-reviews .carousel-indicators {
        bottom: -5rem
    }
}

.ppc_section #reviews .mobile-reviews .carousel-indicators li {
    border-radius: 50%;
    width: 10px;
    height: 10px;
    margin-right: 20px;
    background-color: #d9d9d9
}

.ppc_section #reviews .mobile-reviews .carousel-indicators .active {
    background-color: #fff !important
}

.ppc_section #reviews .large-reviews {
    display: block
}

@media(max-width:767px) {
    .ppc_section #reviews .large-reviews {
        display: none
    }
}

.ppc_section #reviews .header h5 {
    position: relative;
    top: -15rem
}

.ppc_section #reviews .header p {
    position: relative;
    top: -14rem;
    font-size: 36px;
    line-height: 40px;
    font-weight: 700;
    padding: 2rem 10rem;
    text-align: center
}

@media(max-width:767px) {
    .ppc_section #reviews .header p {
        padding: 0;
        text-align: left;
        margin: 1rem 0;
        font-size: 28px;
        top: -16rem
    }
}

.ppc_section #reviews .customer-review {
    position: relative;
    top: -10rem
}

@media(max-width:767px) {
    .ppc_section #reviews .customer-review {
        top: -14rem
    }
}

.ppc_section #reviews .customer-review .green {
    font-size: 16px;
    padding: 22px 0;
    font-weight: 400
}

.ppc_section #reviews .customer-review .col-lg-3 {
    max-width: 23%
}

@media(max-width:767px) {
    .ppc_section #reviews .customer-review .col-lg-3 {
        max-width: 100%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #reviews .customer-review .col-md-6 {
        max-width: 46%
    }
}

.ppc_section #reviews .customer-review .box-reviews {
    border-radius: 26px;
    padding: 30px 35px;
    margin-right: 20px;
    height: fit-content;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(max-width:767px) {
    .ppc_section #reviews .customer-review .box-reviews {
        margin-right: 0;
        padding: 25px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #reviews .customer-review .box-reviews {
        margin-bottom: 20px
    }
}

@media(max-width:767px) {
    .ppc_section #reviews .customer-review .box-reviews .content p {
        padding-right: 1rem
    }
}

.ppc_section #reviews .customer-review .box-reviews .content .green {
    font-weight: 700;
    color: #767676
}

    .ppc_section #reviews .customer-review .box-reviews .content .green span {
        font-weight: 500
    }

.ppc_section #reviews .customer-review .box-reviews .card-img {
    width: 85%
}

@media(max-width:767px) {
    .ppc_section #reviews .customer-review .box-reviews .card-img {
        width: 80%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #reviews .customer-review .box-reviews .card-img {
        width: 70%
    }
}

.ppc_section #reviews .customer-review .box-reviews .customer-review__img {
    text-align: center
}

.ppc_section #reviews .customer-review .box-reviews .review-img {
    position: relative;
    top: -60px
}

.ppc_section #big_cta {
    padding-bottom: 0;
    padding-top: 0;
    position: relative;
    top: -3rem
}

@media(max-width:767px) {
    .ppc_section #big_cta {
        font-size: 13px
    }
}

@media(max-width:767px) {
    .ppc_section #big_cta .row {
        margin-right: 0;
        margin-left: 0
    }
}

@media(max-width:767px) {
    .ppc_section #big_cta img {
        display: none
    }
}

.ppc_section #big_cta .container {
    background-color: #f7b801;
    border-radius: 20px
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #big_cta .container {
        overflow-x: hidden
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #big_cta .container .big_cta_img {
        display: flex;
        align-items: end;
        left: -7rem
    }

        .ppc_section #big_cta .container .big_cta_img img {
            position: relative
        }
}

.ppc_section #big_cta .container .text-cta {
    display: flex;
    position: relative;
    z-index: 1;
    flex-direction: column;
    justify-content: center;
    padding-left: 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #big_cta .container .text-cta {
        padding-left: 1rem;
        padding-bottom: 2rem
    }
}

@media(max-width:767px) {
    .ppc_section #big_cta .container .text-cta {
        overflow-x: hidden
    }
}

.ppc_section #big_cta .container .text-cta h2 {
    font-size: 48px;
    font-weight: 700
}

@media(max-width:767px) {
    .ppc_section #big_cta .container .text-cta h2 {
        font-size: 36px;
        padding-top: 2rem;
        padding-right: 3rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #big_cta .container .text-cta h2 {
        padding-top: 2rem
    }
}

.ppc_section #big_cta .container .text-cta p {
    font-size: 18px;
    font-weight: 600;
    padding: 1rem 0
}

@media(max-width:767px) {
    .ppc_section #big_cta .container .text-cta p {
        font-size: 16px;
        padding-right: 4rem;
        line-height: 36px
    }
}

.ppc_section #big_cta .container .text-cta .icon-ppc-top {
    display: none
}

@media(max-width:767px) {
    .ppc_section #big_cta .container .text-cta .icon-ppc-top {
        display: block;
        position: absolute;
        right: -4rem;
        top: 1rem;
        width: 50%
    }
}

@media(max-width:767px) {
    .ppc_section #big_cta .container .links-cta {
        display: flex;
        flex-direction: column-reverse
    }
}

.ppc_section #big_cta .container .links-cta a {
    font-weight: 700
}

@media(max-width:767px) {
    .ppc_section #big_cta .container .links-cta a {
        width: 65%;
        margin: 3rem 0
    }
}

.ppc_section #big_cta .container .links-cta a:nth-of-type(2) {
    border-bottom: 1px solid #fff;
    color: #fff;
    margin-left: 2rem;
    font-weight: 700
}

@media(max-width:767px) {
    .ppc_section #big_cta .container .links-cta a:nth-of-type(2) {
        margin: 0;
        width: fit-content;
        font-size: 16px
    }
}

.ppc_section .feature-section {
    margin-top: 4rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section .feature-section img {
        width: 100%
    }
}

.ppc_section .feature-section .row {
    margin-bottom: 3rem
}

@media(max-width:767px) {
    .ppc_section .feature-section .row {
        margin-bottom: 2rem
    }

        .ppc_section .feature-section .row:nth-of-type(3) {
            flex-direction: column-reverse
        }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section .feature-section .row {
        margin-bottom: 2rem
    }
}

.ppc_section .feature-section .feature-section__img {
    text-align: end;
    margin: 2rem 0
}

    .ppc_section .feature-section .feature-section__img:nth-of-type(1) {
        position: relative;
        left: -85px;
        text-align: start
    }

@media(max-width:767px) {
    .ppc_section .feature-section .feature-section__img:nth-of-type(1) {
        left: 0
    }
}

.ppc_section .feature-section .heading {
    text-align: center;
    margin-bottom: 6rem
}

@media(max-width:767px) {
    .ppc_section .feature-section .heading {
        margin-bottom: 3rem
    }
}

.ppc_section .feature-section .heading h2 {
    font-size: 36px;
    padding: 23px 0;
    font-weight: 700
}

@media(max-width:767px) {
    .ppc_section .feature-section .heading h2 {
        font-size: 36px;
        text-align: left
    }
}

.ppc_section .feature-section .heading p:nth-of-type(2) {
    font-size: 18px;
    font-weight: 600;
    color: #767676
}

@media(max-width:767px) {
    .ppc_section .feature-section .heading p:nth-of-type(2) {
        font-size: 16px;
        text-align: left
    }
}

.ppc_section .feature-section .feature-section__text {
    display: flex;
    align-items: center
}

@media(max-width:767px) {
    .ppc_section .feature-section .feature-section__text {
        padding: 0
    }
}

.ppc_section .feature-section .text h3 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 2rem
}

@media(max-width:767px) {
    .ppc_section .feature-section .text h3 {
        font-size: 28px;
        padding-right: 2rem
    }
}

.ppc_section .feature-section .text p {
    font-size: 16px
}

.ppc_section #ppc_footer {
    margin: 1rem 0
}

@media(max-width:767px) {
    .ppc_section #ppc_footer {
        margin-top: 0;
        margin-bottom: 1rem
    }
}

.ppc_section #ppc_footer .row {
    justify-content: space-between
}

@media(max-width:767px) {
    .ppc_section #ppc_footer .row {
        text-align: center
    }
}

.ppc_section #ppc_footer .row .copyright-mobile {
    display: none
}

@media(max-width:767px) {
    .ppc_section #ppc_footer .row .copyright-mobile {
        display: block;
        text-align: left;
        margin-top: 1rem
    }
}

.ppc_section #ppc_footer .row .logos {
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .ppc_section #ppc_footer .row .logos {
        margin-top: 2rem;
        text-align: left;
        font-size: 14px;
        justify-content: flex-start
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #ppc_footer .row .logos {
        justify-content: space-around
    }
}

.ppc_section #ppc_footer .row .logos .social-mobile {
    display: none
}

@media(max-width:767px) {
    .ppc_section #ppc_footer .row .logos .social-mobile {
        display: flex
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #ppc_footer .row .logos img {
        margin-left: 2rem
    }
}

.ppc_section #ppc_footer .row .logos .apps-tablet {
    display: none
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #ppc_footer .row .logos .apps-tablet {
        display: block;
        margin-left: 3rem
    }
}

.ppc_section #ppc_footer .row .logos p {
    margin-bottom: 0;
    padding-left: 3rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc_section #ppc_footer .row .logos p {
        display: none
    }
}

.ppc_section #ppc_footer .row .socials {
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .ppc_section #ppc_footer .row .socials {
        display: none;
        justify-content: flex-end
    }
}

.ppc_section #ppc_footer .row .socials img {
    width: 60px;
    height: 22px
}

.ppc_section #ppc_footer .row .apps {
    display: flex;
    align-items: center;
    justify-content: space-evenly
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .ppc_section #ppc_footer .row .apps {
        margin-top: 2rem;
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #ppc_footer .row .apps a {
        display: none
    }
}

@media(max-width:767px) {
    .ppc_section #ppc_footer .row .apps a {
        margin-right: 3rem
    }
}

.ppc_section #ppc_footer .row .apps p {
    display: none
}

@media(min-width:768px) and (max-width:991px) {
    .ppc_section #ppc_footer .row .apps p {
        display: block;
        margin-right: 3rem
    }
}

.monitoring-ppc #top {
    background: 0 0
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #top {
        overflow-x: hidden
    }
}

.monitoring-ppc #top .ppc_top .wrapper:nth-of-type(1) {
    width: 90%
}

@media(max-width:767px) {
    .monitoring-ppc #top .ppc_top .wrapper:nth-of-type(2) {
        display: block
    }
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #top .ppc_top .wrapper:nth-of-type(2) {
        position: absolute;
        right: -16rem;
        bottom: -2rem
    }
}

.monitoring-ppc #top .ppc_top .wrapper h1 {
    width: 100%;
    font-size: 50px
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #top .ppc_top .wrapper h1 {
        width: 96%
    }
}

@media(max-width:767px) {
    .monitoring-ppc #top .ppc_top .wrapper h1 {
        font-size: 36px;
        padding-right: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #top .ppc_top .wrapper p {
        padding-right: 10rem
    }
}

@media(max-width:767px) {
    .monitoring-ppc #top .ppc_top .wrapper p {
        padding-right: 0
    }
}

.monitoring-ppc #mainFeatures {
    margin: 4rem 0
}

    .monitoring-ppc #mainFeatures .mainFeatures__head {
        text-align: center
    }

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .mainFeatures__head {
        margin-bottom: 2rem
    }
}

.monitoring-ppc #mainFeatures .mainFeatures__head h2 {
    font-size: 36px;
    font-family: lato,sans-serif;
    font-weight: 700;
    padding: 2rem 0
}

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .mainFeatures__head h2 {
        font-size: 28px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #mainFeatures .mainFeatures__head h2 {
        padding-right: 12rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #mainFeatures .mainFeatures__head h2 {
        padding-right: 0
    }
}

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .mainFeatures__head h2 {
        padding: 1rem 1rem 1rem 0;
        text-align: left
    }
}

.monitoring-ppc #mainFeatures .mainFeatures__head p {
    font-family: nunito sans,sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #767676
}

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .mainFeatures__head p {
        text-align: left
    }
}

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .mainFeatures__head--carousel {
        height: 200px
    }
}

.monitoring-ppc #mainFeatures .mainFeatures__head--carousel span {
    font-size: 36px;
    color: #f3f3f3
}

.monitoring-ppc #mainFeatures .carousel-caption {
    display: none !important
}

.monitoring-ppc #mainFeatures .carousel-control-prev {
    left: -140px
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #mainFeatures .carousel-control-prev {
        left: -60px
    }
}

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .carousel-control-prev {
        left: -1rem;
        bottom: 0
    }
}

.monitoring-ppc #mainFeatures .carousel-control-prev .carousel-control-prev-icon {
    background-image: url(/img/landing-page/emplyee-monitoring/navigation-carousel-prev.png) !important;
    width: 48px;
    height: 48px;
    background-size: 50% 100%
}

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .carousel-control-prev .carousel-control-prev-icon {
        width: 30px;
        height: 30px
    }
}

.monitoring-ppc #mainFeatures .carousel-control-next {
    right: -140px
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #mainFeatures .carousel-control-next {
        right: -60px
    }
}

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .carousel-control-next {
        right: -16px;
        bottom: 0
    }
}

.monitoring-ppc #mainFeatures .carousel-control-next .carousel-control-next-icon {
    background-image: url(/img/landing-page/emplyee-monitoring/navigation-carousel.png) !important;
    width: 48px;
    height: 48px;
    background-size: 50% 100%
}

@media(max-width:767px) {
    .monitoring-ppc #mainFeatures .carousel-control-next .carousel-control-next-icon {
        width: 30px;
        height: 30px
    }
}

.monitoring-ppc #bottomCta {
    margin: 6rem 0 -5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .monitoring-ppc #bottomCta {
        margin-bottom: -2rem
    }
}

.monitoring-ppc #bottomCta .row {
    padding: 4rem 0
}

    .monitoring-ppc #bottomCta .row .bottomCta__desc {
        display: flex;
        justify-content: space-between
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .monitoring-ppc #bottomCta .row .bottomCta__desc {
        flex-direction: column;
        align-items: center
    }
}

.monitoring-ppc #bottomCta .row .bottomCta__desc h2 {
    margin: 0;
    padding-left: 2rem;
    font-weight: 700;
    font-size: 48px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .monitoring-ppc #bottomCta .row .bottomCta__desc h2 {
        width: 100%;
        margin-bottom: 2rem;
        font-size: 36px;
        padding-left: 0
    }
}

.monitoring-ppc #bottomCta .row .bottomCta__desc .button-container {
    padding-right: 2rem
}

@media(max-width:767px) {
    .monitoring-ppc #bottomCta .row .bottomCta__desc .button-container {
        padding-right: 0
    }
}

.monitoring-ppc #bottomCta .row .bottomCta__desc .button-container .btn-filled {
    color: #fff
}

@media(max-width:767px) {
    .monitoring-ppc #bottomCta .row .bottomCta__desc .button-container .btn-filled {
        margin-bottom: 1rem
    }
}

.monitoring-ppc #bottomCta .row .bottomCta__desc .button-container .bottomCta__desc--custom-link {
    font-weight: 700;
    color: #ffc502;
    border-bottom: 1px solid #ffc502
}

.monitoring-ppc #mainBenefits {
    background-color: #ffc502
}

    .monitoring-ppc #mainBenefits .container {
        max-width: inherit;
        padding-right: 0
    }

        .monitoring-ppc #mainBenefits .container .row {
            flex-wrap: nowrap;
            align-items: center;
            margin-right: 0
        }

@media(max-width:767px) {
    .monitoring-ppc #mainBenefits .container .row {
        flex-direction: column
    }
}

.monitoring-ppc #mainBenefits .container .row .mainBenefits__list {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center
}

    .monitoring-ppc #mainBenefits .container .row .mainBenefits__list h2 {
        font-size: 36px;
        font-weight: 700;
        margin: 0 0 2rem 3rem;
        color: #fff;
        text-align: left !important
    }

@media(max-width:767px) {
    .monitoring-ppc #mainBenefits .container .row .mainBenefits__list h2 {
        text-align: center !important;
        margin: 0 0 2rem
    }
}

.monitoring-ppc #mainBenefits .container .row .mainBenefits__list ul {
    padding: 0;
    margin: 0
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #mainBenefits .container .row .mainBenefits__list ul {
        padding: 6rem 0
    }
}

@media(max-width:767px) {
    .monitoring-ppc #mainBenefits .container .row .mainBenefits__list ul {
        padding: 5rem 1rem 3rem
    }
}

.monitoring-ppc #mainBenefits .container .row .mainBenefits__list ul li {
    display: flex;
    list-style: none;
    margin-bottom: 1rem;
    align-items: center
}

    .monitoring-ppc #mainBenefits .container .row .mainBenefits__list ul li p {
        padding-left: 2rem;
        margin-bottom: 0;
        color: #fff;
        font-size: 18px;
        font-weight: 600
    }

.monitoring-ppc #mainBenefits .container .row .mainBenefits__img {
    flex: .7
}

    .monitoring-ppc #mainBenefits .container .row .mainBenefits__img img {
        padding-top: 10rem;
        width: 100%
    }

@media(max-width:767px) {
    .monitoring-ppc #mainBenefits .container .row .mainBenefits__img img {
        padding-top: 0;
        margin-bottom: -5rem
    }
}

.monitoring-ppc #mainSolution {
    margin: 5rem 0;
    background: linear-gradient(to top,#edeff5,#fff 115%)
}

@media(max-width:767px) {
    .monitoring-ppc #mainSolution {
        margin: 8rem 0 4rem
    }
}

.monitoring-ppc #mainSolution .container .row .mainSolution__head {
    text-align: center
}

    .monitoring-ppc #mainSolution .container .row .mainSolution__head h2 {
        font-weight: 700;
        font-size: 2rem;
        margin-top: 2rem
    }

@media(max-width:767px) {
    .monitoring-ppc #mainSolution .container .row .mainSolution__head h5 {
        text-align: center
    }
}

.monitoring-ppc #mainSolution .container .row .mainSolution__grid-container {
    display: flex;
    justify-content: center;
    margin: 6rem 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .monitoring-ppc #mainSolution .container .row .mainSolution__grid-container {
        flex-wrap: wrap;
        margin: 4rem 0
    }
}

.monitoring-ppc #mainSolution .container .row .mainSolution__grid-container .mainSolution__grid-container--single {
    align-items: center;
    text-align: center;
    padding: 30px 40px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #mainSolution .container .row .mainSolution__grid-container .mainSolution__grid-container--single {
        margin: 0 2rem 2rem 0 !important
    }
}

@media(max-width:767px) {
    .monitoring-ppc #mainSolution .container .row .mainSolution__grid-container .mainSolution__grid-container--single {
        margin: 2rem 0
    }
}

.monitoring-ppc #mainSolution .container .row .mainSolution__grid-container .mainSolution__grid-container--single h3 {
    font-size: 24px;
    font-weight: 600;
    margin: 20px 0
}

.monitoring-ppc #mainSolution .container .row .mainSolution__grid-container .special-magin {
    margin-right: 1.5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .monitoring-ppc #mainSolution .container .row .mainSolution__grid-container .special-magin {
        margin-right: 0
    }
}

.monitoring-ppc #mainEnterprisePrivacy .container .row {
    margin: 0
}

    .monitoring-ppc #mainEnterprisePrivacy .container .row:nth-last-of-type(1) {
        margin: 3rem 0
    }

@media(max-width:767px) {
    .monitoring-ppc #mainEnterprisePrivacy .container .row:nth-of-type(2) {
        flex-direction: column-reverse
    }
}

.monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description h5 {
    text-align: left
}

.monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description h3 {
    font-size: 36px;
    font-weight: 700;
    display: inline-block;
    width: 50%;
    margin: 2rem 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description h3 {
        width: 100%
    }
}

.monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description .mainEnterprisePrivacy__description--headingSpecial {
    width: 100%
}

.monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description ul {
    margin: 0;
    padding-left: 1rem
}

.monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description p {
    color: #767676;
    margin-top: 1rem
}

.monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description--icons {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    width: 70%
}

@media(min-width:768px) and (max-width:991px) {
    .monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description--icons {
        width: 100%
    }
}

@media(max-width:767px) {
    .monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description--icons {
        width: 90%
    }
}

.monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__description--icons span {
    color: #767676
}

.monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__img {
    text-align: left;
    margin: 2rem 0;
    padding-right: 3rem
}

    .monitoring-ppc #mainEnterprisePrivacy .container .row .mainEnterprisePrivacy__img img {
        width: 100%
    }

.monitoring-ppc #bottomCtaSpecial #bottomCta {
    margin: 6rem 0
}

.time-tracking-biz #mainNav .collapse {
    justify-content: flex-end
}

.time-tracking-biz section#top:before {
    content: "";
    opacity: .92;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    background-color: #fff
}

.time-tracking-biz section#top {
    padding: 12rem 0 3rem;
    position: relative;
    background-image: url(/img/landing-page/time-tracking-biz/heroBg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center
}

    .time-tracking-biz section#top .container .row .col-lg-12 h1 {
        font-weight: 500;
        text-align: center;
        font-size: 36px;
        width: 100%
    }

    .time-tracking-biz section#top .container .row .col-lg-12 h2 {
        font-size: 18px;
        text-align: center;
        width: 47%;
        margin: 0 auto;
        font-weight: 600;
        padding: 1rem 0 3rem
    }

    .time-tracking-biz section#top .container .row .check-wrapper {
        width: 80%;
        margin: 0 auto 3rem;
        display: flex;
        justify-content: space-between
    }

@media(max-width:767px) {
    .time-tracking-biz section#top .container .row .check-wrapper {
        width: 100%
    }
}

.time-tracking-biz section#top .container .row .check-wrapper .checks {
    align-items: center;
    display: flex
}

    .time-tracking-biz section#top .container .row .check-wrapper .checks p {
        font-size: 18px;
        width: 100%;
        color: #ffc502;
        font-weight: 600;
        margin-bottom: 0;
        margin-left: 10px
    }

    .time-tracking-biz section#top .container .row .check-wrapper .checks .fas {
        margin-right: .5rem;
        color: #00bf71
    }

.time-tracking-biz section#top .container .form {
    width: 60%;
    margin: 0 auto
}

    .time-tracking-biz section#top .container .form .form-wrapper input {
        border: none;
        outline: none
    }

        .time-tracking-biz section#top .container .form .form-wrapper input[type=email] {
            border-radius: 26px;
            box-shadow: 0 0 0 3px #00bf71
        }

            .time-tracking-biz section#top .container .form .form-wrapper input[type=email]:hover {
                box-shadow: 0 0 0 3px #00bf71
            }

@media(max-width:767px) {
    .time-tracking-biz section#top .container .form .form-wrapper input[type=email] {
        margin-bottom: 1rem;
        width: 100%
    }
}

.time-tracking-biz section#top .container .form .form-wrapper button {
    padding: 16px 0;
    color: #fff;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #00bf71;
    position: relative;
    left: -3rem
}

@media(max-width:767px) {
    .time-tracking-biz section#top .container .form .form-wrapper button {
        left: 0
    }
}

.time-tracking-biz section#top .container .form .form-wrapper button:hover {
    color: #000;
    box-shadow: 0 0 0 3px #00bf71
}

.time-tracking-biz section#top .container .form p.terms-submission {
    margin: 8px 0;
    font-size: 11px;
    color: #1b1b20;
    opacity: .6;
    width: 100%
}

    .time-tracking-biz section#top .container .form p.terms-submission label {
        display: flex
    }

@media(max-width:767px) {
    .time-tracking-biz section#top .container .form p.terms-submission label {
        flex-wrap: wrap
    }
}

.time-tracking-biz section#top .container .form p.terms-submission label:hover {
    cursor: pointer
}

.time-tracking-biz section#top .container .form p.terms-submission label input {
    margin-right: .3rem
}

.time-tracking-biz section#top .container .form p.terms-submission a {
    color: #1b1b20;
    text-decoration: underline;
    margin: 0 2px;
    font-weight: 600
}

.time-tracking-biz section#social-proof .container .row .col-sm-12 h2:before {
    margin-left: -20.7rem
}

.time-tracking-biz section#social-proof .container .row .col-sm-12 h2:after {
    margin-left: .7rem;
    width: 20rem
}

.time-tracking-biz section#quick-look .container .row .col-sm-12 h2.header {
    font-size: 36px;
    font-weight: 700
}

.time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle {
    margin-bottom: 1rem;
    position: relative
}

    .time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle p.green {
        font-size: 24px;
        font-weight: 800;
        color: #00bf71;
        margin: 0;
        position: relative;
        z-index: 1
    }

    .time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle.second:after, .time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle.second:before {
        content: "";
        display: block;
        position: absolute;
        width: 15vw;
        height: 7px;
        top: 50%;
        background-color: #f3f3f3;
        transform: translateY(-50%);
        z-index: 0
    }

@media(min-width:1024px) and (max-width:1477px) {
    .time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle.second:after, .time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle.second:before {
        width: 19vw
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle.second:after, .time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle.second:before {
        display: none
    }
}

.time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle.second:after {
    right: 64px
}

.time-tracking-biz section#quick-look .container .row .col-lg-3 div.circle.second:before {
    left: 64px
}

.time-tracking-biz section#quick-look .container .row .col-lg-3 h2 {
    font-size: 21px;
    font-weight: 600;
    font-family: nunito sans,sans-serif
}

.time-tracking-biz section#reviews {
    background-color: #f3f3f3;
    padding: 5rem 0
}

    .time-tracking-biz section#reviews .customer-review {
        margin-bottom: 2rem
    }

@media(max-width:991px) {
    .time-tracking-biz section#reviews .customer-review .row {
        width: 100%
    }
}

.time-tracking-biz section#reviews .customer-review .row .col-lg-4 {
    margin-bottom: 2rem
}

    .time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content {
        flex-direction: column;
        justify-content: center;
        border: solid 1px rgba(27,27,32,.05);
        background-color: #fff;
        display: flex;
        align-items: center;
        text-align: center;
        padding: 2rem;
        border-radius: 8px
    }

        .time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content img {
            width: 40%;
            padding-bottom: 1rem
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content img {
        display: none
    }
}

.time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 1rem
}

.time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content p {
    font-size: 16px;
    font-weight: 600;
    opacity: .6
}

.time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content hr {
    border: solid 1px #979797;
    width: 20%
}

.time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content p.green {
    font-size: 14px;
    font-weight: 600;
    color: #00bf71
}

@media(max-width:767px) {
    .time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content h3, .time-tracking-biz section#reviews .customer-review .row .col-lg-4 div.content p {
        font-size: 18px
    }
}

.time-tracking-biz section#big_cta .row .col-sm-12 a {
    color: #1b1b20
}

.time-tracking-biz .feature-section {
    max-width: 100%
}

    .time-tracking-biz .feature-section .row {
        width: 85%;
        margin: 0 auto;
        justify-content: space-between
    }

    .time-tracking-biz .feature-section .col-lg-4 {
        margin-bottom: 10rem;
        display: flex;
        flex-direction: column;
        justify-content: center
    }

        .time-tracking-biz .feature-section .col-lg-4 .text {
            text-align: left
        }

            .time-tracking-biz .feature-section .col-lg-4 .text h3 {
                margin-bottom: 1.5rem;
                font-size: 24px;
                font-weight: 700
            }

            .time-tracking-biz .feature-section .col-lg-4 .text p {
                margin-bottom: 2rem
            }

                .time-tracking-biz .feature-section .col-lg-4 .text p.spanHeader {
                    margin-bottom: 0
                }

            .time-tracking-biz .feature-section .col-lg-4 .text div.spanWrapper {
                display: flex;
                flex-direction: column
            }

                .time-tracking-biz .feature-section .col-lg-4 .text div.spanWrapper span i {
                    color: #00bf71
                }

    .time-tracking-biz .feature-section .col-lg-6 {
        text-align: center
    }

        .time-tracking-biz .feature-section .col-lg-6 img {
            width: 100%
        }

@media(max-width:938px) {
    .time-tracking-biz .feature-section .col-lg-6 img {
        width: 100%
    }
}

.time-tracking-biz .feature-section .col-sm-12 {
    text-align: center;
    margin-top: 2rem;
    margin-bottom: 7rem
}

.time-tracking-biz .feature-section h2 {
    font-size: 36px;
    font-weight: 700
}

.time-tracking-biz .feature-section p {
    font-size: 18px;
    font-weight: 600
}

.time-tracking-biz section#compare {
    padding-top: 0
}

.time-tracking-biz #bottomCta {
    margin: 0;
    background-color: #f3f3f3
}

.self_hosted {
    background-color: #fcfcfd
}

    .self_hosted .is_logged {
        display: none
    }

    .self_hosted section.budget-section .col-lg-6 {
        display: flex;
        flex-direction: column;
        justify-content: center
    }

        .self_hosted section.budget-section .col-lg-6 p {
            font-size: 22px;
            font-weight: 400;
            color: #4a5673
        }

        .self_hosted section.budget-section .col-lg-6 ul {
            padding-left: 0
        }

            .self_hosted section.budget-section .col-lg-6 ul li {
                list-style-type: none;
                font-size: 22px;
                font-weight: 400;
                color: #4a5673;
                margin-bottom: 2px
            }

    .self_hosted section.budget-section .img img {
        width: 100%
    }

    .self_hosted section.budget-section h2 {
        margin-top: 45px;
        margin-bottom: 50px;
        font-size: 40px;
        font-weight: 400;
        color: #0a1940
    }

    .self_hosted section.metrics-section {
        margin-top: 5rem
    }

        .self_hosted section.metrics-section div.col-lg-4, .self_hosted section.metrics-section div.col-lg-6:not(.img) {
            align-items: center;
            display: flex;
            flex-direction: column;
            margin-bottom: 3rem
        }

            .self_hosted section.metrics-section div.col-lg-4 img, .self_hosted section.metrics-section div.col-lg-6:not(.img) img {
                width: 153px;
                margin-bottom: 2rem
            }

            .self_hosted section.metrics-section div.col-lg-4 h3, .self_hosted section.metrics-section div.col-lg-6:not(.img) h3 {
                font-size: 28px;
                color: #0a1940;
                margin-top: 1.5rem;
                margin-bottom: 2rem;
                font-weight: 400;
                text-align: center
            }

                .self_hosted section.metrics-section div.col-lg-4 h3.left, .self_hosted section.metrics-section div.col-lg-6:not(.img) h3.left {
                    text-align: left;
                    width: 100%
                }

            .self_hosted section.metrics-section div.col-lg-4 p, .self_hosted section.metrics-section div.col-lg-6:not(.img) p {
                font-weight: 400;
                text-align: center;
                font-size: 20px;
                color: #4a5673
            }

                .self_hosted section.metrics-section div.col-lg-4 p.left, .self_hosted section.metrics-section div.col-lg-6:not(.img) p.left {
                    text-align: left
                }

            .self_hosted section.metrics-section div.col-lg-4 ul, .self_hosted section.metrics-section div.col-lg-6:not(.img) ul {
                padding-left: 0
            }

                .self_hosted section.metrics-section div.col-lg-4 ul li, .self_hosted section.metrics-section div.col-lg-6:not(.img) ul li {
                    list-style-type: none;
                    margin-bottom: 2px;
                    color: #4a5673
                }

        .self_hosted section.metrics-section .img {
            display: flex;
            flex-direction: row;
            justify-content: space-evenly;
            align-items: center
        }

    .self_hosted section.signup-promo .box {
        background: linear-gradient(98.7deg,#ffe876 20.93%,#f5cc63 95.8%);
        border-radius: 98px;
        padding: 50px;
        text-align: center;
        margin: 5rem auto 2rem;
        position: relative
    }

        .self_hosted section.signup-promo .box h2 {
            font-weight: 400;
            font-size: 40px;
            line-height: 130%;
            text-align: center;
            color: #0a1940
        }

        .self_hosted section.signup-promo .box p {
            font-weight: 400;
            font-size: 18px;
            line-height: 26px;
            text-align: center;
            color: #4a5673;
            width: 100%;
            margin-top: 15px
        }

        .self_hosted section.signup-promo .box a {
            background: linear-gradient(180deg,#ffc502 0%,#00bf71 100%);
            box-shadow: 0 15px 61px rgba(0,0,0,.2);
            border-radius: 32px;
            padding: 17px 30px;
            color: #fff;
            text-align: center;
            font-size: 18px;
            display: inline-block;
            font-weight: 400
        }

            .self_hosted section.signup-promo .box a:hover {
                background: linear-gradient(180deg,#1da44c 0%,#008c53 100%)
            }

    .self_hosted #integrations-old {
        padding: 7rem 0 2rem;
        margin-bottom: 9rem;
        position: relative
    }

        .self_hosted #integrations-old .container .row {
            justify-content: center
        }

@media(max-width:991px) {
    .self_hosted #integrations-old .container .row {
        flex-direction: column
    }
}

.self_hosted #integrations-old .container .row .col-lg-7 {
    justify-content: center;
    display: flex;
    flex-direction: column
}

    .self_hosted #integrations-old .container .row .col-lg-7 h2 {
        font-size: 40px;
        font-weight: 400;
        margin: 0 0 2rem;
        color: #0a1940;
        text-align: left
    }

    .self_hosted #integrations-old .container .row .col-lg-7 p {
        font-weight: 400;
        font-size: 20px;
        color: #4a5673;
        margin: 0;
        text-align: left
    }

    .self_hosted #integrations-old .container .row .col-lg-7 .btn-filled {
        font-size: 16px;
        font-weight: 800;
        margin-top: 2rem;
        width: fit-content
    }

@media(max-width:767px) {
    .self_hosted #integrations-old .container .row .col-lg-7 .btn-filled {
        margin: 2rem auto
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .self_hosted #integrations-old .container .row .col-lg-7 {
        text-align: center
    }

        .self_hosted #integrations-old .container .row .col-lg-7 h2 {
            width: 100%;
            margin: 1rem auto
        }
}

.self_hosted #integrations-old .container .row .col-lg-5 .wrapper {
    display: flex;
    justify-content: space-evenly
}

    .self_hosted #integrations-old .container .row .col-lg-5 .wrapper a {
        width: 60px;
        height: 60px;
        border-radius: 8px;
        background-color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 2rem
    }

        .self_hosted #integrations-old .container .row .col-lg-5 .wrapper a img {
            width: 30px;
            height: 30px
        }

.self_hosted #mainNav {
    background: linear-gradient(180deg,#e9eff9 0%,rgba(246,249,250,0) 100%)
}

    .self_hosted #mainNav .collapse .menu-1 li.nav-item {
        margin-left: 1rem
    }

        .self_hosted #mainNav .collapse .menu-1 li.nav-item a.nav-link {
            color: #4a5673
        }

            .self_hosted #mainNav .collapse .menu-1 li.nav-item a.nav-link:hover {
                color: #0e1016
            }

    .self_hosted #mainNav.navbar-shrink {
        background: #fff;
        box-shadow: 0 4px 39px rgba(214,231,255,.7)
    }

.self_hosted a.navbar-shrink-button {
    background: linear-gradient(192.53deg,#ffe876 9.04%,#f5cc63 90.85%);
    box-shadow: 0 15px 26px rgba(255,199,0,.15);
    border-radius: 31px;
    border-color: #f5cc63 !important;
    transition: background-color 2s
}

    .self_hosted a.navbar-shrink-button:hover {
        background: linear-gradient(180deg,#ffdf43 20.93%,#f2bc33 95.8%) !important
    }

.self_hosted #top_test {
    background: linear-gradient(100.15deg,#e7f3ff 7%,#f3f9ff 98.51%);
    padding-top: 3rem;
    padding-bottom: 1rem;
    margin: 0 auto;
    border-radius: 0 0 80px 80px
}

    .self_hosted #top_test .container {
        padding: 3rem 0 0
    }

@media(max-width:767px) {
    .self_hosted #top_test .container .form {
        margin-bottom: 35px;
        text-align: center
    }
}

.self_hosted #top_test .container .row {
    justify-content: space-between
}

@media(max-width:767px) {
    .self_hosted #top_test .container .row {
        margin: 0 auto
    }
}

.self_hosted #top_test .container .row h1 {
    margin: 0 auto 1.25rem;
    font-size: 50px;
    line-height: 70px;
    font-weight: 700;
    text-align: left;
    color: #0a1940;
    width: 100%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .self_hosted #top_test .container .row h1 {
        width: 100%;
        text-align: center
    }
}

.self_hosted #top_test .container .row p {
    font-size: 24px;
    font-weight: 400;
    color: #4a5673;
    margin: 0 auto 2.25rem 0;
    text-align: left;
    line-height: 30px;
    width: 88%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .self_hosted #top_test .container .row p {
        width: 100%;
        text-align: center
    }
}

.self_hosted #top_test .container .row a {
    padding: 18px 44px;
    width: auto;
    display: inline-block;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    box-shadow: 0 0 0 3px #00bf71;
    border: 1px solid rgba(31,225,73,.3);
    box-shadow: 0 15px 32px #bcd1ee;
    border-radius: 32px;
    background: linear-gradient(180deg,#ffc502 0%,#00bf71 100%);
    box-shadow: 0 15px 61px #bcd1ee
}

@media(max-width:767px) {
    .self_hosted #top_test .container .row a {
        left: 0
    }
}

.self_hosted #top_test .container .row a:hover {
    background-color: #00a662;
    background: linear-gradient(180deg,#21b956 0%,#00a662 100%)
}

.self_hosted #top_test .container .row .img img {
    width: 125%
}

@media(max-width:767px) {
    .self_hosted #top_test .container .row .img img {
        width: 100%
    }
}

.self_hosted #social-proof {
    padding-bottom: 5rem
}

    .self_hosted #social-proof .container .row {
        padding-top: 2rem;
        padding-bottom: 1rem;
        display: flex;
        border-bottom: none
    }

        .self_hosted #social-proof .container .row .col-sm-12 h2 {
            font-size: 24px;
            font-weight: 400;
            text-align: center;
            color: #4a5673
        }

            .self_hosted #social-proof .container .row .col-sm-12 h2::after, .self_hosted #social-proof .container .row .col-sm-12 h2::before {
                content: none
            }

        .self_hosted #social-proof .container .row .col-md-4 {
            text-align: center;
            margin: 1rem 0;
            align-items: center;
            display: flex;
            justify-content: center;
            flex-direction: column
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .self_hosted #social-proof .container .row .col-md-4 {
        margin: 20px 0
    }
}

@media(max-width:767px) {
    .self_hosted #social-proof .container .row .col-md-4 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }
}

.self_hosted #social-proof .container .row .col-md-4 .smaller {
    width: 60%
}

@media(max-width:767px) {
    .self_hosted #social-proof .container .row .col-md-4 .smaller {
        width: 30%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .self_hosted #social-proof .container .row .col-md-4 .bigger, .self_hosted #social-proof .container .row .col-md-4 .usp, .self_hosted #social-proof .container .row .col-md-4 .dsv {
        width: 25%
    }
}

.self_hosted section#award {
    margin: 4rem auto 6rem
}

    .self_hosted section#award .container .row .col-sm-12 h2 {
        width: 93%;
        margin: 0 auto;
        font-size: 40px;
        font-weight: 400;
        text-align: center;
        color: #0a1940
    }

@media(max-width:767px) {
    .self_hosted section#award .container .row .col-sm-12 h2 {
        width: 100%;
        margin: 20px auto
    }
}

.self_hosted section#award .container .row .col-sm-12 p {
    font-size: 18px;
    font-weight: 400;
    text-align: center;
    width: 69%;
    margin: 0 auto 1rem;
    color: #4a5673
}

.self_hosted section#award .container .row .header_imgs {
    display: flex;
    justify-content: space-evenly;
    margin-bottom: 1rem
}

@media(max-width:767px) {
    .self_hosted section#award .container .row .header_imgs {
        flex-direction: column
    }
}

.self_hosted section#award .container .row .header_imgs .wrapper {
    text-align: left
}

@media(max-width:767px) {
    .self_hosted section#award .container .row .header_imgs .wrapper {
        display: flex;
        flex-direction: column;
        align-items: center
    }
}

.self_hosted section#award .container .row .header_imgs .wrapper.right {
    text-align: end
}

section#footer {
    padding: 2rem 0;
    background: #f2f8ff;
    border-radius: 98px 98px 0 0
}

    section#footer .container .row {
        justify-content: space-between
    }

@media(max-width:767px) {
    section#footer .container .row {
        flex-direction: column;
        align-items: center
    }
}

section#footer .container .row p {
    margin-bottom: 0;
    color: #4a5673
}

section#footer .container .row .socials a:nth-of-type(2) {
    margin: 0 1rem
}

.web_apps main {
    border-radius: 26px;
    padding: 2rem 8rem;
    box-shadow: 0 4px 10px 2px rgba(0,0,0,.17)
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .web_apps main {
        padding: 2rem;
        margin: 0 1rem
    }
}

.web_apps main a.btn-filled {
    color: #fff;
    box-shadow: 4px 4px 12px 0 rgba(37,207,96,.5)
}

    .web_apps main a.btn-filled:hover {
        cursor: pointer
    }

.web_apps main #hoursWorkedText {
    font-size: 16px;
    color: #767676;
    font-weight: 700
}

.web_apps main .result-row {
    justify-content: center
}

    .web_apps main .result-row .cols {
        display: flex;
        align-items: center;
        margin-right: 2rem
    }

@media(max-width:767px) {
    .web_apps main .result-row .cols {
        margin-bottom: 2rem;
        margin-right: 0
    }
}

@media(max-width:767px) {
    .web_apps main #form .form-group {
        display: grid
    }
}

.web_apps main #form .form-group .form-control {
    border: none;
    text-align: center;
    background-color: #e9e9e9;
    color: #767676;
    border-radius: 8px
}

@media(max-width:767px) {
    .web_apps main .table thead tr {
        display: none
    }
}

.web_apps main .table thead tr th {
    border-bottom: none;
    border-top: 1px solid #767676;
    color: #767676;
    font-weight: 400;
    text-align: center
}

@media(max-width:767px) {
    .web_apps main .table thead tr th {
        border-top: none
    }
}

.web_apps main .table tbody tr {
    background-color: transparent
}

@media(max-width:767px) {
    .web_apps main .table tbody tr {
        display: grid;
        border-bottom: 1px solid #767676
    }
}

.web_apps main .table tbody tr td {
    color: #767676;
    font-weight: 400;
    text-align: center
}

@media(max-width:767px) {
    .web_apps main .table tbody tr td {
        display: flex;
        justify-content: space-between;
        border-top: 0
    }

        .web_apps main .table tbody tr td:nth-of-type(1)::before {
            content: "Day"
        }

        .web_apps main .table tbody tr td:nth-of-type(2)::before {
            content: "Date"
        }

        .web_apps main .table tbody tr td:nth-of-type(3)::before {
            content: "Start Time"
        }

        .web_apps main .table tbody tr td:nth-of-type(4)::before {
            content: "Finish Time"
        }

        .web_apps main .table tbody tr td:nth-of-type(5)::before {
            content: "Break"
        }

        .web_apps main .table tbody tr td:nth-of-type(6)::before {
            content: "Hours Worked"
        }
}

.web_apps main .table tbody tr td input, .web_apps main .table tbody tr td select {
    border: none;
    text-align: center;
    background-color: #e9e9e9;
    color: #767676;
    border-radius: 8px
}

@media(max-width:767px) {
    .web_apps main .table tbody tr td input, .web_apps main .table tbody tr td select {
        width: 60%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps main .table tbody tr td input, .web_apps main .table tbody tr td select {
        width: 100px
    }
}

.web_apps main .table tbody tr td input:focus-visible, .web_apps main .table tbody tr td select:focus-visible {
    outline-color: #767676
}

.web_apps section#top {
    padding: 0 0 3rem
}

@media(max-width:767px) {
    .web_apps section#top {
        padding: 0;
        padding-bottom: 2rem
    }
}

.web_apps section#top .container .row .col-sm-12 h1 {
    font-size: 36px;
    font-weight: 800;
    text-align: center;
    margin: 5rem auto 4rem;
    width: 70%
}

.web_apps section#top .container .ppc_top {
    display: flex
}

@media(max-width:767px) {
    .web_apps section#top .container .ppc_top {
        flex-direction: column
    }
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps section#top .container .ppc_top {
        flex-direction: row
    }
}

.web_apps section#top .container .ppc_top .calculator-header {
    font-weight: 800;
    font-size: 52px;
    width: 100%
}

@media(max-width:767px) {
    .web_apps section#top .container .ppc_top .calculator-header {
        text-align: left;
        font-size: 48px;
        padding-right: 3rem
    }
}

.web_apps section#top .container .ppc_top .calculator-header span {
    color: #ffc502
}

.web_apps section#top .container .ppc_top .bottom {
    font-size: 36px
}

.web_apps section#top .container .ppc_top .wrapper:nth-of-type(1) {
    flex: .5;
    padding-top: 5rem
}

@media(max-width:767px) {
    .web_apps section#top .container .ppc_top .wrapper:nth-of-type(1) {
        padding-top: 2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps section#top .container .ppc_top .wrapper:nth-of-type(1) {
        flex: .7;
        padding-top: 4rem
    }
}

.web_apps section#top .container .ppc_top .roi-calculator:nth-of-type(1) {
    flex: 1
}

.web_apps section#top .container .ppc_top .roi-calculator:nth-of-type(2) {
    display: flex;
    align-items: center
}

.web_apps section#top .container .ppc_top .wrapper:nth-of-type(2) {
    flex: .6;
    margin-left: 7%
}

    .web_apps section#top .container .ppc_top .wrapper:nth-of-type(2) .img-content {
        margin-top: 3rem
    }

@media(max-width:767px) {
    .web_apps section#top .container .ppc_top .wrapper:nth-of-type(2) {
        display: none;
        margin-left: 0;
        margin-top: 3rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps section#top .container .ppc_top .wrapper:nth-of-type(2) {
        flex: .3;
        margin-top: 10rem
    }
}

.web_apps section#top .container .ppc_top .wrapper:nth-of-type(2) .image-desktop-top {
    display: block
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .web_apps section#top .container .ppc_top .wrapper:nth-of-type(2) .image-desktop-top {
        display: none
    }
}

.web_apps section#top .container .ppc_top .wrapper:nth-of-type(2) .image-tablet-top {
    display: none
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps section#top .container .ppc_top .wrapper:nth-of-type(2) .image-tablet-top {
        display: block
    }
}

.web_apps section#top .container .ppc_top p {
    font-size: 24px;
    font-family: nunito sans,sans-serif;
    font-weight: 600;
    line-height: 1.42;
    margin: 2rem 0;
    color: #767676
}

@media(max-width:767px) {
    .web_apps section#top .container .ppc_top p {
        font-size: 18px;
        padding-right: 1rem;
        margin: 2rem 0;
        line-height: 1.89
    }
}

.web_apps .calculator {
    font-family: nunito sans,sans-serif
}

    .web_apps .calculator .cc__title-title, .web_apps .calculator .cc__formula-title {
        font-size: 1.5rem;
        color: #1b1b20;
        font-weight: 700
    }

    .web_apps .calculator .cc__question-title, .web_apps .calculator .cc__formula-description, .web_apps .calculator .aYpiA {
        font-size: 1rem;
        font-weight: 400;
        color: #767676;
        margin-bottom: 1rem !important;
        font-family: nunito sans,sans-serif
    }

    .web_apps .calculator .bcIfGG p {
        padding: 2rem 0 1rem 2rem
    }

    .web_apps .calculator .bcIfGG h3 {
        padding-left: 2rem !important
    }

    .web_apps .calculator .cfumta {
        padding: 0 !important
    }

    .web_apps .calculator .glCyro {
        padding-top: 2rem;
        flex-basis: calc(60% - var(--gap,0rem)) !important
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .web_apps .calculator .cMygpM {
        padding: 0 2rem
    }
}

@media(max-width:767px) {
    .web_apps .calculator .TvUMq {
        padding-left: 0
    }
}

@media(max-width:767px) {
    .web_apps .calculator .cc__calculator__container {
        flex-direction: column
    }
}

@media(max-width:767px) {
    .web_apps .calculator .cc__calculator__column {
        width: 100%;
        max-width: 100%;
        padding: 0
    }
}

.web_apps .calculator .gXDDaB {
    color: #767676
}

.web_apps .calculator .gBymOY {
    border-right: 1px solid #767676
}

.web_apps .calculator .eWkmlB {
    margin-bottom: 3rem
}

.web_apps .calculator .cc__formula-description {
    padding: 1rem 5rem 0 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .web_apps .calculator .cc__formula-description {
        padding: 0
    }
}

.web_apps .calculator .cc__formula-result {
    padding: 1rem 0
}

.web_apps .calculator .cc__text-element {
    font-family: nunito sans,sans-serif;
    padding-right: 5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .web_apps .calculator .cc__text-element {
        padding: 0
    }
}

.web_apps .calculator .cc__icon-button {
    display: none
}

.web_apps .calculator .bxBTup {
    display: block
}

.web_apps .calculator .cc__number-question-input {
    border: none;
    text-align: center;
    background-color: #e9e9e9 !important;
    color: #767676 !important;
    border-radius: 8px !important;
    width: 50%
}

@media(max-width:767px) {
    .web_apps .calculator .cc__number-question-input {
        width: 100%
    }
}

.web_apps .calculator .cc__number-question-input:focus-visible {
    outline-color: #767676
}

.web_apps .calculator .kogIvt {
    border: none;
    border-left: 1px solid #767676 !important;
    flex-basis: calc(40% - var(--gap,0rem)) !important
}

.web_apps .calculator .cc__link-button {
    background-color: #ffc502;
    border-radius: 26px;
    color: #fff;
    font-weight: 700
}

.web_apps #copy_faq {
    margin-top: 3rem;
    padding-bottom: 6rem;
    background-color: #fff;
    background-image: linear-gradient(180deg,#fff 0%,#f3f3f3 34%)
}

@media(max-width:767px) {
    .web_apps #copy_faq {
        padding-bottom: 8rem
    }
}

.web_apps #copy_faq .accordion-section {
    margin: 3rem 0
}

    .web_apps #copy_faq .accordion-section h2 {
        text-align: center
    }

@media(max-width:767px) {
    .web_apps #copy_faq .accordion-section h2 {
        text-align: left;
        font-weight: 700
    }
}

.web_apps #copy_faq .accordion-section .panel-group {
    margin-top: 3rem
}

    .web_apps #copy_faq .accordion-section .panel-group .panel-default {
        border-top: 1px solid #767676;
        padding: 1.2rem 0
    }

        .web_apps #copy_faq .accordion-section .panel-group .panel-default .panel-body {
            padding-left: 3rem;
            font-size: 1rem;
            line-height: 1.63
        }

        .web_apps #copy_faq .accordion-section .panel-group .panel-default .panel-title h3 {
            margin: 0
        }

        .web_apps #copy_faq .accordion-section .panel-group .panel-default .panel-title a {
            display: block;
            font-family: nunito sans,sans-serif;
            font-size: 1.5rem;
            font-weight: 600
        }

            .web_apps #copy_faq .accordion-section .panel-group .panel-default .panel-title a::before {
                font-family: "font awesome 5 free";
                font-style: normal;
                font-size: 16px;
                padding-top: 5px;
                font-weight: 600;
                content: "\f068";
                margin-right: 2rem;
                color: #767676;
                float: left
            }

@media(max-width:767px) {
    .web_apps #copy_faq .accordion-section .panel-group .panel-default .panel-title a::before {
        height: 4rem
    }
}

.web_apps #copy_faq .accordion-section .panel-group .panel-default .panel-title a.collapsed::before {
    content: "\f067"
}

.web_apps section#app {
    margin: 5rem auto
}

    .web_apps section#app .container .row {
        justify-content: center
    }

@media(max-width:767px) {
    .web_apps section#app .container .row {
        margin: 2rem
    }
}

.web_apps section#app .container .row .col-lg-10 {
    box-shadow: 0 0 10px rgba(100,100,100,.2);
    border-radius: 20px;
    padding: 3rem 1.2rem
}

@media(max-width:767px) {
    .web_apps section#app .container .row .col-lg-10 {
        padding: 30px
    }
}

.web_apps section#sign-up-cta {
    margin-bottom: 5rem;
    margin-top: 7rem
}

    .web_apps section#sign-up-cta .container .row {
        justify-content: center
    }

        .web_apps section#sign-up-cta .container .row .schedule-demo-par {
            margin-bottom: 2rem
        }

.web_apps #big_cta {
    padding-bottom: 0;
    padding-top: 0;
    margin-top: -5rem;
    position: relative;
    overflow: hidden
}

@media(max-width:767px) {
    .web_apps #big_cta {
        font-size: 13px
    }
}

.web_apps #big_cta .row {
    position: relative
}

@media(max-width:767px) {
    .web_apps #big_cta .row {
        margin-right: 0;
        margin-left: 0
    }
}

.web_apps #big_cta .container {
    background-color: #000;
    border-radius: 20px
}

    .web_apps #big_cta .container .big_cta_img {
        margin: 0 0 -20px -20px
    }

@media(max-width:767px) {
    .web_apps #big_cta .container .big_cta_img {
        position: absolute;
        left: 12rem;
        top: 12rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps #big_cta .container .big_cta_img {
        position: relative;
        left: 16rem;
        top: 6rem
    }
}

.web_apps #big_cta .container .big_cta_img img {
    overflow: hidden
}

@media(max-width:767px) {
    .web_apps #big_cta .container .big_cta_img img {
        width: 70%
    }
}

.web_apps #big_cta .container .text-cta {
    display: flex;
    padding-left: 4rem;
    z-index: 1;
    flex-direction: column;
    justify-content: space-evenly
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps #big_cta .container .text-cta {
        position: absolute;
        padding: 3rem 0 3rem 2rem
    }
}

@media(max-width:767px) {
    .web_apps #big_cta .container .text-cta {
        overflow-x: hidden;
        position: static;
        padding-left: 2rem
    }
}

@media(max-width:767px) {
    .web_apps #big_cta .container .text-cta .paragraph-text {
        margin-bottom: 3rem
    }
}

.web_apps #big_cta .container .text-cta .paragraph-text p span {
    font-weight: 700;
    color: #ffc502
}

.web_apps #big_cta .container .text-cta .links-cta {
    padding-bottom: 3rem
}

.web_apps #big_cta .container .text-cta h2 {
    font-size: 48px;
    font-weight: 700;
    color: #fff
}

@media(max-width:767px) {
    .web_apps #big_cta .container .text-cta h2 {
        font-size: 36px;
        padding-top: 2rem;
        padding-right: 3rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps #big_cta .container .text-cta h2 {
        padding-top: 2rem
    }
}

.web_apps #big_cta .container .text-cta p {
    font-size: 18px;
    font-weight: 600;
    padding: 1rem 0;
    color: #fff
}

@media(max-width:767px) {
    .web_apps #big_cta .container .text-cta p {
        font-size: 16px;
        padding-right: 4rem;
        line-height: 36px
    }
}

.web_apps .copy-content {
    justify-content: center;
    display: flex;
    flex-direction: row;
    background-color: #f3f3f3;
    padding-bottom: 4rem
}

    .web_apps .copy-content .copy-text h2 {
        font-size: 36px;
        padding: 2rem 18rem;
        color: #1b1b20;
        font-weight: 700;
        text-align: center
    }

@media(min-width:992px) and (max-width:1440px) {
    .web_apps .copy-content .copy-text h2 {
        padding: 2rem 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    .web_apps .copy-content .copy-text h2 {
        padding: 2rem 8rem
    }
}

@media(max-width:767px) {
    .web_apps .copy-content .copy-text h2 {
        padding: 2rem 0 2rem 1rem;
        text-align: left
    }
}

.web_apps .copy-content .copy-text p {
    padding: 0 10rem
}

@media(min-width:992px) and (max-width:1440px) {
    .web_apps .copy-content .copy-text p {
        padding: 0 2rem
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .web_apps .copy-content .copy-text p {
        padding: 0 3rem
    }
}

@media(max-width:767px) {
    .web_apps .copy-content .copy-text p {
        padding: 0 1rem
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .web_apps .copy-content .copy-img {
        display: none
    }
}

.web_apps .copy-content .copy-img img {
    position: relative;
    right: 4rem;
    top: -4rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .web_apps .copy-content .copy-img-second {
        display: none
    }
}

.web_apps .copy-content .copy-img-second img {
    position: relative;
    bottom: -9rem
}

@media print {
    .web_apps #mainNav, .web_apps footer, .web_apps a.btn-filled.green, .web_apps section#sign-up-cta {
        display: none
    }
}

.glow-on-hover {
    margin-top: 1rem;
    background-color: #ffc502;
    border: none;
    outline: none;
    color: #fff;
    cursor: pointer;
    font-weight: 700;
    position: relative;
    z-index: 1;
    border-radius: 26px
}

    .glow-on-hover::before {
        content: '';
        background-image: linear-gradient(315deg,#29e76c 0%,#ffc502 100%);
        position: absolute;
        top: 3px;
        left: 3px;
        background-size: 200%;
        z-index: -1;
        filter: blur(5px);
        width: calc(100%);
        height: calc(100% + 4px);
        animation: glowing 20s linear infinite;
        opacity: 1;
        transition: opacity .3s ease-in-out;
        border-radius: 26px
    }

    .glow-on-hover::after {
        z-index: -1;
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        background: #ffc502;
        left: 0;
        top: 0;
        border-radius: 26px
    }

@keyframes glowing {
    0% {
        background-position: 0 0
    }

    50% {
        background-position: 400% 0
    }

    100% {
        background-position: 0 0
    }
}
/*!normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css*/

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

main {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: sans-serif,sans-serif;
    font-size: 1em
}

a {
    background-color: transparent
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

b, strong {
    font-weight: bolder
}

code, kbd, samp {
    font-family: sans-serif,sans-serif;
    font-size: 1em
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button, input {
    overflow: visible
}

button, select {
    text-transform: none
}

button, [type=button], [type=reset], [type=submit] {
    -webkit-appearance: button
}

    button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner {
        border-style: none;
        padding: 0
    }

    button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring {
        outline: 1px dotted ButtonText
    }

fieldset {
    padding: .35em .75em .625em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox], [type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

    [type=search]::-webkit-search-decoration {
        -webkit-appearance: none
    }

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

template {
    display: none
}

[hidden] {
    display: none
}

.siteMap button.read-more-button {
    border: 0;
    background-color: #ffc502;
    width: fit-content;
    color: #fff;
    padding: 1rem 2rem;
    border-radius: 26px;
    outline: transparent;
    margin: 1rem auto;
    font-weight: 600;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    transition: all .2s ease-in-out
}

    .siteMap button.read-more-button:hover {
        background-color: #1da44c
    }

.siteMap #siteMap .col-12, .siteMap #siteMap .col-md-6 {
    padding: 0;
    margin: 0
}

.siteMap #siteMap .container .row {
    display: flex;
    flex-direction: column
}

    .siteMap #siteMap .container .row h1 {
        font-size: 36px;
        font-weight: 700
    }

    .siteMap #siteMap .container .row h2 {
        font-size: 28px;
        font-weight: 600
    }

    .siteMap #siteMap .container .row .siteMap__head {
        padding: 6rem 0 3rem
    }

    .siteMap #siteMap .container .row .siteMap__list {
        margin-bottom: 3rem
    }

    .siteMap #siteMap .container .row .siteMap__list__header {
        padding: 3rem 0 1rem;
        border-top: 1px solid #ddd
    }

    .siteMap #siteMap .container .row .siteMap__list__listItem ul {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        padding: 0;
        margin: 0
    }

        .siteMap #siteMap .container .row .siteMap__list__listItem ul li {
            list-style: none;
            font-size: 18px;
            padding: 1rem 0
        }

            .siteMap #siteMap .container .row .siteMap__list__listItem ul li a {
                color: #1da44c
            }

                .siteMap #siteMap .container .row .siteMap__list__listItem ul li a:hover {
                    text-decoration: underline
                }

.siteMap #siteMap--planner .col-12, .siteMap #siteMap--planner .col-md-6 {
    padding: 0;
    margin: 0
}

.siteMap #siteMap--planner .container .row {
    display: flex;
    flex-direction: column
}

    .siteMap #siteMap--planner .container .row h1 {
        font-size: 36px;
        font-weight: 700
    }

    .siteMap #siteMap--planner .container .row h2 {
        font-size: 28px;
        font-weight: 600
    }

    .siteMap #siteMap--planner .container .row .siteMap__head {
        padding: 6rem 0 3rem
    }

    .siteMap #siteMap--planner .container .row .siteMap__list {
        margin-bottom: 3rem
    }

    .siteMap #siteMap--planner .container .row .siteMap__list__header {
        padding: 3rem 0 1rem;
        border-top: 1px solid #ddd
    }

    .siteMap #siteMap--planner .container .row .siteMap__list__listItem ul {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        padding: 0;
        margin: 0
    }

        .siteMap #siteMap--planner .container .row .siteMap__list__listItem ul li {
            list-style: none;
            font-size: 18px;
            padding: 1rem 0
        }

            .siteMap #siteMap--planner .container .row .siteMap__list__listItem ul li a {
                color: #2d80eb
            }

                .siteMap #siteMap--planner .container .row .siteMap__list__listItem ul li a:hover {
                    text-decoration: underline
                }

.planner ::selection {
    background: #deebfc
}

.planner .limitHeight {
    height: 68px !important
}

.planner .shadowAndRadius {
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    border-radius: 18px;
    margin-bottom: 7px
}

.planner .blue {
    background-color: #2d80eb !important
}

.planner .hideElement {
    display: none !important
}

@media(max-width:767px) {
    .planner .mobile-display-none {
        display: none !important
    }
}

.planner .btn-filled:hover {
    filter: brightness(95%)
}

.planner .special__paragraph-heading {
    font-size: 14px !important
}

.planner .checkmarks {
    display: flex;
    margin: 0 0 6rem;
    max-width: 1000px
}

    .planner .checkmarks div {
        display: flex;
        align-items: center;
        justify-content: center
    }

        .planner .checkmarks div:not(:first-of-type) {
            margin-left: 7rem
        }

        .planner .checkmarks div img {
            width: 20px !important;
            height: 20px !important
        }

        .planner .checkmarks div p {
            margin: 0 0 0 1rem !important;
            color: #2d80eb !important;
            font-size: 16px !important;
            font-weight: 600 !important;
            padding: 0 !important
        }

.planner a.btn-filled-planner {
    font-family: Lato;
    font-size: 18px;
    font-weight: 700;
    line-height: 21.6px;
    color: #fff;
    text-align: center;
    padding: 16px 32px;
    border-radius: 100px;
    background: linear-gradient(104.16deg,#2d80eb 16.09%,#2466bc 83.91%,#2466bc 83.91%);
    transition: all .2s ease-in-out
}

    .planner a.btn-filled-planner:hover {
        filter: brightness(.85)
    }

.planner a.btn-filled-planner--white {
    color: #1f1f1f;
    background: 0 0;
    background-color: #f3f3f3
}

    .planner a.btn-filled-planner--white:hover {
        filter: unset;
        background-color: #fff
    }

.planner #top {
    margin-top: 3rem;
    display: flex;
    align-items: center
}

    .planner #top .homepage__heading__formerly {
        font-size: 16px;
        font-weight: 700;
        color: #2d80eb
    }

        .planner #top .homepage__heading__formerly img {
            margin-left: .2rem;
            width: 95px
        }

@media(min-width:768px) and (max-width:991px) {
    .planner #top .homepage__heading__formerly {
        text-align: center;
        padding: 0 6rem
    }
}

.planner #top .homepage__heading span {
    color: #767676;
    margin-right: .5rem
}

@media(min-width:1920px) {
    .planner #top .homepage__heading {
        width: 45%;
        padding-left: 25rem
    }

        .planner #top .homepage__heading h1 {
            font-size: 52px !important
        }
}

@media(min-width:1441px) and (max-width:1919px) {
    .planner #top .homepage__heading {
        width: 45%;
        padding-left: 14rem
    }

        .planner #top .homepage__heading h1 {
            font-size: 52px !important
        }
}

@media(min-width:992px) and (max-width:1440px) {
    .planner #top .homepage__heading {
        width: 45%;
        padding-left: 9rem
    }

        .planner #top .homepage__heading h1 {
            font-size: 52px !important
        }
}

@media(max-width:767px) {
    .planner #top .top__integration {
        padding: 0 1.5rem
    }
}

.planner #top .top__integration-img {
    width: 75%
}

@media(max-width:767px) {
    .planner #top .top__integration-img {
        width: 100%
    }
}

.planner #top .top__integration .inline-form-tc {
    margin-top: 1rem
}

.planner #top #specialContent {
    width: 55%;
    overflow: hidden
}

    .planner #top #specialContent img {
        width: 100%;
        margin-right: -2rem;
        box-shadow: none !important
    }

@media(max-width:767px) {
    .planner #top #specialContent {
        margin-left: -.8rem
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #top {
        flex-direction: column;
        padding: 0 1rem !important
    }

        .planner #top #specialContent {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-top: 2.5rem;
            margin-right: 0
        }
}

.planner #top .terms-submission a {
    color: #3c91e6
}

.planner #top--features {
    padding: 0 !important;
    overflow: hidden
}

    .planner #top--features .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 11%;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        display: flex;
        flex-direction: row
    }

@media(max-width:767px) {
    .planner #top--features .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner #top--features .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .planner #top--features .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .planner #top--features .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .planner #top--features .container--custom {
        width: 100%
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #top--features .container--custom {
        flex-direction: column
    }
}

.planner #top--features .container--custom .top__content {
    width: 40%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px) {
    .planner #top--features .container--custom .top__content {
        width: 100%;
        align-items: center;
        justify-content: center;
        margin-bottom: 2rem;
        margin-top: 0 !important;
        text-align: center
    }
}

@media(max-width:767px) {
    .planner #top--features .container--custom .top__content {
        width: 100%;
        align-items: flex-start;
        justify-content: flex-start;
        margin-bottom: 2rem;
        margin-top: 0 !important
    }
}

.planner #top--features .container--custom .top__content h1 {
    color: #2d80eb;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700
}

.planner #top--features .container--custom .top__content h2 {
    font-size: 52px;
    font-weight: 700;
    width: 75%;
    margin-top: 0 !important
}

@media(max-width:767px) {
    .planner #top--features .container--custom .top__content h2 {
        width: 100%
    }
}

.planner #top--features .container--custom .top__content p {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    font-family: nunito sans,sans-serif;
    line-height: 1.89;
    width: 80%
}

@media(min-width:768px) and (max-width:991px) {
    .planner #top--features .container--custom .top__content p {
        text-align: center
    }
}

@media(max-width:767px) {
    .planner #top--features .container--custom .top__content p {
        width: 100%
    }
}

@media(max-width:767px) {
    .planner #top--features .container--custom .top__content .button-wrapper {
        align-self: center
    }
}

.planner #top--features .container--custom .top__img {
    display: flex;
    justify-content: flex-end;
    width: 60%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #top--features .container--custom .top__img {
        width: 100%
    }
}

.planner #top--features .container--custom .top__img img {
    width: 100%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #top--features .container--custom .top__img img {
        margin-right: -3rem
    }
}

.planner #features {
    margin: 5rem 0 1rem;
    width: 100%
}

    .planner #features .features__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 4rem 0 2rem;
        background-color: #eaf2fd
    }

@media(max-width:767px) {
    .planner #features .features__heading {
        align-items: flex-start;
        justify-content: flex-start;
        padding: 4rem 0 0 1.5rem;
        margin-bottom: -3rem
    }
}

.planner #features .features__heading p {
    color: #2d80eb
}

.planner #features .row {
    width: 100%;
    display: flex;
    align-items: flex-start;
    margin: 0;
    padding: 5rem 0
}

.planner #features .row-blue {
    background-color: #eaf2fd
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .row {
        padding: 4rem 0
    }
}

.planner #features .row:first-of-type {
    margin-top: 3rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .row:nth-of-type(2), .planner #features .row:nth-of-type(4), .planner #features .row:nth-of-type(6) {
        flex-direction: column-reverse !important
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .row:nth-of-type(3), .planner #features .row:nth-of-type(5) {
        flex-direction: column !important
    }
}

.planner #features .row:nth-of-type(4) img {
    padding-left: 1rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .row:nth-of-type(4) img {
        padding-left: 0
    }
}

.planner #features .row .features__single {
    width: 45%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 5% 0 20%
}

@media(min-width:992px) and (max-width:1440px) {
    .planner #features .row .features__single {
        padding-left: 12%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features .row .features__single {
        width: 100%;
        padding: 0 5rem
    }
}

@media(max-width:767px) {
    .planner #features .row .features__single {
        width: 100%;
        padding: 0 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .row .features__single a {
        display: none
    }
}

.planner #features .row .features__single--right {
    width: 45%;
    padding: 0 10%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .row .features__single--right a {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features .row .features__single--right {
        width: 100%;
        padding: 0 5rem
    }
}

@media(max-width:767px) {
    .planner #features .row .features__single--right {
        width: 100%;
        padding: 0 1.5rem
    }
}

.planner #features .row h2 {
    font-size: 28px;
    font-weight: 700;
    color: #2d80eb;
    margin-bottom: 1.5rem;
    width: max-content;
    position: relative
}

    .planner #features .row h2::after {
        content: "";
        display: block;
        position: absolute;
        width: calc(100% + 20px);
        border-bottom: 2px solid #2d80eb;
        margin-top: .3rem
    }

@media(min-width:768px) and (max-width:991px) {
    .planner #features .row h2 {
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features .row h2 {
        text-align: left
    }
}

.planner #features .row h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 1rem
}

.planner #features .row p {
    font-size: 18px;
    margin-bottom: 1.5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .row p {
        margin-bottom: 3rem
    }
}

.planner #features .features__img {
    width: 55%;
    display: flex;
    justify-content: flex-end;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features .features__img {
        width: 100%;
        padding: 0 1.5rem
    }
}

@media(max-width:767px) {
    .planner #features .features__img {
        width: 100%;
        padding: 0
    }
}

.planner #features .features__img img {
    width: 100%;
    margin-right: -.5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #features .features__img img {
        margin: 0 0 1.5rem
    }
}

.planner #features .features__img--left {
    width: 55%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features .features__img--left {
        justify-content: flex-end;
        width: 100%;
        padding: 0 1.5rem
    }
}

@media(max-width:767px) {
    .planner #features .features__img--left {
        width: 100%;
        padding: 0
    }
}

.planner #features .features__img--left img {
    width: 100%;
    margin-left: -.5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .features__img--left img {
        margin: 0 0 1.5rem
    }
}

.planner #features .showOnTabletAndMoble {
    display: none
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features .showOnTabletAndMoble {
        display: flex;
        margin: 3rem 0 1rem
    }
}

.planner #features-planner {
    margin: 5rem 0 1rem;
    width: 100%
}

    .planner #features-planner .features__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 4rem 0 2rem;
        background-color: #eaf2fd
    }

@media(max-width:767px) {
    .planner #features-planner .features__heading {
        align-items: flex-start;
        justify-content: flex-start;
        padding: 4rem 0 0 1.5rem;
        margin-bottom: -3rem
    }
}

.planner #features-planner .features__heading p {
    color: #2d80eb
}

.planner #features-planner .row {
    width: 100%;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 5rem 0
}

.planner #features-planner .row-blue {
    background-color: #eaf2fd
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features-planner .row {
        padding: 4rem 0
    }
}

.planner #features-planner .row:first-of-type {
    margin-top: 3rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features-planner .row:nth-of-type(2), .planner #features-planner .row:nth-of-type(4), .planner #features-planner .row:nth-of-type(6) {
        flex-direction: column-reverse !important
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features-planner .row:nth-of-type(3), .planner #features-planner .row:nth-of-type(5) {
        flex-direction: column !important
    }
}

.planner #features-planner .row .features__single {
    width: 45%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 5% 0 20%
}

@media(min-width:992px) and (max-width:1440px) {
    .planner #features-planner .row .features__single {
        padding-left: 12%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features-planner .row .features__single {
        width: 100%;
        padding: 0 5rem
    }
}

@media(max-width:767px) {
    .planner #features-planner .row .features__single {
        width: 100%;
        padding: 0 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features-planner .row .features__single a {
        display: none
    }
}

.planner #features-planner .row .features__single--right {
    width: 45%;
    padding: 0 10%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features-planner .row .features__single--right a {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features-planner .row .features__single--right {
        width: 100%;
        padding: 0 5rem
    }
}

@media(max-width:767px) {
    .planner #features-planner .row .features__single--right {
        width: 100%;
        padding: 0 1.5rem
    }
}

.planner #features-planner .row h2 {
    font-size: 28px;
    font-weight: 700;
    color: #2d80eb;
    margin-bottom: 1.5rem;
    width: max-content;
    position: relative
}

    .planner #features-planner .row h2::after {
        content: "";
        display: block;
        position: absolute;
        width: calc(100% + 20px);
        border-bottom: 2px solid #2d80eb;
        margin-top: .3rem
    }

@media(min-width:768px) and (max-width:991px) {
    .planner #features-planner .row h2 {
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features-planner .row h2 {
        text-align: left
    }
}

.planner #features-planner .row h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 1rem
}

.planner #features-planner .row p {
    font-size: 18px;
    margin: 3rem 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features-planner .row p {
        margin-bottom: 3rem
    }
}

.planner #features-planner .features__img {
    width: 55%;
    display: flex;
    justify-content: flex-end;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features-planner .features__img {
        width: 100%;
        padding: 0 1.5rem
    }
}

@media(max-width:767px) {
    .planner #features-planner .features__img {
        width: 100%;
        padding: 0
    }
}

.planner #features-planner .features__img img {
    width: 100%;
    margin-right: -.5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #features-planner .features__img img {
        margin: 0 0 1.5rem
    }
}

.planner #features-planner .features__img--left {
    width: 55%;
    height: 100%;
    display: flex;
    justify-content: flex-start;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .planner #features-planner .features__img--left {
        justify-content: flex-end;
        width: 100%;
        padding: 0 1.5rem
    }
}

@media(max-width:767px) {
    .planner #features-planner .features__img--left {
        width: 100%;
        padding: 0
    }
}

.planner #features-planner .features__img--left img {
    width: 100%;
    margin-left: -.5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features-planner .features__img--left img {
        margin: 0 0 1.5rem
    }
}

.planner #features-planner .showOnTabletAndMoble {
    display: none
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #features-planner .showOnTabletAndMoble {
        display: flex;
        margin: 3rem 0 1rem
    }
}

.planner #integration {
    margin: 0 5rem 0;
    padding: 0 3rem 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: #fafafa;
    border-radius: 4px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #integration {
        margin: 0 1rem 0;
        padding: 0 1rem 2.5rem
    }
}

.planner #integration .integration__header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin-bottom: 4rem
}

.planner #integration .integration__header-heading {
    font-size: 14px;
    font-weight: 700;
    color: #2d80eb;
    text-transform: uppercase;
    margin: 4rem 0 1.5rem
}

@media(max-width:767px) {
    .planner #integration .integration__header-heading {
        align-self: flex-start
    }
}

.planner #integration .integration__header h2 {
    font-size: 36px;
    font-weight: 700;
    width: 60%;
    text-align: center
}

@media(max-width:767px) {
    .planner #integration .integration__header h2 {
        width: 100%;
        align-self: flex-start;
        text-align: left
    }
}

.planner #integration .integration__header-icons {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 3rem
}

    .planner #integration .integration__header-icons img:first-of-type {
        margin-bottom: 4rem
    }

    .planner #integration .integration__header-icons img:last-of-type {
        margin-top: 4rem
    }

    .planner #integration .integration__header-icons span {
        font-size: 24px;
        font-weight: 700;
        color: #2d80eb;
        padding: 0 1rem
    }

.planner #integration .integration__content {
    width: 100%;
    margin: 0 3rem
}

.planner #integration .integration__content-singlerow {
    display: flex
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #integration .integration__content-singlerow {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }
}

.planner #integration .integration__content-singlerow__element {
    width: 50%;
    padding: 2.5rem 4rem;
    margin: 0 1rem 1.5rem;
    border: solid 1px #e3e3e3;
    border-radius: 4px;
    display: flex;
    align-items: flex-start;
    flex-direction: column
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #integration .integration__content-singlerow__element {
        width: 90%;
        margin: 0 0 1.5rem;
        padding: 2.5rem 1rem
    }
}

.planner #integration .integration__content-singlerow__element h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 1rem
}

.planner #integration .integration__content-singlerow__element p {
    font-size: 18px
}

.planner #integrations--new .container .row p .green {
    color: #2d80eb !important
}

.planner #integrations--new .container .row p a {
    color: #2d80eb !important
}

.planner #bluebox {
    margin: 8rem 0 4rem;
    width: 100%;
    background-color: #2d80eb;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .planner #bluebox p {
        width: 35%;
        font-size: 36px;
        font-weight: 600;
        text-align: center;
        color: #fff;
        margin: 3rem 0 2rem;
        line-height: 1.22
    }

@media(min-width:768px) and (max-width:991px) {
    .planner #bluebox p {
        width: 70%
    }
}

@media(max-width:767px) {
    .planner #bluebox p {
        width: 80%
    }
}

.planner #bluebox button {
    margin-bottom: 3rem
}

.planner #applications {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: #eaf2fd
}

    .planner #applications .applications__header {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        font-weight: 700;
        color: #2d80eb;
        text-transform: uppercase;
        margin: 5rem 0 6rem
    }

        .planner #applications .applications__header h2 {
            color: #000;
            text-transform: none;
            margin-top: 1.5rem;
            font-weight: 600;
            font-size: 36px
        }

    .planner #applications .applications__contentCard {
        display: flex;
        justify-content: center;
        width: 80%;
        text-align: center;
        margin-bottom: -1.5rem
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #applications .applications__contentCard {
        flex-direction: column;
        align-items: center
    }
}

.planner #applications .applications__contentCard .card {
    width: 35%;
    margin: 0 1rem;
    border-radius: 4px;
    display: flex;
    align-items: center;
    border: none !important
}

@media(min-width:768px) and (max-width:991px) {
    .planner #applications .applications__contentCard .card {
        width: 60%
    }
}

@media(max-width:767px) {
    .planner #applications .applications__contentCard .card {
        width: 80%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #applications .applications__contentCard .card:first-of-type {
        margin-bottom: 2rem
    }
}

.planner #applications .applications__contentCard .card h3 {
    font-size: 36px;
    font-weight: 700;
    margin: 3rem 0
}

.planner #applications .applications__contentCard .card__icons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 80%;
    margin-bottom: 1.5rem
}

.planner #applications .applications__contentCard .card__icons-icon {
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center
}

    .planner #applications .applications__contentCard .card__icons-icon:not(:last-child) {
        margin-right: 1.5rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner #applications .applications__contentCard .card__icons-icon:not(:last-child) {
        margin-bottom: .5rem
    }
}

.planner #applications .applications__contentCard .card__icons-icon a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #767676
}

    .planner #applications .applications__contentCard .card__icons-icon a:hover {
        cursor: pointer
    }

    .planner #applications .applications__contentCard .card__icons-icon a img {
        margin-right: .5rem;
        width: 20px
    }

.planner #applications .applications__contentCard .card__image {
    width: 100%;
    overflow: hidden
}

    .planner #applications .applications__contentCard .card__image img {
        width: 100%
    }

    .planner #applications .applications__contentCard .card__image .margin-top {
        margin-top: 1.5rem
    }

.planner #applications .applications__blueBox {
    width: 100%;
    background-color: #2d80eb;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .planner #applications .applications__blueBox p {
        width: 40%;
        font-size: 36px;
        font-weight: 600;
        text-align: center;
        color: #fff;
        margin: 7rem 0 2rem;
        line-height: 1.22
    }

@media(min-width:768px) and (max-width:991px) {
    .planner #applications .applications__blueBox p {
        width: 70%
    }
}

@media(max-width:767px) {
    .planner #applications .applications__blueBox p {
        width: 80%
    }
}

.planner #applications .applications__blueBox button {
    margin-bottom: 7rem
}

.planner #compare {
    margin: 0 5rem 0;
    padding-bottom: 5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner #compare {
        margin: 0 1rem 0
    }
}

.planner #compare .special-paragraph {
    color: #2d80eb
}

.planner #compare .toggle-prices {
    width: 370px !important
}

@media(max-width:767px) {
    .planner #compare .toggle-prices {
        width: 300px !important
    }
}

.planner #compare .toggle-prices input:checked + .switcher-price:before {
    transform: translateX(185px) !important
}

@media(max-width:767px) {
    .planner #compare .toggle-prices input:checked + .switcher-price:before {
        transform: translateX(150px) !important
    }
}

.planner #compare .toggle-prices .switcher-price:before {
    width: 190px !important
}

@media(max-width:767px) {
    .planner #compare .toggle-prices .switcher-price:before {
        width: 150px !important
    }
}

.planner #compare .switcher-price:before {
    background-color: #deebfc !important;
    border: 0 !important
}

.planner #compare .switcher-text, .planner #compare .switcher-text-2 {
    color: #000 !important;
    font-weight: 700;
    margin-left: -1.9rem !important
}

    .planner #compare .switcher-text span, .planner #compare .switcher-text-2 span {
        color: #2d80eb
    }

.planner #compare table {
    width: 100%
}

    .planner #compare table tr {
        width: 100%;
        display: flex;
        justify-content: center
    }

        .planner #compare table tr td {
            padding: 0 .5rem;
            width: 33.3%
        }

@media(max-width:767px) {
    .planner #compare table tr td {
        width: 50%
    }
}

.planner #compare table tr td .card2 {
    background-color: #fafafa;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem;
    height: 100%
}

@media(max-width:767px) {
    .planner #compare table tr td .card2 {
        padding: 1rem
    }
}

.planner #compare table tr td .card2__header {
    width: 100%;
    font-size: 28px;
    font-weight: 700;
    color: #2d80eb;
    border-bottom: 1.5px solid #2d80eb;
    margin-bottom: 1.5rem
}

.planner #compare table tr td .card2__price {
    font-family: lato,sans-serif
}

    .planner #compare table tr td .card2__price .price-toggle {
        font-size: 52px;
        font-weight: 700
    }

    .planner #compare table tr td .card2__price .dollar-icon {
        font-style: normal;
        font-size: 36px
    }

    .planner #compare table tr td .card2__price .user-text {
        font-size: 16px
    }

    .planner #compare table tr td .card2__price .freePlan {
        font-size: 18px;
        font-weight: 700;
        padding: 0 0 .9rem
    }

.planner #compare table tr td .card2__features ul {
    padding-left: 1rem;
    margin-top: 2rem
}

    .planner #compare table tr td .card2__features ul span {
        font-weight: 700
    }

    .planner #compare table tr td .card2__features ul li {
        padding: .3rem 0
    }

.planner #compare table .compareTable {
    width: 100%
}

    .planner #compare table .compareTable .white {
        background-color: #fff !important
    }

    .planner #compare table .compareTable .title {
        padding: 1.33rem 0
    }

    .planner #compare table .compareTable td:not(:first-of-type) ul li {
        display: flex;
        align-items: center;
        justify-content: center
    }

    .planner #compare table .compareTable td ul {
        width: 100%;
        list-style: none;
        padding: 0;
        margin-bottom: 3rem
    }

        .planner #compare table .compareTable td ul li {
            width: 100%;
            height: 55px;
            display: flex;
            align-items: center;
            color: #767676;
            font-weight: 700;
            border-bottom: solid 1px #f3f3f3
        }

        .planner #compare table .compareTable td ul p {
            font-weight: 700
        }

            .planner #compare table .compareTable td ul p::after {
                content: "";
                margin-top: .5rem;
                border-bottom: 1px solid #2d80eb;
                display: block;
                width: 80%;
                position: absolute;
                z-index: 10
            }

        .planner #compare table .compareTable td ul span {
            font-weight: 400
        }

.planner #compare .allFeatures {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 0
}

    .planner #compare .allFeatures a {
        font-size: 16px;
        font-weight: 600;
        color: #2d80eb
    }

        .planner #compare .allFeatures a:hover {
            cursor: pointer
        }

.planner #btnReadMore {
    color: #2d80eb
}

.planner #comparison {
    margin-bottom: 5rem
}

    .planner #comparison .row .col-12 h2 {
        margin-bottom: 4rem;
        font-size: 36px;
        font-weight: 700;
        text-align: center
    }

@media(max-width:767px) {
    .planner #comparison .row .col-12 h2 {
        align-self: flex-start;
        text-align: left
    }
}

.planner #comparison .row .col-12 p {
    text-align: left;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 2rem
}

@media(max-width:767px) {
    .planner #comparison .row .col-12 p {
        padding-right: 0
    }
}

.planner #benefitScroll .benefitScroll__heading {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0
}

    .planner #benefitScroll .benefitScroll__heading h2 {
        width: 50%;
        margin-bottom: 4rem !important;
        font-size: 36px !important
    }

@media(max-width:767px) {
    .planner #benefitScroll .benefitScroll__heading h2 {
        width: 100%;
        margin-bottom: 2rem !important;
        font-size: 36px !important
    }
}

.planner-articles ::selection {
    background: #deebfc
}

.planner-articles .btn-planner-articles {
    width: fit-content;
    margin: 2.5rem auto 0;
    transition: all .2s ease-in-out
}

    .planner-articles .btn-planner-articles:hover {
        filter: brightness(95%)
    }

.planner-articles #content {
    margin-bottom: 12rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-articles #content {
        margin-bottom: 5rem
    }
}

.planner-articles #content .container-custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 2rem
}

@media(max-width:767px) {
    .planner-articles #content .container-custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner-articles #content .container-custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .planner-articles #content .container-custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .planner-articles #content .container-custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .planner-articles #content .container-custom {
        width: 1440px
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-articles #content .container-custom {
        grid-template-columns: 1fr
    }
}

.planner-articles #content .container-custom .nav-menu {
    border-top: 1px solid #ddd;
    margin-top: 2.5rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-articles #content .container-custom .nav-menu {
        display: none
    }
}

.planner-articles #content .container-custom .nav-menu p {
    margin: 1.5rem 0 .5rem;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 700;
    color: #767676
}

.planner-articles #content .container-custom .nav-menu ul {
    padding: 0
}

    .planner-articles #content .container-custom .nav-menu ul li {
        list-style: none;
        padding: .5rem 0
    }

        .planner-articles #content .container-custom .nav-menu ul li a {
            color: #2d80eb;
            opacity: .8;
            transition: .2s all ease-in-out
        }

            .planner-articles #content .container-custom .nav-menu ul li a::after {
                content: "";
                border: 0 solid #767676;
                display: block;
                position: absolute;
                width: 0;
                transition: .2s all ease-in-out
            }

            .planner-articles #content .container-custom .nav-menu ul li a:hover {
                opacity: 1;
                color: #767676
            }

                .planner-articles #content .container-custom .nav-menu ul li a:hover::after {
                    content: "";
                    border: 1px solid #767676;
                    display: block;
                    position: absolute;
                    width: 70px
                }

.planner-articles #content .container-custom .content {
    display: flex;
    flex-direction: column
}

    .planner-articles #content .container-custom .content h1 {
        font-weight: 700;
        font-size: 42px;
        letter-spacing: .08rem;
        word-spacing: .15rem
    }

    .planner-articles #content .container-custom .content h2 {
        padding: 3rem 0 1rem;
        font-weight: 600
    }

    .planner-articles #content .container-custom .content h3 {
        padding: 2rem 0 1rem;
        font-weight: 500;
        font-size: 28px
    }

    .planner-articles #content .container-custom .content p {
        color: #5f5f5f;
        line-height: 1.75
    }

    .planner-articles #content .container-custom .content ol {
        padding-left: 1rem
    }

        .planner-articles #content .container-custom .content ol li {
            color: #5f5f5f;
            padding: .4rem 0
        }

    .planner-articles #content .container-custom .content img {
        width: 100%;
        max-width: 950px;
        align-self: center
    }

.planner-articles #content .container-custom .content-table {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 2rem
}

    .planner-articles #content .container-custom .content-table p {
        margin: 0 0 1rem;
        font-size: 18px;
        font-weight: 700;
        color: #767676;
        text-transform: uppercase
    }

    .planner-articles #content .container-custom .content-table ol {
        padding-left: 1rem
    }

        .planner-articles #content .container-custom .content-table ol li {
            padding: .5rem 0;
            color: #767676;
            opacity: .8;
            transition: .2s all ease-in-out
        }

            .planner-articles #content .container-custom .content-table ol li:last-of-type {
                padding: .5rem 0 0
            }

            .planner-articles #content .container-custom .content-table ol li:hover {
                color: #767676;
                opacity: 1
            }

                .planner-articles #content .container-custom .content-table ol li:hover a {
                    color: #767676;
                    opacity: 1
                }

            .planner-articles #content .container-custom .content-table ol li a {
                color: #2d80eb;
                opacity: 1
            }

.planner-articles #blue-article-banner {
    margin: 5rem 0
}

    .planner-articles #blue-article-banner .container {
        padding: 0 10%
    }

        .planner-articles #blue-article-banner .container .bluebox {
            display: flex;
            width: 100%;
            background-color: #eaf2fd;
            border-radius: 20px;
            position: relative;
            overflow: hidden
        }

        .planner-articles #blue-article-banner .container .bluebox__content {
            padding: 4rem 2rem;
            width: 70%;
            height: max-content
        }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner-articles #blue-article-banner .container .bluebox__content {
        width: 100%
    }
}

.planner-articles #blue-article-banner .container .bluebox__content p {
    position: relative;
    color: #000;
    font-size: 42px;
    font-weight: 700;
    line-height: 1.2;
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 5rem;
    z-index: 2
}

@media(max-width:767px) {
    .planner-articles #blue-article-banner .container .bluebox__content p {
        font-size: 30px
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .planner-articles #blue-article-banner .container .bluebox__content p {
        margin-right: 1.5rem
    }
}

.planner-articles #blue-article-banner .container .bluebox__content a {
    font-weight: 700;
    padding: 1rem 2rem;
    text-align: center;
    background-color: #2d80eb;
    color: #fff;
    border-radius: 26px;
    box-shadow: 0 4px 4px rgba(0,0,0,.25);
    transition: all .2s ease-in-out
}

    .planner-articles #blue-article-banner .container .bluebox__content a:hover {
        cursor: pointer;
        box-shadow: 0 3px 4px rgba(0,0,0,.25);
        filter: brightness(95%)
    }

.planner-articles #blue-article-banner .container .bluebox img {
    position: absolute;
    right: 0;
    width: 56%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner-articles #blue-article-banner .container .bluebox img {
        display: none
    }
}

.planner-articles #blue-article-banner-without-img {
    margin: 5rem 0
}

    .planner-articles #blue-article-banner-without-img .container .bluebox {
        display: flex;
        width: 100%;
        background-color: #eaf2fd;
        border-radius: 20px;
        position: relative;
        overflow: hidden
    }

    .planner-articles #blue-article-banner-without-img .container .bluebox__content {
        flex-direction: column;
        display: flex;
        align-items: center;
        padding: 4rem 2rem;
        width: 100%;
        height: max-content
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner-articles #blue-article-banner-without-img .container .bluebox__content {
        width: 100%
    }
}

.planner-articles #blue-article-banner-without-img .container .bluebox__content p {
    position: relative;
    color: #000;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 2rem;
    z-index: 2;
    text-align: center;
    width: 85%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px),(min-width:992px) and (max-width:1440px) {
    .planner-articles #blue-article-banner-without-img .container .bluebox__content p {
        width: 100%
    }
}

@media(max-width:767px) {
    .planner-articles #blue-article-banner-without-img .container .bluebox__content p {
        font-size: 24px
    }
}

.planner-articles #blue-article-banner-without-img .container .bluebox__content a {
    margin-top: 1rem;
    font-weight: 700;
    padding: 1rem 2rem;
    text-align: center;
    background-color: #2d80eb;
    color: #fff;
    border-radius: 26px;
    box-shadow: 0 4px 4px rgba(0,0,0,.25)
}

    .planner-articles #blue-article-banner-without-img .container .bluebox__content a:hover {
        cursor: pointer
    }

.planner-redesign {
    background-color: #000;
    font-family: lato,sans-serif !important
}

    .planner-redesign ::selection {
        background: #deebfc
    }

    .planner-redesign .hidden {
        opacity: 0;
        transform: translateY(-20px);
        transition: all 1s ease-in-out
    }

@media(max-width:767px) {
    .planner-redesign .hidden {
        transition: none
    }
}

.planner-redesign .show {
    opacity: 1;
    transform: translateY(0)
}

.planner-redesign video {
    background-color: transparent
}

@media(max-width:767px) {
    .planner-redesign video {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .planner-redesign .img-mobile {
        display: none !important
    }
}

.planner-redesign .safari-browser {
    display: none
}

@keyframes randomMovement {
    0% {
        transform: translate(0,0)
    }

    25% {
        transform: translate(-5px,-5px)
    }

    50% {
        transform: translate(5px,-5px)
    }

    75% {
        transform: translate(-5px,5px)
    }

    100% {
        transform: translate(0px,0px)
    }
}

@keyframes claimAnimation {
    0% {
        transform: translateY(-120px);
        opacity: 0
    }

    50% {
        transform: translateY(-60px) !important;
        opacity: .7
    }

    75% {
        transform: translateY(-30px) !important;
        opacity: 0
    }

    100% {
        transform: translateY(0);
        opacity: 1
    }
}

.planner-redesign .btn-planner {
    display: flex;
    padding: 1rem 1.5rem;
    justify-content: center;
    align-items: center;
    border-radius: 32px;
    color: #fff;
    font-size: 18px;
    font-weight: 700
}

.planner-redesign .btn-planner-blue {
    background: linear-gradient(157deg,#2d80eb 0%,#2466bc 100%);
    box-shadow: 2px 4px 32px 0 rgba(36,102,188,.64);
    transition: all .2s ease-in-out
}

    .planner-redesign .btn-planner-blue:hover {
        filter: brightness(90%)
    }

.planner-redesign .btn-planner-white {
    background: linear-gradient(89deg,rgba(255,255,255,0.59) 0%,rgba(255,255,255,0.16) 35%,rgba(234,242,253,0.08) 100%);
    backdrop-filter: blur(37.5px);
    -webkit-backdrop-filter: blur(37.5px)
}

.planner-redesign #top-planner {
    padding: 6rem 0 12rem;
    background: linear-gradient(180deg,rgba(0,0,0,0) 0%,#588acc 60%,#fff 100%)
}

@media(max-width:767px) {
    .planner-redesign #top-planner {
        padding: 2rem 0 5rem
    }
}

.planner-redesign #top-planner .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .planner-redesign #top-planner .container span.label {
        background: linear-gradient(112.54deg,rgba(234,242,253,0.08) 10.29%,rgba(234,242,253,0.08) 100.35%);
        border: 1px solid rgba(255,255,255,.2);
        padding: 6px 16px;
        margin-bottom: 38px;
        border-radius: 32px;
        color: #fff
    }

    .planner-redesign #top-planner .container h1 {
        text-align: center;
        font-size: 64px;
        font-weight: 700;
        line-height: 64px;
        margin-bottom: 1.5rem;
        margin-top: 0;
        background: linear-gradient(162deg,#f5f5f5 5.79%,rgba(45,128,235,0.24) 87.97%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent
    }

@media(max-width:767px) {
    .planner-redesign #top-planner .container h1 {
        font-size: 44px;
        line-height: 44px
    }
}

.planner-redesign #top-planner .container h2 {
    color: #f3f3f3;
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    line-height: 36px;
    margin: 0 0 3rem;
    transition-delay: 400ms
}

@media(max-width:767px) {
    .planner-redesign #top-planner .container h2 {
        font-size: 18px;
        line-height: 28px
    }
}

.planner-redesign #top-planner .container div.button {
    transition-delay: 800ms
}

.planner-redesign #top-planner .container a {
    max-height: 52px
}

.planner-redesign #top-planner .container .mainVideo {
    width: 100%;
    transition-delay: 1200ms;
    margin-top: 160px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-redesign #top-planner .container .mainVideo {
        margin-top: 60px
    }
}

.planner-redesign #top-planner .container .mainVideo video {
    width: 100%
}

.planner-redesign #top-planner .container .mainVideo img {
    width: 100%
}

.planner-redesign #allInOne {
    margin: -1px 0;
    padding-bottom: 8rem;
    background-color: #fff
}

@media(max-width:767px) {
    .planner-redesign #allInOne {
        padding-bottom: 0
    }
}

.planner-redesign #allInOne .animationHidden {
    opacity: 0
}

.planner-redesign #allInOne .animationShow {
    opacity: 1;
    animation: 2s claimAnimation
}

.planner-redesign #allInOne .containerr, .planner-redesign #allInOne .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .planner-redesign #allInOne .containerr h2, .planner-redesign #allInOne .container h2 {
        background: linear-gradient(173deg,#2d80eb 18.79%,rgba(43,154,190,0) 103.41%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        text-align: center;
        font-size: 86px;
        font-weight: 700;
        margin-bottom: 210px;
        height: 202px
    }

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #allInOne .containerr h2, .planner-redesign #allInOne .container h2 {
        margin-bottom: 198px;
        height: 212px
    }
}

@media(max-width:767px) {
    .planner-redesign #allInOne .containerr h2, .planner-redesign #allInOne .container h2 {
        margin-bottom: 0;
        height: 325px
    }
}

.planner-redesign #allInOne .containerr .subMenu.mobile, .planner-redesign #allInOne .container .subMenu.mobile {
    display: none
}

.planner-redesign #allInOne .containerr .subMenu ul, .planner-redesign #allInOne .container .subMenu ul {
    display: flex;
    list-style: none;
    padding: 0;
    margin-bottom: 35px
}

    .planner-redesign #allInOne .containerr .subMenu ul li, .planner-redesign #allInOne .container .subMenu ul li {
        text-align: center;
        font-size: 18px;
        font-weight: 500;
        padding: 0 .5rem
    }

        .planner-redesign #allInOne .containerr .subMenu ul li a, .planner-redesign #allInOne .container .subMenu ul li a {
            color: #7a7a7a
        }

        .planner-redesign #allInOne .containerr .subMenu ul li:not(:last-of-type), .planner-redesign #allInOne .container .subMenu ul li:not(:last-of-type) {
            margin-right: 4rem
        }

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #allInOne .containerr .subMenu ul li:not(:last-of-type), .planner-redesign #allInOne .container .subMenu ul li:not(:last-of-type) {
        margin-right: 2rem
    }
}

.planner-redesign #allInOne .containerr .subMenu ul li:hover, .planner-redesign #allInOne .container .subMenu ul li:hover {
    cursor: pointer
}

.planner-redesign #allInOne .containerr .subMenu ul li::after, .planner-redesign #allInOne .container .subMenu ul li::after {
    content: "";
    width: 0;
    transition: all .2s ease-in-out
}

.planner-redesign #allInOne .containerr .subMenu ul .active, .planner-redesign #allInOne .container .subMenu ul .active {
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    position: relative
}

    .planner-redesign #allInOne .containerr .subMenu ul .active a, .planner-redesign #allInOne .container .subMenu ul .active a {
        color: #313131
    }

    .planner-redesign #allInOne .containerr .subMenu ul .active::after, .planner-redesign #allInOne .container .subMenu ul .active::after {
        content: "";
        position: absolute;
        top: 2rem;
        left: 0;
        height: 2px;
        width: 100%;
        background: linear-gradient(149deg,#eaf2fd 0%,#2d80eb 100%);
        box-shadow: 2px 4px 32px 2px rgba(45,128,235,.28)
    }

.planner-redesign #allInOne .containerr .mobile-subHeader, .planner-redesign #allInOne .container .mobile-subHeader {
    color: #313131;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    position: relative;
    margin-bottom: 41px
}

    .planner-redesign #allInOne .containerr .mobile-subHeader::after, .planner-redesign #allInOne .container .mobile-subHeader::after {
        content: "";
        position: absolute;
        top: 2rem;
        left: 0;
        height: 2px;
        width: 100%;
        background: linear-gradient(149deg,#eaf2fd 0%,#2d80eb 100%);
        box-shadow: 2px 4px 32px 2px rgba(45,128,235,.28)
    }

.planner-redesign #allInOne .containerr .owl-stage-outer, .planner-redesign #allInOne .container .owl-stage-outer {
    padding: 1.7rem 0 !important
}

    .planner-redesign #allInOne .containerr .owl-stage-outer .owl-item .cards__card, .planner-redesign #allInOne .container .owl-stage-outer .owl-item .cards__card {
        height: 400px
    }

.planner-redesign #allInOne .containerr .cards, .planner-redesign #allInOne .container .cards {
    width: 100%;
    display: none;
    grid-template-columns: repeat(5,1fr);
    grid-template-rows: 282px 400px;
    gap: 21px
}

    .planner-redesign #allInOne .containerr .cards.active, .planner-redesign #allInOne .container .cards.active {
        display: grid
    }

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #allInOne .containerr .cards, .planner-redesign #allInOne .container .cards {
        grid-template-columns: auto;
        grid-template-rows: auto;
        display: grid;
        padding: 0
    }

        .planner-redesign #allInOne .containerr .cards:hover, .planner-redesign #allInOne .container .cards:hover {
            cursor: pointer
        }
}

@media(max-width:767px) {
    .planner-redesign #allInOne .containerr .cards, .planner-redesign #allInOne .container .cards {
        grid-template-columns: repeat(3,265px);
        grid-template-rows: 400px;
        margin-bottom: 41px;
        overflow-x: scroll;
        padding: 1.6rem 1.5rem;
        -ms-overflow-style: none;
        scrollbar-width: none
    }

        .planner-redesign #allInOne .containerr .cards::-webkit-scrollbar, .planner-redesign #allInOne .container .cards::-webkit-scrollbar {
            display: none
        }

        .planner-redesign #allInOne .containerr .cards:hover, .planner-redesign #allInOne .container .cards:hover {
            cursor: pointer
        }
}

.planner-redesign #allInOne .containerr .cards__card, .planner-redesign #allInOne .container .cards__card {
    border-radius: 32px;
    background: linear-gradient(136deg,rgba(234,242,253,0.12) 0%,rgba(234,242,253,0) 100%);
    box-shadow: 2px 4px 32px 2px rgba(36,102,188,.12);
    backdrop-filter: blur(37.5px);
    -webkit-backdrop-filter: blur(37.5px);
    border: 1px solid #2d7feb3a;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-redesign #allInOne .containerr .cards__card, .planner-redesign #allInOne .container .cards__card {
        grid-area: auto !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: 50% !important;
        padding: 0 !important;
        overflow: hidden !important
    }
}

.planner-redesign #allInOne .containerr .cards__card-text, .planner-redesign #allInOne .container .cards__card-text {
    display: flex;
    flex-direction: column;
    justify-content: center
}

    .planner-redesign #allInOne .containerr .cards__card-text h3, .planner-redesign #allInOne .container .cards__card-text h3 {
        color: #313131;
        font-size: 26px;
        font-weight: 500;
        text-align: center
    }

    .planner-redesign #allInOne .containerr .cards__card-text p, .planner-redesign #allInOne .container .cards__card-text p {
        color: #7a7a7a;
        font-size: 18px;
        font-weight: 400;
        line-height: 24px;
        text-align: center
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-redesign #allInOne .containerr .cards__card-text, .planner-redesign #allInOne .container .cards__card-text {
        width: 100% !important;
        justify-content: flex-start;
        margin-left: 0 !important;
        padding: 0 3rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #allInOne .containerr .cards__card-text, .planner-redesign #allInOne .container .cards__card-text {
        margin-top: 65px
    }
}

@media(max-width:767px) {
    .planner-redesign #allInOne .containerr .cards__card-text, .planner-redesign #allInOne .container .cards__card-text {
        padding: 0 1.5rem !important;
        margin-top: 18px
    }
}

@media(max-width:767px) {
    .planner-redesign #allInOne .containerr .cards__card-animation, .planner-redesign #allInOne .container .cards__card-animation {
        display: flex !important;
        align-items: flex-start !important;
        justify-content: flex-end !important
    }
}

.planner-redesign #allInOne .containerr .cards__card-animation .img-mobile, .planner-redesign #allInOne .container .cards__card-animation .img-mobile {
    width: 230px;
    height: 200px;
    box-shadow: 0 0 24px -7px rgba(0,0,0,.664);
    border-bottom-left-radius: 12px
}

.planner-redesign #allInOne .containerr .cards__card-animation img, .planner-redesign #allInOne .container .cards__card-animation img {
    width: 100%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-redesign #allInOne .containerr .cards__card-animation, .planner-redesign #allInOne .container .cards__card-animation {
        min-height: 195px;
        width: 100% !important
    }
}

@media(max-width:767px) {
    .planner-redesign #allInOne .containerr .cards__card-animation, .planner-redesign #allInOne .container .cards__card-animation {
        min-height: auto !important;
        width: 100% !important
    }
}

.planner-redesign #allInOne .containerr .cards__card:nth-of-type(1), .planner-redesign #allInOne .containerr .cards__card:nth-of-type(5), .planner-redesign #allInOne .containerr .cards__card:nth-of-type(7), .planner-redesign #allInOne .container .cards__card:nth-of-type(1), .planner-redesign #allInOne .container .cards__card:nth-of-type(5), .planner-redesign #allInOne .container .cards__card:nth-of-type(7) {
    grid-area: 1/1/2/6;
    display: flex;
    width: 100%;
    padding: 0 2rem;
    overflow: hidden;
    position: relative
}

    .planner-redesign #allInOne .containerr .cards__card:nth-of-type(1) .cards__card-text, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(5) .cards__card-text, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(7) .cards__card-text, .planner-redesign #allInOne .container .cards__card:nth-of-type(1) .cards__card-text, .planner-redesign #allInOne .container .cards__card:nth-of-type(5) .cards__card-text, .planner-redesign #allInOne .container .cards__card:nth-of-type(7) .cards__card-text {
        width: 40.5%;
        margin-left: 51px
    }

    .planner-redesign #allInOne .containerr .cards__card:nth-of-type(1) .cards__card-animation, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(5) .cards__card-animation, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(7) .cards__card-animation, .planner-redesign #allInOne .container .cards__card:nth-of-type(1) .cards__card-animation, .planner-redesign #allInOne .container .cards__card:nth-of-type(5) .cards__card-animation, .planner-redesign #allInOne .container .cards__card:nth-of-type(7) .cards__card-animation {
        width: 59.5%;
        position: relative
    }

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #allInOne .containerr .cards__card:nth-of-type(1) .cards__card-animation, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(5) .cards__card-animation, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(7) .cards__card-animation, .planner-redesign #allInOne .container .cards__card:nth-of-type(1) .cards__card-animation, .planner-redesign #allInOne .container .cards__card:nth-of-type(5) .cards__card-animation, .planner-redesign #allInOne .container .cards__card:nth-of-type(7) .cards__card-animation {
        display: flex;
        justify-content: center
    }
}

.planner-redesign #allInOne .containerr .cards__card:nth-of-type(1) .cards__card-animation video, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(5) .cards__card-animation video, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(7) .cards__card-animation video, .planner-redesign #allInOne .container .cards__card:nth-of-type(1) .cards__card-animation video, .planner-redesign #allInOne .container .cards__card:nth-of-type(5) .cards__card-animation video, .planner-redesign #allInOne .container .cards__card:nth-of-type(7) .cards__card-animation video {
    width: 100%
}

.planner-redesign #allInOne .containerr .cards__card:nth-of-type(1) .cards__card-animation::before, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(5) .cards__card-animation::before, .planner-redesign #allInOne .containerr .cards__card:nth-of-type(7) .cards__card-animation::before, .planner-redesign #allInOne .container .cards__card:nth-of-type(1) .cards__card-animation::before, .planner-redesign #allInOne .container .cards__card:nth-of-type(5) .cards__card-animation::before, .planner-redesign #allInOne .container .cards__card:nth-of-type(7) .cards__card-animation::before {
    content: "";
    position: absolute;
    top: 33%;
    left: 10%;
    height: 30%;
    width: 60%;
    background-color: #2d80ebad;
    filter: blur(78px);
    transform: translate3d(0,0,0);
    z-index: -1
}

.planner-redesign #allInOne .containerr .cards__card:nth-of-type(2n), .planner-redesign #allInOne .container .cards__card:nth-of-type(2n) {
    grid-area: 2/1/3/4;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 50%;
    padding: 0 2rem;
    overflow: hidden
}

    .planner-redesign #allInOne .containerr .cards__card:nth-of-type(2n) .cards__card-text, .planner-redesign #allInOne .container .cards__card:nth-of-type(2n) .cards__card-text {
        align-items: center;
        justify-content: flex-start;
        margin-top: 1.5rem
    }

    .planner-redesign #allInOne .containerr .cards__card:nth-of-type(2n) .cards__card-animation, .planner-redesign #allInOne .container .cards__card:nth-of-type(2n) .cards__card-animation {
        width: 100%;
        position: relative
    }

        .planner-redesign #allInOne .containerr .cards__card:nth-of-type(2n) .cards__card-animation::before, .planner-redesign #allInOne .container .cards__card:nth-of-type(2n) .cards__card-animation::before {
            content: "";
            position: absolute;
            top: 19%;
            right: 10%;
            height: 30%;
            width: 30%;
            background-color: rgba(45,128,235,.678431);
            filter: blur(78px);
            z-index: -1
        }

        .planner-redesign #allInOne .containerr .cards__card:nth-of-type(2n) .cards__card-animation video, .planner-redesign #allInOne .container .cards__card:nth-of-type(2n) .cards__card-animation video {
            width: 100%
        }

.planner-redesign #allInOne .containerr .cards__card:nth-of-type(3n), .planner-redesign #allInOne .container .cards__card:nth-of-type(3n) {
    grid-area: 2/4/3/6;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 50%
}

    .planner-redesign #allInOne .containerr .cards__card:nth-of-type(3n) .cards__card-text, .planner-redesign #allInOne .container .cards__card:nth-of-type(3n) .cards__card-text {
        align-items: center;
        justify-content: flex-start;
        margin-top: 1.5rem;
        padding: 0 3rem
    }

    .planner-redesign #allInOne .containerr .cards__card:nth-of-type(3n) .cards__card-animation, .planner-redesign #allInOne .container .cards__card:nth-of-type(3n) .cards__card-animation {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative
    }

        .planner-redesign #allInOne .containerr .cards__card:nth-of-type(3n) .cards__card-animation::before, .planner-redesign #allInOne .container .cards__card:nth-of-type(3n) .cards__card-animation::before {
            content: "";
            position: absolute;
            top: 22%;
            left: 21%;
            height: 28%;
            width: 28%;
            background-color: #2d80eb;
            filter: blur(78px);
            z-index: -1
        }

        .planner-redesign #allInOne .containerr .cards__card:nth-of-type(3n) .cards__card-animation video, .planner-redesign #allInOne .container .cards__card:nth-of-type(3n) .cards__card-animation video {
            height: 100%
        }

        .planner-redesign #allInOne .containerr .cards__card:nth-of-type(3n) .cards__card-animation img, .planner-redesign #allInOne .container .cards__card:nth-of-type(3n) .cards__card-animation img {
            width: 260px;
            height: 220px
        }

@media(max-width:767px) {
    .planner-redesign #allInOne .containerr .cards__card:nth-of-type(3n) .cards__card-animation img, .planner-redesign #allInOne .container .cards__card:nth-of-type(3n) .cards__card-animation img {
        width: 230px;
        height: 200px
    }
}

.planner-redesign #allInOne .containerr .cards__card:nth-of-type(3n) .cards__card-animation img.safari, .planner-redesign #allInOne .container .cards__card:nth-of-type(3n) .cards__card-animation img.safari {
    width: 260px !important;
    height: 220px !important
}

.planner-redesign #carousel {
    padding-top: 180px;
    background: linear-gradient(0deg,rgba(0,0,0,0) 0%,#588acc 60%,#fff 100%)
}

@media(max-width:767px) {
    .planner-redesign #carousel {
        padding-top: 95px
    }
}

.planner-redesign #carousel .owl-carousel .active.center .cards__card {
    border-radius: 32px;
    background: linear-gradient(82deg,rgba(45,128,235,0.24),rgba(234,242,253,0)) !important;
    backdrop-filter: blur(37.5px);
    -webkit-backdrop-filter: blur(37.5px);
    box-shadow: 0 0 23px 0 rgba(45,128,235,.24)
}

.planner-redesign #carousel h2 {
    text-align: center;
    font-size: 64px;
    line-height: 64px;
    font-weight: 700;
    background: linear-gradient(93deg,#f5f5f5 53.98%,rgba(255,255,255,0.38) 87.13%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    padding-bottom: .5rem
}

@media(max-width:767px) {
    .planner-redesign #carousel h2 {
        padding: 0 1rem 1rem .5rem;
        font-size: 41px;
        line-height: 41px
    }
}

.planner-redesign #carousel p.claim {
    color: #d1d0d1;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    transition-delay: 200ms;
    margin-bottom: 65px
}

.planner-redesign #carousel .cards {
    width: 100%;
    display: grid;
    overflow: hidden
}

.planner-redesign #carousel .cards__card {
    height: 300px;
    border-radius: 32px;
    background: linear-gradient(82deg,rgba(234,242,253,0.08),rgba(234,242,253,0));
    backdrop-filter: blur(37.5px);
    -webkit-backdrop-filter: blur(37.5px);
    border: 1px solid #eaf2fd24;
    padding: 38px 31px;
    display: grid;
    margin: 1rem 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-redesign #carousel .cards__card {
        height: 360px
    }
}

.planner-redesign #carousel .cards__card h4 {
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 32px;
    height: fit-content;
    align-self: flex-end
}

.planner-redesign #carousel .cards__card p {
    margin: 0;
    align-self: flex-end;
    display: flex;
    flex-direction: column;
    color: #fff;
    font-size: 18px;
    font-weight: 700
}

.planner-redesign #carousel .cards__card span {
    color: #fff;
    font-size: 18px;
    font-weight: 400
}

.planner-redesign #important-integrations {
    margin-top: 300px;
    position: relative
}

@media(max-width:767px) {
    .planner-redesign #important-integrations {
        margin-top: 120px
    }
}

.planner-redesign #important-integrations::before {
    content: "";
    position: absolute;
    width: 400px;
    height: 400px;
    border-radius: 600px;
    background: #2d80eb;
    filter: blur(400px);
    transform: translate3d(0,0,0)
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-redesign #important-integrations::before {
        width: 75vw;
        left: 0
    }
}

.planner-redesign #important-integrations .container {
    position: relative
}

    .planner-redesign #important-integrations .container h2 {
        text-align: center;
        font-size: 64px;
        line-height: 64px;
        padding-bottom: .5rem;
        font-weight: 700;
        background: linear-gradient(180deg,#f5f5f5 0%,#ffc502 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent
    }

@media(max-width:767px) {
    .planner-redesign #important-integrations .container h2 {
        padding: 0 1rem 1rem .5rem;
        font-size: 41px;
        line-height: 41px
    }
}

.planner-redesign #important-integrations .container p {
    color: #d1d0d1;
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    line-height: 36px;
    transition-delay: 200ms
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container p {
        font-size: 18px;
        line-height: 28px;
        padding: 0 1rem
    }
}

.planner-redesign #important-integrations .container .bubbles {
    position: relative;
    width: 100%;
    height: 20rem
}

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #important-integrations .container .bubbles {
        height: 15rem
    }
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles {
        height: 10rem
    }
}

.planner-redesign #important-integrations .container .bubbles::before {
    content: "";
    position: absolute;
    top: -5rem;
    left: 20%;
    width: 600px;
    height: 600px;
    border-radius: 600px;
    background: #25cf61be;
    filter: blur(400px);
    transform: translate3d(0,0,0)
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles::before {
        width: 75vw;
        left: 0
    }
}

.planner-redesign #important-integrations .container .bubbles__bubble {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    border-radius: 80px;
    background: linear-gradient(0deg,rgba(234,242,253,0.2),rgba(217,217,217,0));
    border: 1px solid #ffffff2e;
    backdrop-filter: blur(37.5px);
    -webkit-backdrop-filter: blur(37.5px)
}

    .planner-redesign #important-integrations .container .bubbles__bubble:first-of-type {
        top: 7rem;
        left: 20%;
        padding: 20px;
        animation: randomMovement 4s linear infinite .5s
    }

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:first-of-type {
        animation: none
    }
}

.planner-redesign #important-integrations .container .bubbles__bubble:first-of-type svg {
    width: 40px
}

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:first-of-type {
        top: 8rem;
        left: 5%
    }
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:first-of-type {
        left: 3%
    }
}

.planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(2) {
    width: 140px;
    height: 140px;
    top: 10rem;
    left: 39%;
    box-shadow: 0 0 31px -3px #2466bc;
    animation: randomMovement 4s linear infinite 1s
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(2) {
        animation: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(2) {
        top: 11rem;
        left: 30%
    }
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(2) {
        left: 30%
    }
}

.planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(3) {
    top: 6rem;
    left: 53%;
    padding: 25px;
    box-shadow: 0 4px 11px 0 #2466bc;
    animation: randomMovement 4s linear infinite 1.5s
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(3) {
        animation: none
    }
}

.planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(3) svg {
    width: 50px
}

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(3) {
        top: 2.5rem
    }
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(3) {
        top: 1rem
    }
}

.planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(4) {
    top: 9rem;
    right: 20%;
    padding: 32px 10px;
    animation: randomMovement 4s linear infinite 2s
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(4) {
        animation: none
    }
}

.planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(4) svg {
    width: 59px
}

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(4) {
        top: 10rem;
        right: 5%
    }
}

@media(max-width:767px) {
    .planner-redesign #important-integrations .container .bubbles__bubble:nth-of-type(4) {
        right: 3%
    }
}

.planner-redesign #plans {
    margin-top: 300px
}

    .planner-redesign #plans .container {
        display: flex;
        flex-direction: column;
        align-items: center
    }

        .planner-redesign #plans .container h2 {
            text-align: center;
            font-size: 64px;
            line-height: 64px;
            font-weight: 700;
            background: linear-gradient(156deg,#f5f5f5 0%,rgba(255,255,255,0.38));
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
            margin-bottom: 32px
        }

@media(max-width:767px) {
    .planner-redesign #plans .container h2 {
        padding: 0 1rem 1rem .5rem;
        font-size: 41px;
        line-height: 41px
    }
}

.planner-redesign #plans .container p {
    color: #fff;
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    margin-bottom: 32px
}

@media(max-width:767px) {
    .planner-redesign #plans .container p {
        font-size: 18px;
        line-height: 28px;
        padding: 0 1rem
    }
}

.planner-redesign #plans .container .switch {
    position: relative;
    margin-bottom: 48px;
    width: 348px;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    border-radius: 32px;
    border: 1px solid #ffffff1c;
    background: linear-gradient(113deg,rgba(234,242,253,0.08),rgba(234,242,253,0.08));
    backdrop-filter: blur(37.5px);
    -webkit-backdrop-filter: blur(37.5px)
}

    .planner-redesign #plans .container .switch.left::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 50%;
        background: linear-gradient(89deg,rgba(255,255,255,0.493),rgba(255,255,255,0.12),rgba(234,242,253,0.08));
        backdrop-filter: blur(37.5px);
        border-radius: 32px;
        transition: all .3s ease-in-out
    }

        .planner-redesign #plans .container .switch.left::after:hover {
            cursor: pointer
        }

    .planner-redesign #plans .container .switch.right::after {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        height: 100%;
        width: 50%;
        color: var(--white,#fff);
        background: linear-gradient(89deg,rgba(255,255,255,0.493),rgba(255,255,255,0.12),rgba(234,242,253,0.08));
        backdrop-filter: blur(37.5px);
        border-radius: 32px;
        transition: all .3s ease-in-out
    }

        .planner-redesign #plans .container .switch.right::after:hover {
            cursor: pointer
        }

    .planner-redesign #plans .container .switch a {
        color: #d1d0d1;
        font-family: lato,sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 24px;
        text-align: center;
        padding: .3rem 0;
        border-radius: 32px;
        transition: all .5s ease-in-out
    }

        .planner-redesign #plans .container .switch a:hover {
            cursor: pointer
        }

        .planner-redesign #plans .container .switch a.active {
            color: var(--white,#fff)
        }

        .planner-redesign #plans .container .switch a span {
            color: #2d80eb;
            font-family: lato,sans-serif;
            font-size: 18px;
            font-weight: 700;
            line-height: 24px
        }

.planner-redesign #plans .container .cards {
    display: grid;
    grid-template-columns: repeat(2,414px);
    gap: 58px;
    margin: 0 auto
}

@media(min-width:768px) and (max-width:991px) {
    .planner-redesign #plans .container .cards {
        grid-template-columns: repeat(2,1fr);
        gap: 20px
    }
}

@media(max-width:767px) {
    .planner-redesign #plans .container .cards {
        grid-template-columns: 1fr
    }
}

.planner-redesign #plans .container .cards__card {
    padding: 32px 40px 48px;
    display: flex;
    align-items: center;
    flex-direction: column;
    border-radius: 32px;
    background: linear-gradient(112.54deg,rgba(234,242,253,0.12) 10.29%,rgba(234,242,253,0) 100.35%);
    backdrop-filter: blur(37.5px);
    -webkit-backdrop-filter: blur(37.5px);
    border: 1px solid rgba(226,238,255,.04)
}

    .planner-redesign #plans .container .cards__card:nth-of-type(2) {
        position: relative
    }

        .planner-redesign #plans .container .cards__card:nth-of-type(2)::before {
            content: "";
            position: absolute;
            top: -5rem;
            width: 450px;
            height: 450px;
            border-radius: 600px;
            background: #2d80eb;
            transform: translate3d(0,0,0);
            filter: blur(430px)
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-redesign #plans .container .cards__card:nth-of-type(2)::before {
        width: auto;
        left: 0
    }
}

.planner-redesign #plans .container .cards__card span {
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    font-family: Lato;
    margin-bottom: 32px
}

.planner-redesign #plans .container .cards__card h3 {
    color: #fff;
    font-family: lato;
    font-size: 28px;
    font-weight: 500;
    position: relative
}

    .planner-redesign #plans .container .cards__card h3 span.discount {
        position: absolute;
        left: -4.3rem;
        bottom: 0
    }

        .planner-redesign #plans .container .cards__card h3 span.discount::after {
            content: "";
            position: absolute;
            top: 8px;
            left: 0;
            margin-left: -5px;
            width: calc(100% + 10px);
            height: 2px;
            background-color: #a7a6a7;
            border-radius: 10px
        }

    .planner-redesign #plans .container .cards__card h3 span.user {
        position: absolute;
        right: -3rem;
        bottom: 0;
        color: #fff
    }

.planner-redesign #plans .container .cards__card p.per-user {
    font-family: Lato;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 36px;
    padding: 2px 16px 4px;
    margin-top: 6px
}

    .planner-redesign #plans .container .cards__card p.per-user.label {
        background: linear-gradient(104.16deg,#2d80eb 16.09%,#2466bc 83.91%,#2466bc 83.91%);
        border-radius: 26px
    }

.planner-redesign #plans .container .cards__card-list {
    margin-bottom: 40px
}

    .planner-redesign #plans .container .cards__card-list p {
        font-family: Lato;
        font-size: 18px;
        font-weight: 700;
        line-height: 32px;
        color: #fff;
        margin-bottom: 0;
        text-align: left;
        margin-bottom: 20px
    }

    .planner-redesign #plans .container .cards__card-list ul {
        padding: 0 0 0 1.2rem;
        list-style: none;
        list-style-image: url(/img/planner/redesign/Vector.svg);
        height: 100%;
        display: flex;
        flex-direction: column;
        gap: 1rem
    }

        .planner-redesign #plans .container .cards__card-list ul li {
            color: #e3e3e3;
            font-size: 18px;
            padding-left: .4rem;
            font-family: Lato;
            font-size: 18px;
            font-weight: 400
        }

.planner-redesign #plans .container .cards__card a {
    width: 100%;
    margin-top: auto
}

.planner-redesign #transparent-banner {
    margin: 300px 0
}

@media(max-width:767px) {
    .planner-redesign #transparent-banner {
        margin: 140px 0
    }
}

.planner-redesign #transparent-banner .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .planner-redesign #transparent-banner .container h2 {
        margin-bottom: 32px;
        text-align: center;
        font-size: 64px;
        font-weight: 700;
        background: linear-gradient(151.08deg,#f5f5f5 17.79%,rgba(45,128,235,0.7) 98.03%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent
    }

@media(max-width:767px) {
    .planner-redesign #transparent-banner .container h2 {
        padding: 0 1rem 1rem .5rem;
        font-size: 41px;
        line-height: 41px
    }
}

.kiosk .btn-filled {
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

.kiosk .borders-img {
    border-radius: 13px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

.kiosk .img-padding {
    padding: 1rem
}

.kiosk #top {
    padding: 0 !important;
    overflow: hidden
}

    .kiosk #top .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 11%;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        display: flex;
        flex-direction: row
    }

@media(max-width:767px) {
    .kiosk #top .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #top .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .kiosk #top .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .kiosk #top .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .kiosk #top .container--custom {
        width: 100%
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .kiosk #top .container--custom {
        flex-direction: column
    }
}

.kiosk #top .container--custom .top__content {
    width: 40%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .kiosk #top .container--custom .top__content {
        width: 100%;
        align-items: center;
        justify-content: center;
        margin-bottom: 2rem;
        margin-top: 0 !important;
        text-align: center
    }
}

.kiosk #top .container--custom .top__content h1 {
    font-size: 52px;
    font-weight: 700;
    width: 75%;
    margin-top: 0 !important
}

@media(max-width:767px) {
    .kiosk #top .container--custom .top__content h1 {
        width: 100%
    }
}

.kiosk #top .container--custom .top__content h2 {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    font-family: nunito sans,sans-serif;
    line-height: 1.89;
    width: 80%
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #top .container--custom .top__content h2 {
        text-align: center
    }
}

@media(max-width:767px) {
    .kiosk #top .container--custom .top__content h2 {
        width: 100%
    }
}

@media(max-width:767px) {
    .kiosk #top .container--custom .top__content .button-wrapper {
        align-self: center
    }
}

.kiosk #top .container--custom .top__img {
    display: flex;
    justify-content: flex-end;
    width: 60%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .kiosk #top .container--custom .top__img {
        width: 100%
    }
}

.kiosk #top .container--custom .top__img img {
    width: 100%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .kiosk #top .container--custom .top__img img {
        margin-right: -3rem
    }
}

.kiosk #grey-banner {
    padding-bottom: 2.5rem !important
}

@media(max-width:767px) {
    .kiosk #grey-banner {
        padding-bottom: 0 !important
    }
}

.kiosk #grey-banner .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .kiosk #grey-banner .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #grey-banner .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .kiosk #grey-banner .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .kiosk #grey-banner .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .kiosk #grey-banner .container--custom {
        width: 1440px
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .kiosk #grey-banner .container--custom {
        padding-top: 7.5rem !important
    }
}

.kiosk #grey-banner .container--custom .grey-banner__content {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f3f3f3;
    width: 100%;
    text-align: center;
    padding: 3rem 0;
    border-radius: 26px;
    position: relative;
    overflow: hidden
}

    .kiosk #grey-banner .container--custom .grey-banner__content p {
        width: 70%;
        font-size: 36px;
        font-weight: 700;
        line-height: normal;
        z-index: 1;
        margin: 0;
        padding: 0
    }

    .kiosk #grey-banner .container--custom .grey-banner__content span {
        color: #ffc502
    }

    .kiosk #grey-banner .container--custom .grey-banner__content img {
        position: absolute;
        bottom: -.5rem;
        right: -.5rem
    }

@media(max-width:767px) {
    .kiosk #features {
        margin-top: 0
    }
}

.kiosk #features .row {
    overflow: hidden
}

.kiosk #features .features__img img {
    margin-right: -3.5rem;
    overflow: auto
}

.kiosk #features .features__img--left {
    justify-content: flex-start
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .kiosk #features .features__img--left img {
        margin-left: -3rem
    }
}

.kiosk #features .margin-left img {
    width: 120%;
    margin-left: -11rem !important
}

@media(max-width:767px) {
    .kiosk #features .margin-left img {
        margin-left: -8rem !important
    }
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #features .margin-left img {
        margin-left: -11rem !important
    }
}

.kiosk #features p {
    margin-bottom: 3rem !important;
    font-size: 18px !important
}

.kiosk #other-features {
    text-align: center
}

    .kiosk #other-features .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }

@media(max-width:767px) {
    .kiosk #other-features .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #other-features .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .kiosk #other-features .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .kiosk #other-features .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .kiosk #other-features .container--custom {
        width: 1440px
    }
}

.kiosk #other-features .container--custom .features__heading {
    width: 100%
}

    .kiosk #other-features .container--custom .features__heading .special__paragraph-heading {
        margin-bottom: 4rem
    }

    .kiosk #other-features .container--custom .features__heading h2 {
        font-size: 36px;
        font-weight: 700;
        margin: 2rem 0;
        padding: 0 8rem;
        text-align: center
    }

@media(max-width:767px) {
    .kiosk #other-features .container--custom .features__heading h2 {
        padding: 0 1rem 0 0;
        font-size: 28px;
        text-align: left
    }
}

.kiosk #other-features .container--custom .features__boxes {
    display: flex;
    flex-wrap: wrap
}

    .kiosk #other-features .container--custom .features__boxes .col-6 {
        flex: 0 0 48%;
        max-width: 48%
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .kiosk #other-features .container--custom .features__boxes .col-6 {
        flex: 0 0 100%;
        max-width: 100%
    }
}

.kiosk #other-features .container--custom .features__boxes .features__boxes--single {
    padding: 4rem 3rem 0;
    overflow: hidden;
    background-color: #f3f3f3;
    border-radius: 20px;
    margin: 10px
}

@media(max-width:767px) {
    .kiosk #other-features .container--custom .features__boxes .features__boxes--single {
        margin: 0 0 10px;
        padding: 2rem 0 0 1rem
    }
}

.kiosk #other-features .container--custom .features__boxes .features__boxes--single h2 {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 1rem;
    text-align: left
}

.kiosk #other-features .container--custom .features__boxes .features__boxes--single p {
    margin-bottom: 2rem;
    text-align: left;
    padding-right: 20px;
    min-height: 100px
}

@media(max-width:767px) {
    .kiosk #other-features .container--custom .features__boxes .features__boxes--single p {
        padding-right: 0
    }
}

.kiosk #other-features .container--custom .features__boxes .features__boxes--single img {
    width: 100%;
    margin-bottom: -6rem
}

.kiosk #other-features .container--custom .features__boxes .special__box--img img {
    margin-right: -9rem
}

.kiosk #other-features .container--custom .features__button {
    width: 100%;
    margin: 2rem 0
}

.kiosk #admins-only {
    background: #f3f3f3;
    background: linear-gradient(0deg,#f3f3f3 0%,#fff 100%);
    padding-bottom: 7.5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .kiosk #admins-only {
        padding-bottom: 4rem
    }
}

.kiosk #admins-only .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto
}

@media(max-width:767px) {
    .kiosk #admins-only .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #admins-only .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .kiosk #admins-only .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .kiosk #admins-only .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .kiosk #admins-only .container--custom {
        width: 1440px
    }
}

.kiosk #admins-only .container--custom .admins-only__heading {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

@media(max-width:767px) {
    .kiosk #admins-only .container--custom .admins-only__heading {
        align-items: flex-start
    }
}

.kiosk #admins-only .container--custom .admins-only__heading h2 {
    font-size: 36px;
    font-weight: 700;
    margin: 1.5rem 0 4rem;
    width: 55%;
    text-align: center
}

@media(max-width:767px) {
    .kiosk #admins-only .container--custom .admins-only__heading h2 {
        align-items: flex-start;
        width: 100%;
        text-align: left
    }
}

.kiosk #admins-only .container--custom .admins-only__boxes {
    width: 100%;
    display: flex
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .kiosk #admins-only .container--custom .admins-only__boxes {
        flex-direction: column
    }
}

.kiosk #admins-only .container--custom .admins-only__boxes--box {
    width: 25%;
    padding: 3.5rem 3rem 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #admins-only .container--custom .admins-only__boxes--box {
        flex-direction: row;
        width: 100%;
        border-left: 0;
        border-top: 1px solid #ddd;
        padding: 1.5rem 3rem 0
    }
}

@media(max-width:767px) {
    .kiosk #admins-only .container--custom .admins-only__boxes--box {
        flex-direction: row;
        width: 100%;
        border-left: 0;
        border-top: 2px solid #ddd;
        padding: 1.5rem 1rem 0
    }
}

.kiosk #admins-only .container--custom .admins-only__boxes--box span {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffc502;
    border-radius: 100px;
    width: 64px;
    height: 64px;
    color: #fff;
    margin-bottom: 3.5rem;
    font-size: 24px
}

@media(min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .kiosk #admins-only .container--custom .admins-only__boxes--box span {
        margin-right: 1.5rem;
        padding: 1.5rem
    }
}

.kiosk #admins-only .container--custom .admins-only__boxes--box p {
    font-size: 22px
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .kiosk #admins-only .container--custom .admins-only__boxes--box::after {
        content: "";
        background-color: #ddd;
        position: absolute;
        left: 0;
        top: 0;
        width: 1px;
        height: 85%
    }
}

.kiosk #admins-only .container--custom .admins-only__button {
    margin-top: 3rem;
    display: flex;
    align-items: center;
    justify-content: center
}

.kiosk #apps {
    margin-top: 7rem
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #apps .container {
        width: 580px
    }
}

.kiosk #apps h5 {
    color: #ffc502;
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 600
}

@media(max-width:767px) {
    .kiosk #apps h5 {
        text-align: left
    }
}

.kiosk #apps h2 {
    font-size: 36px;
    font-weight: 700;
    text-align: center;
    margin: 2rem 0 4rem
}

@media(max-width:767px) {
    .kiosk #apps h2 {
        font-size: 28px;
        text-align: left
    }
}

.kiosk #apps .row {
    flex-wrap: nowrap
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .kiosk #apps .row {
        flex-wrap: wrap
    }
}

.kiosk #apps .row .apps__box {
    background-color: #f3f3f3;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    margin-right: 15px;
    text-align: left;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #apps .row .apps__box {
        margin-bottom: 2rem
    }
}

@media(max-width:767px) {
    .kiosk #apps .row .apps__box {
        margin: 0 1rem 2rem
    }
}

.kiosk #apps .row .apps__box h2 {
    margin: 0 0 1rem;
    text-align: left;
    padding: 3rem 1rem 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .kiosk #apps .row .apps__box h2 {
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .kiosk #apps .row .apps__box .apps__box--img {
        text-align: center
    }
}

.kiosk #apps .row .apps__box .apps__box--img img {
    width: 100%;
    margin-bottom: -8rem;
    padding: 1rem 0 0 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #apps .row .apps__box .apps__box--img img {
        padding: 1rem 2rem 0 5rem
    }
}

@media(max-width:767px) {
    .kiosk #apps .row .apps__box .apps__box--img img {
        margin-bottom: -3rem;
        padding: 1rem 0 0 2rem
    }
}

.kiosk #apps .row .apps__box img {
    width: 100%;
    margin-bottom: -3rem;
    padding: 1rem 0 0 2rem
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #apps .row .apps__box img {
        margin-bottom: -4rem;
        padding: 1rem 5rem 0 7rem
    }
}

@media(max-width:767px) {
    .kiosk #apps .row .apps__box img {
        margin-bottom: -3rem;
        padding: 1rem 2rem 0 3rem
    }
}

.kiosk #apps .row .apps__box .apps__box--icons {
    display: flex;
    align-items: center;
    flex: 1;
    margin-bottom: 1rem;
    padding: 0 1rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .kiosk #apps .row .apps__box .apps__box--icons {
        justify-content: center;
        padding: 0
    }
}

.kiosk #apps .row .apps__box .apps__box--icons a {
    display: flex
}

    .kiosk #apps .row .apps__box .apps__box--icons a:hover {
        cursor: pointer
    }

.kiosk #apps .row .apps__box .apps__box--icons img {
    width: inherit;
    margin-bottom: 0;
    padding: 0
}

.kiosk #apps .row .apps__box .apps__box--icons span {
    font-size: 1rem;
    color: #767676;
    padding: 0 1rem 0 .5rem;
    transition: all .3s
}

    .kiosk #apps .row .apps__box .apps__box--icons span:hover {
        color: #ffc502
    }

@media(max-width:767px) {
    .kiosk #apps .row .apps__box .apps__box--icons span {
        font-size: 14px
    }
}

.kiosk #apps .row .apps__button {
    display: flex;
    margin: 5rem auto 0
}

@media(min-width:768px) and (max-width:991px) {
    .kiosk #apps .row .apps__button {
        margin: 2rem auto 0
    }
}

.kiosk #apps .row .apps__button .btn-filled {
    border-radius: 26px;
    padding: 16px 55px;
    font-size: 20px;
    color: #1b1b20;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

@media(max-width:767px) {
    .kiosk #apps .row .apps__button {
        margin: 3rem auto
    }
}

.kiosk #bannerBookaDemoBlack {
    margin-bottom: 10rem
}

.mainCustomerStories .img {
    transition: all .2s ease-in-out;
    padding-right: 76px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .mainCustomerStories .img {
        margin-top: 2rem;
        padding-right: 15px
    }
}

.mainCustomerStories .img:hover > .text {
    background-color: #fff;
    box-shadow: 2px 2px 18px 0 rgba(212,229,234,.53)
}

    .mainCustomerStories .img:hover > .text > h2 {
        text-decoration: underline
    }

.mainCustomerStories .img:hover {
    transform: scale(1.02)
}

.mainCustomerStories .img img {
    width: 100%
}

.mainCustomerStories section#top {
    background-color: #f3f3f3
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .mainCustomerStories section#top .col-lg-6 {
        text-align: center
    }
}

.mainCustomerStories section#top .col-lg-6 p.date {
    font-size: 16px;
    font-weight: 600;
    color: #1b1b20;
    margin-top: 10%
}

.mainCustomerStories section#top .col-lg-6 h2, .mainCustomerStories section#top .col-lg-6 h1 {
    font-size: 30px;
    font-weight: 800;
    position: relative;
    z-index: 1;
    margin-bottom: 1rem
}

.mainCustomerStories section#top .col-lg-6 p.description {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.9;
    margin-bottom: 2rem
}

.mainCustomerStories section#top .col-lg-6 .button-container button.btn-highlighted {
    border: 2px solid #3c91e6;
    padding: .5rem 1.5rem
}

.mainCustomerStories section#top .white-bg {
    padding: 0 3rem
}

.mainCustomerStories section#two-cs .col-sm-12 {
    text-align: center;
    margin: 4rem 0 6rem
}

    .mainCustomerStories section#two-cs .col-sm-12 h1 {
        font-size: 41px;
        font-weight: 800
    }

.mainCustomerStories section#two-cs .col-lg-6 .text {
    padding-left: 2rem
}

    .mainCustomerStories section#two-cs .col-lg-6 .text h2 {
        font-size: 24px;
        font-weight: 800;
        padding: 1.5rem 0;
        position: relative;
        z-index: 1;
        width: 80%
    }

    .mainCustomerStories section#two-cs .col-lg-6 .text .company-name {
        text-transform: uppercase;
        color: #1b1b20;
        font-size: 15px;
        font-weight: 700;
        padding-bottom: 2rem
    }

.mainCustomerStories #customer-stories-list {
    margin-bottom: 3rem
}

    .mainCustomerStories #customer-stories-list .row {
        justify-content: center
    }

        .mainCustomerStories #customer-stories-list .row .col-sm-12 {
            text-align: center;
            margin: 4rem 0 6rem
        }

            .mainCustomerStories #customer-stories-list .row .col-sm-12 h2 {
                font-size: 41px;
                font-weight: 800
            }

        .mainCustomerStories #customer-stories-list .row .col-lg-3 {
            margin-bottom: 1rem;
            padding-right: 40px
        }

@media(max-width:991px) {
    .mainCustomerStories #customer-stories-list .row .col-lg-3 {
        padding-right: 15px
    }
}

.mainCustomerStories #customer-stories-list .row .col-lg-3 .text {
    padding-left: 1rem
}

    .mainCustomerStories #customer-stories-list .row .col-lg-3 .text h2 {
        font-size: 24px;
        font-weight: 800;
        padding: 1.5rem 0;
        line-height: 1.5;
        position: relative;
        z-index: 1
    }

    .mainCustomerStories #customer-stories-list .row .col-lg-3 .text .company-name {
        text-transform: uppercase;
        color: #1b1b20;
        font-size: 15px;
        font-weight: 700;
        padding-bottom: 2rem
    }

.mainCustomerStories .author {
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #1b1b20
}

    .mainCustomerStories .author img {
        border-radius: 50%
    }

    .mainCustomerStories .author p {
        margin: 0 0 0 .5rem;
        font-size: 14px;
        font-weight: 600
    }

.mainCustomerStories #case-studies .container--custom {
    width: 100%;
    padding-right: 3rem;
    padding-left: 3rem;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3rem !important
}

@media(max-width:767px) {
    .mainCustomerStories #case-studies .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .mainCustomerStories #case-studies .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .mainCustomerStories #case-studies .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .mainCustomerStories #case-studies .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .mainCustomerStories #case-studies .container--custom {
        width: 100%
    }
}

.mainCustomerStories #case-studies .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center
}

    .mainCustomerStories #case-studies .container--custom .row .case-studies__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        height: 70vw
    }

        .mainCustomerStories #case-studies .container--custom .row .case-studies__heading h1 {
            font-size: 52px;
            font-weight: 700
        }

        .mainCustomerStories #case-studies .container--custom .row .case-studies__heading h2 {
            font-size: 18px;
            font-weight: 600;
            line-height: 1.89;
            color: #767676
        }

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 2rem
    }

@media(min-width:768px) and (max-width:991px) {
    .mainCustomerStories #case-studies .container--custom .row .case-studies__content {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:767px) {
    .mainCustomerStories #case-studies .container--custom .row .case-studies__content {
        grid-template-columns: 1fr
    }
}

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case {
    margin-bottom: 4rem
}

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__img img {
    width: 100%;
    border-top-left-radius: 26px;
    border-top-right-radius: 26px
}

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__greenbar {
    background-color: #ffc502;
    display: flex
}

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__greenbar__element {
    width: 33.3%;
    padding: 1rem 0 1rem 1rem
}

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__greenbar__element p {
        margin-top: 1rem;
        font-size: 14px;
        font-weight: 700;
        color: #fff
    }

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__greenbar__element img {
        height: 35px
    }

.mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__content {
    height: 100%
}

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__content h3 {
        padding: 1.5rem 0;
        font-size: 36px;
        font-weight: 700
    }

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__content p {
        font-size: 18px;
        line-height: 1.44;
        margin-bottom: 2.5rem
    }

    .mainCustomerStories #case-studies .container--custom .row .case-studies__content .single-case__content a {
        padding: 1rem 2rem !important;
        color: #fff;
        font-weight: 700;
        font-size: 16px;
        background-color: #ffc502;
        border-radius: 26px;
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
    }

.singleCS section#top {
    background-color: #fff
}

    .singleCS section#top a, .singleCS section#top a:hover {
        color: #00bf71;
        text-decoration: none
    }

    .singleCS section#top .container .row .white-bg {
        background-color: #fff;
        display: flex;
        justify-content: center;
        flex-direction: column;
        position: relative;
        top: 2rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleCS section#top .container .row .white-bg {
        align-items: center
    }
}

.singleCS section#top .container .row .white-bg p.green {
    color: #00bf71;
    font-size: 14px;
    font-weight: 700
}

.singleCS section#top .container .row .white-bg h1 {
    font-size: 40px
}

.singleCS section#top .container .row .img {
    padding-left: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleCS section#top .container .row .img {
        padding-left: 15px;
        margin-top: 4rem
    }
}

.singleCS section#top .container .row .col-sm-12 {
    margin: 6rem 0 0;
    text-align: center
}

@media(max-width:767px) {
    .singleCS section#top .container .row .col-sm-12 {
        margin: 0
    }
}

.singleCS section#top .container .row .col-sm-12 img {
    width: 10rem;
    margin-top: 6rem
}

.singleCS section#top .container .row .about-company {
    font-weight: 700
}

    .singleCS section#top .container .row .about-company .company-name-green, .singleCS section#top .container .row .about-company .description {
        font-size: 22px;
        line-height: 1.2
    }

    .singleCS section#top .container .row .about-company .title {
        font-size: 14px;
        color: #1b1b20;
        margin-bottom: .5rem
    }

    .singleCS section#top .container .row .about-company .company-name-green {
        color: #00bf71
    }

    .singleCS section#top .container .row .about-company .description {
        color: #1b1b20
    }

.singleCS #content {
    margin-top: 5rem
}

    .singleCS #content a, .singleCS #content a:hover {
        color: #00bf71;
        text-decoration: none
    }

    .singleCS #content .container .row h2 {
        font-size: 25px;
        font-weight: 700;
        margin-bottom: 1.5rem
    }

    .singleCS #content .container .row p {
        font-size: 18px;
        font-weight: 600;
        line-height: 1.9
    }

        .singleCS #content .container .row p strong {
            font-weight: 700
        }

    .singleCS #content .container .row img {
        margin-top: 2rem;
        margin-bottom: 4rem;
        width: 100%
    }

@media(max-width:767px) {
    .singleCS #content .container .row .customer-second-img {
        height: 6%
    }
}

.singleCS #content .container .row blockquote {
    font-family: lato,sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.54;
    margin: 2rem 0
}

    .singleCS #content .container .row blockquote strong {
        font-weight: 700
    }

.singleCS #content .container .row .wrapper {
    width: 80%;
    margin: 0 auto
}

    .singleCS #content .container .row .wrapper h2 {
        margin-top: 2rem
    }

    .singleCS #content .container .row .wrapper .read-more {
        margin: 4rem 0;
        background-color: #f3f3f3;
        display: flex;
        align-items: center
    }

        .singleCS #content .container .row .wrapper .read-more .left {
            padding: 3rem 0 3rem 3rem
        }

            .singleCS #content .container .row .wrapper .read-more .left img {
                width: 100%;
                margin: 0
            }

        .singleCS #content .container .row .wrapper .read-more .right {
            padding: 3rem
        }

            .singleCS #content .container .row .wrapper .read-more .right p {
                margin-top: 3rem;
                text-align: right;
                font-weight: 700
            }

.singleCS #content .container .row .about {
    padding: 0 0 1rem 4rem;
    background-color: #f3f3f3;
    margin: 2rem 0 4rem;
    display: flex
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .singleCS #content .container .row .about {
        flex-direction: column;
        align-items: center;
        padding: 0 0 1rem
    }
}

.singleCS #content .container .row .about .left .name {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 0;
    margin-top: 1rem;
    margin-left: 2rem;
    line-height: normal
}

.singleCS #content .container .row .about .left .role {
    font-size: 16px;
    font-weight: 400;
    margin-left: 2rem
}

.singleCS #content .container .row .about .left img {
    width: 300px;
    margin-bottom: 0
}

.singleCS #content .container .row .about .right {
    width: 58%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-direction: column
}

    .singleCS #content .container .row .about .right h2 {
        position: relative;
        z-index: 1
    }

        .singleCS #content .container .row .about .right h2 p {
            font-size: 18px;
            font-weight: 600
        }

.singleCS #cs-carousel .container .row .col-sm-12 {
    margin-top: 8rem;
    margin-bottom: 5rem
}

    .singleCS #cs-carousel .container .row .col-sm-12 h2 {
        font-size: 36px;
        font-weight: 800;
        text-align: center
    }

.singleCS #cs-carousel .container .row .customer-stories-cards .row {
    margin: 0
}

.singleCS #cs-carousel .container .row .articles-container .col-sm-12 {
    width: 70%;
    margin: 0 auto 3rem
}

@media(max-width:440px) {
    .singleCS #cs-carousel .container .row .articles-container .col-sm-12 {
        width: 90%
    }
}

.singleCS #cs-carousel .container .row .articles-container .card {
    height: 100%;
    border: 1px solid #1b1b20;
    border: none;
    transition: all .2s ease-in-out
}

    .singleCS #cs-carousel .container .row .articles-container .card:hover {
        box-shadow: 2px -3px 26px 0 rgba(200,215,243,.5);
        transform: scale(1.07);
        cursor: pointer
    }

    .singleCS #cs-carousel .container .row .articles-container .card img {
        margin: 0
    }

    .singleCS #cs-carousel .container .row .articles-container .card .company-name {
        text-transform: uppercase;
        color: #3c91e6;
        font-size: 14px;
        letter-spacing: 1px;
        font-weight: 700
    }

    .singleCS #cs-carousel .container .row .articles-container .card .card-text {
        font-family: lato,sans-serif;
        font-size: 20px;
        font-weight: 800;
        color: #1b1b20;
        letter-spacing: .3px
    }

        .singleCS #cs-carousel .container .row .articles-container .card .card-text:hover {
            color: #1b1b20
        }

.singleCS #cs-carousel .container .row .articles-container a, .singleCS #cs-carousel .container .row .articles-container a:hover {
    color: #4bb063;
    text-align: left
}

.singleCS #cs-carousel .container .row .articles-container .line {
    width: 50px;
    height: 1px;
    background: #dadada;
    margin-top: auto
}

.newsingleCS .row {
    margin-left: 0 !important;
    margin-right: 0 !important
}

.newsingleCS #top .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0 !important
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #top .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #top .container--custom {
        width: 100%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #top .container--custom {
        width: 100%
    }
}

@media(min-width:1920px) {
    .newsingleCS #top .container--custom {
        width: 100%
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .newsingleCS #top .container--custom {
        width: 100%;
        padding-right: 0 !important;
        padding-left: 0 !important
    }
}

.newsingleCS #top .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center
}

    .newsingleCS #top .container--custom .row .top__heading {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        margin-bottom: 4rem
    }

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__heading {
        margin-top: 7rem
    }
}

.newsingleCS #top .container--custom .row .top__heading__img {
    margin-top: -5rem;
    margin-bottom: 2rem
}

    .newsingleCS #top .container--custom .row .top__heading__img img:last-of-type {
        margin-top: 6rem;
        margin-left: 1.5rem
    }

.newsingleCS #top .container--custom .row .top__heading h1 {
    font-size: 52px;
    font-weight: 700
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__heading h1 {
        padding: 0 1.5rem;
        text-align: left
    }
}

.newsingleCS #top .container--custom .row .top__heading__text--mobile {
    padding: 0 1.5rem
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .newsingleCS #top .container--custom .row .top__heading__text--mobile {
        display: none
    }
}

.newsingleCS #top .container--custom .row .top__heading__text--mobile p {
    font-size: 18px;
    font-weight: 600;
    color: #767676
}

.newsingleCS #top .container--custom .row .top__heading__text--desktop {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__heading__text--desktop {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #top .container--custom .row .top__heading__text--desktop {
        width: 70%;
        text-align: center
    }
}

.newsingleCS #top .container--custom .row .top__heading__text--desktop p {
    font-size: 18px;
    font-weight: 600;
    color: #767676;
    margin-bottom: .4rem !important
}

.newsingleCS #top .container--custom .row .top__content__img img {
    width: 100%
}

.newsingleCS #top .container--custom .row .top__content__greenbar {
    background-color: #ffc502;
    display: flex;
    height: 230px
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__content__greenbar {
        flex-direction: column;
        height: 100%
    }
}

.newsingleCS #top .container--custom .row .top__content__greenbar__element {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 33.3%;
    padding: 1rem;
    position: relative
}

    .newsingleCS #top .container--custom .row .top__content__greenbar__element:first-of-type::after, .newsingleCS #top .container--custom .row .top__content__greenbar__element:nth-of-type(2)::after {
        content: "";
        display: block;
        top: 15%;
        right: 0;
        position: absolute;
        height: 70%;
        width: 1px;
        background-color: #fff
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__content__greenbar__element:first-of-type::after, .newsingleCS #top .container--custom .row .top__content__greenbar__element:nth-of-type(2)::after {
        display: none
    }
}

@media(max-width:767px) {
    .newsingleCS #top .container--custom .row .top__content__greenbar__element {
        width: 100%
    }
}

.newsingleCS #top .container--custom .row .top__content__greenbar__element p {
    margin-top: 1rem;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    line-height: 1.44;
    width: 35%
}

.newsingleCS #top .container--custom .row .top__content__greenbar__element img {
    width: 56px;
    margin-right: 1.5rem
}

.newsingleCS #green-banner .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 5rem !important
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #green-banner .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #green-banner .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #green-banner .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .newsingleCS #green-banner .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom {
        padding-right: 0 !important;
        padding-left: 0 !important
    }
}

.newsingleCS #green-banner .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%
}

    .newsingleCS #green-banner .container--custom .row .green-banner {
        background-color: #ffc502;
        padding: 4rem 4rem 2.5rem;
        margin-bottom: 3rem;
        width: 100%;
        border-radius: 26px;
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
        position: relative;
        display: flex
    }

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .green-banner {
        padding: 1.5rem 0 1.5rem 1.5rem
    }
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .green-banner__left {
        width: 70%
    }
}

.newsingleCS #green-banner .container--custom .row .green-banner__left h2 {
    font-size: 36px;
    font-weight: 700;
    color: #fff
}

.newsingleCS #green-banner .container--custom .row .green-banner__left ul {
    padding: 0 0 0 1.5rem
}

    .newsingleCS #green-banner .container--custom .row .green-banner__left ul li {
        color: #fff;
        font-size: 16px;
        padding: 1rem 0
    }

        .newsingleCS #green-banner .container--custom .row .green-banner__left ul li:first-of-type {
            font-weight: 700
        }

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .green-banner__right {
        width: 30%;
        display: flex;
        align-items: center;
        justify-content: center
    }
}

.newsingleCS #green-banner .container--custom .row .green-banner__right img {
    position: absolute;
    top: 10%;
    right: -1rem;
    height: 80%
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .green-banner__right img {
        height: 40%;
        top: 30%;
        right: -.5rem
    }
}

.newsingleCS #green-banner .container--custom .row .grey-banners {
    display: flex;
    justify-content: space-between;
    width: 100%
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .grey-banners {
        flex-direction: column
    }
}

.newsingleCS #green-banner .container--custom .row .grey-banners__banner {
    width: 48%;
    padding: 4rem 4rem 2.5rem;
    background-color: #f3f3f3;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    border-radius: 26px
}

@media(max-width:767px) {
    .newsingleCS #green-banner .container--custom .row .grey-banners__banner {
        width: 100%;
        padding: 1.5rem
    }

        .newsingleCS #green-banner .container--custom .row .grey-banners__banner:first-of-type {
            margin-bottom: 3rem
        }
}

.newsingleCS #green-banner .container--custom .row .grey-banners__banner h2 {
    font-size: 36px;
    font-weight: 700
}

.newsingleCS #green-banner .container--custom .row .grey-banners__banner ul {
    margin-top: 1.5rem;
    padding: 0 0 0 1.5rem
}

    .newsingleCS #green-banner .container--custom .row .grey-banners__banner ul li {
        font-size: 16px
    }

.newsingleCS #content .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3rem !important
}

@media(max-width:767px) {
    .newsingleCS #content .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #content .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #content .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #content .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .newsingleCS #content .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .newsingleCS #content .container--custom {
        padding-right: 0 !important;
        padding-left: 0 !important
    }
}

.newsingleCS #content .container--custom .row {
    padding: 4rem;
    display: flex;
    flex-direction: column
}

@media(max-width:767px) {
    .newsingleCS #content .container--custom .row {
        padding: 1.5rem
    }
}

.newsingleCS #content .container--custom .row h2 {
    font-size: 36px;
    font-weight: 700;
    padding: 3rem 0
}

.newsingleCS #content .container--custom .row p {
    font-size: 18px;
    line-height: 1.44
}

.newsingleCS #content .container--custom .row span {
    font-weight: 500
}

.newsingleCS #content .container--custom .row .italic {
    font-style: italic !important
}

.newsingleCS #content .container--custom .row .bold {
    font-weight: 700
}

.newsingleCS #greenquota {
    background-color: #ffc502;
    position: relative
}

    .newsingleCS #greenquota .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        padding: 2rem 0
    }

@media(max-width:767px) {
    .newsingleCS #greenquota .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #greenquota .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #greenquota .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #greenquota .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .newsingleCS #greenquota .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .newsingleCS #greenquota .container--custom {
        padding-right: 0 !important;
        padding-left: 0 !important
    }
}

.newsingleCS #greenquota .container--custom .row {
    padding: 0 4rem;
    width: 80%
}

@media(max-width:767px) {
    .newsingleCS #greenquota .container--custom .row {
        padding: 0 1.5rem;
        width: 100%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #greenquota .container--custom .row {
        width: 100%
    }
}

.newsingleCS #greenquota .container--custom .row p {
    font-size: 28px;
    font-weight: 600;
    line-height: 1.5;
    color: #fff;
    margin-bottom: 2rem
}

.newsingleCS #greenquota .container--custom .row div {
    display: flex;
    width: 100%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .newsingleCS #greenquota .container--custom .row div {
        justify-content: space-between
    }
}

.newsingleCS #greenquota .container--custom .row div span {
    color: #fff;
    font-size: 18px
}

.newsingleCS #greenquota .container--custom .row div img {
    position: absolute;
    bottom: 3rem;
    right: 6rem;
    width: 8%
}

@media(max-width:767px) {
    .newsingleCS #greenquota .container--custom .row div img {
        position: relative;
        bottom: 0;
        right: 0;
        width: 60px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #greenquota .container--custom .row div img {
        position: relative;
        bottom: 0;
        right: 0;
        width: 120px
    }
}

.newsingleCS #content-with-banner .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto
}

@media(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #content-with-banner .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .newsingleCS #content-with-banner .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .newsingleCS #content-with-banner .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .newsingleCS #content-with-banner .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom {
        padding-right: 0 !important;
        padding-left: 0 !important;
        padding-top: 5rem !important
    }
}

@media(min-width:768px) and (max-width:991px) {
    .newsingleCS #content-with-banner .container--custom {
        padding-top: 8rem !important
    }
}

.newsingleCS #content-with-banner .container--custom .row {
    padding: 0 4rem;
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row {
        flex-direction: column
    }
}

@media(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row {
        padding: 0
    }
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__content {
    width: 80%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__content {
        width: 100%;
        margin-bottom: 2rem
    }
}

@media(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__content {
        padding: 0 1.5rem
    }
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__content h2 {
    margin-bottom: 2rem;
    font-weight: 700
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__content p {
    font-size: 18px
}

    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__content p:not(:last-of-type) {
        margin-bottom: 2rem
    }

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__content .bold {
    font-weight: 700;
    margin-bottom: 1rem !important
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 47%;
    background-color: #f3f3f3;
    padding: 4rem;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07)
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner {
        width: 100%
    }
}

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner p {
    font-size: 28px;
    font-weight: 700;
    text-align: center
}

    .newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner p:first-of-type {
        margin-bottom: 1.5rem
    }

.newsingleCS #content-with-banner .container--custom .row .content-with-banner__banner .green {
    color: #ffc502
}

.rebranding-case-studies #top {
    overflow: hidden
}

    .rebranding-case-studies #top .container {
        position: relative;
        margin-bottom: 5rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start
    }

        .rebranding-case-studies #top .container h1 {
            font-size: 52px;
            font-weight: 700
        }

        .rebranding-case-studies #top .container h2 {
            font-family: nunito sans,sans-serif;
            font-weight: 600;
            font-size: 18px;
            font-style: normal;
            line-height: normal;
            color: #767676;
            max-width: 406px;
            margin-bottom: 3.5rem
        }

@media(max-width:767px) {
    .rebranding-case-studies #top .container a {
        align-self: center;
        width: 100%
    }
}

.rebranding-case-studies #top .container img {
    position: absolute;
    top: -151px;
    right: -413px;
    max-width: 940px;
    z-index: -1
}

@media(min-width:992px) and (max-width:1440px) {
    .rebranding-case-studies #top .container img {
        max-width: 715px;
        top: -109px;
        right: -204px
    }
}

@media(min-width:992px) and (max-width:1199px) {
    .rebranding-case-studies #top .container img {
        max-width: 700px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-case-studies #top .container img {
        max-width: 615px;
        top: -75px;
        right: -306px
    }
}

@media(max-width:767px) {
    .rebranding-case-studies #top .container img {
        display: none
    }
}

.rebranding-case-studies #content .container {
    margin-top: 5rem
}

    .rebranding-case-studies #content .container .cards {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 7rem 1.5rem
    }

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .rebranding-case-studies #content .container .cards {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .rebranding-case-studies #content .container .cards {
        grid-template-columns: 1fr
    }
}

.rebranding-case-studies #content .container .cards__singleCard {
    border-radius: 26px;
    box-shadow: 4px 20px 24px -2px rgba(0,0,0,.12);
    padding: 6rem 2rem 2rem;
    position: relative
}

.rebranding-case-studies #content .container .cards__singleCard__circle {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100px;
    height: 100px;
    border-radius: 83px;
    box-shadow: 4px 20px 24px -2px rgba(0,0,0,.12);
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center
}

.rebranding-case-studies #content .container .cards__singleCard h2 {
    font-size: 36px;
    font-weight: 700;
    color: #222324;
    margin-bottom: 1.5rem
}

.rebranding-case-studies #content .container .cards__singleCard p {
    font-size: 18px;
    color: #222324;
    margin-bottom: 4rem;
    min-height: 135px
}

.rebranding-case-studies #content .container .cards__singleCard a {
    font-size: 18px;
    font-weight: 700;
    color: #ffc502
}

    .rebranding-case-studies #content .container .cards__singleCard a img {
        margin-left: .5rem;
        transition: all .2s ease-in-out
    }

    .rebranding-case-studies #content .container .cards__singleCard a:hover img {
        margin-left: .75rem
    }

.rebranding-case-studies #social-proof {
    margin: 0 0 5rem
}

@media(max-width:767px) {
    .rebranding-case-studies #social-proof {
        margin: 0
    }
}

.rebranding-case-studies #social-proof .container--custom {
    width: 100%;
    padding-right: 5rem;
    padding-left: 5rem;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3rem;
    padding-bottom: 2rem
}

@media(max-width:767px) {
    .rebranding-case-studies #social-proof .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-case-studies #social-proof .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .rebranding-case-studies #social-proof .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .rebranding-case-studies #social-proof .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .rebranding-case-studies #social-proof .container--custom {
        width: 1440px
    }
}

@media(max-width:767px) {
    .rebranding-case-studies #social-proof .container--custom {
        padding-top: 0;
        padding-bottom: 0
    }
}

.rebranding-case-studies #social-proof .container--custom .row {
    border-bottom: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-case-studies #social-proof .container--custom .row {
        gap: 2rem 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-case-studies #social-proof .container--custom .col-6 {
        text-align: center
    }
}

.rebranding-case-studies #social-proof .container--custom .social-proof__heading {
    text-align: center
}

    .rebranding-case-studies #social-proof .container--custom .social-proof__heading h3 {
        font-family: nunito sans,sans-serif;
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 2.5rem;
        color: #6b6b6b
    }

.rebranding-single-case-studie .progressItem::after {
    width: 0;
    transition: all 1s ease-in-out
}

.rebranding-single-case-studie .progressItem-active::after {
    width: 80px
}

.rebranding-single-case-studie #top {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #top .container--custom {
        max-width: 2560px;
        width: 100%;
        margin-top: 10rem;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

@media(max-width:767px) {
    .rebranding-single-case-studie #top .container--custom {
        padding: 0 1rem
    }
}

.rebranding-single-case-studie #top img.shapeOnTop {
    position: absolute;
    top: -1.5rem;
    left: -15%;
    max-width: 1600px;
    width: 60vw;
    z-index: -1
}

@media(min-width:992px) and (max-width:1440px) {
    .rebranding-single-case-studie #top img.shapeOnTop {
        left: -12rem;
        width: 775px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #top img.shapeOnTop {
        left: -10rem;
        width: 650px
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #top img.shapeOnTop {
        left: -8rem;
        width: 500px
    }
}

.rebranding-single-case-studie #top img.shapeOnBottom {
    position: absolute;
    bottom: 3rem;
    right: 0;
    z-index: -1;
    width: 8%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #top img.shapeOnBottom {
        display: none
    }
}

.rebranding-single-case-studie #top h1 {
    color: #222324;
    font-size: 52px;
    font-weight: 700
}

.rebranding-single-case-studie #top h2 {
    max-width: 630px;
    text-align: center;
    color: var(--light-gray-600,#6b6b6b);
    font-family: nunito sans,sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 160%
}

.rebranding-single-case-studie #top .industrie-info {
    display: flex;
    gap: 2rem;
    margin-top: 10rem
}

@media(max-width:767px) {
    .rebranding-single-case-studie #top .industrie-info {
        margin-top: 4rem;
        flex-direction: column;
        gap: 3rem 0
    }
}

.rebranding-single-case-studie #top .industrie-info__singleInfo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column
}

    .rebranding-single-case-studie #top .industrie-info__singleInfo h3 {
        font-size: 16px;
        font-weight: 700;
        font-family: nunito sans,sans-serif;
        padding: 1rem 2rem;
        border-radius: 26px;
        background-color: #fff;
        box-shadow: 0 8px 32px 0 rgb(245 226 179)
    }

    .rebranding-single-case-studie #top .industrie-info__singleInfo p {
        color: var(--light-gray-600,#6b6b6b);
        font-size: 18px;
        line-height: 160%;
        max-width: 141px;
        text-align: center;
        margin-top: 1.5rem
    }

.rebranding-single-case-studie #main-goals {
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #main-goals .container--custom {
        max-width: 2560px;
        width: 100%
    }

    .rebranding-single-case-studie #main-goals .cards {
        width: 100%
    }

    .rebranding-single-case-studie #main-goals .cards__singleCard {
        background-color: #fff;
        padding: 4rem 0;
        border-top: 1px solid #e9e9e9;
        border-bottom: 1px solid #e9e9e9;
        transition: all .2s ease-in-out
    }

        .rebranding-single-case-studie #main-goals .cards__singleCard .container {
            display: grid;
            grid-template-columns: repeat(2,1fr)
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #main-goals .cards__singleCard .container {
        grid-template-columns: 1fr
    }
}

@media(min-width:1920px),(min-width:1441px) and (max-width:1919px),(min-width:992px) and (max-width:1440px),(min-width:992px) and (max-width:1199px) {
    .rebranding-single-case-studie #main-goals .cards__singleCard:hover {
        background: #f8f8f8;
        box-shadow: 0 6px 24px 0 rgba(0,0,0,.12)
    }
}

.rebranding-single-case-studie #main-goals .cards__singleCard div:first-of-type h2 {
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #main-goals .cards__singleCard div:first-of-type h2 {
        margin-left: 0;
        margin-bottom: 2rem
    }
}

.rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul {
    padding: 0
}

    .rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul li {
        list-style: none
    }

        .rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul li span {
            display: flex;
            align-items: center
        }

            .rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul li span img {
                margin-right: 1rem
            }

        .rebranding-single-case-studie #main-goals .cards__singleCard div:last-of-type ul li:not(:last-of-type) {
            padding-bottom: 1.3rem
        }

.rebranding-single-case-studie #case-implementation {
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #case-implementation .container--custom {
        width: 100%
    }

    .rebranding-single-case-studie #case-implementation .cards {
        width: 100%;
        position: relative;
        overflow: hidden
    }

        .rebranding-single-case-studie #case-implementation .cards img.frame-img {
            position: absolute;
            top: 0;
            left: 0
        }

    .rebranding-single-case-studie #case-implementation .cards__singleCard {
        background-color: #fff;
        padding: 6rem 0;
        transition: all .2s ease-in-out
    }

        .rebranding-single-case-studie #case-implementation .cards__singleCard:first-of-type {
            padding-top: 13rem
        }

        .rebranding-single-case-studie #case-implementation .cards__singleCard:only-of-type {
            padding-top: 10rem
        }

    .rebranding-single-case-studie #case-implementation .cards__singleCard--grey {
        background-color: #f8f8f8
    }

    .rebranding-single-case-studie #case-implementation .cards__singleCard .container {
        display: grid;
        grid-template-columns: 45% 55%
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard .container {
        grid-template-columns: 1fr
    }
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div h2 {
    position: relative;
    width: fit-content;
    z-index: 1
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div img {
    position: absolute;
    top: -1.5rem;
    right: -13.5rem;
    transform: translate(-50%,-50%);
    z-index: -1
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard div img {
        top: -1.5rem;
        right: -10.5rem;
        width: 75%
    }
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2 {
    max-width: 366px;
    font-size: 36px;
    font-weight: 700;
    text-transform: uppercase;
    position: relative
}

@media(min-width:1920px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2 {
        max-width: 100%
    }
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2::before {
    content: attr(number);
    position: absolute;
    top: -4rem;
    color: #ffc502
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1.5rem;
    max-width: 80px;
    height: 3px;
    background-color: #ffc502
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard div:first-of-type h2 {
        margin-left: 0;
        margin-bottom: 2rem
    }
}

.rebranding-single-case-studie #case-implementation .cards__singleCard div:last-of-type p {
    color: #222324;
    max-width: 651px;
    font-size: 18px;
    line-height: 160%
}

@media(min-width:992px) and (max-width:1199px) {
    .rebranding-single-case-studie #case-implementation .cards__singleCard div:last-of-type p {
        max-width: 451px
    }
}

.rebranding-single-case-studie #quote {
    background-color: #f8f8f8;
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #quote .container--custom {
        padding: 4.5rem 0;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #quote .container--custom {
        padding: 4.5rem 8rem
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #quote .container--custom {
        padding: 4.5rem 1.5rem
    }
}

.rebranding-single-case-studie #quote .container--custom p {
    max-width: 850px;
    text-align: center;
    color: #222324;
    font-size: 36px;
    line-height: 120%;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    .rebranding-single-case-studie #quote .container--custom p {
        font-size: 28px
    }
}

.rebranding-single-case-studie #quote .container--custom span {
    color: #222324;
    font-family: lato,sans-serif;
    font-size: 18px
}

.rebranding-single-case-studie #grid-content {
    display: flex;
    align-items: center;
    justify-content: center
}

    .rebranding-single-case-studie #grid-content img {
        max-width: 1020px
    }

    .rebranding-single-case-studie #grid-content .container--custom {
        max-width: 2560px;
        width: 100%
    }

    .rebranding-single-case-studie #grid-content .cards {
        width: 100%;
        overflow: hidden
    }

    .rebranding-single-case-studie #grid-content .cards__singleCard {
        display: grid;
        grid-template-columns: 40% 60%;
        gap: 8.5rem;
        background-color: #fff;
        padding: 4rem 0;
        transition: all .2s ease-in-out
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard {
        grid-template-columns: 1fr;
        gap: 3rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard {
        padding: 1rem 4rem 5rem
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard {
        padding: 1rem 1rem 5rem
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard--grey {
    background-color: #f8f8f8
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard--grey {
        padding: 1rem 4rem 5rem !important
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard--grey {
        padding: 1rem 1rem 5rem !important
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div img {
    width: 100%
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type {
    align-items: flex-end
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type {
        padding-right: 0;
        margin-top: 4rem
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type p {
    position: relative;
    max-width: 366px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type p {
        max-width: 100%
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type p.quote {
        margin-top: 2rem
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type p.quote::before {
    content: "“";
    position: absolute;
    top: -3rem;
    left: 0;
    color: #222324;
    font-family: lato,sans-serif;
    font-size: 52px;
    font-weight: 700;
    text-transform: uppercase
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type img {
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    border-radius: 13px
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:first-of-type span {
    text-align: right
}

.rebranding-single-case-studie #grid-content .cards__singleCard div:last-of-type {
    align-items: flex-start;
    overflow: hidden
}

    .rebranding-single-case-studie #grid-content .cards__singleCard div:last-of-type p {
        max-width: 651px
    }

@media(min-width:992px) and (max-width:1199px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div:last-of-type p {
        max-width: 451px
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div.text {
    display: flex;
    justify-content: center;
    flex-direction: column
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div.text {
        align-items: center
    }
}

.rebranding-single-case-studie #grid-content .cards__singleCard div.text p {
    color: #222324;
    font-size: 18px;
    line-height: 160%
}

.rebranding-single-case-studie #grid-content .cards__singleCard div.text span {
    color: #222324;
    font-size: 18px;
    line-height: 160%;
    margin-top: 3rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .rebranding-single-case-studie #grid-content .cards__singleCard div.text span {
        margin-bottom: 4rem
    }
}

.rebranding-single-case-studie #black-banner {
    background-color: #000
}

    .rebranding-single-case-studie #black-banner .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        padding-top: 0 !important
    }

@media(max-width:767px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .rebranding-single-case-studie #black-banner .container--custom {
        width: 1440px
    }
}

.rebranding-single-case-studie #black-banner .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 9rem 0
}

@media(max-width:767px) {
    .rebranding-single-case-studie #black-banner .container--custom .row {
        padding: 3.5rem 0
    }
}

.rebranding-single-case-studie #black-banner .container--custom .row p {
    font-size: 36px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    width: 70%;
    margin-bottom: 2.5rem
}

@media(min-width:768px) and (max-width:991px) {
    .rebranding-single-case-studie #black-banner .container--custom .row p {
        font-size: 32px;
        width: 100%
    }
}

@media(max-width:767px) {
    .rebranding-single-case-studie #black-banner .container--custom .row p {
        font-size: 28px;
        width: 100%
    }
}

.industries-redesign #top {
    overflow: hidden;
    margin-top: 0 !important
}

    .industries-redesign #top .container {
        margin-bottom: 5rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        position: relative
    }

        .industries-redesign #top .container h1 {
            font-family: lato,sans-serif;
            font-size: 52px;
            font-weight: 700;
            max-width: 700px;
            color: #1b1b20
        }

            .industries-redesign #top .container h1 span {
                border-bottom: 4px solid #ffc502
            }

                .industries-redesign #top .container h1 span.planner {
                    border-bottom: 4px solid #2d80eb
                }

        .industries-redesign #top .container h2 {
            font-family: lato,sans-serif;
            font-weight: 400;
            font-size: 24px;
            font-style: normal;
            line-height: normal;
            color: #767676;
            max-width: 630px;
            margin-bottom: 3.5rem
        }

@media(max-width:767px) {
    .industries-redesign #top .container a {
        align-self: center;
        width: 100%
    }
}

.industries-redesign #top .container img {
    position: absolute;
    top: -263px;
    right: -462px;
    max-width: 758px;
    z-index: -1
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-redesign #top .container img {
        display: none
    }
}

.industries-redesign #top .container img.planner {
    position: absolute;
    top: -175px;
    right: -397px;
    width: 64%;
    z-index: -1
}

@media(min-width:992px) and (max-width:1440px) {
    .industries-redesign #top .container img.planner {
        top: -175px;
        right: -187px;
        width: 54%
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-redesign #top .container img.planner {
        display: none
    }
}

.industries-redesign #social-proof {
    margin: 0 0 5rem
}

@media(min-width:768px) and (max-width:991px) {
    .industries-redesign #social-proof {
        margin: -5rem 0 5rem
    }
}

@media(max-width:767px) {
    .industries-redesign #social-proof {
        margin: 0
    }
}

@media(max-width:767px) {
    .industries-redesign #social-proof .container {
        margin-top: -4.5rem;
        margin-bottom: -4.5rem;
        padding-top: 0;
        padding-bottom: 0
    }
}

.industries-redesign #social-proof .container .row {
    border-bottom: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-redesign #social-proof .container .row {
        gap: 2rem 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .industries-redesign #social-proof .container .col-6 {
        text-align: center
    }
}

.industries-redesign #social-proof .container .social-proof__heading {
    text-align: center
}

    .industries-redesign #social-proof .container .social-proof__heading h3 {
        font-family: nunito sans,sans-serif;
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 2.5rem;
        color: #6b6b6b
    }

.industries-redesign #content .container {
    margin-top: 5rem
}

    .industries-redesign #content .container .cards {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 5rem 5rem
    }

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .industries-redesign #content .container .cards {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .industries-redesign #content .container .cards {
        grid-template-columns: 1fr
    }
}

.industries-redesign #content .container .cards img {
    width: 118px;
    height: 142px;
    margin-bottom: 1.5rem
}

.industries-redesign #content .container .cards h2 {
    font-size: 26px;
    font-weight: 700;
    color: #1b1b20;
    margin-bottom: 20px
}

.industries-redesign #content .container .cards p {
    font-size: 18px;
    font-weight: 400;
    color: #1b1b20;
    margin-bottom: 1.5rem;
    min-height: 81px
}

.industries-redesign #content .container .cards a {
    font-size: 18px;
    font-weight: 700;
    color: #2380e3;
    display: flex;
    align-items: center
}

    .industries-redesign #content .container .cards a img {
        width: 21px;
        height: 12px;
        margin: 0 0 0 .5rem !important;
        transition: all .2s ease-in-out
    }

    .industries-redesign #content .container .cards a:hover img {
        margin: 0 0 0 .75rem !important
    }

.articles {
    box-sizing: border-box
}

    .articles #top .container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

        .articles #top .container h1 {
            font-size: 45px;
            font-weight: 800;
            line-height: 1.25;
            padding-bottom: 18px;
            width: 70%;
            text-align: center
        }

@media(max-width:767px) {
    .articles #top .container h1 {
        width: 100%
    }
}

.articles #top .container .button-wrapper {
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .articles #top .container .button-wrapper {
        flex-direction: column;
        width: 100%
    }
}

.articles #top .container .button-wrapper a {
    border-radius: 50px !important;
    font-size: 18px !important;
    font-weight: 500
}

@media(max-width:767px) {
    .articles #top .container .button-wrapper a {
        width: 100% !important;
        text-align: center
    }
}

.articles #top .container .button-wrapper__google {
    margin-left: 3rem
}

@media(max-width:767px) {
    .articles #top .container .button-wrapper__google {
        margin-left: 1rem;
        margin-top: 2rem
    }
}

.articles #content {
    margin-bottom: 5rem
}

    .articles #content .container {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center
    }

        .articles #content .container h2 {
            font-weight: 700;
            padding-top: 40px;
            padding-bottom: 5px;
            font-size: 2rem
        }

        .articles #content .container h3 {
            font-weight: 700;
            padding-top: 40px;
            padding-bottom: 5px;
            font-size: 1.75rem
        }

        .articles #content .container p {
            font-size: 18px;
            font-stretch: normal;
            font-style: normal;
            line-height: 1.78;
            letter-spacing: normal;
            margin-top: 0;
            margin-bottom: 1rem
        }

        .articles #content .container a {
            font-weight: 700;
            color: #1da44c
        }

            .articles #content .container a:hover {
                cursor: pointer;
                text-decoration: underline
            }

        .articles #content .container img {
            margin: 3rem 0;
            align-self: center;
            max-width: 85%
        }

        .articles #content .container ul, .articles #content .container ol {
            margin-top: 0;
            margin-bottom: 1rem
        }

            .articles #content .container ul li, .articles #content .container ol li {
                letter-spacing: .5px;
                font-size: 18px;
                padding-bottom: 15px
            }

        .articles #content .container iframe {
            align-self: center;
            min-width: 75%;
            aspect-ratio: 16/9
        }

        .articles #content .container .list-without-bullets {
            list-style: none
        }

        .articles #content .container .list-green-number ol li::marker {
            color: #1da44c;
            font-weight: 700
        }

        .articles #content .container .bold-paragraph {
            font-weight: 700
        }

        .articles #content .container .button-max-width {
            align-self: center;
            background-color: #ffc502;
            font-weight: 700;
            color: #fff;
            padding: 1rem;
            width: 70%;
            font-size: 20px;
            text-align: center;
            border-radius: 26px
        }

            .articles #content .container .button-max-width:hover {
                text-decoration: none;
                background-color: #1da44c
            }

.articles #orangebox {
    margin: 5rem 0
}

    .articles #orangebox .container {
        padding: 0 10%
    }

        .articles #orangebox .container .orangebox {
            display: flex;
            width: 100%;
            background-color: #f7b801;
            border-radius: 20px;
            position: relative;
            overflow: hidden
        }

        .articles #orangebox .container .orangebox__content {
            padding: 4rem 2rem;
            width: 70%;
            height: max-content
        }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .articles #orangebox .container .orangebox__content {
        width: 100%
    }
}

.articles #orangebox .container .orangebox__content p {
    position: relative;
    font-size: 42px;
    font-weight: 700;
    line-height: 1.2;
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 5rem;
    z-index: 2
}

@media(max-width:767px) {
    .articles #orangebox .container .orangebox__content p {
        font-size: 30px
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .articles #orangebox .container .orangebox__content p {
        margin-right: 1.5rem
    }
}

.articles #orangebox .container .orangebox__content a {
    font-weight: 700;
    padding: 10px 25px;
    text-align: center;
    background-color: #000;
    color: #fff;
    border-radius: 26px;
    box-shadow: 0 4px 4px rgba(0,0,0,.25)
}

    .articles #orangebox .container .orangebox__content a:hover {
        cursor: pointer
    }

.articles #orangebox .container .orangebox img {
    position: absolute;
    right: 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .articles #orangebox .container .orangebox img {
        display: none
    }
}

.articles #dottedbox {
    margin: 5rem 0
}

    .articles #dottedbox .container {
        padding: 0 10%
    }

        .articles #dottedbox .container .dottedbox {
            display: flex;
            width: 100%;
            border-radius: 4px;
            border: dashed 1px #d8d8d8;
            position: relative;
            overflow: hidden;
            padding: 2rem
        }

@media(max-width:767px) {
    .articles #dottedbox .container .dottedbox {
        flex-direction: column
    }
}

.articles #dottedbox .container .dottedbox__img {
    width: 20%
}

@media(max-width:767px) {
    .articles #dottedbox .container .dottedbox__img {
        width: 100%
    }
}

.articles #dottedbox .container .dottedbox__content {
    width: 80%
}

@media(max-width:767px) {
    .articles #dottedbox .container .dottedbox__content {
        margin-top: 3rem;
        width: 100%
    }
}

.articles #dottedbox .container .dottedbox__content h2 {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.31;
    letter-spacing: -.14px;
    margin-top: 12px;
    margin-bottom: 20px
}

.articles #dottedbox .container .dottedbox__content p {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.56
}

.articles #other-posts p {
    font-size: 22px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.78;
    letter-spacing: normal;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 1rem
}

.articles #other-posts ul, .articles #other-posts ol {
    margin-top: 0;
    margin-bottom: 1rem;
    padding-left: 0
}

    .articles #other-posts ul li, .articles #other-posts ol li {
        letter-spacing: .5px;
        font-size: 18px;
        padding-bottom: 15px;
        list-style: none
    }

        .articles #other-posts ul li a:hover, .articles #other-posts ol li a:hover {
            cursor: pointer;
            color: #767676;
            text-decoration: underline
        }

.btn-filled-mobileSmaller {
    width: fit-content !important;
    font-weight: 600 !important;
    white-space: normal
}

@media(min-width:1200px) and (max-width:1440px) {
    .btn-filled-mobileSmaller {
        font-size: 12px !important;
        padding: 12px 18px !important
    }
}

.margin-top {
    margin-top: 10px
}

@media(max-width:767px) {
    #compare .col-sm-10 {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

#compare .container--custom {
    width: 100%;
    padding-right: 5rem;
    padding-left: 5rem;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3rem;
    padding-bottom: 8rem
}

@media(max-width:767px) {
    #compare .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #compare .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    #compare .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    #compare .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    #compare .container--custom {
        width: 1440px
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #compare .container--custom {
        padding-bottom: 5rem
    }
}

@media(max-width:767px) {
    #compare .row {
        justify-content: center
    }
}

#compare .mainHeader-ppc {
    font-weight: 700;
    font-size: 36px
}

#compare h1 {
    font-size: 36px;
    font-weight: 700;
    text-align: center
}

@media(max-width:767px) {
    #compare h1 {
        font-size: 28px;
        text-align: left
    }
}

#compare .special-paragraph {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffc502
}

@media(min-width:768px) and (max-width:991px) {
    #compare .special-paragraph {
        text-align: center
    }
}

#compare p {
    line-height: 26px
}

#compare .mainPara-ppc {
    font-size: 18px;
    padding: 20px 0;
    margin: 0 25%;
    color: #767676
}

@media(max-width:767px) {
    #compare .mainPara-ppc {
        text-align: left;
        padding: 0;
        margin: 1rem 0;
        font-size: 16px;
        line-height: 2.13
    }
}

#compare .col-sm-12 {
    text-align: center
}

@media(max-width:767px) {
    #compare .col-sm-12:nth-of-type(1) {
        text-align: left
    }

    #compare .col-sm-12 .mainPara {
        font-size: 16px;
        text-align: center
    }
}

@media(max-width:767px) {
    #compare .col-sm-10 {
        padding-right: 30px;
        padding-left: 30px
    }
}

#compare .toggle-prices {
    display: inline-flex;
    align-items: center;
    justify-content: space-around;
    margin: auto;
    position: relative;
    height: 50px;
    width: 280px;
    margin-bottom: 5rem
}

@media(max-width:767px) {
    #compare .toggle-prices {
        width: 280px
    }
}

#compare .toggle-prices input {
    position: absolute;
    height: 0;
    width: 0;
    opacity: 0
}

#compare .toggle-prices .changed-color {
    color: #fff
}

#compare .toggle-prices .switcher-price {
    display: flex;
    justify-content: inherit;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #fff;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,.07);
    border-radius: 26px;
    transition: background-color .15s ease-in .4s,box-shadow .15s ease-in .4s;
    user-select: none;
    cursor: pointer
}

    #compare .toggle-prices .switcher-price:before {
        position: absolute;
        content: "";
        height: 50px;
        width: 140px;
        top: 0;
        left: 0;
        border: 1px solid #ffc502;
        box-shadow: 0 2px 4px 0 rgba(0,0,0,.07);
        border-radius: 26px;
        transition: transform .3s,background-color .15s ease-in .4s,box-shadow .15s ease-in .4s
    }

    #compare .toggle-prices .switcher-price .switcher-text, #compare .toggle-prices .switcher-price .switcher-text-2 {
        color: #000;
        z-index: 1;
        cursor: pointer;
        margin-bottom: 0
    }

@media(max-width:767px) {
    #compare .toggle-prices .switcher-price .switcher-text, #compare .toggle-prices .switcher-price .switcher-text-2 {
        font-size: 12px
    }
}

#compare .toggle-prices .switcher-price .switcher-text .switcher-span, #compare .toggle-prices .switcher-price .switcher-text-2 .switcher-span {
    font-size: 13px
}

#compare .toggle-prices .switcher-price .switcher-text-2 {
    color: #b7b7b7;
    cursor: pointer;
    margin-bottom: 0;
    z-index: 1
}

@media(max-width:767px) {
    #compare .toggle-prices .switcher-price .switcher-text-2 {
        padding-right: 0
    }
}

#compare .toggle-prices .switcher-price .white-text {
    color: #000
}

#compare .toggle-prices .switcher-price .green-text {
    color: #ffc502;
    font-weight: 700
}

#compare .toggle-prices .switcher-price .gray-text {
    color: #b7b7b7
}

#compare .toggle-prices input:checked + .switcher-price:before {
    transform: translateX(142px)
}

#compare .card.green {
    background-color: #ffc502;
    color: #fff
}

    #compare .card.green .price {
        border-bottom: 1px solid #fff;
        background-color: #ffc502;
        color: #fff
    }

    #compare .card.green ul.list-group li.list-group-item {
        background-color: #ffc502;
        color: #fff
    }

        #compare .card.green ul.list-group li.list-group-item.ul-wrapper {
            background-color: #ffc502;
            color: #fff
        }

    #compare .card.green a.btn-filled {
        background-color: #fff;
        color: #ffc502
    }

@media(min-width:993px) and (max-width:1199px) {
    #compare .card.green a.btn-filled {
        font-size: 12px;
        padding: 12px 18px
    }
}

@media(max-width:767px),tablet,(min-width:768px) and (max-width:1150px) {
    #compare .col-md-6 {
        margin-top: 1rem
    }
}

#compare .most-popular-label::after {
    content: "Most popular";
    text-transform: uppercase;
    position: absolute;
    display: inline-block;
    background: #ffc502;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    right: -66px;
    top: 23px;
    transform: rotate(40deg);
    font-weight: 700;
    font-size: 12px;
    line-height: 17px;
    color: #fff;
    padding: .5rem 4rem
}

#compare .card {
    height: 100%;
    position: relative;
    overflow: hidden;
    text-align: center;
    border: none;
    background-color: #fff;
    box-shadow: 0 20px 24px -2px rgba(0,0,0,.12);
    border-radius: 26px;
    padding: 1rem 1rem 2rem
}

#compare .card-enterprise {
    display: flex;
    flex-direction: column;
    margin-top: 1.5rem;
    box-shadow: 0 20px 24px -2px rgba(0,0,0,.12);
    border-radius: 26px;
    background-color: #fff;
    padding: 2rem 0 2rem 2rem
}

@media(max-width:767px) {
    #compare .card-enterprise {
        margin-top: 1rem;
        padding: 2rem 2.5rem 3rem
    }
}

#compare .card-enterprise-title {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

@media(max-width:767px) {
    #compare .card-enterprise-title {
        justify-content: center
    }
}

#compare .card-enterprise-title h2 {
    padding: .5rem 2.5rem;
    color: #ffc502;
    font-weight: 700
}

@media(max-width:767px) {
    #compare .card-enterprise-title h2 {
        margin-bottom: 1.5rem
    }
}

#compare .card-enterprise-content {
    width: 100%;
    display: grid;
    grid-template-columns: .7fr 1fr 300px
}

@media(min-width:768px) and (max-width:991px) {
    #compare .card-enterprise-content {
        grid-template-columns: .6fr 1fr 220px
    }
}

@media(max-width:767px) {
    #compare .card-enterprise-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }
}

#compare .card-enterprise-content-paragraph {
    border-top: 1px solid #ffc502
}

    #compare .card-enterprise-content-paragraph p {
        padding: 1rem 0 0 2.5rem;
        text-align: left;
        font-size: 18px;
        color: #6b6b6b
    }

@media(max-width:767px) {
    #compare .card-enterprise-content-paragraph p {
        padding: 1rem .5rem 0;
        text-align: center
    }
}

#compare .card-enterprise-content-list {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    #compare .card-enterprise-content-list {
        align-items: center;
        justify-content: flex-start
    }
}

#compare .card-enterprise-content-list ul {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 1rem 2rem;
    margin: 0;
    padding-left: 1.5rem;
    list-style-image: url(/img/check-mark.svg) !important
}

@media(max-width:767px) {
    #compare .card-enterprise-content-list ul {
        grid-template-columns: 1fr;
        margin: 1rem 0 2.5rem
    }
}

#compare .card-enterprise-content-list ul li {
    text-align: left;
    color: #222324;
    font-weight: 600
}

#compare .card-enterprise-content-button {
    display: flex;
    align-items: flex-start;
    justify-content: center
}

#compare .card .price-first {
    margin-top: 3rem
}

    #compare .card .price-first .title-price {
        color: #ffc502;
        font-size: 48px;
        font-weight: 700
    }

        #compare .card .price-first .title-price span {
            font-size: 24px
        }

#compare .card .list-with-checkmarks {
    padding: 0 0 0 .5rem
}

    #compare .card .list-with-checkmarks > * {
        cursor: text
    }

    #compare .card .list-with-checkmarks li {
        list-style-image: url(/img/check-mark.svg) !important;
        padding: .3rem 0 .3rem .3rem
    }

        #compare .card .list-with-checkmarks li span {
            font-weight: 600
        }

#compare .card .list-with-checkmarks-circle {
    display: flex;
    align-items: flex-start;
    margin: 0 !important
}

    #compare .card .list-with-checkmarks-circle > * {
        cursor: text
    }

    #compare .card .list-with-checkmarks-circle img {
        margin-right: 6px
    }

    #compare .card .list-with-checkmarks-circle p {
        font-weight: 700
    }

#compare .card .list-unstyled {
    margin-left: 15px;
    width: 100%;
    cursor: help
}

    #compare .card .list-unstyled .item-styled {
        margin-bottom: 0;
        list-style: disc;
        text-align: left
    }

        #compare .card .list-unstyled .item-styled .fas {
            display: none
        }

        #compare .card .list-unstyled .item-styled .special-asana {
            border-bottom: 1px solid #ffc502;
            font-weight: 700
        }

    #compare .card .list-unstyled span {
        margin-left: 0;
        font-size: 16px;
        font-weight: 400
    }

#compare .card .card-titles {
    margin: 1rem 0 0;
    font-size: 14px;
    text-align: center;
    color: #ffc502;
    font-family: lato,sans-serif;
    font-weight: 700;
    text-transform: uppercase
}

#compare .card .list-group {
    margin-top: 0
}

    #compare .card .list-group .list-group-item {
        color: #1b1b20;
        border: none;
        padding: 1rem;
        border-radius: 26px
    }

@media(max-width:767px) {
    #compare .card .list-group .list-group-item {
        padding: 25px
    }
}

#compare .card .list-group .list-group-item .green-box {
    color: #fff
}

#compare .card .list-group .list-group-item .enterprise-price {
    padding: 1rem 0 3.3rem;
    font-family: lato,sans-serif
}

@media(min-width:993px) and (max-width:1199px) {
    #compare .card .list-group .list-group-item a.btn-filled {
        font-size: 12px;
        padding: 12px 18px
    }
}

@media(min-width:768px) and (max-width:991px) {
    #compare .card .list-group .list-group-item a.btn-filled {
        width: 100%
    }
}

#compare .card .list-group .list-group-item .btn-filled {
    width: 100%
}

#compare .card .list-group .list-group-item .bottom-price-text {
    color: #222324;
    padding-top: 10px
}

#compare .card .list-group .list-group-item .btn-basic-plan {
    margin-top: 7px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #compare .card .list-group .list-group-item .btn-basic-plan {
        margin-top: 1.9rem
    }
}

#compare .card .list-group .no_cursor {
    text-align: left;
    padding-left: 1rem
}

@media(max-width:767px) {
    #compare .card .list-group .no_cursor {
        padding-left: 25px
    }
}

#compare .card .card-icon-pro {
    position: absolute;
    width: 35px;
    bottom: -40px;
    right: -35px
}

#compare .card .pricing-features-header-ppc {
    margin-top: 1rem;
    color: #767676;
    font-weight: 600;
    font-size: 18px;
    text-align: center;
    min-height: 70px
}

    #compare .card .pricing-features-header-ppc p {
        padding-right: 10px;
        margin-bottom: 0
    }

#compare .card .tooltip-inner {
    position: relative;
    top: -58px
}

#compare .card .tooltip.bs-tooltip-bottom .arrow, #compare .card .tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow {
    top: 0
}

#compare .card .tooltip.bs-tooltip-right .arrow::before, #compare .card .tooltip.bs-tooltip-auto[x-placement^=right] .arrow::before {
    margin-top: -62px
}

#compare .card .price, #compare .card .price-subtitle {
    display: flex;
    flex-direction: column;
    text-align: center;
    margin: 0 auto;
    padding-bottom: 1rem;
    justify-content: center;
    border-bottom: 1px solid #ffc502
}

    #compare .card .price .title-price, #compare .card .price-subtitle .title-price {
        font-family: lato,sans-serif;
        font-weight: 700
    }

    #compare .card .price .dollar-icon, #compare .card .price-subtitle .dollar-icon {
        font-size: 24px;
        font-style: normal
    }

    #compare .card .price .pricing-seats-period, #compare .card .price-subtitle .pricing-seats-period {
        font-size: 16px
    }

#compare .card .price-toggle {
    text-align: center;
    font-size: 36px;
    margin-top: 12px
}

#compare .secure-payment {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 4rem
}

    #compare .secure-payment p {
        margin-bottom: 0;
        padding-left: 20px;
        color: #767676
    }

#nav-container {
    height: 90px;
    width: 100%
}

    #nav-container * {
        font-family: sans-serif,sans-serif
    }

    #nav-container .new-label {
        position: relative
    }

        #nav-container .new-label::after {
            content: attr(new-data-label);
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            left: calc(100% + 8px);
            padding: 2px 8px;
            color: #fff;
            font-size: 14px;
            font-weight: 700;
            background-color: #ffc502;
            border-radius: 1000px;
            display: flex;
            justify-content: center;
            align-items: center
        }

    #nav-container .new-label-green::after {
        background-color: #ffc502
    }

    #nav-container #navbar {
        z-index: 9999;
        position: fixed;
        width: 100%;
        top: 0;
        right: 0;
        left: 0
    }

        #nav-container #navbar ul {
            padding: 0;
            margin: 0
        }

            #nav-container #navbar ul li {
                list-style: none
            }

        #nav-container #navbar a:hover {
            cursor: pointer
        }

        #nav-container #navbar a.underline-button {
            width: fit-content;
            font-weight: 600 !important;
            font-size: 18px;
            padding: .3rem 0;
            transition: all .2s ease-in-out
        }

        #nav-container #navbar a.underline-button-green {
            color: #ffc502
        }

            #nav-container #navbar a.underline-button-green:hover > span {
                margin-left: 10px;
                transition: all .2s ease-in-out
            }

        #nav-container #navbar a.underline-button-blue {
            color: #2d80eb
        }

            #nav-container #navbar a.underline-button-blue:hover > span {
                margin-left: 10px;
                transition: all .2s ease-in-out
            }

            #nav-container #navbar a.underline-button-blue::after {
                display: none
            }

        #nav-container #navbar a.underline-button img {
            margin-left: .4rem
        }

        #nav-container #navbar .cta-register {
            font-size: 18px;
            padding: 16px 36px 17px;
            background-color: #ffc502 !important;
            transition: background-color .2s ease-in-out;
            color: #fff;
            font-weight: 600;
            border-radius: 36px
        }

            #nav-container #navbar .cta-register:hover {
                background-color: #17b54e !important
            }

        #nav-container #navbar .gradient-background {
            border-top: 1px solid #dbdbdb;
            width: 100%;
            background: #fff;
            background: linear-gradient(90deg,#fff 0%,#fff 52%,#f5f5f5 58%)
        }

        #nav-container #navbar .container {
            display: flex;
            flex-direction: column;
            align-items: normal !important;
            width: 100%
        }

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .container {
        padding: 1.2rem 15px
    }
}

#nav-container #navbar .navbar {
    background-color: #fff !important;
    transition: box-shadow .3s ease-in-out;
    width: 100%;
    padding: 0
}

#nav-container #navbar .navbar__header {
    display: flex;
    align-items: center
}

    #nav-container #navbar .navbar__header .onSmallScreen {
        display: none
    }

@media(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .navbar__header .onSmallScreen {
        margin-left: auto;
        display: block;
        margin-right: 2rem
    }
}

#nav-container #navbar .navbar__header-logo img {
    fill: #fff
}

#nav-container #navbar .navbar__header-links {
    margin-left: 4rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .navbar__header-links {
        display: none
    }
}

#nav-container #navbar .navbar__header-register {
    margin-left: auto
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .navbar__header-register {
        display: none
    }
}

#nav-container #navbar .navbar__header-burger {
    display: none
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .navbar__header-burger {
        display: block
    }
}

@media(max-width:767px) {
    #nav-container #navbar .navbar__header-burger {
        margin-left: auto
    }
}

#nav-container #navbar .navbar__header-burger-line {
    width: 34px;
    height: 4px;
    margin: 8px;
    border-radius: 100px;
    background-color: #222324
}

#nav-container #navbar .navbar__header-burger-active .navbar__header-burger-line:first-of-type {
    transform: translateY(13px) rotate(-45deg)
}

#nav-container #navbar .navbar__header-burger-active .navbar__header-burger-line:nth-of-type(2) {
    visibility: hidden
}

#nav-container #navbar .navbar__header-burger-active .navbar__header-burger-line:last-of-type {
    transform: translateY(-10px) rotate(45deg)
}

#nav-container #navbar .navbar__list {
    display: flex;
    align-items: center;
    padding: 1.4rem 0
}

#nav-container #navbar .navbar__list-item {
    list-style: none;
    padding: .6rem 1.2rem
}

#nav-container #navbar .navbar__list-item--border {
    border-right: .5px solid #222324 !important
}

#nav-container #navbar .navbar__list-item--last {
    padding: .6rem 0 .6rem 1.2rem
}

#nav-container #navbar .navbar__link {
    font-weight: 600;
    color: #222324 !important
}

#nav-container #navbar .content {
    width: 100%;
    height: 100vh;
    opacity: 1;
    visibility: visible;
    background-color: rgba(0,0,0,.5);
    transition: all .4s ease-in-out;
    position: relative
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content {
        height: 100%;
        margin-top: 2rem
    }
}

#nav-container #navbar .content .active-link {
    font-weight: 800
}

#nav-container #navbar .content-notDisplayed {
    position: absolute;
    left: 0;
    opacity: 0;
    visibility: hidden;
    transition: all .4s ease-in-out
}

#nav-container #navbar .content__product {
    display: flex;
    max-width: 1400px;
    margin: 0 auto
}

@media(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .content__product {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px) {
    #nav-container #navbar .content__product {
        padding-left: 5rem;
        padding-right: 5rem
    }
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__product {
        flex-direction: column;
        min-height: 100%;
        overflow-y: scroll;
        margin: 0
    }
}

#nav-container #navbar .content__product img {
    width: 24px;
    height: 24px;
    margin-right: .5rem
}

#nav-container #navbar .content__product svg {
    margin-right: .5rem
}

#nav-container #navbar .content__product__white {
    width: 70%;
    background-color: #fff;
    display: flex;
    padding: 3rem 0
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    #nav-container #navbar .content__product__white {
        padding: 0
    }
}

@media(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .content__product__white {
        width: 100%;
        padding: 3rem;
        flex-direction: column
    }
}

@media(max-width:767px) {
    #nav-container #navbar .content__product__white {
        width: 100%;
        padding: 2rem 3rem;
        flex-direction: column
    }
}

#nav-container #navbar .content__product__white-firstColumn {
    border-right: 1px solid #e9e9e9;
    padding-right: 4rem
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    #nav-container #navbar .content__product__white-firstColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-right: 4rem
    }
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container #navbar .content__product__white-firstColumn {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        padding-right: 0;
        border-right: 0;
        border-bottom: 1px solid #e9e9e9;
        padding-bottom: 1.5rem
    }
}

@media(max-width:767px) {
    #nav-container #navbar .content__product__white-firstColumn {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        padding-right: 0;
        border-right: 0;
        border-bottom: 1px solid #e9e9e9;
        padding-bottom: 1.5rem
    }
}

#nav-container #navbar .content__product__white-firstColumn div {
    display: flex;
    flex-direction: column
}

#nav-container #navbar .content__product__white-firstColumn-element-header {
    margin-top: 2rem;
    display: flex;
    flex-direction: row !important
}

    #nav-container #navbar .content__product__white-firstColumn-element-header svg {
        color: #323232
    }

    #nav-container #navbar .content__product__white-firstColumn-element-header a {
        font-size: 18px;
        color: #323333;
        font-weight: 700 !important;
        margin-bottom: .7rem
    }

    #nav-container #navbar .content__product__white-firstColumn-element-header:hover a {
        color: #ffc502;
        font-weight: 700 !important
    }

    #nav-container #navbar .content__product__white-firstColumn-element-header:hover svg {
        color: #ffc502
    }

#nav-container #navbar .content__product__white-firstColumn-element-header-malachite {
    margin-top: 0 !important
}

    #nav-container #navbar .content__product__white-firstColumn-element-header-malachite svg {
        color: #ffc502 !important
    }

    #nav-container #navbar .content__product__white-firstColumn-element-header-malachite a {
        color: #ffc502 !important
    }

@media(min-width:768px) and (max-width:1150px) {
    #nav-container #navbar .content__product__white-firstColumn-element {
        margin-top: 1.5rem
    }
}

#nav-container #navbar .content__product__white-firstColumn-element-header {
    display: flex;
    text-transform: uppercase
}

#nav-container #navbar .content__product__white-firstColumn-element ul li a {
    font-weight: 400;
    font-size: 18px;
    color: #323333;
    padding: 0 0 0 1rem
}

#nav-container #navbar .content__product__white-secondColumn {
    width: 60%;
    padding-left: 4rem;
    display: flex;
    flex-direction: column
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    #nav-container #navbar .content__product__white-secondColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-left: 4rem
    }
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container #navbar .content__product__white-secondColumn {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        padding-left: 0;
        padding-top: 1.5rem
    }
}

@media(max-width:767px) {
    #nav-container #navbar .content__product__white-secondColumn {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        padding-left: 0;
        padding-top: 1.5rem
    }
}

#nav-container #navbar .content__product__white-secondColumn-element:first-of-type ul {
    display: grid;
    grid-template-rows: repeat(6,auto);
    grid-template-columns: repeat(2,1fr);
    grid-auto-flow: column
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__product__white-secondColumn-element:first-of-type ul {
        width: 100%;
        grid-template-rows: unset;
        grid-auto-flow: unset;
        grid-template-columns: repeat(2,1fr);
        grid-template-columns: 1fr
    }
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container #navbar .content__product__white-secondColumn-element:first-of-type {
        margin-top: 2rem
    }
}

#nav-container #navbar .content__product__white-secondColumn-element:not(:first-of-type) {
    margin-top: 2rem
}

#nav-container #navbar .content__product__white-secondColumn-element-header {
    display: flex
}

    #nav-container #navbar .content__product__white-secondColumn-element-header svg {
        color: #323232
    }

    #nav-container #navbar .content__product__white-secondColumn-element-header a {
        font-size: 18px;
        color: #323333;
        font-weight: 700 !important;
        text-transform: uppercase;
        margin-bottom: .7rem
    }

    #nav-container #navbar .content__product__white-secondColumn-element-header:hover a {
        color: #ffc502
    }

    #nav-container #navbar .content__product__white-secondColumn-element-header:hover svg {
        color: #ffc502
    }

#nav-container #navbar .content__product__white-secondColumn-element ul {
    display: grid;
    grid-template-columns: 1fr
}

    #nav-container #navbar .content__product__white-secondColumn-element ul li a {
        font-weight: 400;
        font-size: 18px;
        color: #323333;
        padding: 0 0 0 1rem;
        display: inline-block;
        width: 100%
    }

#nav-container #navbar .content__product__white .content__product__white-firstColumn-element ul li, #nav-container #navbar .content__product__white .content__product__white-secondColumn-element ul li {
    max-width: 300px;
    padding: .3rem 0
}

    #nav-container #navbar .content__product__white .content__product__white-firstColumn-element ul li:hover, #nav-container #navbar .content__product__white .content__product__white-secondColumn-element ul li:hover {
        background-color: #ffc502;
        border-radius: 8px
    }

        #nav-container #navbar .content__product__white .content__product__white-firstColumn-element ul li:hover a, #nav-container #navbar .content__product__white .content__product__white-secondColumn-element ul li:hover a {
            color: #fff;
            display: inline-block;
            width: 100%
        }

#nav-container #navbar .content__product__grey {
    width: 30%;
    background-color: #f5f5f5;
    padding: 3rem 0 3rem 3rem;
    display: flex;
    justify-content: center
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .content__product__grey {
        width: 100%;
        padding: 3rem
    }
}

#nav-container #navbar .content__product__grey-element {
    max-width: 350px;
    display: flex;
    flex-direction: column
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__product__grey-element {
        max-width: 100%
    }
}

#nav-container #navbar .content__product__grey-element-header {
    display: flex !important;
    flex-direction: row !important;
    margin-bottom: 2rem
}

    #nav-container #navbar .content__product__grey-element-header a {
        color: #2d80eb;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 18px;
        cursor: inherit
    }

#nav-container #navbar .content__product__grey-element .underline-button-blue:hover > span {
    margin-left: 10px;
    transition: all .2s ease-in-out
}

#nav-container #navbar .content__product__grey-element div {
    display: grid;
    grid-template-columns: 1fr
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container #navbar .content__product__grey-element div {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    #nav-container #navbar .content__product__grey-element div {
        grid-template-columns: 1fr
    }
}

#nav-container #navbar .content__product__grey-element p {
    font-weight: 500;
    font-size: 18px;
    color: #323333;
    margin-bottom: 3rem
}

#nav-container #navbar .content__product__grey-element ul {
    margin-bottom: 3rem
}

    #nav-container #navbar .content__product__grey-element ul li {
        padding: .3rem 0
    }

        #nav-container #navbar .content__product__grey-element ul li:hover {
            background-color: #2d80eb;
            border-radius: 8px
        }

            #nav-container #navbar .content__product__grey-element ul li:hover svg {
                color: #fff
            }

            #nav-container #navbar .content__product__grey-element ul li:hover a {
                color: #fff
            }

        #nav-container #navbar .content__product__grey-element ul li span {
            display: flex;
            padding: 0 0 0 10px
        }

            #nav-container #navbar .content__product__grey-element ul li span svg {
                color: #323232
            }

            #nav-container #navbar .content__product__grey-element ul li span a {
                font-weight: 400;
                font-size: 18px;
                color: #323333;
                display: inline-block;
                width: 100%
            }

                #nav-container #navbar .content__product__grey-element ul li span a::after {
                    display: none
                }

#nav-container #navbar .content__integrations {
    display: flex;
    max-width: 1400px;
    margin: 0 auto
}

@media(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .content__integrations {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px) {
    #nav-container #navbar .content__integrations {
        padding-left: 5rem;
        padding-right: 5rem
    }
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__integrations {
        flex-direction: column;
        min-height: 100%;
        overflow-y: scroll
    }
}

#nav-container #navbar .content__integrations__white {
    width: 70%;
    padding: 3rem 0;
    background-color: #fff;
    display: flex;
    flex-direction: column
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container #navbar .content__integrations__white {
        width: 100%;
        padding: 3rem;
        flex-direction: column
    }
}

@media(max-width:767px) {
    #nav-container #navbar .content__integrations__white {
        width: 100%;
        padding: 2rem 3rem;
        flex-direction: column
    }
}

#nav-container #navbar .content__integrations__white-firstRow p {
    color: #323333;
    font-weight: 700;
    font-size: 18px;
    text-transform: uppercase
}

#nav-container #navbar .content__integrations__white-firstRow ul {
    display: grid;
    grid-template-columns: repeat(3,1fr)
}

@media(max-width:767px) {
    #nav-container #navbar .content__integrations__white-firstRow ul {
        grid-template-columns: 1fr
    }
}

#nav-container #navbar .content__integrations__white-firstRow ul li {
    max-width: 300px;
    padding: .3rem 0
}

    #nav-container #navbar .content__integrations__white-firstRow ul li span {
        display: flex
    }

    #nav-container #navbar .content__integrations__white-firstRow ul li a {
        color: #323333;
        font-weight: 400;
        font-size: 18px;
        padding: 0 0 0 .7rem
    }

    #nav-container #navbar .content__integrations__white-firstRow ul li:hover a {
        color: #ffc502;
        font-weight: 400 !important
    }

#nav-container #navbar .content__integrations__white-secondRow {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    margin-top: 2rem
}

@media(max-width:767px) {
    #nav-container #navbar .content__integrations__white-secondRow {
        grid-template-columns: 1fr
    }
}

#nav-container #navbar .content__integrations__white-secondRow ul p {
    color: #323333;
    font-weight: 700;
    font-size: 18px;
    text-transform: uppercase;
    margin-top: 3rem
}

    #nav-container #navbar .content__integrations__white-secondRow ul p:nth-of-type(1) {
        margin-top: 1rem
    }

#nav-container #navbar .content__integrations__white-secondRow ul li {
    max-width: 300px;
    padding: .3rem 0
}

    #nav-container #navbar .content__integrations__white-secondRow ul li span {
        display: flex
    }

    #nav-container #navbar .content__integrations__white-secondRow ul li a {
        color: #323333;
        font-weight: 400;
        font-size: 18px;
        padding: 0 0 0 .7rem
    }

    #nav-container #navbar .content__integrations__white-secondRow ul li:hover a {
        color: #ffc502;
        font-weight: 400 !important
    }

#nav-container #navbar .content__integrations__grey {
    width: 30%;
    background-color: #f5f5f5;
    padding: 3rem 0 3rem 3rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__integrations__grey {
        width: 100%;
        padding: 3rem
    }
}

#nav-container #navbar .content__integrations__grey-header p {
    color: #ffc502;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase
}

#nav-container #navbar .content__integrations__grey-grid {
    display: grid;
    grid-template-columns: 1fr
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container #navbar .content__integrations__grey-grid {
        grid-template-columns: repeat(2,1fr);
        gap: 3rem
    }
}

@media(max-width:767px) {
    #nav-container #navbar .content__integrations__grey-grid {
        grid-template-columns: 1fr
    }
}

#nav-container #navbar .content__integrations__grey-grid div:first-of-type {
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__integrations__grey-grid div:first-of-type {
        justify-content: space-between;
        gap: unset
    }
}

#nav-container #navbar .content__integrations__grey-grid div:first-of-type span {
    border-radius: 12px;
    max-height: 100px
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__integrations__grey-grid div:first-of-type span {
        margin: 0
    }
}

#nav-container #navbar .content__integrations__grey-grid div:first-of-type span:first-of-type {
    background-color: #fff
}

    #nav-container #navbar .content__integrations__grey-grid div:first-of-type span:first-of-type p {
        color: #323333
    }

#nav-container #navbar .content__integrations__grey-grid div:first-of-type span:last-of-type {
    background-color: #ffc502
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__integrations__grey-grid div:first-of-type span:last-of-type {
        margin-top: 1rem
    }
}

#nav-container #navbar .content__integrations__grey-grid div:first-of-type span:last-of-type p {
    color: #fff
}

#nav-container #navbar .content__integrations__grey-grid div:first-of-type span p {
    padding: 0;
    margin: 0;
    font-weight: 700;
    font-size: 18px;
    margin-left: 1.5rem
}

#nav-container #navbar .content__integrations__grey-grid div:first-of-type span a {
    display: flex;
    align-items: center;
    justify-content: space-between
}

    #nav-container #navbar .content__integrations__grey-grid div:first-of-type span a::after {
        display: none
    }

#nav-container #navbar .content__integrations__grey-grid div:last-of-type {
    display: flex;
    flex-direction: column;
    margin-top: 2.5rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content__integrations__grey-grid div:last-of-type {
        margin: 1.5rem 0 0
    }
}

#nav-container #navbar .content__integrations__grey-grid div:last-of-type img {
    margin-bottom: 1.5rem;
    width: 32px;
    height: 32px
}

#nav-container #navbar .content__integrations__grey-grid div:last-of-type h3 {
    line-height: normal;
    color: #323333;
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 1rem
}

#nav-container #navbar .content__integrations__grey-grid div:last-of-type p {
    color: #6b6b6b;
    font-weight: 400;
    font-size: 18px;
    margin-bottom: 1.5rem
}

#nav-container #navbar .content__integrations__grey-grid div:last-of-type a {
    width: fit-content
}

    #nav-container #navbar .content__integrations__grey-grid div:last-of-type a::after {
        display: none
    }

#nav-container #navbar .content-mobile {
    width: 100%;
    height: 100vh !important;
    background-color: rgba(0,0,0,.5);
    margin-top: -2px;
    display: none;
    padding-bottom: 3.5rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container #navbar .content-mobile {
        height: 100%;
        display: block;
        overflow-y: scroll
    }
}

@media(min-width:992px) and (max-width:1199px) {
    #nav-container #navbar .content-mobile {
        display: block;
        height: 100%
    }
}

#nav-container #navbar .content-mobile-notDisplayed {
    display: none !important
}

#nav-container #navbar .content-mobile-list {
    background-color: #fff !important
}

#nav-container #navbar .content-mobile-list-item {
    padding: .8rem 0
}

#nav-container #navbar .content-mobile-list-item-text {
    color: #222324 !important;
    margin: 0 3rem;
    color: #fff;
    font-weight: 700;
    font-size: 16px
}

#nav-container #navbar .content-mobile-list-item-button {
    margin: 0 3rem;
    max-width: 100% !important;
    display: block;
    text-align: center
}

#nav-container #navbar .arrow-active::after {
    content: "" !important;
    margin-left: .6rem !important;
    top: 8px !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-bottom: 6px solid #fff !important;
    transform: rotate(0deg) !important;
    transition: all .4s ease-in-out
}

#nav-container #navbar .arrow-active-mobile a::after {
    content: "";
    margin-left: .6rem;
    top: 8px;
    position: absolute;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid #fff;
    transform: rotate(0deg) !important;
    transition: all .4s ease-in-out
}

#nav-container #navbar .toggle-product-arrow, #nav-container #navbar .toggle-integrations-arrow {
    position: relative;
    padding-right: 10px
}

    #nav-container #navbar .toggle-product-arrow::after, #nav-container #navbar .toggle-integrations-arrow::after {
        content: "";
        margin-left: .6rem;
        top: 8px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #222324 !important;
        transform: rotate(180deg);
        transition: all .4s ease-in-out
    }

#nav-container #navbar .toggle-mobile-product-button a.content-mobile-list-item-text, #nav-container #navbar .toggle-mobile-integrations-button a.content-mobile-list-item-text {
    position: relative
}

    #nav-container #navbar .toggle-mobile-product-button a.content-mobile-list-item-text::after, #nav-container #navbar .toggle-mobile-integrations-button a.content-mobile-list-item-text::after {
        content: "";
        margin-left: .6rem;
        top: 8px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #222324 !important;
        transform: rotate(180deg);
        transition: all .4s ease-in-out
    }

#navbar-planner-transparent {
    z-index: 9999;
    position: fixed;
    width: 100%;
    top: 0;
    right: 0;
    left: 0
}

    #navbar-planner-transparent ul {
        padding: 0;
        margin: 0
    }

        #navbar-planner-transparent ul li {
            list-style: none
        }

    #navbar-planner-transparent a:hover {
        cursor: pointer
    }

    #navbar-planner-transparent a.check-link.hover:hover {
        cursor: pointer;
        color: #2d80eb
    }

    #navbar-planner-transparent a.filled-menu-button {
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        margin-top: 4.5rem;
        padding: 1rem 2rem;
        border-radius: 12px;
        font-weight: 700 !important;
        font-size: 18px;
        transition: all .2s ease-in-out;
        background-color: #ddebfc
    }

        #navbar-planner-transparent a.filled-menu-button img {
            margin-left: .4rem
        }

@media(max-width:767px) {
    #navbar-planner-transparent a.filled-menu-button {
        margin-top: 2rem;
        margin-left: 0;
        padding: 1rem .5rem
    }
}

#navbar-planner-transparent a.filled-menu-button-blue {
    color: #2d80eb
}

    #navbar-planner-transparent a.filled-menu-button-blue:hover > span {
        margin-left: 10px;
        transition: all .2s ease-in-out
    }

    #navbar-planner-transparent a.filled-menu-button-blue::after {
        display: none
    }

#navbar-planner-transparent a.underline-button {
    width: fit-content;
    font-weight: 700 !important;
    font-size: 18px;
    padding: .3rem 0;
    transition: all .2s ease-in-out
}

#navbar-planner-transparent a.underline-button-green {
    color: #ffc502;
    border-bottom: 2px solid #ffc502
}

    #navbar-planner-transparent a.underline-button-green:hover > span {
        margin-left: 10px;
        transition: all .2s ease-in-out
    }

#navbar-planner-transparent a.underline-button-blue {
    color: #2d80eb;
    border-bottom: 2px solid #2d80eb
}

    #navbar-planner-transparent a.underline-button-blue:hover > span {
        margin-left: 10px;
        transition: all .2s ease-in-out
    }

    #navbar-planner-transparent a.underline-button-blue::after {
        display: none
    }

#navbar-planner-transparent a.underline-button img {
    margin-left: .4rem
}

#navbar-planner-transparent .gradient-background {
    width: 100%;
    background: #fff;
    background: linear-gradient(90deg,#fff 0%,#fff 52%,#f5f5f5 58%)
}

#navbar-planner-transparent .cta-register {
    font-size: 18px;
    padding: 16px 36px 17px;
    border-radius: 36px;
    background: linear-gradient(111deg,#2d80eb 36.16%,#2466bc 88.93%);
    box-shadow: 2px 4px 32px 0 rgba(36,102,188,.64);
    color: #fff;
    font-weight: 700;
    transition: all .2s ease-in-out
}

    #navbar-planner-transparent .cta-register:hover {
        filter: brightness(.85)
    }

#navbar-planner-transparent .container {
    display: flex;
    flex-direction: column;
    align-items: normal !important;
    width: 100%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner-transparent .container {
        padding: 1.5rem 15px
    }
}

#navbar-planner-transparent .navbar {
    position: relative;
    background: linear-gradient(91deg,rgba(234,242,253,0.02) 9.28%,rgba(234,242,253,0) 100.82%);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    border-bottom: 1px solid #2d80eb26;
    width: 100%;
    padding: 0;
    box-shadow: 0 6px 24px 0 rgba(0,0,0,.12)
}

#navbar-planner-transparent .navbar__header {
    display: flex;
    align-items: center
}

#navbar-planner-transparent .navbar__header-logo img {
    fill: #fff
}

#navbar-planner-transparent .navbar__header-links {
    margin-left: 3rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner-transparent .navbar__header-links {
        display: none
    }
}

#navbar-planner-transparent .navbar__header-register {
    margin-left: auto
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner-transparent .navbar__header-register {
        display: none
    }
}

#navbar-planner-transparent .navbar__header-burger {
    display: none;
    margin-left: auto
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner-transparent .navbar__header-burger {
        display: block
    }
}

#navbar-planner-transparent .navbar__header-burger-line {
    width: 2rem;
    height: 1px;
    background-color: #fff;
    margin: 8px
}

    #navbar-planner-transparent .navbar__header-burger-line.black {
        background-color: #000
    }

#navbar-planner-transparent .navbar__header-burger-active .navbar__header-burger-line:first-of-type {
    transform: translateY(9px) rotate(-45deg)
}

#navbar-planner-transparent .navbar__header-burger-active .navbar__header-burger-line:nth-of-type(2) {
    visibility: hidden
}

#navbar-planner-transparent .navbar__header-burger-active .navbar__header-burger-line:last-of-type {
    transform: translateY(-9px) rotate(45deg)
}

#navbar-planner-transparent .navbar__list {
    display: flex;
    align-items: center;
    padding: 1.4rem 0
}

#navbar-planner-transparent .navbar__list-item {
    list-style: none;
    padding: .6rem 1.2rem
}

#navbar-planner-transparent .navbar__list-item--last {
    padding: .6rem 0 .6rem 1.2rem
}

#navbar-planner-transparent .navbar__link {
    font-weight: 400;
    font-size: 16px;
    color: #fff;
    transition: all .2s ease-in-out
}

    #navbar-planner-transparent .navbar__link:hover {
        color: #a7a7a7
    }

    #navbar-planner-transparent .navbar__link.black {
        color: #000
    }

#navbar-planner-transparent .content-desktop {
    position: relative;
    z-index: -1
}

#navbar-planner-transparent .content {
    width: 100%;
    height: 100vh;
    opacity: 1;
    visibility: visible;
    background-color: rgba(0,0,0,.5);
    transition: all .4s ease-in-out;
    position: relative
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner-transparent .content {
        height: 100%;
        margin-top: 2rem
    }
}

#navbar-planner-transparent .content .active-link {
    font-weight: 800
}

#navbar-planner-transparent .content-notDisplayed {
    position: absolute;
    left: 0;
    opacity: 0;
    visibility: hidden;
    transition: all .4s ease-in-out
}

#navbar-planner-transparent .content__product {
    display: flex;
    max-width: 1400px;
    margin: 0 auto
}

@media(min-width:992px) and (max-width:1199px) {
    #navbar-planner-transparent .content__product {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px) {
    #navbar-planner-transparent .content__product {
        padding-left: 5rem;
        padding-right: 5rem
    }
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner-transparent .content__product {
        flex-direction: column;
        min-height: 100%;
        overflow-y: scroll;
        margin: 0
    }
}

#navbar-planner-transparent .content__product img {
    width: 24px;
    height: 24px;
    margin-right: .5rem
}

#navbar-planner-transparent .content__product svg {
    margin-right: .5rem
}

#navbar-planner-transparent .content__product__white {
    width: 70%;
    background-color: #fff;
    display: flex;
    padding: 3rem 0
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner-transparent .content__product__white {
        width: 100%;
        padding: 0 3rem 3rem;
        flex-direction: column
    }
}

@media(max-width:767px) {
    #navbar-planner-transparent .content__product__white {
        width: 100%;
        padding: 0 2rem 2rem;
        flex-direction: column
    }
}

#navbar-planner-transparent .content__product__white-firstColumn {
    border-right: 1px solid #e9e9e9;
    padding-right: 4rem
}

@media(min-width:768px) and (max-width:1150px) {
    #navbar-planner-transparent .content__product__white-firstColumn {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        padding-right: 0;
        border-right: 0;
        border-bottom: 1px solid #e9e9e9;
        padding-bottom: 3rem
    }
}

@media(max-width:767px) {
    #navbar-planner-transparent .content__product__white-firstColumn {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        padding-right: 0;
        border-right: 0;
        border-bottom: 1px solid #e9e9e9;
        padding-bottom: 1.5rem
    }
}

#navbar-planner-transparent .content__product__white-firstColumn div {
    display: flex;
    flex-direction: column
}

#navbar-planner-transparent .content__product__white-firstColumn-element-header {
    margin-top: 1.5rem;
    display: flex;
    flex-direction: row !important
}

    #navbar-planner-transparent .content__product__white-firstColumn-element-header svg {
        color: #323232
    }

    #navbar-planner-transparent .content__product__white-firstColumn-element-header a {
        font-size: 18px;
        color: #323333;
        font-weight: 700 !important;
        margin-bottom: .7rem
    }

    #navbar-planner-transparent .content__product__white-firstColumn-element-header:hover a {
        cursor: text
    }

    #navbar-planner-transparent .content__product__white-firstColumn-element-header:hover svg {
        color: #2d80eb
    }

#navbar-planner-transparent .content__product__white-firstColumn-element-header-malachite {
    margin-top: 1.5rem !important
}

    #navbar-planner-transparent .content__product__white-firstColumn-element-header-malachite svg {
        color: #2d80eb !important
    }

    #navbar-planner-transparent .content__product__white-firstColumn-element-header-malachite a {
        color: #2d80eb !important
    }

@media(min-width:768px) and (max-width:1150px) {
    #navbar-planner-transparent .content__product__white-firstColumn-element {
        margin-top: 1.5rem
    }
}

#navbar-planner-transparent .content__product__white-firstColumn-element-header {
    display: flex;
    text-transform: uppercase
}

#navbar-planner-transparent .content__product__white-firstColumn-element ul li a {
    font-weight: 400;
    font-size: 18px;
    color: #323333;
    padding: 0 0 0 1rem
}

#navbar-planner-transparent .content__product__white-secondColumn {
    width: 60%;
    padding-left: 4rem;
    display: flex;
    flex-direction: column
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner-transparent .content__product__white-secondColumn {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        padding-left: 0;
        padding-top: 1.5rem
    }
}

#navbar-planner-transparent .content__product__white-secondColumn-element:first-of-type {
    margin-top: 1.5rem
}

    #navbar-planner-transparent .content__product__white-secondColumn-element:first-of-type ul {
        display: grid;
        grid-template-columns: repeat(2,1fr)
    }

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner-transparent .content__product__white-secondColumn-element:first-of-type ul {
        width: 100%;
        grid-template-columns: repeat(2,1fr)
    }
}

@media(min-width:768px) and (max-width:1150px) {
    #navbar-planner-transparent .content__product__white-secondColumn-element:first-of-type {
        margin-top: 2rem
    }
}

#navbar-planner-transparent .content__product__white-secondColumn-element:not(:first-of-type) {
    margin-top: 2rem
}

#navbar-planner-transparent .content__product__white-secondColumn-element-header {
    display: flex
}

    #navbar-planner-transparent .content__product__white-secondColumn-element-header svg {
        color: #323232
    }

    #navbar-planner-transparent .content__product__white-secondColumn-element-header a {
        font-size: 18px;
        color: #323333;
        font-weight: 700 !important;
        text-transform: uppercase;
        margin-bottom: .7rem
    }

    #navbar-planner-transparent .content__product__white-secondColumn-element-header:hover a {
        cursor: text
    }

    #navbar-planner-transparent .content__product__white-secondColumn-element-header:hover svg {
        color: #2d80eb
    }

#navbar-planner-transparent .content__product__white-secondColumn-element ul li a {
    font-weight: 400;
    font-size: 18px;
    color: #323333;
    padding: 0 0 0 1rem;
    display: inline-block;
    width: 100%
}

#navbar-planner-transparent .content__product__white .content__product__white-firstColumn-element ul li, #navbar-planner-transparent .content__product__white .content__product__white-secondColumn-element ul li {
    max-width: 300px;
    padding: .3rem 0
}

    #navbar-planner-transparent .content__product__white .content__product__white-firstColumn-element ul li:hover, #navbar-planner-transparent .content__product__white .content__product__white-secondColumn-element ul li:hover {
        background-color: #2d80eb;
        border-radius: 8px
    }

        #navbar-planner-transparent .content__product__white .content__product__white-firstColumn-element ul li:hover a, #navbar-planner-transparent .content__product__white .content__product__white-secondColumn-element ul li:hover a {
            color: #fff;
            display: inline-block;
            width: 100%
        }

#navbar-planner-transparent .content__product__grey {
    width: 30%;
    background-color: #f5f5f5;
    padding: 3rem 0 3rem 3rem;
    display: flex;
    justify-content: center
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner-transparent .content__product__grey {
        width: 100%;
        padding: 3rem
    }
}

#navbar-planner-transparent .content__product__grey-element {
    max-width: 350px;
    display: flex;
    flex-direction: column;
    margin-top: 1.5rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner-transparent .content__product__grey-element {
        max-width: 100%
    }
}

#navbar-planner-transparent .content__product__grey-element-header {
    display: flex !important;
    flex-direction: row !important;
    margin-bottom: 2rem
}

    #navbar-planner-transparent .content__product__grey-element-header a {
        color: #ffc502;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 18px;
        cursor: inherit
    }

#navbar-planner-transparent .content__product__grey-element div {
    display: grid;
    grid-template-columns: 1fr
}

@media(min-width:768px) and (max-width:1150px) {
    #navbar-planner-transparent .content__product__grey-element div {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    #navbar-planner-transparent .content__product__grey-element div {
        grid-template-columns: 1fr
    }
}

#navbar-planner-transparent .content__product__grey-element p {
    font-weight: 600;
    font-size: 18px;
    color: #323333;
    margin-bottom: 3rem
}

#navbar-planner-transparent .content__product__grey-element ul {
    margin-bottom: 3rem
}

    #navbar-planner-transparent .content__product__grey-element ul li {
        padding: .3rem 0
    }

        #navbar-planner-transparent .content__product__grey-element ul li:hover {
            background-color: #ffc502;
            border-radius: 8px
        }

            #navbar-planner-transparent .content__product__grey-element ul li:hover svg {
                color: #fff
            }

            #navbar-planner-transparent .content__product__grey-element ul li:hover a {
                color: #fff
            }

        #navbar-planner-transparent .content__product__grey-element ul li span {
            display: flex;
            padding: 0 0 0 10px
        }

            #navbar-planner-transparent .content__product__grey-element ul li span svg {
                color: #323232
            }

            #navbar-planner-transparent .content__product__grey-element ul li span a {
                font-weight: 400;
                font-size: 18px;
                color: #323333;
                display: inline-block;
                width: 100%
            }

                #navbar-planner-transparent .content__product__grey-element ul li span a::after {
                    display: none
                }

#navbar-planner-transparent .content-mobile {
    width: 100%;
    height: 100vh !important;
    background-color: rgba(0,0,0,.5);
    margin-top: -2px;
    display: none;
    padding-bottom: 3.5rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner-transparent .content-mobile {
        height: 100%;
        display: block;
        overflow-y: scroll
    }
}

@media(min-width:992px) and (max-width:1199px) {
    #navbar-planner-transparent .content-mobile {
        display: block;
        height: 100%
    }
}

#navbar-planner-transparent .content-mobile-notDisplayed {
    display: none !important
}

#navbar-planner-transparent .content-mobile-list {
    background-color: #fff
}

@media(min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    #navbar-planner-transparent .content-mobile-list {
        padding: 1rem 0
    }
}

#navbar-planner-transparent .content-mobile-list-item {
    padding: .8rem 0
}

#navbar-planner-transparent .content-mobile-list-item-text {
    margin: 0 2rem;
    color: #000;
    font-weight: 700;
    font-size: 16px
}

#navbar-planner-transparent .content-mobile-list-item-button {
    margin: 0 2rem;
    max-width: 100% !important;
    display: block;
    text-align: center
}

#navbar-planner-transparent .arrow-active::after {
    content: "" !important;
    margin-left: .6rem !important;
    top: 8px !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-bottom: 6px solid #a7a7a7 !important;
    transform: rotate(0deg) !important;
    transition: all .4s ease-in-out
}

#navbar-planner-transparent .arrow-active.black::after {
    border-bottom: 6px solid #000 !important
}

#navbar-planner-transparent .arrow-active-mobile a.content-mobile-list-item-text::after {
    content: "";
    margin-left: .6rem;
    top: 8px;
    position: absolute;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid #a7a7a7;
    transform: rotate(0deg) !important;
    transition: all .4s ease-in-out
}

#navbar-planner-transparent .toggle-product-arrow {
    position: relative;
    padding-right: 10px
}

    #navbar-planner-transparent .toggle-product-arrow::after {
        content: "";
        margin-left: .6rem;
        top: 8px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #fff;
        transform: rotate(180deg);
        transition: all .4s ease-in-out
    }

    #navbar-planner-transparent .toggle-product-arrow.black::after {
        border-bottom: 6px solid #000
    }

#navbar-planner-transparent .toggle-mobile-product-button .content-mobile-list-item-text {
    position: relative
}

    #navbar-planner-transparent .toggle-mobile-product-button .content-mobile-list-item-text::after {
        content: "";
        margin-left: .6rem;
        top: 8px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #000;
        transform: rotate(180deg);
        transition: all .4s ease-in-out
    }

#navbar-planner {
    z-index: 9999;
    position: fixed;
    width: 100%;
    top: 0;
    right: 0;
    left: 0
}

    #navbar-planner ul {
        padding: 0;
        margin: 0
    }

        #navbar-planner ul li {
            list-style: none
        }

    #navbar-planner a:hover {
        cursor: pointer
    }

    #navbar-planner a.check-link.hover:hover {
        cursor: pointer;
        color: #2d80eb
    }

    #navbar-planner a.filled-menu-button {
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        margin-top: 4.5rem;
        padding: 1rem 2rem;
        border-radius: 12px;
        font-weight: 700 !important;
        font-size: 18px;
        transition: all .2s ease-in-out;
        background-color: #ddebfc
    }

        #navbar-planner a.filled-menu-button img {
            margin-left: .4rem
        }

@media(max-width:767px) {
    #navbar-planner a.filled-menu-button {
        margin-top: 2rem;
        margin-left: 0;
        padding: 1rem .5rem
    }
}

#navbar-planner a.filled-menu-button-blue {
    color: #2d80eb
}

    #navbar-planner a.filled-menu-button-blue:hover > span {
        margin-left: 10px;
        transition: all .2s ease-in-out
    }

    #navbar-planner a.filled-menu-button-blue::after {
        display: none
    }

#navbar-planner a.underline-button {
    width: fit-content;
    font-weight: 700 !important;
    font-size: 18px;
    padding: .3rem 0;
    transition: all .2s ease-in-out
}

#navbar-planner a.underline-button-green {
    color: #ffc502;
    border-bottom: 2px solid #ffc502
}

    #navbar-planner a.underline-button-green:hover > span {
        margin-left: 10px;
        transition: all .2s ease-in-out
    }

#navbar-planner a.underline-button-blue {
    color: #2d80eb;
    border-bottom: 2px solid #2d80eb
}

    #navbar-planner a.underline-button-blue:hover > span {
        margin-left: 10px;
        transition: all .2s ease-in-out
    }

    #navbar-planner a.underline-button-blue::after {
        display: none
    }

#navbar-planner a.underline-button img {
    margin-left: .4rem
}

#navbar-planner .gradient-background {
    width: 100%;
    background: #fff;
    background: linear-gradient(90deg,#fff 0%,#fff 52%,#f5f5f5 58%)
}

#navbar-planner .cta-register {
    font-size: 18px;
    padding: 16px 36px 17px;
    background: #ddebfc;
    box-shadow: 0 8px 32px 0 rgba(221,235,252,.8);
    color: #000;
    font-weight: 700;
    border-radius: 36px;
    transition: all .2s ease-in-out
}

    #navbar-planner .cta-register:hover {
        filter: contrast(.91)
    }

#navbar-planner .container {
    display: flex;
    flex-direction: column;
    align-items: normal !important;
    width: 100%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner .container {
        padding: 1.5rem 15px
    }
}

#navbar-planner .navbar {
    background-color: #fff;
    width: 100%;
    padding: 0;
    box-shadow: 0 6px 24px 0 rgba(0,0,0,.12)
}

#navbar-planner .navbar__header {
    display: flex;
    align-items: center
}

#navbar-planner .navbar__header-logo img {
    fill: #fff
}

#navbar-planner .navbar__header-links {
    margin-left: 3rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner .navbar__header-links {
        display: none
    }
}

#navbar-planner .navbar__header-register {
    margin-left: auto
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner .navbar__header-register {
        display: none
    }
}

#navbar-planner .navbar__header-burger {
    display: none;
    margin-left: auto
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner .navbar__header-burger {
        display: block
    }
}

#navbar-planner .navbar__header-burger-line {
    width: 2rem;
    height: 1px;
    background-color: #000;
    margin: 8px
}

#navbar-planner .navbar__header-burger-active .navbar__header-burger-line:first-of-type {
    transform: translateY(9px) rotate(-45deg)
}

#navbar-planner .navbar__header-burger-active .navbar__header-burger-line:nth-of-type(2) {
    visibility: hidden
}

#navbar-planner .navbar__header-burger-active .navbar__header-burger-line:last-of-type {
    transform: translateY(-9px) rotate(45deg)
}

#navbar-planner .navbar__list {
    display: flex;
    align-items: center;
    padding: 1.4rem 0
}

#navbar-planner .navbar__list-item {
    list-style: none;
    padding: .6rem 1.2rem
}

#navbar-planner .navbar__list-item--border {
    border-right: .5px solid #e3e3e3
}

#navbar-planner .navbar__list-item--last {
    padding: .6rem 0 .6rem 1.2rem
}

#navbar-planner .navbar__link {
    font-weight: 600;
    color: #000;
    transition: all .2s ease-in-out
}

    #navbar-planner .navbar__link:hover {
        color: #1b1b20
    }

#navbar-planner .content-desktop {
    position: relative;
    z-index: -1
}

#navbar-planner .content {
    width: 100%;
    height: 100vh;
    opacity: 1;
    visibility: visible;
    background-color: rgba(0,0,0,.5);
    transition: all .4s ease-in-out;
    position: relative
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner .content {
        height: 100%;
        margin-top: 2rem
    }
}

#navbar-planner .content .active-link {
    font-weight: 800
}

#navbar-planner .content-notDisplayed {
    position: absolute;
    left: 0;
    opacity: 0;
    visibility: hidden;
    transition: all .4s ease-in-out
}

#navbar-planner .content__product {
    display: flex;
    max-width: 1400px;
    margin: 0 auto
}

@media(min-width:992px) and (max-width:1199px) {
    #navbar-planner .content__product {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px) {
    #navbar-planner .content__product {
        padding-left: 5rem;
        padding-right: 5rem
    }
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner .content__product {
        flex-direction: column;
        min-height: 100%;
        overflow-y: scroll;
        margin: 0
    }
}

#navbar-planner .content__product img {
    width: 24px;
    height: 24px;
    margin-right: .5rem
}

#navbar-planner .content__product svg {
    margin-right: .5rem
}

#navbar-planner .content__product__white {
    width: 70%;
    background-color: #fff;
    display: flex;
    padding: 3rem 0
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner .content__product__white {
        width: 100%;
        padding: 0 3rem 3rem;
        flex-direction: column
    }
}

@media(max-width:767px) {
    #navbar-planner .content__product__white {
        width: 100%;
        padding: 0 2rem 2rem;
        flex-direction: column
    }
}

#navbar-planner .content__product__white-firstColumn {
    border-right: 1px solid #e9e9e9;
    padding-right: 4rem
}

@media(min-width:768px) and (max-width:1150px) {
    #navbar-planner .content__product__white-firstColumn {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        padding-right: 0;
        border-right: 0;
        border-bottom: 1px solid #e9e9e9;
        padding-bottom: 3rem
    }
}

@media(max-width:767px) {
    #navbar-planner .content__product__white-firstColumn {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        padding-right: 0;
        border-right: 0;
        border-bottom: 1px solid #e9e9e9;
        padding-bottom: 1.5rem
    }
}

#navbar-planner .content__product__white-firstColumn div {
    display: flex;
    flex-direction: column
}

#navbar-planner .content__product__white-firstColumn-element-header {
    margin-top: 1.5rem;
    display: flex;
    flex-direction: row !important
}

    #navbar-planner .content__product__white-firstColumn-element-header svg {
        color: #323232
    }

    #navbar-planner .content__product__white-firstColumn-element-header a {
        font-size: 18px;
        color: #323333;
        font-weight: 700 !important;
        margin-bottom: .7rem
    }

    #navbar-planner .content__product__white-firstColumn-element-header:hover a {
        cursor: text
    }

    #navbar-planner .content__product__white-firstColumn-element-header:hover svg {
        color: #2d80eb
    }

#navbar-planner .content__product__white-firstColumn-element-header-malachite {
    margin-top: 1.5rem !important
}

    #navbar-planner .content__product__white-firstColumn-element-header-malachite svg {
        color: #2d80eb !important
    }

    #navbar-planner .content__product__white-firstColumn-element-header-malachite a {
        color: #2d80eb !important
    }

@media(min-width:768px) and (max-width:1150px) {
    #navbar-planner .content__product__white-firstColumn-element {
        margin-top: 1.5rem
    }
}

#navbar-planner .content__product__white-firstColumn-element-header {
    display: flex;
    text-transform: uppercase
}

#navbar-planner .content__product__white-firstColumn-element ul li a {
    font-weight: 400;
    font-size: 18px;
    color: #323333;
    padding: 0 0 0 1rem
}

#navbar-planner .content__product__white-secondColumn {
    width: 60%;
    padding-left: 4rem;
    display: flex;
    flex-direction: column
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner .content__product__white-secondColumn {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        padding-left: 0;
        padding-top: 1.5rem
    }
}

#navbar-planner .content__product__white-secondColumn-element:first-of-type {
    margin-top: 1.5rem
}

    #navbar-planner .content__product__white-secondColumn-element:first-of-type ul {
        display: grid;
        grid-template-columns: repeat(2,1fr)
    }

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner .content__product__white-secondColumn-element:first-of-type ul {
        width: 100%;
        grid-template-columns: repeat(2,1fr)
    }
}

@media(min-width:768px) and (max-width:1150px) {
    #navbar-planner .content__product__white-secondColumn-element:first-of-type {
        margin-top: 2rem
    }
}

#navbar-planner .content__product__white-secondColumn-element:not(:first-of-type) {
    margin-top: 2rem
}

#navbar-planner .content__product__white-secondColumn-element-header {
    display: flex
}

    #navbar-planner .content__product__white-secondColumn-element-header svg {
        color: #323232
    }

    #navbar-planner .content__product__white-secondColumn-element-header a {
        font-size: 18px;
        color: #323333;
        font-weight: 700 !important;
        text-transform: uppercase;
        margin-bottom: .7rem
    }

    #navbar-planner .content__product__white-secondColumn-element-header:hover a {
        cursor: text
    }

    #navbar-planner .content__product__white-secondColumn-element-header:hover svg {
        color: #2d80eb
    }

#navbar-planner .content__product__white-secondColumn-element ul li a {
    font-weight: 400;
    font-size: 18px;
    color: #323333;
    padding: 0 0 0 1rem;
    display: inline-block;
    width: 100%
}

#navbar-planner .content__product__white .content__product__white-firstColumn-element ul li, #navbar-planner .content__product__white .content__product__white-secondColumn-element ul li {
    max-width: 300px;
    padding: .3rem 0
}

    #navbar-planner .content__product__white .content__product__white-firstColumn-element ul li:hover, #navbar-planner .content__product__white .content__product__white-secondColumn-element ul li:hover {
        background-color: #2d80eb;
        border-radius: 8px
    }

        #navbar-planner .content__product__white .content__product__white-firstColumn-element ul li:hover a, #navbar-planner .content__product__white .content__product__white-secondColumn-element ul li:hover a {
            color: #fff;
            display: inline-block;
            width: 100%
        }

#navbar-planner .content__product__grey {
    width: 30%;
    background-color: #f5f5f5;
    padding: 3rem 0 3rem 3rem;
    display: flex;
    justify-content: center
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #navbar-planner .content__product__grey {
        width: 100%;
        padding: 3rem
    }
}

#navbar-planner .content__product__grey-element {
    max-width: 350px;
    display: flex;
    flex-direction: column;
    margin-top: 1.5rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner .content__product__grey-element {
        max-width: 100%
    }
}

#navbar-planner .content__product__grey-element-header {
    display: flex !important;
    flex-direction: row !important;
    margin-bottom: 2rem
}

    #navbar-planner .content__product__grey-element-header a {
        color: #ffc502;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 18px;
        cursor: inherit
    }

#navbar-planner .content__product__grey-element div {
    display: grid;
    grid-template-columns: 1fr
}

@media(min-width:768px) and (max-width:1150px) {
    #navbar-planner .content__product__grey-element div {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    #navbar-planner .content__product__grey-element div {
        grid-template-columns: 1fr
    }
}

#navbar-planner .content__product__grey-element p {
    font-weight: 600;
    font-size: 18px;
    color: #323333;
    margin-bottom: 3rem
}

#navbar-planner .content__product__grey-element ul {
    margin-bottom: 3rem
}

    #navbar-planner .content__product__grey-element ul li {
        padding: .3rem 0
    }

        #navbar-planner .content__product__grey-element ul li:hover {
            background-color: #ffc502;
            border-radius: 8px
        }

            #navbar-planner .content__product__grey-element ul li:hover svg {
                color: #fff
            }

            #navbar-planner .content__product__grey-element ul li:hover a {
                color: #fff
            }

        #navbar-planner .content__product__grey-element ul li span {
            display: flex;
            padding: 0 0 0 10px
        }

            #navbar-planner .content__product__grey-element ul li span svg {
                color: #323232
            }

            #navbar-planner .content__product__grey-element ul li span a {
                font-weight: 400;
                font-size: 18px;
                color: #323333;
                display: inline-block;
                width: 100%
            }

                #navbar-planner .content__product__grey-element ul li span a::after {
                    display: none
                }

#navbar-planner .content-mobile {
    width: 100%;
    height: 100vh !important;
    background-color: rgba(0,0,0,.5);
    margin-top: -2px;
    display: none;
    padding-bottom: 3.5rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #navbar-planner .content-mobile {
        height: 100%;
        display: block;
        overflow-y: scroll
    }
}

@media(min-width:992px) and (max-width:1199px) {
    #navbar-planner .content-mobile {
        display: block;
        height: 100%
    }
}

#navbar-planner .content-mobile-notDisplayed {
    display: none !important
}

#navbar-planner .content-mobile-list {
    background-color: #fff
}

@media(min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    #navbar-planner .content-mobile-list {
        padding: 1rem 0
    }
}

#navbar-planner .content-mobile-list-item {
    padding: .8rem 0
}

#navbar-planner .content-mobile-list-item-text {
    margin: 0 2rem;
    color: #000;
    font-weight: 700;
    font-size: 16px
}

#navbar-planner .content-mobile-list-item-button {
    margin: 0 2rem;
    max-width: 100% !important;
    display: block;
    text-align: center
}

#navbar-planner .arrow-active::after {
    content: "" !important;
    margin-left: .6rem !important;
    top: 8px !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-bottom: 6px solid #1b1b20 !important;
    transform: rotate(0deg) !important;
    transition: all .4s ease-in-out
}

#navbar-planner .arrow-active-mobile a.content-mobile-list-item-text::after {
    content: "";
    margin-left: .6rem;
    top: 8px;
    position: absolute;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid #1b1b20;
    transform: rotate(0deg) !important;
    transition: all .4s ease-in-out
}

#navbar-planner .toggle-product-arrow {
    position: relative;
    padding-right: 10px
}

    #navbar-planner .toggle-product-arrow::after {
        content: "";
        margin-left: .6rem;
        top: 8px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #000;
        transform: rotate(180deg);
        transition: all .4s ease-in-out
    }

#navbar-planner .toggle-mobile-product-button .content-mobile-list-item-text {
    position: relative
}

    #navbar-planner .toggle-mobile-product-button .content-mobile-list-item-text::after {
        content: "";
        margin-left: .6rem;
        top: 8px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #000;
        transform: rotate(180deg);
        transition: all .4s ease-in-out
    }

#nav-container-ppc {
    height: 90px;
    width: 100%
}

    #nav-container-ppc * {
        font-family: sans-serif,sans-serif
    }

    #nav-container-ppc .toggle-product-button {
        position: relative
    }

        #nav-container-ppc .toggle-product-button:hover > .submenu-product {
            display: flex
        }

            #nav-container-ppc .toggle-product-button:hover > .submenu-product::before {
                display: flex
            }

        #nav-container-ppc .toggle-product-button .check-link.active-link {
            color: #ffc502
        }

            #nav-container-ppc .toggle-product-button .check-link.active-link svg {
                fill: #ffc502
            }

        #nav-container-ppc .toggle-product-button .submenu-product {
            z-index: 999999999;
            width: max-content;
            background-color: #fff;
            padding: 24px 32px;
            box-shadow: 0 8px 32px 0 #7d808666;
            border-radius: 8px;
            position: absolute;
            top: 2.5rem;
            left: 0;
            display: none;
            gap: 48px
        }

            #nav-container-ppc .toggle-product-button .submenu-product::before {
                content: "";
                width: 100%;
                height: 30px;
                position: absolute;
                background-color: transparent;
                top: -18px;
                left: 0
            }

            #nav-container-ppc .toggle-product-button .submenu-product ul {
                display: flex;
                flex-direction: column;
                gap: 8px
            }

                #nav-container-ppc .toggle-product-button .submenu-product ul span.list-header {
                    font-family: sans-serif;
                    font-size: 16px;
                    font-weight: 700;
                    line-height: 19.2px;
                    text-align: left;
                    color: #222324;
                    margin-bottom: 4px
                }

                #nav-container-ppc .toggle-product-button .submenu-product ul li {
                    display: flex
                }

                    #nav-container-ppc .toggle-product-button .submenu-product ul li a {
                        font-family: sans-serif;
                        font-size: 16px;
                        font-weight: 400;
                        line-height: 19px;
                        letter-spacing: 0;
                        text-align: left;
                        color: #323333;
                        width: 100%;
                        padding: 8px 12px;
                        transition: all .2s ease-in-out;
                        display: flex;
                        align-items: center;
                        gap: 8px
                    }

                        #nav-container-ppc .toggle-product-button .submenu-product ul li a:hover {
                            color: #ffc502;
                            background-color: #f2fcf6;
                            cursor: pointer
                        }

                            #nav-container-ppc .toggle-product-button .submenu-product ul li a:hover svg {
                                fill: #ffc502
                            }

    #nav-container-ppc .toggle-mobile-product-button .submenu-product-mobile {
        display: none;
        flex-direction: column;
        gap: 40px;
        margin-top: 20px
    }

    #nav-container-ppc .toggle-mobile-product-button .submenu-product-mobile__active {
        display: flex
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc .toggle-mobile-product-button .submenu-product-mobile {
        flex-direction: unset;
        gap: 140px
    }
}

#nav-container-ppc .toggle-mobile-product-button .submenu-product-mobile ul {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative
}

    #nav-container-ppc .toggle-mobile-product-button .submenu-product-mobile ul:first-of-type::after {
        position: absolute;
        content: "";
        width: 100%;
        height: 1px;
        background-color: #dbdbdb;
        bottom: -20px;
        left: 0
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc .toggle-mobile-product-button .submenu-product-mobile ul:first-of-type::after {
        display: none
    }
}

#nav-container-ppc .toggle-mobile-product-button .submenu-product-mobile ul span.list-header {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 19.2px;
    text-align: left;
    color: #222324;
    margin-bottom: 4px
}

#nav-container-ppc .toggle-mobile-product-button .submenu-product-mobile ul li a {
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0;
    text-align: left;
    color: #323333;
    display: flex;
    align-items: center;
    gap: 8px
}

#nav-container-ppc .new-label {
    position: relative
}

    #nav-container-ppc .new-label::after {
        content: attr(new-data-label);
        position: absolute;
        top: -1px;
        left: calc(100% + 8px);
        padding: 2px 8px;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        background-color: #ffc502;
        border-radius: 1000px;
        display: flex;
        justify-content: center;
        align-items: center
    }

#nav-container-ppc .new-label-green::after {
    background-color: #ffc502
}

#nav-container-ppc #navbar {
    z-index: 99999999999;
    position: fixed;
    width: 100%;
    top: 0;
    right: 0;
    left: 0
}

    #nav-container-ppc #navbar ul {
        padding: 0;
        margin: 0
    }

        #nav-container-ppc #navbar ul li {
            list-style: none
        }

    #nav-container-ppc #navbar a:hover {
        cursor: pointer
    }

    #nav-container-ppc #navbar a.underline-button {
        width: fit-content;
        font-weight: 600 !important;
        font-size: 18px;
        padding: .3rem 0;
        transition: all .2s ease-in-out
    }

    #nav-container-ppc #navbar a.underline-button-green {
        color: #ffc502
    }

        #nav-container-ppc #navbar a.underline-button-green:hover > span {
            margin-left: 10px;
            transition: all .2s ease-in-out
        }

    #nav-container-ppc #navbar a.underline-button-blue {
        color: #2d80eb
    }

        #nav-container-ppc #navbar a.underline-button-blue:hover > span {
            margin-left: 10px;
            transition: all .2s ease-in-out
        }

        #nav-container-ppc #navbar a.underline-button-blue::after {
            display: none
        }

    #nav-container-ppc #navbar a.underline-button img {
        margin-left: .4rem
    }

    #nav-container-ppc #navbar .cta-register {
        font-size: 18px;
        padding: 16px 36px 17px;
        background-color: #ffc502 !important;
        transition: background-color .2s ease-in-out;
        color: #fff;
        font-weight: 600;
        border-radius: 36px
    }

        #nav-container-ppc #navbar .cta-register:hover {
            background-color: #17b54e !important
        }

    #nav-container-ppc #navbar .gradient-background {
        border-top: 1px solid #dbdbdb;
        width: 100%;
        background: #fff;
        background: linear-gradient(90deg,#fff 0%,#fff 52%,#f5f5f5 58%)
    }

    #nav-container-ppc #navbar .container {
        display: flex;
        flex-direction: column;
        align-items: normal !important;
        width: 100%
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .container {
        padding: 1.2rem 15px
    }
}

#nav-container-ppc #navbar .navbar {
    background-color: #fff !important;
    transition: box-shadow .3s ease-in-out;
    width: 100%;
    padding: 0
}

#nav-container-ppc #navbar .navbar__header {
    display: flex;
    align-items: center
}

    #nav-container-ppc #navbar .navbar__header .onSmallScreen {
        display: none
    }

@media(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .navbar__header .onSmallScreen {
        margin-left: auto;
        display: block;
        margin-right: 2rem
    }
}

#nav-container-ppc #navbar .navbar__header-logo img {
    fill: #fff
}

#nav-container-ppc #navbar .navbar__header-links {
    margin-left: 4rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .navbar__header-links {
        display: none
    }
}

#nav-container-ppc #navbar .navbar__header-register {
    margin-left: auto
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .navbar__header-register {
        display: none
    }
}

#nav-container-ppc #navbar .navbar__header-burger {
    display: none
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .navbar__header-burger {
        display: block
    }
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .navbar__header-burger {
        margin-left: auto
    }
}

#nav-container-ppc #navbar .navbar__header-burger-line {
    width: 34px;
    height: 4px;
    margin: 8px;
    border-radius: 100px;
    background-color: #222324
}

#nav-container-ppc #navbar .navbar__header-burger-active .navbar__header-burger-line:first-of-type {
    transform: translateY(13px) rotate(-45deg)
}

#nav-container-ppc #navbar .navbar__header-burger-active .navbar__header-burger-line:nth-of-type(2) {
    visibility: hidden
}

#nav-container-ppc #navbar .navbar__header-burger-active .navbar__header-burger-line:last-of-type {
    transform: translateY(-10px) rotate(45deg)
}

#nav-container-ppc #navbar .navbar__list {
    display: flex;
    align-items: center;
    padding: 1.4rem 0
}

#nav-container-ppc #navbar .navbar__list-item {
    list-style: none;
    padding: .6rem 40px
}

#nav-container-ppc #navbar .navbar__list-item--border {
    border-right: .5px solid #b7bbc2 !important
}

#nav-container-ppc #navbar .navbar__list-item--last {
    padding: .6rem 0 .6rem 1.2rem
}

#nav-container-ppc #navbar .navbar__link {
    font-weight: 600;
    color: #222324 !important
}

#nav-container-ppc #navbar .content {
    width: 100%;
    height: 100vh;
    opacity: 1;
    visibility: visible;
    background-color: rgba(0,0,0,.5);
    transition: all .4s ease-in-out;
    position: relative
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content {
        height: 100%;
        margin-top: 2rem
    }
}

#nav-container-ppc #navbar .content .active-link {
    font-weight: 800
}

#nav-container-ppc #navbar .content-notDisplayed {
    position: absolute;
    left: 0;
    opacity: 0;
    visibility: hidden;
    transition: all .4s ease-in-out
}

#nav-container-ppc #navbar .content__product {
    display: flex;
    max-width: 1400px;
    margin: 0 auto
}

@media(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .content__product {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px) {
    #nav-container-ppc #navbar .content__product {
        padding-left: 5rem;
        padding-right: 5rem
    }
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__product {
        flex-direction: column;
        min-height: 100%;
        overflow-y: scroll;
        margin: 0
    }
}

#nav-container-ppc #navbar .content__product img {
    width: 24px;
    height: 24px;
    margin-right: .5rem
}

#nav-container-ppc #navbar .content__product svg {
    margin-right: .5rem
}

#nav-container-ppc #navbar .content__product__white {
    width: 70%;
    background-color: #fff;
    display: flex;
    padding: 3rem 0
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    #nav-container-ppc #navbar .content__product__white {
        padding: 0
    }
}

@media(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .content__product__white {
        width: 100%;
        padding: 3rem;
        flex-direction: column
    }
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .content__product__white {
        width: 100%;
        padding: 2rem 3rem;
        flex-direction: column
    }
}

#nav-container-ppc #navbar .content__product__white-firstColumn {
    border-right: 1px solid #e9e9e9;
    padding-right: 4rem
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    #nav-container-ppc #navbar .content__product__white-firstColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-right: 4rem
    }
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container-ppc #navbar .content__product__white-firstColumn {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        padding-right: 0;
        border-right: 0;
        border-bottom: 1px solid #e9e9e9;
        padding-bottom: 1.5rem
    }
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .content__product__white-firstColumn {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        padding-right: 0;
        border-right: 0;
        border-bottom: 1px solid #e9e9e9;
        padding-bottom: 1.5rem
    }
}

#nav-container-ppc #navbar .content__product__white-firstColumn div {
    display: flex;
    flex-direction: column
}

#nav-container-ppc #navbar .content__product__white-firstColumn-element-header {
    margin-top: 2rem;
    display: flex;
    flex-direction: row !important
}

    #nav-container-ppc #navbar .content__product__white-firstColumn-element-header svg {
        color: #323232
    }

    #nav-container-ppc #navbar .content__product__white-firstColumn-element-header a {
        font-size: 18px;
        color: #323333;
        font-weight: 700 !important;
        margin-bottom: .7rem
    }

    #nav-container-ppc #navbar .content__product__white-firstColumn-element-header:hover a {
        color: #ffc502;
        font-weight: 700 !important
    }

    #nav-container-ppc #navbar .content__product__white-firstColumn-element-header:hover svg {
        color: #ffc502
    }

#nav-container-ppc #navbar .content__product__white-firstColumn-element-header-malachite {
    margin-top: 0 !important
}

    #nav-container-ppc #navbar .content__product__white-firstColumn-element-header-malachite svg {
        color: #ffc502 !important
    }

    #nav-container-ppc #navbar .content__product__white-firstColumn-element-header-malachite a {
        color: #ffc502 !important
    }

@media(min-width:768px) and (max-width:1150px) {
    #nav-container-ppc #navbar .content__product__white-firstColumn-element {
        margin-top: 1.5rem
    }
}

#nav-container-ppc #navbar .content__product__white-firstColumn-element-header {
    display: flex;
    text-transform: uppercase
}

#nav-container-ppc #navbar .content__product__white-firstColumn-element ul li a {
    font-weight: 400;
    font-size: 18px;
    color: #323333;
    padding: 0 0 0 1rem
}

#nav-container-ppc #navbar .content__product__white-secondColumn {
    width: 60%;
    padding-left: 4rem;
    display: flex;
    flex-direction: column
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    #nav-container-ppc #navbar .content__product__white-secondColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-left: 4rem
    }
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container-ppc #navbar .content__product__white-secondColumn {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        padding-left: 0;
        padding-top: 1.5rem
    }
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .content__product__white-secondColumn {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        padding-left: 0;
        padding-top: 1.5rem
    }
}

#nav-container-ppc #navbar .content__product__white-secondColumn-element:first-of-type ul {
    display: grid;
    grid-template-rows: repeat(6,auto);
    grid-template-columns: repeat(2,1fr);
    grid-auto-flow: column
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__product__white-secondColumn-element:first-of-type ul {
        width: 100%;
        grid-template-rows: unset;
        grid-auto-flow: unset;
        grid-template-columns: repeat(2,1fr);
        grid-template-columns: 1fr
    }
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container-ppc #navbar .content__product__white-secondColumn-element:first-of-type {
        margin-top: 2rem
    }
}

#nav-container-ppc #navbar .content__product__white-secondColumn-element:not(:first-of-type) {
    margin-top: 2rem
}

#nav-container-ppc #navbar .content__product__white-secondColumn-element-header {
    display: flex
}

    #nav-container-ppc #navbar .content__product__white-secondColumn-element-header svg {
        color: #323232
    }

    #nav-container-ppc #navbar .content__product__white-secondColumn-element-header a {
        font-size: 18px;
        color: #323333;
        font-weight: 700 !important;
        text-transform: uppercase;
        margin-bottom: .7rem
    }

    #nav-container-ppc #navbar .content__product__white-secondColumn-element-header:hover a {
        color: #ffc502
    }

    #nav-container-ppc #navbar .content__product__white-secondColumn-element-header:hover svg {
        color: #ffc502
    }

#nav-container-ppc #navbar .content__product__white-secondColumn-element ul {
    display: grid;
    grid-template-columns: 1fr
}

    #nav-container-ppc #navbar .content__product__white-secondColumn-element ul li a {
        font-weight: 400;
        font-size: 18px;
        color: #323333;
        padding: 0 0 0 1rem;
        display: inline-block;
        width: 100%
    }

#nav-container-ppc #navbar .content__product__white .content__product__white-firstColumn-element ul li, #nav-container-ppc #navbar .content__product__white .content__product__white-secondColumn-element ul li {
    max-width: 300px;
    padding: .3rem 0
}

    #nav-container-ppc #navbar .content__product__white .content__product__white-firstColumn-element ul li:hover, #nav-container-ppc #navbar .content__product__white .content__product__white-secondColumn-element ul li:hover {
        background-color: #ffc502;
        border-radius: 8px
    }

        #nav-container-ppc #navbar .content__product__white .content__product__white-firstColumn-element ul li:hover a, #nav-container-ppc #navbar .content__product__white .content__product__white-secondColumn-element ul li:hover a {
            color: #fff;
            display: inline-block;
            width: 100%
        }

#nav-container-ppc #navbar .content__product__grey {
    width: 30%;
    background-color: #f5f5f5;
    padding: 3rem 0 3rem 3rem;
    display: flex;
    justify-content: center
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px),(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .content__product__grey {
        width: 100%;
        padding: 3rem
    }
}

#nav-container-ppc #navbar .content__product__grey-element {
    max-width: 350px;
    display: flex;
    flex-direction: column
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__product__grey-element {
        max-width: 100%
    }
}

#nav-container-ppc #navbar .content__product__grey-element-header {
    display: flex !important;
    flex-direction: row !important;
    margin-bottom: 2rem
}

    #nav-container-ppc #navbar .content__product__grey-element-header a {
        color: #2d80eb;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 18px;
        cursor: inherit
    }

#nav-container-ppc #navbar .content__product__grey-element .underline-button-blue:hover > span {
    margin-left: 10px;
    transition: all .2s ease-in-out
}

#nav-container-ppc #navbar .content__product__grey-element div {
    display: grid;
    grid-template-columns: 1fr
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container-ppc #navbar .content__product__grey-element div {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .content__product__grey-element div {
        grid-template-columns: 1fr
    }
}

#nav-container-ppc #navbar .content__product__grey-element p {
    font-weight: 500;
    font-size: 18px;
    color: #323333;
    margin-bottom: 3rem
}

#nav-container-ppc #navbar .content__product__grey-element ul {
    margin-bottom: 3rem
}

    #nav-container-ppc #navbar .content__product__grey-element ul li {
        padding: .3rem 0
    }

        #nav-container-ppc #navbar .content__product__grey-element ul li:hover {
            background-color: #2d80eb;
            border-radius: 8px
        }

            #nav-container-ppc #navbar .content__product__grey-element ul li:hover svg {
                color: #fff
            }

            #nav-container-ppc #navbar .content__product__grey-element ul li:hover a {
                color: #fff
            }

        #nav-container-ppc #navbar .content__product__grey-element ul li span {
            display: flex;
            padding: 0 0 0 10px
        }

            #nav-container-ppc #navbar .content__product__grey-element ul li span svg {
                color: #323232
            }

            #nav-container-ppc #navbar .content__product__grey-element ul li span a {
                font-weight: 400;
                font-size: 18px;
                color: #323333;
                display: inline-block;
                width: 100%
            }

                #nav-container-ppc #navbar .content__product__grey-element ul li span a::after {
                    display: none
                }

#nav-container-ppc #navbar .content__integrations {
    display: flex;
    max-width: 1400px;
    margin: 0 auto
}

@media(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .content__integrations {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px) {
    #nav-container-ppc #navbar .content__integrations {
        padding-left: 5rem;
        padding-right: 5rem
    }
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations {
        flex-direction: column;
        min-height: 100%;
        overflow-y: scroll
    }
}

#nav-container-ppc #navbar .content__integrations__white {
    width: 70%;
    padding: 3rem 0;
    background-color: #fff;
    display: flex;
    flex-direction: column
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container-ppc #navbar .content__integrations__white {
        width: 100%;
        padding: 3rem;
        flex-direction: column
    }
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__white {
        width: 100%;
        padding: 2rem 3rem;
        flex-direction: column
    }
}

#nav-container-ppc #navbar .content__integrations__white-firstRow p {
    color: #323333;
    font-weight: 700;
    font-size: 18px;
    text-transform: uppercase
}

#nav-container-ppc #navbar .content__integrations__white-firstRow ul {
    display: grid;
    grid-template-columns: repeat(3,1fr)
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__white-firstRow ul {
        grid-template-columns: 1fr
    }
}

#nav-container-ppc #navbar .content__integrations__white-firstRow ul li {
    max-width: 300px;
    padding: .3rem 0
}

    #nav-container-ppc #navbar .content__integrations__white-firstRow ul li span {
        display: flex
    }

    #nav-container-ppc #navbar .content__integrations__white-firstRow ul li a {
        color: #323333;
        font-weight: 400;
        font-size: 18px;
        padding: 0 0 0 .7rem
    }

    #nav-container-ppc #navbar .content__integrations__white-firstRow ul li:hover a {
        color: #ffc502;
        font-weight: 400 !important
    }

#nav-container-ppc #navbar .content__integrations__white-secondRow {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    margin-top: 2rem
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__white-secondRow {
        grid-template-columns: 1fr
    }
}

#nav-container-ppc #navbar .content__integrations__white-secondRow ul p {
    color: #323333;
    font-weight: 700;
    font-size: 18px;
    text-transform: uppercase;
    margin-top: 3rem
}

    #nav-container-ppc #navbar .content__integrations__white-secondRow ul p:nth-of-type(1) {
        margin-top: 1rem
    }

#nav-container-ppc #navbar .content__integrations__white-secondRow ul li {
    max-width: 300px;
    padding: .3rem 0
}

    #nav-container-ppc #navbar .content__integrations__white-secondRow ul li span {
        display: flex
    }

    #nav-container-ppc #navbar .content__integrations__white-secondRow ul li a {
        color: #323333;
        font-weight: 400;
        font-size: 18px;
        padding: 0 0 0 .7rem
    }

    #nav-container-ppc #navbar .content__integrations__white-secondRow ul li:hover a {
        color: #ffc502;
        font-weight: 400 !important
    }

#nav-container-ppc #navbar .content__integrations__grey {
    width: 30%;
    background-color: #f5f5f5;
    padding: 3rem 0 3rem 3rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__grey {
        width: 100%;
        padding: 3rem
    }
}

#nav-container-ppc #navbar .content__integrations__grey-header p {
    color: #ffc502;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase
}

#nav-container-ppc #navbar .content__integrations__grey-grid {
    display: grid;
    grid-template-columns: 1fr
}

@media(min-width:768px) and (max-width:1150px) {
    #nav-container-ppc #navbar .content__integrations__grey-grid {
        grid-template-columns: repeat(2,1fr);
        gap: 3rem
    }
}

@media(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__grey-grid {
        grid-template-columns: 1fr
    }
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type {
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type {
        justify-content: space-between;
        gap: unset
    }
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span {
    border-radius: 12px;
    max-height: 100px
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span {
        margin: 0
    }
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span:first-of-type {
    background-color: #fff
}

    #nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span:first-of-type p {
        color: #323333
    }

#nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span:last-of-type {
    background-color: #ffc502
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span:last-of-type {
        margin-top: 1rem
    }
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span:last-of-type p {
    color: #fff
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span p {
    padding: 0;
    margin: 0;
    font-weight: 700;
    font-size: 18px;
    margin-left: 1.5rem
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span a {
    display: flex;
    align-items: center;
    justify-content: space-between
}

    #nav-container-ppc #navbar .content__integrations__grey-grid div:first-of-type span a::after {
        display: none
    }

#nav-container-ppc #navbar .content__integrations__grey-grid div:last-of-type {
    display: flex;
    flex-direction: column;
    margin-top: 2.5rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content__integrations__grey-grid div:last-of-type {
        margin: 1.5rem 0 0
    }
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:last-of-type img {
    margin-bottom: 1.5rem;
    width: 32px;
    height: 32px
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:last-of-type h3 {
    line-height: normal;
    color: #323333;
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 1rem
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:last-of-type p {
    color: #6b6b6b;
    font-weight: 400;
    font-size: 18px;
    margin-bottom: 1.5rem
}

#nav-container-ppc #navbar .content__integrations__grey-grid div:last-of-type a {
    width: fit-content
}

    #nav-container-ppc #navbar .content__integrations__grey-grid div:last-of-type a::after {
        display: none
    }

#nav-container-ppc #navbar .content-mobile {
    width: 100%;
    height: 100vh !important;
    background-color: rgba(0,0,0,.5);
    margin-top: -2px;
    display: none;
    padding-bottom: 3.5rem
}

@media(min-width:768px) and (max-width:1150px),(max-width:767px) {
    #nav-container-ppc #navbar .content-mobile {
        height: 100%;
        display: block;
        overflow-y: scroll
    }
}

@media(min-width:992px) and (max-width:1199px) {
    #nav-container-ppc #navbar .content-mobile {
        display: block;
        height: 100%
    }
}

#nav-container-ppc #navbar .content-mobile-notDisplayed {
    display: none !important
}

#nav-container-ppc #navbar .content-mobile-list {
    background-color: #fff !important
}

#nav-container-ppc #navbar .content-mobile-list-item {
    padding: .8rem 0
}

#nav-container-ppc #navbar .content-mobile-list-item-text {
    color: #222324 !important;
    color: #fff;
    font-weight: 700;
    font-size: 16px
}

#nav-container-ppc #navbar .content-mobile-list-item-button {
    max-width: 100% !important;
    display: block;
    text-align: center
}

#nav-container-ppc #navbar .arrow-active::after {
    content: "" !important;
    margin-left: .6rem !important;
    top: 8px !important;
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-bottom: 6px solid #fff !important;
    transform: rotate(0deg) !important;
    transition: all .4s ease-in-out
}

#nav-container-ppc #navbar .toggle-product-arrow, #nav-container-ppc #navbar .toggle-integrations-arrow {
    position: relative;
    padding-right: 10px
}

    #nav-container-ppc #navbar .toggle-product-arrow::after, #nav-container-ppc #navbar .toggle-integrations-arrow::after {
        content: "";
        margin-left: .6rem;
        top: 8px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #222324 !important;
        transform: rotate(180deg);
        transition: all .4s ease-in-out
    }

#nav-container-ppc #navbar .toggle-mobile-product-button a.content-mobile-list-item-text, #nav-container-ppc #navbar .toggle-mobile-integrations-button a.content-mobile-list-item-text {
    position: relative
}

    #nav-container-ppc #navbar .toggle-mobile-product-button a.content-mobile-list-item-text::after, #nav-container-ppc #navbar .toggle-mobile-integrations-button a.content-mobile-list-item-text::after {
        content: "";
        margin-left: .6rem;
        top: 8px;
        position: absolute;
        width: 0;
        height: 0;
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-bottom: 6px solid #222324 !important;
        transform: rotate(180deg);
        transition: all .4s ease-in-out
    }

.Timely-redesign * {
    font-family: sans-serif
}

.Timely-redesign .hidden {
    opacity: 0;
    transform: translateY(-20px);
    transition: all 1s ease-in-out
}

@media(max-width:767px) {
    .Timely-redesign .hidden {
        transition: none
    }
}

.Timely-redesign .show {
    opacity: 1;
    transform: translateY(0)
}

@keyframes slider {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(calc((-108px * 12) + (-80px * 12)))
    }
}

@keyframes slider-mini {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(calc((-108px * 12) + (-40px * 12)))
    }
}

@keyframes carousel-slider {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(calc((-1444px) + (-64px * 12)))
    }
}

.Timely-redesign .subHeaders {
    display: flex;
    flex-direction: column;
    max-width: 740px;
    margin-bottom: 80px
}

@media(max-width:767px) {
    .Timely-redesign .subHeaders {
        margin-bottom: 64px
    }
}

.Timely-redesign .subHeaders > *:not(:last-child) {
    margin-bottom: 32px
}

.Timely-redesign .subHeaders__header {
    color: #222324;
    font-size: 52px;
    font-weight: 700
}

@media(max-width:767px) {
    .Timely-redesign .subHeaders__header {
        font-size: 36px
    }
}

.Timely-redesign .subHeaders__header span {
    color: #ffc502
}

.Timely-redesign .subHeaders__paragraph {
    color: #323333;
    font-size: 24px;
    font-weight: 400;
    max-width: 683px
}

@media(max-width:767px) {
    .Timely-redesign .subHeaders__paragraph {
        font-size: 18px
    }
}

.Timely-redesign .safari-browser, .Timely-redesign .normal-browser {
    display: block
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-redesign .safari-browser, .Timely-redesign .normal-browser {
        display: none !important
    }
}

.Timely-redesign img.tablet {
    display: none
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .Timely-redesign img.tablet {
        display: block
    }
}

.Timely-redesign img.mobile {
    display: none
}

@media(max-width:767px) {
    .Timely-redesign img.mobile {
        display: block
    }
}

.Timely-redesign #top {
    overflow: hidden
}

@media(min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:1441px) and (max-width:1919px),(min-width:1920px),(max-width:767px) {
    .Timely-redesign #top {
        padding: 2rem 0 0 !important
    }
}

.Timely-redesign #top img, .Timely-redesign #top svg, .Timely-redesign #top video {
    width: 100%;
    height: 100%
}

@media(max-width:767px) {
    .Timely-redesign #top img.img-desktop, .Timely-redesign #top svg.img-desktop, .Timely-redesign #top video.img-desktop {
        display: none
    }
}

.Timely-redesign #top img.img-mobile, .Timely-redesign #top svg.img-mobile, .Timely-redesign #top video.img-mobile {
    display: none
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-redesign #top img.img-mobile, .Timely-redesign #top svg.img-mobile, .Timely-redesign #top video.img-mobile {
        display: block !important
    }
}

.Timely-redesign #top .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

    .Timely-redesign #top .container h1 {
        color: #222324;
        text-align: center;
        font-size: 64px;
        font-weight: 700;
        line-height: 116%;
        margin-bottom: 32px
    }

@media(max-width:767px) {
    .Timely-redesign #top .container h1 {
        font-size: 44px
    }
}

.Timely-redesign #top .container h1 span {
    color: #ffc502
}

.Timely-redesign #top .container h2 {
    color: #323333;
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    margin-bottom: 40px;
    transition-delay: 400ms;
    max-width: 670px
}

@media(max-width:767px) {
    .Timely-redesign #top .container h2 {
        font-size: 18px;
        line-height: 24px
    }
}

.Timely-redesign #top .container .buttons {
    display: flex;
    gap: 28px;
    transition-delay: 600ms
}

@media(max-width:767px) {
    .Timely-redesign #top .container .buttons {
        flex-direction: column
    }
}

.Timely-redesign #top .container .stars {
    margin: 32px 0 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    transition-delay: 800ms
}

@media(max-width:767px) {
    .Timely-redesign #top .container .stars {
        margin-bottom: 40px
    }
}

.Timely-redesign #top .container .stars p {
    margin-bottom: 0;
    color: #7d8086;
    font-size: 18px;
    font-weight: 400;
    margin-top: 3px
}

.Timely-redesign #top .container .stars img {
    width: 112px
}

.Timely-redesign #top .container .carousel {
    transition-delay: 1000ms;
    margin-bottom: 56px
}

    .Timely-redesign #top .container .carousel .container {
        overflow: hidden;
        position: relative
    }

        .Timely-redesign #top .container .carousel .container .blur-left {
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 200px;
            z-index: 10;
            background: linear-gradient(270deg,rgba(248,250,252,0) 0%,#fff 50%)
        }

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #top .container .carousel .container .blur-left {
        width: 50px
    }
}

@media(max-width:767px) {
    .Timely-redesign #top .container .carousel .container .blur-left {
        width: 20px
    }
}

.Timely-redesign #top .container .carousel .container .blur-right {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 200px;
    z-index: 10;
    background: linear-gradient(270deg,#fff 50%,rgba(248,250,252,0) 100%)
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #top .container .carousel .container .blur-right {
        width: 50px
    }
}

@media(max-width:767px) {
    .Timely-redesign #top .container .carousel .container .blur-right {
        width: 20px
    }
}

.Timely-redesign #top .container .carousel .container .carousel__images {
    animation: carousel-slider 55s linear infinite;
    display: flex;
    gap: 64px
}

.Timely-redesign #top .container .main-img {
    position: relative;
    transition-delay: 1200ms
}

    .Timely-redesign #top .container .main-img img, .Timely-redesign #top .container .main-img svg {
        width: 100%;
        height: 100%
    }

.Timely-redesign #green_statistics {
    margin: 140px 0
}

@media(max-width:767px) {
    .Timely-redesign #green_statistics {
        margin: 80px 0
    }
}

.Timely-redesign #green_statistics .container {
    display: flex;
    justify-content: space-between
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    .Timely-redesign #green_statistics .container {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 40px
    }
}

@media(max-width:767px) {
    .Timely-redesign #green_statistics .container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 40px
    }
}

.Timely-redesign #green_statistics .container .box {
    display: flex;
    gap: 12px
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .Timely-redesign #green_statistics .container .box {
        align-items: center;
        justify-content: center
    }
}

.Timely-redesign #green_statistics .container .box p {
    margin: 0
}

.Timely-redesign #green_statistics .container .box__text-green {
    padding: 8px 12px;
    gap: 10px;
    border-radius: 8px;
    background: #f2fcf6
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    .Timely-redesign #green_statistics .container .box__text-green {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 133px
    }
}

@media(max-width:767px) {
    .Timely-redesign #green_statistics .container .box__text-green {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 109px
    }
}

.Timely-redesign #green_statistics .container .box__text-green p {
    font-family: sans-serif;
    font-size: 36px;
    font-weight: 600;
    line-height: 43px;
    letter-spacing: 0;
    text-align: left;
    color: #ffc502
}

@media(max-width:767px) {
    .Timely-redesign #green_statistics .container .box__text-green p {
        font-size: 28px
    }
}

.Timely-redesign #green_statistics .container .box__text-black p {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 29px;
    letter-spacing: 0;
    text-align: left;
    color: #323333
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    .Timely-redesign #green_statistics .container .box__text-black {
        width: 179px
    }
}

.Timely-redesign #statistics {
    margin-bottom: 164px;
    margin-top: 60px
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #statistics {
        margin-bottom: 140px;
        margin-top: 40px
    }
}

@media(max-width:767px) {
    .Timely-redesign #statistics {
        margin-bottom: 120px
    }
}

.Timely-redesign #statistics .container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 96px
}

    .Timely-redesign #statistics .container .statistics {
        display: grid;
        grid-template-columns: repeat(4,1fr)
    }

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #statistics .container .statistics {
        grid-template-columns: repeat(2,1fr);
        gap: 64px 64px
    }
}

@media(max-width:767px) {
    .Timely-redesign #statistics .container .statistics {
        grid-template-columns: 1fr;
        gap: 48px
    }
}

.Timely-redesign #statistics .container .statistics__singleStatistic {
    display: flex;
    flex-direction: column;
    justify-content: center
}

    .Timely-redesign #statistics .container .statistics__singleStatistic h2 {
        color: var(--grey-dark-900,#222324);
        text-align: center;
        font-family: sans-serif;
        font-size: 64px;
        font-style: normal;
        font-weight: 600;
        line-height: 116%;
        margin: 0
    }

    .Timely-redesign #statistics .container .statistics__singleStatistic p {
        color: var(--grey-dark-900,#222324);
        text-align: center;
        font-family: sans-serif;
        font-size: 32px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        margin-bottom: 16px
    }

    .Timely-redesign #statistics .container .statistics__singleStatistic span {
        color: var(--grey-dark-800,#323333);
        text-align: center;
        font-family: sans-serif;
        font-size: 24px;
        font-style: normal;
        font-weight: 400;
        line-height: normal
    }

.Timely-redesign #statistics .container .featuredIn {
    display: grid;
    grid-template-columns: fit-content(100%) 1.1fr 2fr;
    column-gap: 20px;
    row-gap: 60px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #statistics .container .featuredIn {
        grid-template-columns: fit-content(100%) 1fr
    }
}

.Timely-redesign #statistics .container .featuredIn span {
    color: var(--grey-dark-900,#222324);
    font-size: 18px;
    font-weight: 600
}

.Timely-redesign #statistics .container .featuredIn .line {
    height: 2px;
    background-color: #b7bbc2;
    margin-top: 13px
}

.Timely-redesign #statistics .container .featuredIn .icons {
    display: flex;
    justify-content: space-between;
    margin-top: -5px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #statistics .container .featuredIn .icons {
        grid-column: span 2
    }
}

@media(max-width:767px) {
    .Timely-redesign #statistics .container .featuredIn .icons {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 20px
    }
}

@media(max-width:767px) {
    .Timely-redesign #statistics .container .featuredIn .icons img:last-of-type {
        grid-column: span 2
    }
}

.Timely-redesign #boxesOnGray {
    background-color: #f8fafc;
    padding: 4rem 0
}

    .Timely-redesign #boxesOnGray .container {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 128px
    }

@media(min-width:1900px) {
    .Timely-redesign #boxesOnGray .container {
        grid-template-columns: minmax(500px,40%) minmax(600px,60%);
        gap: 100px
    }
}

@media only screen and (max-width:1900px) {
    .Timely-redesign #boxesOnGray .container {
        margin-right: 0;
        padding-right: 0
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #boxesOnGray .container {
        gap: 0;
        grid-template-columns: 1fr
    }
}

@media(max-width:767px) {
    .Timely-redesign #boxesOnGray .container {
        max-width: 767px
    }
}

.Timely-redesign #boxesOnGray .container .subHeaders {
    width: 522px !important
}

@media(max-width:767px) {
    .Timely-redesign #boxesOnGray .container .subHeaders {
        width: 100% !important
    }
}

.Timely-redesign #boxesOnGray .container .boxesOnGray {
    display: grid;
    grid-template-columns: 1fr;
    gap: 36px
}

.Timely-redesign #boxesOnGray .container .boxesOnGray__box {
    display: flex;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 8px 32px 0 rgba(125,128,134,.2);
    padding: 32px 28px 36px 36px
}

@media only screen and (max-width:1900px) and (min-width:200px) {
    .Timely-redesign #boxesOnGray .container .boxesOnGray__box {
        border-radius: 24px 0 0 24px
    }
}

.Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation {
    min-width: 40px;
    height: 88px;
    border-radius: 100px;
    position: relative
}

    .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.first.active .object:nth-of-type(2) {
        bottom: 32%
    }

    .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.first .object {
        position: absolute;
        left: 0;
        width: 100%;
        border-radius: 100px
    }

        .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.first .object:nth-of-type(1) {
            top: 0;
            height: 100%;
            background: rgba(10,26,56,.5)
        }

        .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.first .object:nth-of-type(2) {
            bottom: 0;
            height: 60px;
            background: rgba(10,26,56,.8);
            transition: all .7s ease-in-out
        }

    .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.second.active .object:nth-of-type(2) {
        bottom: 54%
    }

    .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.second .object {
        position: absolute;
        left: 0;
        width: 100%;
        border-radius: 100px
    }

        .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.second .object:nth-of-type(1) {
            top: 0;
            height: 100%;
            background: rgba(10,26,56,.2)
        }

        .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.second .object:nth-of-type(2) {
            bottom: 0;
            height: 40px;
            background: rgba(10,26,56,.8);
            transition: all .7s ease-in-out
        }

    .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.third.active .object:nth-of-type(1) {
        top: 0
    }

    .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.third.active .object:nth-of-type(2) {
        top: 10px
    }

    .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.third.active .object:nth-of-type(3) {
        top: 20px
    }

    .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.third .object {
        position: absolute;
        left: 0;
        width: 100%;
        height: 40px;
        border-radius: 100px
    }

        .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.third .object:nth-of-type(1) {
            top: 0;
            background: rgba(10,26,56,.8);
            transition: all .7s ease-in-out
        }

        .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.third .object:nth-of-type(2) {
            top: 20px;
            background: rgba(10,26,56,.5);
            transition: all .7s ease-in-out;
            transition-delay: 100ms
        }

        .Timely-redesign #boxesOnGray .container .boxesOnGray__box .rectangles-animation.third .object:nth-of-type(3) {
            top: 43px;
            background: rgba(10,26,56,.2);
            transition: all .7s ease-in-out;
            transition-delay: 200ms
        }

.Timely-redesign #boxesOnGray .container .boxesOnGray__box h2 {
    color: #222324;
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 16px
}

.Timely-redesign #boxesOnGray .container .boxesOnGray__box p {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    min-height: 81px;
    margin-bottom: 0
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .Timely-redesign #boxesOnGray .container .boxesOnGray__box p {
        max-width: 369px
    }
}

@media(max-width:767px) {
    .Timely-redesign #boxesOnGray .container .boxesOnGray__box p {
        max-width: 267px
    }
}

.Timely-redesign #boxesOnGray .container .boxesOnGray__box:nth-of-type(1) {
    transition-delay: 100ms
}

.Timely-redesign #boxesOnGray .container .boxesOnGray__box:nth-of-type(2) {
    transition-delay: 200ms
}

.Timely-redesign #boxesOnGray .container .boxesOnGray__box:nth-of-type(3) {
    transition-delay: 300ms
}

.Timely-redesign #boxesOnGray .container .boxesOnGray__box div:first-of-type {
    margin-right: 32px
}

.Timely-redesign #contentBoxes {
   /* margin: 96px 0 180px*/
   margin-top:100px;
}

    .Timely-redesign #contentBoxes img, .Timely-redesign #contentBoxes svg, .Timely-redesign #contentBoxes video {
        width: 100%;
        height: 100%
    }

@media(max-width:767px) {
    .Timely-redesign #contentBoxes img.img-desktop, .Timely-redesign #contentBoxes svg.img-desktop, .Timely-redesign #contentBoxes video.img-desktop {
        display: none
    }
}

.Timely-redesign #contentBoxes img.img-mobile, .Timely-redesign #contentBoxes svg.img-mobile, .Timely-redesign #contentBoxes video.img-mobile {
    display: none
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-redesign #contentBoxes img.img-mobile, .Timely-redesign #contentBoxes svg.img-mobile, .Timely-redesign #contentBoxes video.img-mobile {
        display: block !important
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes .row {
    grid-template-columns: 1fr;
    display: grid
}

    .Timely-redesign #contentBoxes .container .contentBoxes .row.twoColumns {
        grid-template-columns: 55% 45%
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes .row.twoColumns {
        grid-template-columns: 1fr
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes .row.twoColumns > :last-child {
    margin-left: 40px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes .row.twoColumns > :last-child {
        margin-left: 0;
        margin-top: 40px
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes .row.twoColumns .greenBoxWithImg {
    max-height: 292px
}

@media(min-width:1920px),(min-width:1441px) and (max-width:1919px),(min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:991px) {
    .Timely-redesign #contentBoxes .container .contentBoxes .row.twoColumns .greenBoxWithImg {
        margin-bottom: -13px
    }

        .Timely-redesign #contentBoxes .container .contentBoxes .row.twoColumns .greenBoxWithImg video {
            margin-bottom: 0 !important
        }
}

.Timely-redesign #contentBoxes .container .contentBoxes .row:not(:last-of-type) {
    margin-bottom: 40px
}

.Timely-redesign #contentBoxes .container .contentBoxes__box {
    border-radius: 24px;
    border: .2px solid #b7bbc22c;
    background: #fff;
    box-shadow: 0 8px 32px 0 rgba(125,128,134,.2);
    display: flex;
    overflow: hidden
}

    .Timely-redesign #contentBoxes .container .contentBoxes__box h2 {
        color: #222324;
        font-size: 32px;
        font-weight: 600;
        margin-bottom: 12px;
        max-width: 396px
    }

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box h2 {
        font-size: 24px;
        max-width: 321px
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box p {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 32px;
    max-width: 400px
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box p {
        font-size: 16px
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background-color: rgb(245 226 179);
    width: 100%;
    overflow: hidden
}

    .Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg video {
        margin-bottom: -15px
    }

    .Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg.bothCornerRadius {
        border-top-right-radius: 20px;
        border-top-left-radius: 20px;
        padding: 32px 30px 0
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg.bothCornerRadius {
        border-top-right-radius: 0;
        border-top-left-radius: 0
    }
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg.bothCornerRadius {
        border-top-left-radius: 0;
        padding: 20px 20px 0 0
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg.leftCornerRadius {
    border-top-left-radius: 20px;
    padding: 32px 40px 0
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg.leftCornerRadius {
        padding: 20px 0 0 20px
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg.rightCornerRadius {
    border-top-right-radius: 20px;
    padding: 32px 40px 0
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box .greenBoxWithImg.rightCornerRadius {
        padding: 20px 20px 0 0
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.fullWidth {
    flex-direction: column;
    padding: 40px 48px 0
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.fullWidth {
        padding: 40px 0 0
    }
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.fullWidth {
        padding: 32px 20px 0 0
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.fullWidth div:first-of-type {
        margin-left: 40px
    }
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.fullWidth div:first-of-type {
        margin-left: 20px
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.textLeft {
    padding: 40px 0 0 48px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textLeft {
        padding: 40px 0 0 40px;
        flex-direction: column
    }
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textLeft {
        padding: 32px 0 0 20px
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.textLeft h2 {
    margin-top: 2rem
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.textLeft div:first-of-type {
    width: 35%
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textLeft div:first-of-type {
        width: 100%
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.textLeft div:last-of-type {
    width: 65%
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textLeft div:last-of-type {
        width: 100%
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.textRight {
    padding: 40px 48px 0 0
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textRight {
        padding: 40px 40px 0 0;
        flex-direction: column-reverse
    }
}

@media(max-width:767px) and (max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textRight {
        padding: 32px 20px 0 0
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.textRight p {
    margin-bottom: 2rem
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.textRight div:first-of-type {
    width: 65%
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textRight div:first-of-type {
        width: 100%
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.textRight div:last-of-type {
    width: 35%;
    margin-left: 40px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textRight div:last-of-type {
        width: 100%
    }
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.textRight div:last-of-type {
        margin-left: 20px
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.smallBox {
    flex-direction: column;
    padding: 32px 40px 0 0
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.smallBox {
        padding: 32px 20px 0 0
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.smallBox div:first-of-type {
    margin-left: 48px
}

@media(max-width:767px) {
    .Timely-redesign #contentBoxes .container .contentBoxes__box.smallBox div:first-of-type {
        margin-left: 20px
    }
}

.Timely-redesign #contentBoxes .container .contentBoxes__box.smallBox img, .Timely-redesign #contentBoxes .container .contentBoxes__box.smallBox svg {
    max-height: 257px
}

.Timely-redesign #imgOnGray {
    background-color: #f8fafc;
    padding-top: 48px;
    overflow: hidden
}

    .Timely-redesign #imgOnGray .container {
        display: grid;
        grid-template-columns: 45% 55%
    }

@media only screen and (max-width:1900px) and (min-width:992px) {
    .Timely-redesign #imgOnGray .container {
        margin-right: 0;
        padding-right: 0
    }

        .Timely-redesign #imgOnGray .container div.img {
            transition-delay: 200ms
        }

            .Timely-redesign #imgOnGray .container div.img img, .Timely-redesign #imgOnGray .container div.img svg {
                width: 100%;
                height: 100%;
                border-top-left-radius: 30px
            }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #imgOnGray .container div:first-of-type {
        margin-bottom: 40px
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #imgOnGray .container {
        grid-template-columns: 1fr;
        margin-right: 0;
        padding-right: 0
    }
}

@media(max-width:767px) {
    .Timely-redesign #imgOnGray .container {
        max-width: 767px
    }
}

.Timely-redesign #imgOnGray .container .small-logo {
    margin-bottom: 16px
}

.Timely-redesign #imgOnGray .container h2 {
    max-width: 516px;
    color: #222324;
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 12px
}

.Timely-redesign #imgOnGray .container p {
    max-width: 413px;
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 40px
}

.Timely-redesign #imgOnGray .container a {
    color: #222324;
    font-size: 18px;
    font-weight: 600
}

    .Timely-redesign #imgOnGray .container a span {
        margin-left: 6px;
        transition: all .2s ease-in-out
    }

    .Timely-redesign #imgOnGray .container a:hover span {
        margin-left: 10px
    }

.Timely-redesign #imgOnGray .container div.img img, .Timely-redesign #imgOnGray .container div.img svg {
    width: 100%;
    height: 100%;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #imgOnGray .container div.img img, .Timely-redesign #imgOnGray .container div.img svg {
        border-top-right-radius: 0
    }
}

.Timely-redesign #CompaniesCarousel {
    background-color: #f8fafc;
    padding: 120px 0 164px;
    overflow: hidden;
    z-index: 2;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center
}

    .Timely-redesign #CompaniesCarousel .CompaniesCarousel {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        max-width: 2465px;
        overflow: hidden
    }

        .Timely-redesign #CompaniesCarousel .CompaniesCarousel::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 10rem;
            height: 100%;
            z-index: 2;
            background: linear-gradient(90deg,#f8fafc 42%,rgba(255,255,255,0) 100%)
        }

        .Timely-redesign #CompaniesCarousel .CompaniesCarousel::after {
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            width: 10rem;
            height: 100%;
            z-index: 2;
            background: linear-gradient(270deg,#f8fafc 42%,rgba(255,255,255,0) 100%)
        }

    .Timely-redesign #CompaniesCarousel .CompaniesCarousel__singleCarousel {
        opacity: .3;
        display: grid;
        grid-template-columns: repeat(24,108px);
        gap: 80px;
        position: relative;
        width: 100%;
        animation: slider 55s linear infinite
    }

@media only screen and (max-width:1900px) and (min-width:1200px) {
    .Timely-redesign #CompaniesCarousel .CompaniesCarousel__singleCarousel {
        gap: 40px;
        animation: slider-mini 55s linear infinite
    }
}

.Timely-redesign #CompaniesCarousel .CompaniesCarousel__singleCarousel:nth-of-type(2) {
    margin-left: 3.5rem;
    animation-direction: reverse;
    animation-duration: 55s
}

.Timely-redesign #CompaniesCarousel .CompaniesCarousel__singleCarousel:nth-of-type(3) {
    margin-left: -2rem;
    animation-duration: 50s
}

.Timely-redesign #CompaniesCarousel .CompaniesCarousel__singleCarousel:not(:last-child) {
    margin-bottom: 40px
}

.Timely-redesign #CompaniesCarousel .CompaniesCarousel__singleCarousel .img {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 108px;
    border-radius: 24px;
    border: .2px solid #b7bbc244;
    background: #fff;
    box-shadow: 0 4px 10px 0 rgba(125,128,134,.15)
}

.Timely-redesign #CompaniesCarousel .CompaniesCarousel .Timely-logo {
    position: absolute;
    top: calc(50% - 115px);
    left: calc(50% - 95px);
    width: 189px;
    height: 189px;
    border-radius: 24px;
    border: .2px solid #b7bbc249;
    background: #fff;
    box-shadow: 0 8px 32px 0 rgba(125,128,134,.2);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px
}

    .Timely-redesign #CompaniesCarousel .CompaniesCarousel .Timely-logo img {
        width: 100%
    }

.Timely-redesign #reviews {
    margin: 140px 0 -1rem;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden
}

    .Timely-redesign #reviews a {
        color: #fff;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px;
        padding: 16px 36px;
        border-radius: 36px;
        background-color: #ffc502;
        margin-bottom: 12px;
        width: fit-content;
        transition: background-color .2s ease-in-out
    }

        .Timely-redesign #reviews a:hover {
            background-color: #17b54e
        }

    .Timely-redesign #reviews .reviews {
        max-height: 542px;
        overflow: hidden;
        display: flex
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-redesign #reviews .reviews {
        width: 100vw;
        overflow-x: scroll
    }
}

.Timely-redesign #reviews .reviews__reviewColumn:not(:last-of-type) {
    margin-right: 36px
}

.Timely-redesign #reviews .reviews__reviewColumn div {
    padding: 32px 28px;
    border-radius: 24px;
    border: .2px solid #b7bbc244;
    background: #fff;
    box-shadow: 0 4px 10px 0 rgba(125,128,134,.15)
}

    .Timely-redesign #reviews .reviews__reviewColumn div p {
        color: #222324;
        font-size: 18px;
        font-weight: 400;
        line-height: 147.5%
    }

        .Timely-redesign #reviews .reviews__reviewColumn div p span {
            color: #ffc502;
            font-weight: 600
        }

        .Timely-redesign #reviews .reviews__reviewColumn div p:first-of-type {
            margin-bottom: 1.5rem
        }

.Timely-redesign #reviews .reviews__reviewColumn.first {
    min-width: 316px;
    max-width: 316px
}

    .Timely-redesign #reviews .reviews__reviewColumn.first div {
        height: 253px
    }

        .Timely-redesign #reviews .reviews__reviewColumn.first div:first-of-type {
            margin-bottom: 153px;
            transition: all .5s ease-in-out
        }

@media(max-width:767px) {
    .Timely-redesign #reviews .reviews__reviewColumn.first div:first-of-type {
        margin-bottom: 36px
    }
}

.Timely-redesign #reviews .reviews__reviewColumn.second {
    min-width: 412px;
    max-width: 412px
}

    .Timely-redesign #reviews .reviews__reviewColumn.second div {
        height: 280px
    }

        .Timely-redesign #reviews .reviews__reviewColumn.second div:first-of-type {
            margin-bottom: 153px;
            transition: all .7s ease-in-out
        }

@media(max-width:767px) {
    .Timely-redesign #reviews .reviews__reviewColumn.second div:first-of-type {
        margin-bottom: 36px
    }
}

.Timely-redesign #reviews .reviews__reviewColumn.second div:last-of-type {
    height: 226px
}

.Timely-redesign #reviews .reviews__reviewColumn.third {
    min-width: 316px;
    max-width: 316px
}

    .Timely-redesign #reviews .reviews__reviewColumn.third div {
        height: 280px
    }

        .Timely-redesign #reviews .reviews__reviewColumn.third div:first-of-type {
            margin-bottom: 153px;
            transition: all .6s ease-in-out
        }

@media(max-width:767px) {
    .Timely-redesign #reviews .reviews__reviewColumn.third div:first-of-type {
        margin-bottom: 36px
    }
}

.Timely-redesign #reviews .reviews__reviewColumn.third div:last-of-type {
    height: 226px
}

.Timely-redesign #reviews .reviews__reviewColumn.fourth {
    min-width: 414px;
    max-width: 414px
}

    .Timely-redesign #reviews .reviews__reviewColumn.fourth div {
        height: 334px
    }

        .Timely-redesign #reviews .reviews__reviewColumn.fourth div:first-of-type {
            margin-bottom: 153px;
            transition: all .5s ease-in-out
        }

@media(max-width:767px) {
    .Timely-redesign #reviews .reviews__reviewColumn.fourth div:first-of-type {
        margin-bottom: 36px
    }
}

.Timely-redesign #reviews .reviews__reviewColumn.fourth div:last-of-type {
    height: 172px
}

.Timely-redesign #reviews .reviews__reviewColumn.fifth {
    min-width: 316px;
    max-width: 316px
}

    .Timely-redesign #reviews .reviews__reviewColumn.fifth div {
        height: 172px
    }

        .Timely-redesign #reviews .reviews__reviewColumn.fifth div:first-of-type {
            margin-bottom: 153px;
            transition: all .7s ease-in-out
        }

@media(max-width:767px) {
    .Timely-redesign #reviews .reviews__reviewColumn.fifth div:first-of-type {
        margin-bottom: 36px
    }
}

.Timely-redesign #reviews .reviews__reviewColumn.fifth div:last-of-type {
    height: 334px
}

.Timely-redesign #reviews .reviews__reviewColumn.sixth {
    min-width: 412px;
    max-width: 412px
}

    .Timely-redesign #reviews .reviews__reviewColumn.sixth div {
        height: 253px
    }

        .Timely-redesign #reviews .reviews__reviewColumn.sixth div:first-of-type {
            margin-bottom: 153px;
            transition: all .6s ease-in-out
        }

@media(max-width:767px) {
    .Timely-redesign #reviews .reviews__reviewColumn.sixth div:first-of-type {
        margin-bottom: 36px
    }
}

.Timely-redesign #reviews .reviews__reviewColumn.sixth div:last-of-type {
    height: 253px
}

.Timely-redesign #compareNew {
    margin-top: 120px
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .col-sm-10 {
        padding-left: 0 !important;
        padding-right: 0 !important
    }
}

.Timely-redesign #compareNew .col-xl-3, .Timely-redesign #compareNew .col-xl-12 {
    padding-left: 0 !important
}

.Timely-redesign #compareNew .container--custom {
    width: 100%;
    padding-right: 5rem;
    padding-left: 5rem;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3rem;
    padding-bottom: 8rem
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #compareNew .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    .Timely-redesign #compareNew .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .Timely-redesign #compareNew .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    .Timely-redesign #compareNew .container--custom {
        width: 1440px
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .Timely-redesign #compareNew .container--custom {
        padding-bottom: 5rem
    }
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .row {
        justify-content: center
    }
}

.Timely-redesign #compareNew .mainHeader-ppc {
    font-weight: 700;
    font-size: 36px
}

.Timely-redesign #compareNew h1 {
    font-size: 36px;
    font-weight: 700;
    text-align: center
}

@media(max-width:767px) {
    .Timely-redesign #compareNew h1 {
        font-size: 28px;
        text-align: left
    }
}

.Timely-redesign #compareNew a {
    display: block;
    padding: 16px 0;
    border-radius: 36px;
    background: #ffc502;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    transition: all .2s ease-in-out
}

    .Timely-redesign #compareNew a:hover {
        background-color: #17b54e
    }

    .Timely-redesign #compareNew a.btn-full {
        width: 100%
    }

    .Timely-redesign #compareNew a.btn-fit {
        width: fit-content;
        padding: 16px 36px
    }

@media(max-width:767px) {
    .Timely-redesign #compareNew a.btn-fit {
        width: 100%
    }
}

.Timely-redesign #compareNew .switchers {
    position: relative
}

    .Timely-redesign #compareNew .switchers::after {
        content: "";
        top: 19px;
        left: 0;
        position: absolute;
        height: .2px;
        background: #b7bbc246;
        width: calc(100% - 15px)
    }

@media(max-width:767px) {
    .Timely-redesign #compareNew .switchers::after {
        width: calc(100% - 5px)
    }
}

.Timely-redesign #compareNew .special-paragraph {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffc502
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #compareNew .special-paragraph {
        text-align: center
    }
}

.Timely-redesign #compareNew p {
    line-height: 26px
}

.Timely-redesign #compareNew .mainPara-ppc {
    font-size: 18px;
    padding: 20px 0;
    margin: 0 25%;
    color: #767676
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .mainPara-ppc {
        text-align: left;
        padding: 0;
        margin: 1rem 0;
        font-size: 16px;
        line-height: 2.13
    }
}

.Timely-redesign #compareNew .col-sm-12 {
    text-align: center
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .col-sm-12:nth-of-type(1) {
        text-align: left
    }

    .Timely-redesign #compareNew .col-sm-12 .mainPara {
        font-size: 16px;
        text-align: center
    }
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .col-sm-10 {
        padding-right: 30px;
        padding-left: 30px
    }
}

.Timely-redesign #compareNew .toggle-prices {
    display: inline-flex;
    align-items: center;
    position: relative;
    width: 280px;
    margin-left: 2rem;
    margin-bottom: 2rem
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .toggle-prices {
        width: 280px
    }
}

.Timely-redesign #compareNew .toggle-prices input {
    position: absolute;
    height: 0;
    width: 0;
    opacity: 0
}

.Timely-redesign #compareNew .toggle-prices .changed-color {
    color: #fff
}

.Timely-redesign #compareNew .toggle-prices .switcher-price {
    display: flex;
    justify-content: inherit;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #fff;
    transition: background-color .15s ease-in .4s,box-shadow .15s ease-in .4s;
    user-select: none;
    cursor: pointer
}

    .Timely-redesign #compareNew .toggle-prices .switcher-price > *:first-child {
        margin-right: 20px
    }

    .Timely-redesign #compareNew .toggle-prices .switcher-price:before {
        position: absolute;
        content: "";
        width: 112px;
        height: 3px;
        border-radius: 100px 100px 0 0;
        top: 16px;
        left: -8px;
        background-color: #ffc502;
        transition: transform .3s,background-color .15s ease-in .4s,box-shadow .15s ease-in .4s
    }

    .Timely-redesign #compareNew .toggle-prices .switcher-price .switcher-text, .Timely-redesign #compareNew .toggle-prices .switcher-price .switcher-text-2 {
        color: #222324;
        text-align: center;
        font-size: 24px;
        font-weight: 700;
        z-index: 1;
        cursor: pointer;
        margin-bottom: 0
    }

        .Timely-redesign #compareNew .toggle-prices .switcher-price .switcher-text .switcher-span, .Timely-redesign #compareNew .toggle-prices .switcher-price .switcher-text-2 .switcher-span {
            font-size: 13px
        }

    .Timely-redesign #compareNew .toggle-prices .switcher-price .switcher-text-2 {
        color: #b7b7b7;
        cursor: pointer;
        margin-bottom: 0;
        z-index: 1
    }

@media(max-width:767px) {
    .Timely-redesign #compareNew .toggle-prices .switcher-price .switcher-text-2 {
        padding-right: 0
    }
}

.Timely-redesign #compareNew .toggle-prices .switcher-price .white-text {
    color: #000
}

.Timely-redesign #compareNew .toggle-prices .switcher-price .green-text {
    color: #ffc502;
    font-weight: 700
}

.Timely-redesign #compareNew .toggle-prices .switcher-price .gray-text {
    color: #b7b7b7
}

.Timely-redesign #compareNew .toggle-prices input:checked + .switcher-price:before {
    transform: translateX(117px)
}

.Timely-redesign #compareNew .card.green {
    background-color: #ffc502;
    color: #fff
}

    .Timely-redesign #compareNew .card.green .price {
        border-bottom: 1px solid #fff;
        background-color: #ffc502;
        color: #fff
    }

    .Timely-redesign #compareNew .card.green ul.list-group li.list-group-item {
        background-color: #ffc502;
        color: #fff
    }

        .Timely-redesign #compareNew .card.green ul.list-group li.list-group-item.ul-wrapper {
            background-color: #ffc502;
            color: #fff
        }

    .Timely-redesign #compareNew .card.green a.btn-filled {
        background-color: #fff;
        color: #ffc502
    }

@media(min-width:993px) and (max-width:1199px) {
    .Timely-redesign #compareNew .card.green a.btn-filled {
        font-size: 12px;
        padding: 12px 18px
    }
}

@media(max-width:767px),tablet,(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    .Timely-redesign #compareNew .col-md-6 {
        margin-top: 1rem
    }
}

.Timely-redesign #compareNew .most-popular-label::after {
    content: "Most popular";
    position: absolute;
    display: inline-block;
    background: #ffc502;
    left: 29px;
    top: 0;
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    padding: 5px 10px 8px;
    border-radius: 0 0 8px 8px
}

.Timely-redesign #compareNew .card {
    height: 100%;
    position: relative;
    overflow: hidden;
    text-align: center;
    border: none;
    background-color: #fff;
    box-shadow: 0 8px 32px 0 rgba(125,128,134,.2);
    border-radius: 26px;
    border: .2px solid #b7bbc249;
    padding: 1rem 1rem 2rem
}

.Timely-redesign #compareNew .card-enterprise {
    display: flex;
    flex-direction: column;
    margin-top: 1.5rem;
    box-shadow: 0 8px 32px 0 rgba(125,128,134,.2);
    border: .2px solid #b7bbc249;
    border-radius: 26px;
    background-color: #fff;
    padding: 2rem 0 2rem 2rem
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise {
        margin-top: 1rem;
        padding: 2rem 0 3rem
    }
}

.Timely-redesign #compareNew .card-enterprise-content {
    width: 100%;
    display: grid;
    grid-template-columns: .5fr 1fr 300px
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #compareNew .card-enterprise-content {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise-content-paragraph {
        margin-left: -31px
    }
}

.Timely-redesign #compareNew .card-enterprise-content-paragraph h2 {
    color: #000;
    font-size: 24px;
    font-weight: 700;
    margin-top: 12px
}

.Timely-redesign #compareNew .card-enterprise-content-paragraph p {
    padding: 1rem 0 0;
    text-align: left;
    color: #6b6b6b;
    font-size: 16px;
    font-weight: 400;
    max-width: 273px;
    line-height: normal !important
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise-content-paragraph p {
        padding: 1rem 0 0;
        text-align: left
    }
}

.Timely-redesign #compareNew .card-enterprise-content-list {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise-content-list {
        align-items: center;
        justify-content: flex-start
    }
}

.Timely-redesign #compareNew .card-enterprise-content-list ul {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 1rem 3rem;
    margin: 0
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #compareNew .card-enterprise-content-list ul {
        grid-template-columns: 1fr;
        display: flex;
        flex-direction: column;
        align-items: flex-start
    }
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise-content-list ul {
        grid-template-columns: 1fr;
        margin: 1rem 0 2.5rem
    }
}

.Timely-redesign #compareNew .card-enterprise-content-list ul a {
    margin-top: 25px;
    text-align: center
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px),(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise-content-list ul a {
        display: none
    }
}

.Timely-redesign #compareNew .card-enterprise-content-list ul li {
    text-align: left;
    color: #222324;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

    .Timely-redesign #compareNew .card-enterprise-content-list ul li img {
        margin-right: 13px;
        height: 22px
    }

.Timely-redesign #compareNew .card-enterprise-content-button {
    display: flex;
    align-items: flex-start;
    justify-content: center
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #compareNew .card-enterprise-content-button {
        display: none
    }
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise-content-button {
        width: 100%;
        padding: 0 2.5rem
    }
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card-enterprise-content-button a {
        margin-top: 3rem;
        text-align: center
    }
}

.Timely-redesign #compareNew .card .price-first {
    margin-top: 3rem
}

    .Timely-redesign #compareNew .card .price-first .title-price {
        color: #ffc502;
        font-size: 48px;
        font-weight: 700
    }

        .Timely-redesign #compareNew .card .price-first .title-price span {
            font-size: 24px
        }

.Timely-redesign #compareNew .card .all-benefits {
    padding: 1rem 0 0;
    border-bottom: 1px solid #dbdbdb;
    z-index: 10;
    position: inherit
}

.Timely-redesign #compareNew .card .list-with-checkmarks {
    padding-top: 1rem
}

    .Timely-redesign #compareNew .card .list-with-checkmarks > * {
        cursor: text
    }

    .Timely-redesign #compareNew .card .list-with-checkmarks li {
        list-style-image: url(/img/Timely-redesign/checkmark.png) !important;
        padding: .4rem 0 .3rem 0
    }

.Timely-redesign #compareNew .card .list-with-checkmarks-circle {
    display: flex;
    align-items: flex-start;
    margin: 0 !important
}

    .Timely-redesign #compareNew .card .list-with-checkmarks-circle > * {
        cursor: text
    }

    .Timely-redesign #compareNew .card .list-with-checkmarks-circle img {
        margin-right: 13px
    }

    .Timely-redesign #compareNew .card .list-with-checkmarks-circle p {
        font-weight: 700
    }

.Timely-redesign #compareNew .card .list-unstyled {
    width: 100%;
    cursor: help
}

    .Timely-redesign #compareNew .card .list-unstyled .item-styled {
        display: flex;
        text-align: left
    }

        .Timely-redesign #compareNew .card .list-unstyled .item-styled img {
            margin-right: 13px;
            height: 22px
        }

        .Timely-redesign #compareNew .card .list-unstyled .item-styled .fas {
            display: none
        }

        .Timely-redesign #compareNew .card .list-unstyled .item-styled .special-asana {
            border-bottom: 1px solid #ffc502;
            font-weight: 700
        }

    .Timely-redesign #compareNew .card .list-unstyled span {
        margin-left: 0;
        font-size: 16px;
        font-weight: 400
    }

.Timely-redesign #compareNew .card .card-titles {
    color: #000;
    font-size: 24px;
    font-weight: 700;
    text-align: left;
    margin-bottom: 12px
}

.Timely-redesign #compareNew .card .list-group {
    margin-top: 1rem
}

    .Timely-redesign #compareNew .card .list-group .list-group-item {
        margin-bottom: .5rem;
        color: #1b1b20;
        border: none;
        padding: 1rem;
        border-radius: 26px
    }

@media(max-width:767px) {
    .Timely-redesign #compareNew .card .list-group .list-group-item {
        padding: 25px
    }
}

.Timely-redesign #compareNew .card .list-group .list-group-item .green-box {
    color: #fff
}

.Timely-redesign #compareNew .card .list-group .list-group-item .enterprise-price {
    padding: 1rem 0 3.3rem
}

@media(min-width:993px) and (max-width:1199px) {
    .Timely-redesign #compareNew .card .list-group .list-group-item a.btn-filled {
        font-size: 12px;
        padding: 12px 18px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #compareNew .card .list-group .list-group-item a.btn-filled {
        width: 100%
    }
}

.Timely-redesign #compareNew .card .list-group .list-group-item .btn-filled {
    width: 100% !important
}

.Timely-redesign #compareNew .card .list-group .list-group-item .bottom-price-text {
    color: #222324;
    padding-top: 10px
}

.Timely-redesign #compareNew .card .list-group .list-group-item .btn-basic-plan {
    margin-top: 7px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .Timely-redesign #compareNew .card .list-group .list-group-item .btn-basic-plan {
        margin-top: 1.9rem
    }
}

.Timely-redesign #compareNew .card .list-group .no_cursor {
    text-align: left;
    padding-left: 1rem
}

@media(max-width:767px) {
    .Timely-redesign #compareNew .card .list-group .no_cursor {
        padding-left: 25px
    }
}

.Timely-redesign #compareNew .card .card-icon-pro {
    position: absolute;
    width: 35px;
    bottom: -40px;
    right: -35px
}

.Timely-redesign #compareNew .card .tooltip-inner {
    position: relative;
    top: -58px
}

.Timely-redesign #compareNew .card .tooltip.bs-tooltip-bottom .arrow, .Timely-redesign #compareNew .card .tooltip.bs-tooltip-auto[x-placement^=bottom] .arrow {
    top: 0
}

.Timely-redesign #compareNew .card .tooltip.bs-tooltip-right .arrow::before, .Timely-redesign #compareNew .card .tooltip.bs-tooltip-auto[x-placement^=right] .arrow::before {
    margin-top: -62px
}

.Timely-redesign #compareNew .card .description {
    text-align: left;
    color: #6b6b6b;
    font-size: 16px;
    font-weight: 400;
    min-height: 52px
}

.Timely-redesign #compareNew .card .price, .Timely-redesign #compareNew .card .price-subtitle {
    display: flex;
    flex-direction: column;
    text-align: left;
    margin: 0 auto;
    padding-bottom: 1rem;
    justify-content: center;
    margin-bottom: 50px
}

    .Timely-redesign #compareNew .card .price .title-price, .Timely-redesign #compareNew .card .price-subtitle .title-price {
        color: #222324;
        font-size: 52px;
        font-weight: 700
    }

        .Timely-redesign #compareNew .card .price .title-price .text, .Timely-redesign #compareNew .card .price-subtitle .title-price .text {
            position: relative
        }

    .Timely-redesign #compareNew .card .price .dollar-icon, .Timely-redesign #compareNew .card .price-subtitle .dollar-icon {
        color: #222324;
        font-size: 52px;
        font-weight: 700;
        font-style: initial
    }

    .Timely-redesign #compareNew .card .price .pricing-seats-period, .Timely-redesign #compareNew .card .price-subtitle .pricing-seats-period {
        color: #6b6b6b;
        font-size: 16px;
        font-weight: 400;
        margin-top: 12px
    }

.Timely-redesign #compareNew .card .price-toggle {
    text-align: left;
    font-size: 36px;
    margin-top: 12px
}

.Timely-redesign #badges {
    margin-top: 164px
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #badges {
        margin-top: 140px
    }
}

@media(max-width:767px) {
    .Timely-redesign #badges {
        margin-top: 120px
    }
}

.Timely-redesign #badges .container {
    display: grid;
    grid-template-columns: repeat(6,1fr);
    gap: 48px 24px
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #badges .container {
        grid-template-columns: repeat(4,1fr)
    }
}

@media(max-width:767px) {
    .Timely-redesign #badges .container {
        column-gap: unset;
        row-gap: 48px;
        grid-template-columns: repeat(3,1fr)
    }
}

.Timely-redesign #badges .container .badges__singleBadge {
    display: flex;
    align-items: center;
    justify-content: center
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-redesign #badges .container .badges__singleBadge:nth-of-type(5) {
        grid-column: 2
    }
}

@media(max-width:767px) {
    .Timely-redesign #badges .container .badges__singleBadge img {
        width: 88px
    }
}

.expenses * {
    font-family: sans-serif,sans-serif
}

.expenses .sectionsHeader {
    display: flex;
    flex-direction: column;
    margin-bottom: 4rem
}

    .expenses .sectionsHeader span {
        color: #ffc502;
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 1rem
    }

    .expenses .sectionsHeader h2 {
        color: #222324;
        font-size: 36px;
        font-weight: 700;
        max-width: 628px
    }

@media(max-width:767px) {
    .expenses .sectionsHeader h2 {
        font-size: 28px
    }
}

.expenses .container {
    padding-left: 0 !important;
    padding-right: 0 !important
}

@media(max-width:767px) {
    .expenses .container {
        padding-left: 15px !important;
        padding-right: 15px !important
    }
}

@media(min-width:1200px) {
    .expenses .container {
        max-width: 1280px
    }
}

@media(min-width:1900px) {
    .expenses .container {
        max-width: 1334px
    }
}

.expenses .border-line {
    display: none
}

.expenses #footer .footer-bottom {
    margin-top: 64px
}

.expenses .section-integration-more-info div.limitHeight {
    height: 46px
}

.expenses .section-integration-more-info h2 {
    margin: 2rem 0;
    text-align: left !important;
    max-width: 532px
}

.expenses .section-integration-more-info h4 {
    margin: 3rem 0 1.5rem
}

.expenses .fas.fa-plus, .expenses .fas.fa-minus {
    display: none !important
}

.expenses #btnReadMore {
    padding: 0 !important;
    margin-top: 1.5rem;
    transition: all .2s ease-in-out !important;
    text-decoration: none !important;
    position: relative
}

    .expenses #btnReadMore::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 2px;
        bottom: 0;
        left: 0;
        background-color: #ffc502
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .expenses #top {
        padding: 0
    }
}

.expenses #top .container {
    display: grid;
    grid-template-columns: minmax(auto,40%) minmax(auto,60%);
    gap: 2rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .expenses #top .container {
        grid-template-columns: 1fr;
        text-align: center
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .expenses #top .container .content {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }
}

.expenses #top .container .content h1 {
    color: #222324;
    font-size: 52px;
    font-weight: 700;
    line-height: 116%;
    max-width: 522px
}

@media(max-width:767px) {
    .expenses #top .container .content h1 {
        max-width: 320px;
        font-size: 36px
    }
}

.expenses #top .container .content h1 span {
    color: #ffc502
}

.expenses #top .container .content h2 {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    max-width: 420px;
    margin-bottom: 40px;
    transition-delay: 200ms
}

@media(min-width:768px) and (max-width:991px) {
    .expenses #top .container .content h2 {
        max-width: 520px
    }
}

@media(max-width:767px) {
    .expenses #top .container .content h2 {
        max-width: 355px
    }
}

.expenses #top .container .content .sign-up {
    display: flex;
    align-items: center;
    transition-delay: 400ms
}

@media(max-width:767px) {
    .expenses #top .container .content .sign-up {
        flex-direction: column
    }
}

.expenses #top .container .content .sign-up a.btn {
    background: #ffc502;
    border-radius: 36px;
    display: flex;
    padding: 16px 36px 17px;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    margin-right: 1.5rem;
    transition: background-color .2s ease-in-out
}

    .expenses #top .container .content .sign-up a.btn:hover {
        background-color: #17b54e
    }

@media(max-width:767px) {
    .expenses #top .container .content .sign-up a.btn {
        margin-bottom: 2rem
    }
}

.expenses #top .container .content .sign-up span {
    color: #323333;
    font-size: 18px;
    font-weight: 400
}

    .expenses #top .container .content .sign-up span a img {
        border-radius: 100px;
        padding: 8px;
        transition: all .2s ease-in-out
    }

    .expenses #top .container .content .sign-up span a:hover img {
        box-shadow: rgba(0,0,0,.09) 0 3px 12px
    }

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .expenses #top .container .img {
        margin-right: -1.9rem
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .expenses #top .container .img {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 2rem
    }
}

.expenses #top .container .img img {
    transition-delay: 600ms;
    width: 100%
}

@media(max-width:767px) {
    .expenses #top .container .img img.desktop {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .expenses #top .container .img img.mobile {
        display: none
    }
}

.expenses #grid-content {
    margin-top: 100px
}

@media(min-width:768px) and (max-width:991px) {
    .expenses #grid-content {
        margin-top: 160px
    }
}

@media(max-width:767px) {
    .expenses #grid-content {
        margin-top: 140px
    }
}

.expenses #grid-content .container .header {
    display: grid;
    grid-template-columns: minmax(auto,122px) minmax(auto,413px) minmax(auto,700px);
    gap: 20px;
    margin-bottom: 198px
}

@media(min-width:992px) and (max-width:1440px) {
    .expenses #grid-content .container .header {
        grid-template-columns: minmax(auto,122px) minmax(auto,390px) minmax(auto,700px)
    }
}

@media(min-width:768px) and (max-width:991px) {
    .expenses #grid-content .container .header {
        grid-template-columns: minmax(auto,122px) minmax(auto,172px) minmax(auto,350px);
        margin-bottom: 160px
    }
}

@media(max-width:767px) {
    .expenses #grid-content .container .header {
        grid-template-columns: minmax(auto,122px) 1fr;
        margin-bottom: 140px
    }
}

.expenses #grid-content .container .header p {
    color: #323333;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    margin-top: 3px
}

.expenses #grid-content .container .header div {
    height: 2px;
    background-color: #b7bbc2;
    margin-top: 1rem
}

.expenses #grid-content .container .header h2 {
    color: #222324;
    font-size: 36px;
    font-weight: 600
}

    .expenses #grid-content .container .header h2 span {
        color: #ffc502
    }

@media(max-width:767px) {
    .expenses #grid-content .container .header h2 {
        grid-column: 1/3;
        font-size: 28px;
        max-width: 300px
    }
}

.expenses #grid-content .container .singleGrid:not(:last-of-type) {
    margin-bottom: 166px
}

@media(min-width:768px) and (max-width:991px) {
    .expenses #grid-content .container .singleGrid:not(:last-of-type) {
        margin-bottom: 140px
    }
}

@media(max-width:767px) {
    .expenses #grid-content .container .singleGrid:not(:last-of-type) {
        margin-bottom: 96px
    }
}

.expenses #grid-content .container .textOnLeft {
    display: grid;
    grid-template-columns: minmax(auto,44%) minmax(auto,55%)
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .expenses #grid-content .container .textOnLeft {
        display: flex;
        flex-direction: column;
        gap: 4rem
    }
}

@media(max-width:767px) {
    .expenses #grid-content .container .textOnLeft {
        gap: 40px
    }
}

.expenses #grid-content .container .textOnLeft .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 6rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .expenses #grid-content .container .textOnLeft .content {
        padding-right: 0
    }
}

.expenses #grid-content .container .textOnLeft .content h2 {
    color: #222324;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 4rem;
    position: relative;
    max-width: 433px
}

@media(max-width:767px) {
    .expenses #grid-content .container .textOnLeft .content h2 {
        font-size: 28px
    }
}

.expenses #grid-content .container .textOnLeft .content h2::after {
    content: "";
    position: absolute;
    bottom: -2rem;
    left: 0;
    width: 88px;
    height: 2px;
    background-color: #ffc502
}

.expenses #grid-content .container .textOnLeft .content p {
    color: #222324;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    max-width: 433px
}

.expenses #grid-content .container .textOnLeft .img img {
    width: 100%
}

.expenses #grid-content .container .textOnRight {
    display: grid;
    grid-template-columns: minmax(auto,55%) minmax(auto,44%)
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .expenses #grid-content .container .textOnRight {
        display: flex;
        flex-direction: column-reverse;
        gap: 4rem
    }
}

@media(max-width:767px) {
    .expenses #grid-content .container .textOnRight {
        gap: 40px
    }
}

.expenses #grid-content .container .textOnRight .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 6rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .expenses #grid-content .container .textOnRight .content {
        padding-left: 0
    }
}

.expenses #grid-content .container .textOnRight .content h2 {
    color: #222324;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 4rem;
    position: relative;
    max-width: 433px
}

@media(max-width:767px) {
    .expenses #grid-content .container .textOnRight .content h2 {
        font-size: 28px
    }
}

.expenses #grid-content .container .textOnRight .content h2::after {
    content: "";
    position: absolute;
    bottom: -2rem;
    left: 0;
    width: 88px;
    height: 2px;
    background-color: #ffc502
}

.expenses #grid-content .container .textOnRight .content p {
    color: #222324;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    max-width: 433px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .expenses #grid-content .container .textOnRight .content a {
        display: none
    }
}

.expenses #grid-content .container .textOnRight .img {
    text-align: center
}

    .expenses #grid-content .container .textOnRight .img img {
        width: 100%
    }

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .expenses #grid-content .container .textOnRight .img a {
        display: none
    }
}

.expenses #grid-content .container a.btn {
    width: fit-content;
    padding: 16px 36px 17px;
    border-radius: 36px;
    background: #ffc502;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    transition: background-color .2s ease-in-out;
    margin-top: 40px
}

    .expenses #grid-content .container a.btn:hover {
        background-color: #17b54e
    }

@media(max-width:767px) {
    .expenses #grid-content .container img.desktop {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .expenses #grid-content .container img.mobile {
        display: none;
        border: .2px solid #b7bbc23a;
        margin-top: -1px
    }
}

.expenses #steps-table {
    margin-top: 164px
}

    .expenses #steps-table .container .steps-table {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 4rem
    }

@media(min-width:768px) and (max-width:991px) {
    .expenses #steps-table .container .steps-table {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:767px) {
    .expenses #steps-table .container .steps-table {
        grid-template-columns: 1fr;
        gap: 1rem
    }
}

.expenses #steps-table .container .steps-table .singleCard {
    padding: 2rem 0 1rem 2rem;
    border-left: 1px solid #b7bbc2;
    display: flex;
    flex-direction: column
}

@media(max-width:767px) {
    .expenses #steps-table .container .steps-table .singleCard {
        border-left: 0;
        border-top: 1px solid #b7bbc2
    }

        .expenses #steps-table .container .steps-table .singleCard:last-of-type {
            padding-bottom: 2rem;
            border-bottom: 1px solid #b7bbc2
        }
}

.expenses #steps-table .container .steps-table .singleCard h2 {
    color: #ffc502;
    font-size: 52px;
    font-weight: 700;
    margin-bottom: 32px
}

.expenses #steps-table .container .steps-table .singleCard p {
    color: #222324;
    font-size: 24px;
    font-weight: 400;
    line-height: 33px
}

.expenses #bannerGray {
    background-color: #f8fafc;
    padding: 96px 0 100px;
    margin: 164px 0
}

    .expenses #bannerGray .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }

        .expenses #bannerGray .container h2 {
            color: #222324;
            text-align: center;
            font-size: 36px;
            font-weight: 700;
            margin-bottom: 32px;
            max-width: 846px
        }

@media(max-width:767px) {
    .expenses #bannerGray .container h2 {
        font-size: 28px
    }
}

@media(max-width:767px) {
    .expenses #bannerGray .container h2 {
        max-width: 522px
    }
}

.expenses #bannerGray .container h2 span {
    color: #ffc502
}

.expenses #bannerGray .container a {
    padding: 16px 36px 17px;
    border-radius: 36px;
    background: #ffc502;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    transition: background-color .2s ease-in-out
}

    .expenses #bannerGray .container a:hover {
        background-color: #17b54e
    }

@media(max-width:767px) {
    .expenses #bannerGray .container br.desktop {
        display: none
    }
}

@media(max-width:767px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .expenses #bannerGray .container br.tablet {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .expenses #bannerGray .container br.mobile {
        display: none
    }
}

.expenses #features {
    margin-bottom: 15rem
}

    .expenses #features .container .features {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 4rem;
        margin-bottom: 48px
    }

@media(min-width:768px) and (max-width:991px) {
    .expenses #features .container .features {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:767px) {
    .expenses #features .container .features {
        grid-template-columns: 1fr
    }
}

.expenses #features .container .features .singleFeature {
    display: flex;
    flex-direction: column
}

    .expenses #features .container .features .singleFeature .img {
        border-radius: 26px;
        border: .2px solid #b7bbc24f;
        overflow: hidden;
        margin-bottom: 40px
    }

        .expenses #features .container .features .singleFeature .img img {
            width: 100%;
            margin-top: -1px
        }

@media(max-width:767px) {
    .expenses #features .container .features .singleFeature .img img.desktop {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .expenses #features .container .features .singleFeature .img img.mobile {
        display: none;
        border: .2px solid #b7bbc23a;
        margin-top: -1px
    }
}

.expenses #features .container .features .singleFeature .content {
    display: flex;
    flex-direction: column
}

    .expenses #features .container .features .singleFeature .content h3 {
        color: #222324;
        font-size: 24px;
        font-weight: 600;
        line-height: 22px;
        margin-bottom: 16px
    }

    .expenses #features .container .features .singleFeature .content p {
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px
    }

.expenses #features .container a {
    padding: 16px 36px 17px;
    border-radius: 36px;
    background: #ffc502;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    transition: background-color .2s ease-in-out
}

    .expenses #features .container a:hover {
        background-color: #17b54e
    }

.white_navbar .navbar {
    background-color: #fff !important;
    transition: box-shadow .3s ease-in-out
}

.white_navbar #navbar .content-mobile-list {
    background-color: #fff !important
}

.white_navbar .content-mobile-list-item-text {
    color: #222324 !important
}

.white_navbar .navbar__link {
    color: #222324 !important
}

.white_navbar #navbar .gradient-background {
    border-top: 1px solid #dbdbdb
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .white_navbar #navbar .content__product__white {
        padding: 0
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .white_navbar #navbar .content__product__white-firstColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-right: 4rem
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .white_navbar #navbar .content__product__white-secondColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-left: 4rem
    }
}

.white_navbar #navbar .toggle-product-arrow::after, .white_navbar #navbar .toggle-integrations-arrow::after {
    border-bottom: 6px solid #222324 !important
}

.white_navbar #navbar .toggle-mobile-product-button .content-mobile-list-item-text::after {
    border-bottom: 6px solid #222324 !important
}

.white_navbar #navbar .toggle-mobile-integrations-button .content-mobile-list-item-text::after {
    border-bottom: 6px solid #222324 !important
}

.white_navbar #navbar .navbar__list-item--border {
    border-right: .5px solid #222324 !important
}

.white_navbar #navbar .cta-register {
    background-color: #ffc502 !important;
    transition: background-color .2s ease-in-out
}

    .white_navbar #navbar .cta-register:hover {
        background-color: #17b54e !important
    }

.white_navbar #navbar .navbar__header-burger-line {
    background-color: #222324
}

.glossary * {
    font-family: sans-serif,sans-serif
}

.glossary #top {
    padding: 8rem 0
}

@media(max-width:767px) {
    .glossary #top {
        padding: 0 0 4rem !important
    }
}

.glossary #top .container {
    display: flex
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .glossary #top .container {
        flex-direction: column;
        gap: 1.5rem
    }
}

.glossary #top .container .content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    min-width: 522px
}

@media(max-width:767px) {
    .glossary #top .container .content {
        min-width: 100%
    }
}

.glossary #top .container .content span.label {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 22px;
    font-size: 18px;
    border-radius: 8px;
    padding: 12px 36px 13px;
    background-color: #f2fcf6;
    color: #ffc502
}

.glossary #top .container .content a {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 22px;
    font-size: 18px
}

    .glossary #top .container .content a.back {
        color: #222324
    }

    .glossary #top .container .content a img {
        margin-right: 6px;
        transition: all .2s ease-in-out
    }

    .glossary #top .container .content a:hover img {
        margin-right: 9px
    }

.glossary #top .container .content h1 {
    padding: 0;
    color: #222324;
    font-size: 52px;
    font-weight: 700;
    line-height: 116%;
    margin: 0 0 32px;
    max-width: 522px
}

    .glossary #top .container .content h1 span {
        color: #ffc502
    }

.glossary #top .container .content h2 {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    max-width: 422px
}

.glossary #top .container .img {
    width: 100%
}

    .glossary #top .container .img img {
        width: 100%
    }

.glossary #tableOfContent .container {
    display: grid;
    grid-template-columns: repeat(3,1fr)
}

@media(max-width:767px) {
    .glossary #tableOfContent .container {
        grid-template-columns: 1fr
    }
}

.glossary #tableOfContent .container .table h2 {
    color: #222324;
    font-size: 36px;
    font-weight: 700;
    line-height: 116%;
    margin-bottom: 20px
}

    .glossary #tableOfContent .container .table h2.green {
        color: #ffc502
    }

.glossary #tableOfContent .container .table ul {
    display: flex;
    flex-direction: column;
    padding: 0;
    gap: 16px;
    margin-bottom: 64px
}

    .glossary #tableOfContent .container .table ul li {
        list-style: none;
        max-width: 85%
    }

        .glossary #tableOfContent .container .table ul li a {
            color: #323333;
            font-size: 18px;
            font-weight: 500;
            line-height: 26px
        }

            .glossary #tableOfContent .container .table ul li a:hover {
                font-weight: 700
            }

.glossary #content {
    margin-bottom: 15rem
}

    .glossary #content .container {
        display: grid;
        grid-template-columns: 1fr 320px;
        gap: 110px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .glossary #content .container {
        grid-template-columns: 1fr
    }
}

.glossary #content .container .banner {
    padding-left: 35px;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    border-left: 2px solid #b7bbc2;
    gap: 32px
}

    .glossary #content .container .banner span {
        display: flex;
        padding: 12px 32px 13px;
        border-radius: 8px;
        background-color: #f2fcf6;
        color: #ffc502;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px
    }

        .glossary #content .container .banner span img {
            margin-right: 16px
        }

    .glossary #content .container .banner p {
        color: #222324;
        font-size: 24px;
        font-weight: 400;
        line-height: 33px;
        margin: 0
    }

    .glossary #content .container .banner a {
        padding: 16px 36px 17px;
        background-color: #ffc502;
        color: #fff;
        border-radius: 36px;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px;
        transition: all .2s ease-in-out
    }

        .glossary #content .container .banner a:hover {
            background-color: #17b54e
        }

.glossary #content .container .content {
    display: flex;
    flex-direction: column;
    gap: 32px
}

    .glossary #content .container .content h2 {
        color: #222324;
        font-size: 36px;
        font-weight: 700;
        line-height: 116%
    }

        .glossary #content .container .content h2:not(:first-of-type) {
            margin-top: 32px
        }

    .glossary #content .container .content p {
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        margin: 0
    }

    .glossary #content .container .content img {
        width: 100%
    }

        .glossary #content .container .content img.label-img {
            width: auto
        }

.glossary #content .container .sticky-banner {
    position: relative
}

    .glossary #content .container .sticky-banner .banner {
        position: sticky;
        top: 10rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .glossary #content .container .sticky-banner {
        display: none
    }
}

.glossary-planner * {
    font-family: lato,sans-serif
}

.glossary-planner .border-line {
    display: none
}

.glossary-planner #footer .footer-bottom {
    margin-top: 64px
}

.glossary-planner .cta-register {
    padding: 15px 24px !important;
    background: linear-gradient(111deg,#2d80eb 36.16%,#2466bc 88.93%) !important;
    box-shadow: 2px 4px 32px 0 rgba(36,102,188,.64) !important;
    color: #fff !important;
    font-weight: 600 !important;
    border-radius: 32px !important;
    transition: all .2s ease-in-out !important
}

.glossary-planner #top {
    padding: 8rem 0
}

    .glossary-planner #top .container {
        display: flex
    }

        .glossary-planner #top .container .content {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            min-width: 522px
        }

@media(max-width:767px) {
    .glossary-planner #top .container .content {
        min-width: 100%
    }
}

.glossary-planner #top .container .content a {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 22px;
    font-size: 18px
}

    .glossary-planner #top .container .content a.back {
        color: #222324
    }

    .glossary-planner #top .container .content a.blue {
        border-radius: 8px;
        padding: 12px 36px 13px;
        background-color: #deebfc;
        color: #2d80eb
    }

    .glossary-planner #top .container .content a img {
        margin-right: 6px;
        transition: all .2s ease-in-out
    }

    .glossary-planner #top .container .content a:hover img {
        margin-right: 9px
    }

.glossary-planner #top .container .content h1 {
    padding: 0;
    color: #222324;
    font-size: 52px;
    font-weight: 700;
    line-height: 116%;
    margin: 0 0 32px;
    max-width: 522px
}

    .glossary-planner #top .container .content h1 span {
        color: #2d80eb
    }

.glossary-planner #top .container .content h2 {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    max-width: 422px
}

.glossary-planner #top .container .img {
    margin-left: 15%
}

@media(max-width:767px) {
    .glossary-planner #top .container .img {
        display: none
    }
}

.glossary-planner #top .container .img img {
    width: 100%
}

.glossary-planner #tableOfContent .container {
    display: grid;
    grid-template-columns: repeat(3,1fr)
}

@media(max-width:767px) {
    .glossary-planner #tableOfContent .container {
        grid-template-columns: 1fr
    }
}

.glossary-planner #tableOfContent .container .table h2 {
    color: #222324;
    font-size: 36px;
    font-weight: 700;
    line-height: 116%;
    margin-bottom: 20px
}

    .glossary-planner #tableOfContent .container .table h2.green {
        color: #2d80eb
    }

.glossary-planner #tableOfContent .container .table ul {
    display: flex;
    flex-direction: column;
    padding: 0;
    gap: 16px;
    margin-bottom: 64px
}

    .glossary-planner #tableOfContent .container .table ul li {
        list-style: none;
        max-width: 85%
    }

        .glossary-planner #tableOfContent .container .table ul li a {
            color: #323333;
            font-size: 18px;
            font-weight: 500;
            line-height: 26px
        }

            .glossary-planner #tableOfContent .container .table ul li a:hover {
                font-weight: 700
            }

.glossary-planner #content {
    margin-bottom: 15rem
}

    .glossary-planner #content .container {
        display: grid;
        grid-template-columns: 1fr 320px;
        gap: 110px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .glossary-planner #content .container {
        grid-template-columns: 1fr
    }
}

.glossary-planner #content .container .banner {
    padding-left: 35px;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    border-left: 2px solid #b7bbc2;
    gap: 32px
}

    .glossary-planner #content .container .banner span {
        display: flex;
        padding: 12px 32px 13px;
        border-radius: 8px;
        background-color: #deebfc;
        color: #2d80eb;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px
    }

        .glossary-planner #content .container .banner span img {
            margin-right: 16px
        }

    .glossary-planner #content .container .banner p {
        color: #222324;
        font-size: 24px;
        font-weight: 400;
        line-height: 33px;
        margin: 0
    }

    .glossary-planner #content .container .banner a {
        padding: 16px 36px 17px;
        background: linear-gradient(111deg,#2d80eb 36.16%,#2466bc 88.93%);
        color: #fff;
        border-radius: 36px;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px
    }

.glossary-planner #content .container .content {
    display: flex;
    flex-direction: column;
    gap: 32px
}

    .glossary-planner #content .container .content h2 {
        color: #222324;
        font-size: 36px;
        font-weight: 700;
        line-height: 116%
    }

        .glossary-planner #content .container .content h2:not(:first-of-type) {
            margin-top: 32px
        }

    .glossary-planner #content .container .content p {
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        margin: 0
    }

.glossary-planner #content .container .sticky-banner {
    position: relative
}

    .glossary-planner #content .container .sticky-banner .banner {
        position: sticky;
        top: 10rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .glossary-planner #content .container .sticky-banner {
        display: none
    }
}

.templates * {
    font-family: sans-serif,sans-serif
}

.templates .navbar {
    background-color: #fff !important;
    transition: box-shadow .3s ease-in-out
}

.templates #navbar .content-mobile-list {
    background-color: #fff !important
}

.templates .content-mobile-list-item-text {
    color: #222324 !important
}

.templates .navbar__link {
    color: #222324 !important
}

.templates #navbar .gradient-background {
    border-top: 1px solid #dbdbdb
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .templates #navbar .content__product__white {
        padding: 0
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .templates #navbar .content__product__white-firstColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-right: 4rem
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .templates #navbar .content__product__white-secondColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-left: 4rem
    }
}

.templates #navbar .toggle-product-arrow::after, .templates #navbar .toggle-integrations-arrow::after {
    border-bottom: 6px solid #222324 !important
}

.templates #navbar .toggle-mobile-product-button .content-mobile-list-item-text::after {
    border-bottom: 6px solid #222324 !important
}

.templates #navbar .toggle-mobile-integrations-button .content-mobile-list-item-text::after {
    border-bottom: 6px solid #222324 !important
}

.templates #navbar .navbar__list-item--border {
    border-right: .5px solid #222324 !important
}

.templates #navbar .cta-register {
    background-color: #ffc502 !important;
    transition: background-color .2s ease-in-out
}

    .templates #navbar .cta-register:hover {
        background-color: #17b54e !important
    }

.templates #navbar .navbar__header-burger-line {
    background-color: #222324
}

.templates a.link {
    display: flex;
    color: #ffc502;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    width: fit-content
}

    .templates a.link img {
        transition: all .2s ease-in-out;
        margin-left: 6px;
        width: 20px !important;
        height: 26px !important
    }

    .templates a.link:hover img {
        margin-left: .75rem
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .templates img.desktop {
        display: none
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .templates img.mobile {
        display: none
    }
}

.templates #top {
    margin: 64px 0;
    padding: 0
}

@media(min-width:768px) and (max-width:991px) {
    .templates #top {
        margin: 48px 0 96px
    }
}

@media(max-width:767px) {
    .templates #top {
        margin: 40px 0 96px
    }
}

.templates #top .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .templates #top .container h1 {
        color: #222324;
        text-align: center;
        font-size: 52px;
        font-weight: 700;
        margin-bottom: 2rem
    }

        .templates #top .container h1 span {
            color: #ffc502
        }

    .templates #top .container p {
        color: #323333;
        text-align: center;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        max-width: 630px
    }

.templates #cards .container {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 4rem
}

@media(min-width:768px) and (max-width:991px) {
    .templates #cards .container {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .templates #cards .container {
        grid-template-columns: 1fr
    }
}

.templates #cards .container .card {
    display: flex;
    flex-direction: column;
    border: none
}

    .templates #cards .container .card img.main {
        background-color: #f8fafc;
        border-radius: 24px;
        border: .2px solid #b7bbc246;
        margin-bottom: 32px
    }

    .templates #cards .container .card h2 {
        color: #222324;
        font-size: 24px;
        font-weight: 700;
        margin-bottom: 16px
    }

    .templates #cards .container .card p {
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        margin-bottom: 24px
    }

.templates .singleTemplate {
    margin-top: 4rem
}

    .templates .singleTemplate .container {
        display: grid;
        grid-template-columns: minmax(369px,369px) 1fr;
        gap: 64px
    }

@media(min-width:768px) and (max-width:991px) {
    .templates .singleTemplate .container {
        grid-template-columns: minmax(286px,286px) 1fr
    }
}

@media(max-width:767px) {
    .templates .singleTemplate .container {
        grid-template-columns: 1fr
    }
}

.templates #fixedBar {
    position: relative;
    height: 100%
}

    .templates #fixedBar .fixedBar {
        position: sticky;
        top: 128px
    }

@media(max-width:767px) {
    .templates #fixedBar .fixedBar {
        position: unset;
        top: unset
    }
}

.templates #fixedBar .fixedBar .location {
    text-transform: uppercase;
    font-size: 12px;
    display: flex;
    gap: 8px
}

    .templates #fixedBar .fixedBar .location a {
        color: #7d8086;
        font-weight: 500
    }

    .templates #fixedBar .fixedBar .location span {
        color: #7d8086;
        font-weight: 500
    }

    .templates #fixedBar .fixedBar .location p {
        color: #7d8086;
        font-weight: 700;
        margin: 0
    }

.templates #fixedBar .fixedBar .content h1 {
    color: #222324;
    font-size: 44px;
    font-weight: 700;
    line-height: 116%;
    margin: 24px 0 32px
}

    .templates #fixedBar .fixedBar .content h1 span {
        color: #ffc502
    }

.templates #fixedBar .fixedBar .content p {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    margin-bottom: 40px
}

.templates #fixedBar .fixedBar .buttons {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px
}

.templates #fixedBar .fixedBar .buttons__singleButton {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 263px;
    border-radius: 36px;
    padding: 16px 0;
    color: #222324;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    border: 1px solid #222324;
    transition: all .2s ease-in-out
}

    .templates #fixedBar .fixedBar .buttons__singleButton:hover {
        border: 1px solid #ffc502
    }

    .templates #fixedBar .fixedBar .buttons__singleButton img {
        margin-right: 8px
    }

    .templates #fixedBar .fixedBar .buttons__singleButton.app-register {
        background-color: #ffc502;
        color: #fff;
        transition: all .2s ease-in-out;
        border: none
    }

        .templates #fixedBar .fixedBar .buttons__singleButton.app-register:hover {
            background-color: #17b54e
        }

.templates #fixedBar .fixedBar .socials {
    margin-top: 64px
}

    .templates #fixedBar .fixedBar .socials span {
        color: #7d8086;
        font-size: 12px;
        font-weight: 500;
        text-transform: uppercase
    }

    .templates #fixedBar .fixedBar .socials div {
        margin-top: 12px;
        display: flex;
        gap: 18px
    }

.templates #content {
    display: flex;
    flex-direction: column;
    gap: 40px
}

    .templates #content img {
        width: 100%
    }

    .templates #content h2, .templates #content h2 strong {
        margin: 36px 0 24px;
        color: #222324;
        font-size: 36px;
        font-weight: 700
    }

    .templates #content h3 {
        margin: 32px 0 24px;
        color: #323333;
        font-weight: 700;
        font-size: 28px
    }

    .templates #content h4 {
        margin: 24px 0 20px;
        color: #323333;
        font-weight: 700;
        font-size: 22px
    }

    .templates #content p {
        margin: 12px 0;
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px
    }

    .templates #content ul, .templates #content ol {
        margin: 12px 0 12px 25px;
        padding: 0
    }

        .templates #content ul li, .templates #content ol li {
            color: #323333;
            font-size: 18px;
            font-weight: 400;
            line-height: 26px
        }

            .templates #content ul li:not(:last-of-type), .templates #content ol li:not(:last-of-type) {
                margin-bottom: 8px
            }

    .templates #content .banner {
        display: flex;
        align-items: center;
        margin: 40px 0;
        padding: 40px 48px;
        gap: 54px;
        border-radius: 24px;
        background: #f8fafc
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates #content .banner {
        padding: 36px 48px;
        gap: 40px;
        flex-direction: column
    }
}

.templates #content .banner div.text {
    display: flex;
    flex-direction: column;
    gap: 20px
}

    .templates #content .banner div.text p.strong {
        color: #222324;
        font-size: 28px;
        font-weight: 700;
        line-height: 36px;
        margin: 0
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates #content .banner div.text p.strong {
        text-align: center
    }
}

.templates #content .banner div.text p.strong span {
    color: #2d80eb;
    font-weight: 800
}

.templates #content .banner div.text div.checks {
    display: flex;
    gap: 20px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates #content .banner div.text div.checks {
        margin-left: auto;
        margin-right: auto;
        width: 175px;
        flex-direction: column;
        gap: 10px
    }
}

.templates #content .banner div.text div.checks__single-check {
    display: flex;
    align-items: center;
    gap: 6px
}

    .templates #content .banner div.text div.checks__single-check img {
        width: 21px
    }

    .templates #content .banner div.text div.checks__single-check p {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: left;
        margin: 0
    }

.templates #content .banner a {
    min-width: 165px;
    padding: 16px 36px;
    border-radius: 36px;
    background: #ffc502;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    transition: background-color .2s ease-in-out
}

    .templates #content .banner a:hover {
        background-color: #17b54e
    }

.templates #content a.link {
    margin-top: .7rem;
    margin-bottom: 1rem
}

.templates #otherTemplates {
    margin-top: 164px;
    margin-bottom: 3rem;
    width: 100vw;
    overflow: hidden
}

    .templates #otherTemplates .container {
        display: flex;
        flex-direction: column;
        overflow: visible
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates #otherTemplates .container {
        overflow: unset
    }
}

@media(min-width:2000px) {
    .templates #otherTemplates .container {
        overflow: hidden
    }
}

.templates #otherTemplates .container span {
    color: #1f1f1f;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 40px
}

.templates #otherTemplates .container .cards {
    display: flex;
    gap: 4rem;
    transition: all .3s ease-in-out
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates #otherTemplates .container .cards {
        overflow: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates #otherTemplates .container .cards::-webkit-scrollbar {
        display: none
    }
}

.templates #otherTemplates .container .cards .card {
    flex: 0 0 374px;
    flex-direction: column;
    border: none
}

@media(max-width:767px) {
    .templates #otherTemplates .container .cards .card {
        flex: 0 0 276px
    }
}

.templates #otherTemplates .container .cards .card img.main {
    background-color: #f8fafc;
    border-radius: 24px;
    border: .2px solid #b7bbc246;
    margin-bottom: 32px
}

.templates #otherTemplates .container .cards .card h2 {
    color: #222324;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 16px
}

.templates #otherTemplates .container .cards .card p {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    margin-bottom: 24px
}

.templates #otherTemplates .container .buttons {
    margin-top: 40px;
    display: flex;
    gap: 16px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates #otherTemplates .container .buttons {
        display: none
    }
}

.templates #otherTemplates .container .buttons_button {
    background-color: transparent;
    border: none;
    outline: none;
    opacity: 1;
    transition: all .2s ease-in-out
}

    .templates #otherTemplates .container .buttons_button:disabled {
        opacity: .3
    }

    .templates #otherTemplates .container .buttons_button.before {
        transform: rotateY(180deg)
    }

.templates__planner * {
    font-family: lato,sans-serif
}

.templates__planner .cta-register {
    padding: 15px 24px !important;
    background: linear-gradient(111deg,#2d80eb 36.16%,#2466bc 88.93%) !important;
    box-shadow: 2px 4px 32px 0 rgba(36,102,188,.64) !important;
    color: #fff !important;
    font-weight: 600 !important;
    border-radius: 32px !important;
    transition: all .2s ease-in-out !important
}

.templates__planner a.link {
    display: flex;
    color: #2d80eb;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    width: fit-content
}

    .templates__planner a.link img {
        transition: all .2s ease-in-out;
        margin-left: 6px;
        width: 20px !important;
        height: 26px !important
    }

    .templates__planner a.link:hover img {
        margin-left: .75rem
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .templates__planner img.desktop {
        display: none
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .templates__planner img.mobile {
        display: none
    }
}

.templates__planner #top {
    margin: 64px 0;
    padding: 0
}

@media(min-width:768px) and (max-width:991px) {
    .templates__planner #top {
        margin: 48px 0 96px
    }
}

@media(max-width:767px) {
    .templates__planner #top {
        margin: 40px 0 96px
    }
}

.templates__planner #top .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .templates__planner #top .container h1 {
        color: #222324;
        text-align: center;
        font-size: 52px;
        font-weight: 700;
        margin-bottom: 2rem
    }

        .templates__planner #top .container h1 span {
            color: #2d80eb
        }

    .templates__planner #top .container p {
        color: #323333;
        text-align: center;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        max-width: 630px
    }

.templates__planner #cards .container {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 4rem
}

@media(min-width:768px) and (max-width:991px) {
    .templates__planner #cards .container {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .templates__planner #cards .container {
        grid-template-columns: 1fr
    }
}

.templates__planner #cards .container .card {
    display: flex;
    flex-direction: column;
    border: none
}

    .templates__planner #cards .container .card img.main {
        background-color: #ddeafb;
        border-radius: 24px;
        border: .2px solid #b7bbc246;
        margin-bottom: 32px
    }

    .templates__planner #cards .container .card h2 {
        color: #222324;
        font-size: 24px;
        font-weight: 700;
        margin-bottom: 16px
    }

    .templates__planner #cards .container .card p {
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        margin-bottom: 24px
    }

.templates__planner .singleTemplate {
    margin-top: 4rem
}

    .templates__planner .singleTemplate .container {
        display: grid;
        grid-template-columns: minmax(369px,369px) 1fr;
        gap: 64px
    }

@media(min-width:768px) and (max-width:991px) {
    .templates__planner .singleTemplate .container {
        grid-template-columns: minmax(286px,286px) 1fr
    }
}

@media(max-width:767px) {
    .templates__planner .singleTemplate .container {
        grid-template-columns: 1fr
    }
}

.templates__planner #fixedBar {
    position: relative;
    height: 100%
}

    .templates__planner #fixedBar .fixedBar {
        position: sticky;
        top: 128px
    }

@media(max-width:767px) {
    .templates__planner #fixedBar .fixedBar {
        position: unset;
        top: unset
    }
}

.templates__planner #fixedBar .fixedBar .location {
    text-transform: uppercase;
    font-size: 12px;
    display: flex;
    gap: 8px
}

    .templates__planner #fixedBar .fixedBar .location a {
        color: #7d8086;
        font-weight: 500
    }

    .templates__planner #fixedBar .fixedBar .location span {
        color: #7d8086;
        font-weight: 500
    }

    .templates__planner #fixedBar .fixedBar .location p {
        color: #7d8086;
        font-weight: 700;
        margin: 0
    }

.templates__planner #fixedBar .fixedBar .content h1 {
    color: #222324;
    font-size: 44px;
    font-weight: 700;
    line-height: 116%;
    margin: 24px 0 32px
}

    .templates__planner #fixedBar .fixedBar .content h1 span {
        color: #2d80eb
    }

.templates__planner #fixedBar .fixedBar .content p {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    margin-bottom: 40px
}

.templates__planner #fixedBar .fixedBar .buttons {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px
}

.templates__planner #fixedBar .fixedBar .buttons__singleButton {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 263px;
    border-radius: 36px;
    padding: 16px 0;
    color: #222324;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    background-color: #deebfc;
    transition: all .2s ease-in-out
}

    .templates__planner #fixedBar .fixedBar .buttons__singleButton:hover {
        background: #c0d9f9
    }

    .templates__planner #fixedBar .fixedBar .buttons__singleButton img {
        margin-right: 8px
    }

    .templates__planner #fixedBar .fixedBar .buttons__singleButton.app-register {
        background: linear-gradient(111deg,#2d80eb 36.16%,#2466bc 88.93%);
        color: #fff;
        transition: all .2s ease-in-out
    }

        .templates__planner #fixedBar .fixedBar .buttons__singleButton.app-register:hover {
            background: linear-gradient(111deg,#2d80eb 10.16%,#2466bc 88.93%)
        }

.templates__planner #fixedBar .fixedBar .socials {
    margin-top: 64px
}

    .templates__planner #fixedBar .fixedBar .socials span {
        color: #7d8086;
        font-size: 12px;
        font-weight: 500;
        text-transform: uppercase
    }

    .templates__planner #fixedBar .fixedBar .socials div {
        margin-top: 12px;
        display: flex;
        gap: 18px
    }

.templates__planner #content {
    display: flex;
    flex-direction: column;
    gap: 64px
}

    .templates__planner #content img {
        width: 100%
    }

    .templates__planner #content h2, .templates__planner #content h2 strong {
        margin-top: 24px;
        margin-bottom: 32px;
        color: #222324;
        font-size: 36px;
        font-weight: 700
    }

    .templates__planner #content p, .templates__planner #content h3 {
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        padding: 12px 0;
        margin-bottom: 0
    }

    .templates__planner #content h3 {
        font-weight: 700
    }

    .templates__planner #content ul, .templates__planner #content ol {
        padding: 12px 0 12px 25px;
        margin-bottom: 0
    }

        .templates__planner #content ul li, .templates__planner #content ol li {
            color: #323333;
            font-size: 18px;
            font-weight: 400;
            line-height: 26px
        }

            .templates__planner #content ul li:not(:last-of-type), .templates__planner #content ol li:not(:last-of-type) {
                margin-bottom: 8px
            }

    .templates__planner #content .banner {
        display: flex;
        align-items: center;
        margin: 40px 0;
        padding: 40px 48px;
        gap: 54px;
        border-radius: 24px;
        background: #f8fafc
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates__planner #content .banner {
        padding: 36px 48px;
        gap: 40px;
        flex-direction: column
    }
}

.templates__planner #content .banner p.text {
    color: #222324;
    font-size: 28px;
    font-weight: 700;
    line-height: 36px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates__planner #content .banner p.text {
        text-align: center
    }
}

.templates__planner #content .banner p.text span {
    color: #2d80eb;
    font-weight: 800
}

.templates__planner #content .banner a {
    min-width: 165px;
    padding: 16px 36px;
    border-radius: 36px;
    background: linear-gradient(111deg,#2d80eb 36.16%,#2466bc 88.93%);
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    transition: background-color .2s ease-in-out
}

.templates__planner #content a.link {
    margin-top: .7rem;
    margin-bottom: 1rem
}

.templates__planner #otherTemplates {
    margin-top: 164px;
    margin-bottom: 3rem;
    width: 100vw;
    overflow: hidden
}

    .templates__planner #otherTemplates .container {
        display: flex;
        flex-direction: column;
        overflow: visible
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates__planner #otherTemplates .container {
        overflow: unset
    }
}

@media(min-width:2000px) {
    .templates__planner #otherTemplates .container {
        overflow: hidden
    }
}

.templates__planner #otherTemplates .container span {
    color: #1f1f1f;
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 40px
}

.templates__planner #otherTemplates .container .cards {
    display: flex;
    gap: 4rem;
    transition: all .3s ease-in-out
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates__planner #otherTemplates .container .cards {
        overflow: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates__planner #otherTemplates .container .cards::-webkit-scrollbar {
        display: none
    }
}

.templates__planner #otherTemplates .container .cards .card {
    flex: 0 0 374px;
    flex-direction: column;
    border: none
}

@media(max-width:767px) {
    .templates__planner #otherTemplates .container .cards .card {
        flex: 0 0 276px
    }
}

.templates__planner #otherTemplates .container .cards .card img.main {
    background-color: #ddeafb;
    border-radius: 24px;
    border: .2px solid #b7bbc246;
    margin-bottom: 32px
}

.templates__planner #otherTemplates .container .cards .card h2 {
    color: #222324;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 16px
}

.templates__planner #otherTemplates .container .cards .card p {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    margin-bottom: 24px
}

.templates__planner #otherTemplates .container .buttons {
    margin-top: 40px;
    display: flex;
    gap: 16px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .templates__planner #otherTemplates .container .buttons {
        display: none
    }
}

.templates__planner #otherTemplates .container .buttons_button {
    background-color: transparent;
    border: none;
    outline: none;
    opacity: 1;
    transition: all .2s ease-in-out
}

    .templates__planner #otherTemplates .container .buttons_button:disabled {
        opacity: .3
    }

    .templates__planner #otherTemplates .container .buttons_button.before {
        transform: rotateY(180deg)
    }

.state-labor-laws * {
    font-family: sans-serif,sans-serif
}

.state-labor-laws #top {
    padding: 8rem 0 80px
}

@media(min-width:768px) and (max-width:991px) {
    .state-labor-laws #top {
        padding: 3rem 0 80px
    }
}

.state-labor-laws #top .container {
    display: flex
}

@media(min-width:768px) and (max-width:991px) {
    .state-labor-laws #top .container {
        gap: 96px;
        flex-direction: column
    }
}

@media(max-width:767px) {
    .state-labor-laws #top .container {
        gap: 64px;
        flex-direction: column
    }
}

.state-labor-laws #top .container .content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 522px
}

@media(max-width:767px) {
    .state-labor-laws #top .container .content {
        min-width: 100%
    }
}

.state-labor-laws #top .container .content .label {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 22px;
    font-size: 18px;
    border-radius: 8px;
    padding: 12px 36px 13px;
    background-color: #f2fcf6;
    color: #ffc502
}

.state-labor-laws #top .container .content .breadcrumbs {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    gap: 8.8px
}

    .state-labor-laws #top .container .content .breadcrumbs a {
        color: #7d8086;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 500;
        text-transform: uppercase;
        transition: all .2s ease-in-out
    }

        .state-labor-laws #top .container .content .breadcrumbs a:hover {
            color: #4f5052
        }

    .state-labor-laws #top .container .content .breadcrumbs p {
        color: #7d8086;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 700;
        line-height: normal;
        text-transform: uppercase;
        margin: 0 !important
    }

.state-labor-laws #top .container .content h1 {
    padding: 0;
    color: #222324;
    font-size: 52px;
    font-weight: 700;
    line-height: 116%;
    margin: 0
}

    .state-labor-laws #top .container .content h1 span {
        color: #ffc502
    }

.state-labor-laws #top .container .content h3 {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    max-width: 522px;
    margin-top: 32px
}

.state-labor-laws #top .container .img {
    margin-left: 5%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .state-labor-laws #top .container .img {
        margin-left: unset
    }
}

.state-labor-laws #top .container .img img {
    width: 100%
}

.state-labor-laws #simpleTableOfContent .container ul {
    display: grid;
    row-gap: 20px;
    grid-template-columns: repeat(3,1fr);
    padding: 0;
    margin-bottom: 10rem
}

@media(max-width:767px) {
    .state-labor-laws #simpleTableOfContent .container ul {
        grid-template-columns: repeat(2,1fr)
    }
}

.state-labor-laws #simpleTableOfContent .container ul li {
    list-style: none;
    max-width: 85%
}

    .state-labor-laws #simpleTableOfContent .container ul li a {
        color: #323333;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px
    }

        .state-labor-laws #simpleTableOfContent .container ul li a:hover {
            font-weight: 700;
            color: var(--green-500,#ffc502)
        }

.state-labor-laws #content {
    margin-bottom: 15rem
}

    .state-labor-laws #content .container {
        display: grid;
        grid-template-columns: 1fr 320px;
        gap: 120px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .state-labor-laws #content .container {
        grid-template-columns: 1fr
    }
}

.state-labor-laws #content .container .banner {
    padding-left: 35px;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    gap: 32px
}

    .state-labor-laws #content .container .banner span {
        display: flex;
        padding: 12px 32px 13px;
        border-radius: 8px;
        background-color: #f2fcf6;
        color: #ffc502;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px
    }

        .state-labor-laws #content .container .banner span img {
            margin-right: 16px
        }

    .state-labor-laws #content .container .banner p {
        color: #222324;
        font-size: 24px;
        font-weight: 400;
        line-height: 33px;
        margin: 0
    }

    .state-labor-laws #content .container .banner a {
        padding: 16px 36px 17px;
        background-color: #ffc502;
        color: #fff;
        border-radius: 36px;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px;
        transition: all .2s ease-in-out
    }

        .state-labor-laws #content .container .banner a:hover {
            background-color: #17b54e
        }

.state-labor-laws #content .container .content {
    padding-top: 40px;
    border-top: 2px solid #b7bbc2;
    display: flex;
    flex-direction: column;
    gap: 32px
}

    .state-labor-laws #content .container .content tbody th, .state-labor-laws #content .container .content tbody td {
        border: 1px solid #000
    }

    .state-labor-laws #content .container .content tbody tr:first-of-type, .state-labor-laws #content .container .content tbody tr:first-of-type th {
        text-align: center
    }

    .state-labor-laws #content .container .content tbody tr:not(:first-of-type) td {
        padding: .2rem .5rem
    }

    .state-labor-laws #content .container .content h2 {
        color: #222324;
        font-size: 36px;
        font-weight: 700;
        line-height: 116%
    }

        .state-labor-laws #content .container .content h2:not(:first-of-type) {
            margin-top: 32px
        }

    .state-labor-laws #content .container .content p, .state-labor-laws #content .container .content li {
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        margin: 0
    }

    .state-labor-laws #content .container .content ul {
        display: flex;
        flex-direction: column;
        gap: 10px
    }

.state-labor-laws #content .container .sticky-banner {
    position: relative
}

    .state-labor-laws #content .container .sticky-banner .banner {
        position: sticky;
        top: 10rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .state-labor-laws #content .container .sticky-banner {
        display: none
    }
}

.state-labor-laws #related-posts {
    border-top: 2px solid #b7bbc2;
    padding-top: 40px;
    margin-top: 40px
}

    .state-labor-laws #related-posts ul {
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 20px;
        list-style: none;
        width: fit-content
    }

        .state-labor-laws #related-posts ul span {
            color: var(--grey-dark-900,#222324);
            font-size: 18px;
            font-style: normal;
            font-weight: 600;
            line-height: 26px
        }

        .state-labor-laws #related-posts ul li {
            display: flex;
            gap: 6px
        }

            .state-labor-laws #related-posts ul li a {
                color: var(--grey-dark-900,#222324);
                font-size: 18px;
                font-style: normal;
                font-weight: 400;
                line-height: 26px;
                text-decoration-line: underline;
                transition: all .2s ease-in-out
            }

                .state-labor-laws #related-posts ul li a:hover {
                    color: var(--green-500,#ffc502)
                }

.integration_articles * {
    font-family: sans-serif,sans-serif
}

.integration_articles .navbar {
    background-color: #fff !important;
    transition: box-shadow .3s ease-in-out
}

.integration_articles #navbar .content-mobile-list {
    background-color: #fff !important
}

.integration_articles .content-mobile-list-item-text {
    color: #222324 !important
}

.integration_articles .navbar__link {
    color: #222324 !important
}

.integration_articles #navbar .gradient-background {
    border-top: 1px solid #dbdbdb
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .integration_articles #navbar .content__product__white {
        padding: 0
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .integration_articles #navbar .content__product__white-firstColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-right: 4rem
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .integration_articles #navbar .content__product__white-secondColumn {
        padding-top: 3rem;
        padding-bottom: 3rem;
        padding-left: 4rem
    }
}

.integration_articles #navbar .toggle-product-arrow::after, .integration_articles #navbar .toggle-integrations-arrow::after {
    border-bottom: 6px solid #222324 !important
}

.integration_articles #navbar .toggle-mobile-product-button .content-mobile-list-item-text::after {
    border-bottom: 6px solid #222324 !important
}

.integration_articles #navbar .toggle-mobile-integrations-button .content-mobile-list-item-text::after {
    border-bottom: 6px solid #222324 !important
}

.integration_articles #navbar .navbar__list-item--border {
    border-right: .5px solid #222324 !important
}

.integration_articles #navbar .cta-register {
    background-color: #ffc502 !important;
    transition: background-color .2s ease-in-out
}

    .integration_articles #navbar .cta-register:hover {
        background-color: #17b54e !important
    }

.integration_articles #navbar .navbar__header-burger-line {
    background-color: #222324
}

.integration_articles .border-line {
    display: none
}

.integration_articles #footer .footer-bottom {
    margin-top: 64px
}

.integration_articles .cta-register {
    padding: 15px 40px;
    color: #fff;
    font-weight: 600;
    border-radius: 26px;
    background-color: #ffc502 !important;
    transition: background-color .2s ease-in-out
}

    .integration_articles .cta-register:hover {
        background-color: #17b54e !important
    }

.integration_articles #top {
    padding: 64px 0
}

@media(max-width:767px) {
    .integration_articles #top {
        padding: 40px 0 64px
    }
}

.integration_articles #top .container {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 120px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .integration_articles #top .container {
        grid-template-columns: 1fr;
        gap: 25px
    }
}

.integration_articles #top .container .content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 522px
}

@media(max-width:767px) {
    .integration_articles #top .container .content {
        min-width: 100%
    }
}

.integration_articles #top .container .content .label {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 22px;
    font-size: 18px;
    border-radius: 8px;
    padding: 12px 36px 13px;
    background-color: #f2fcf6;
    color: #ffc502
}

.integration_articles #top .container .content .breadcrumbs {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    gap: 8.8px
}

    .integration_articles #top .container .content .breadcrumbs a {
        color: #7d8086;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 500;
        text-transform: uppercase;
        transition: all .2s ease-in-out
    }

        .integration_articles #top .container .content .breadcrumbs a:hover {
            color: #4f5052
        }

    .integration_articles #top .container .content .breadcrumbs p {
        color: #7d8086;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 700;
        line-height: normal;
        text-transform: uppercase;
        margin: 0 !important
    }

.integration_articles #top .container .content h1 {
    margin: 0;
    padding: 0;
    font-size: 52px;
    font-weight: 700;
    line-height: 60.32px;
    text-align: left
}

    .integration_articles #top .container .content h1 span {
        color: #ffc502
    }

.integration_articles #top .container .content h3 {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    max-width: 522px;
    margin-top: 32px
}

.integration_articles #top .container .content img {
    width: 100%;
    margin-top: 40px
}

.integration_articles #top .container .img {
    margin-left: 5%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .integration_articles #top .container .img {
        margin-left: unset
    }
}

.integration_articles #top .container .img img {
    width: 100%
}

.integration_articles #content .container {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 120px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .integration_articles #content .container {
        grid-template-columns: 1fr
    }
}

.integration_articles #content .container .banner {
    padding-left: 35px;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    gap: 32px
}

@media(max-width:767px) {
    .integration_articles #content .container .banner {
        border-left: 2px solid #b7bbc2
    }
}

.integration_articles #content .container .banner span {
    display: flex;
    padding: 12px 32px 13px;
    border-radius: 8px;
    background-color: #f2fcf6;
    color: #ffc502;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px
}

    .integration_articles #content .container .banner span img {
        margin-right: 16px;
        width: 24px
    }

.integration_articles #content .container .banner p {
    color: #222324;
    font-size: 24px;
    font-weight: 400;
    line-height: 33px;
    margin: 0
}

.integration_articles #content .container .banner a {
    padding: 16px 36px 17px;
    background-color: #ffc502;
    color: #fff;
    border-radius: 36px;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    transition: all .2s ease-in-out
}

    .integration_articles #content .container .banner a:hover {
        background-color: #17b54e
    }

.integration_articles #content .container .content {
    display: flex;
    flex-direction: column;
    gap: 32px
}

    .integration_articles #content .container .content img {
        width: 100%
    }

    .integration_articles #content .container .content h2 {
        color: #222324;
        font-size: 36px;
        font-weight: 700;
        line-height: 116%
    }

        .integration_articles #content .container .content h2:not(:first-of-type) {
            margin-top: 32px
        }

    .integration_articles #content .container .content p, .integration_articles #content .container .content li {
        color: #323333;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        margin: 0
    }

    .integration_articles #content .container .content ul {
        display: flex;
        flex-direction: column;
        gap: 10px
    }

.integration_articles #content .container .sticky-banner {
    position: relative
}

    .integration_articles #content .container .sticky-banner .banner {
        position: sticky;
        top: 10rem
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .integration_articles #content .container .sticky-banner {
        display: none
    }
}

.integration_articles #other-articles {
    margin: 164px 0
}

@media(min-width:768px) and (max-width:991px) {
    .integration_articles #other-articles {
        margin: 140px 0
    }
}

@media(max-width:767px) {
    .integration_articles #other-articles {
        margin: 120px 0
    }
}

.integration_articles #other-articles .container {
    display: flex;
    flex-direction: column;
    gap: 40px
}

    .integration_articles #other-articles .container h2 {
        color: var(--light-gray-900,#1f1f1f);
        font-size: 36px;
        font-style: normal;
        font-weight: 700;
        line-height: normal
    }

@media(max-width:767px) {
    .integration_articles #other-articles .container h2 {
        font-size: 28px
    }
}

.integration_articles #other-articles .container .cards {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: auto
}

@media(min-width:768px) and (max-width:991px) {
    .integration_articles #other-articles .container .cards {
        grid-template-columns: repeat(2,1fr);
        gap: 40px 20px
    }
}

@media(max-width:767px) {
    .integration_articles #other-articles .container .cards {
        grid-template-columns: 1fr;
        gap: 40px
    }
}

.integration_articles #other-articles .container .cards__card {
    padding: 16px 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    border-left: 2px solid #b7bbc2
}

    .integration_articles #other-articles .container .cards__card:hover {
        border-left: 2px solid #ffc502
    }

    .integration_articles #other-articles .container .cards__card img {
        padding: 12px;
        border-radius: 8px;
        background: #f2fcf6;
        width: 48px;
        height: 48px
    }

    .integration_articles #other-articles .container .cards__card a {
        color: #1b1b20;
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        transition: all .2s ease-in-out
    }

        .integration_articles #other-articles .container .cards__card a:hover {
            color: #56565e
        }

.calculators * {
    font-family: sans-serif,sans-serif
}

@media print {
    .calculators body {
        display: none
    }

    .calculators input {
        width: 50px
    }

    .calculators #printButton {
        display: none
    }

    .calculators #printableArea {
        display: block
    }
}

.calculators #top.half-width .container {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 25px
}

@media(min-width:768px) and (max-width:991px) {
    .calculators #top.half-width .container {
        grid-template-columns: 1fr;
        gap: 96px
    }
}

@media(max-width:767px) {
    .calculators #top.half-width .container {
        grid-template-columns: 1fr;
        gap: 80px
    }
}

.calculators #top.half-width .container .content {
    max-width: 522px;
    margin-top: 40px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .calculators #top.half-width .container .content {
        margin: 40px auto 0;
        text-align: center;
        max-width: unset
    }
}

.calculators #top.half-width .container .content h2, .calculators #top.half-width .container .content h1 {
    color: #222324;
    font-size: 64px;
    font-weight: 700;
    line-height: 74px;
    letter-spacing: 0;
    margin-bottom: 2rem
}

@media(max-width:767px) {
    .calculators #top.half-width .container .content h2, .calculators #top.half-width .container .content h1 {
        font-size: 44px;
        line-height: normal
    }
}

.calculators #top.half-width .container .content h2 span, .calculators #top.half-width .container .content h1 span {
    color: #ffc502
}

.calculators #top.half-width .container .content p {
    font-size: 24px;
    font-weight: 400;
    line-height: 29px;
    letter-spacing: 0
}

@media(max-width:767px) {
    .calculators #top.half-width .container .content p {
        font-size: 18px
    }
}

.calculators #top.half-width .container .box-shadow {
    position: relative;
    width: 100%
}

    .calculators #top.half-width .container .box-shadow .calculator-box {
        width: 100%;
        height: 100%;
        border-radius: 24px;
        padding: 48px;
        box-shadow: 0 8px 32px 0 #7d808633;
        background: #fff;
        display: flex;
        flex-direction: column;
        max-width: 542px
    }

        .calculators #top.half-width .container .box-shadow .calculator-box::before {
            content: "";
            position: absolute;
            width: 542px;
            height: 100%;
            background-color: #f2fcf6;
            border-radius: 24px;
            top: 3rem;
            right: 0;
            z-index: -1
        }

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator-box {
        padding: 48px 20px
    }

        .calculators #top.half-width .container .box-shadow .calculator-box::before {
            display: none
        }
}

.calculators #top.half-width .container .box-shadow .calculator-box label {
    margin-bottom: 2px
}

.calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator {
    display: flex;
    flex-direction: column;
    gap: 1.5rem
}

    .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator #am_pm_start, .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator #am_pm_end {
        margin-top: 1rem
    }

    .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator select {
        border-radius: 10px;
        padding: 15px;
        border: none;
        outline: none;
        background-color: #efefef;
        border-right: 16px solid transparent;
        width: 100%
    }

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator select {
        padding: 15px 20px
    }
}

.calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator .hours {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px
}

    .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator .hours span {
        font-size: 20px
    }

    .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator .hours input {
        border-radius: 10px;
        padding: 15px;
        border: none;
        outline: none;
        background-color: #efefef;
        width: 100%
    }

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator .hours input {
        padding: 15px 20px
    }
}

.calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator .hours input::-webkit-outer-spin-button, .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator .hours input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator .hours input[type=number] {
    -moz-appearance: textfield
}

.calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator .buttons {
    margin-top: 1rem;
    display: flex;
    gap: 1rem
}

.calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator #wynik {
    font-size: 18px;
    color: #1b1b20
}

    .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator #wynik strong {
        font-weight: 600
    }

    .calculators #top.half-width .container .box-shadow .calculator-box.time-duration-calculator #wynik p {
        margin: 0
    }

.calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #swap {
    margin-top: 1.5rem
}

.calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator {
    display: flex;
    flex-direction: column
}

    .calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator span {
        font-size: 20px
    }

    .calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator input {
        border-radius: 10px;
        padding: 15px;
        border: none;
        outline: none;
        background-color: #efefef;
        width: 100%
    }

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator input {
        padding: 15px 20px
    }
}

.calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator input::-webkit-outer-spin-button, .calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator input[type=number] {
    -moz-appearance: textfield
}

.calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator #equals {
    font-size: 38px;
    font-weight: 600;
    margin: 0 auto
}

.calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator div.decimal-hours {
    display: flex;
    flex-direction: column
}

.calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator div.normal-hours {
    display: flex;
    flex-direction: column;
    gap: .8rem
}

    .calculators #top.half-width .container .box-shadow .calculator-box.decimal-hours-calculator #decimalCalculator div.normal-hours div {
        display: flex;
        flex-direction: column
    }

.calculators #top.half-width .container .box-shadow .calculator-box.markup-calculator {
    display: flex;
    flex-direction: column;
    gap: .8rem
}

    .calculators #top.half-width .container .box-shadow .calculator-box.markup-calculator div {
        display: flex;
        flex-direction: column
    }

    .calculators #top.half-width .container .box-shadow .calculator-box.markup-calculator button {
        margin-top: 1rem
    }

    .calculators #top.half-width .container .box-shadow .calculator-box.markup-calculator input {
        border-radius: 10px;
        padding: 15px;
        border: none;
        outline: none;
        background-color: #efefef;
        width: 100%
    }

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator-box.markup-calculator input {
        padding: 15px 20px
    }
}

.calculators #top.half-width .container .box-shadow .calculator-box.markup-calculator input::-webkit-outer-spin-button, .calculators #top.half-width .container .box-shadow .calculator-box.markup-calculator input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.calculators #top.half-width .container .box-shadow .calculator-box.markup-calculator input[type=number] {
    -moz-appearance: textfield
}

.calculators #top.half-width .container .box-shadow .calculator-box.military-converter #standardTimeResultLabel, .calculators #top.half-width .container .box-shadow .calculator-box.military-converter #militaryTimeResultLabel {
    margin-top: 1rem
}

.calculators #top.half-width .container .box-shadow .calculator-box.military-converter #militaryTimeError, .calculators #top.half-width .container .box-shadow .calculator-box.military-converter #standardTimeError {
    margin: 1rem 0 0;
    padding: .5rem 2rem;
    display: block;
    background-color: #f26565;
    border-radius: 13px;
    color: #fff;
    font-weight: 700;
    width: fit-content
}

.calculators #top.half-width .container .box-shadow .calculator-box.military-converter .buttons {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    width: 100%;
    gap: 2rem
}

    .calculators #top.half-width .container .box-shadow .calculator-box.military-converter .buttons button {
        width: 100%
    }

.calculators #top.half-width .container .box-shadow .calculator-box.military-converter div#standardToMilitary, .calculators #top.half-width .container .box-shadow .calculator-box.military-converter div#militaryToStandard {
    display: flex;
    flex-direction: column
}

    .calculators #top.half-width .container .box-shadow .calculator-box.military-converter div#standardToMilitary div {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: .5rem
    }

.calculators #top.half-width .container .box-shadow .calculator-box.military-converter select {
    border-radius: 10px;
    padding: 15px;
    border: none;
    outline: none;
    background-color: #efefef;
    border-right: 16px solid transparent
}

.calculators #top.half-width .container .box-shadow .calculator-box.military-converter input {
    border-radius: 10px;
    padding: 15px;
    border: none;
    outline: none;
    background-color: #efefef;
    width: 100%
}

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator-box.military-converter input {
        padding: 15px 20px
    }
}

.calculators #top.half-width .container .box-shadow .calculator-box.military-converter input::-webkit-outer-spin-button, .calculators #top.half-width .container .box-shadow .calculator-box.military-converter input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.calculators #top.half-width .container .box-shadow .calculator-box.military-converter input[type=number] {
    -moz-appearance: textfield
}

.calculators #top.half-width .container .box-shadow .calculator {
    width: 100%;
    height: 100%;
    border-radius: 24px;
    padding: 48px;
    box-shadow: 0 8px 32px 0 #7d808633;
    background: #fff;
    display: flex;
    flex-direction: column;
    max-width: 542px
}

    .calculators #top.half-width .container .box-shadow .calculator::before {
        content: "";
        position: absolute;
        width: 542px;
        height: 100%;
        background-color: #f2fcf6;
        border-radius: 24px;
        top: 3rem;
        right: 0;
        z-index: -1
    }

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator {
        padding: 48px 20px
    }

        .calculators #top.half-width .container .box-shadow .calculator::before {
            display: none
        }
}

.calculators #top.half-width .container .box-shadow .calculator label {
    padding: 33px 24px;
    display: flex;
    align-items: center;
    margin: 0
}

    .calculators #top.half-width .container .box-shadow .calculator label:first-of-type {
        padding: 0 24px 33px
    }

    .calculators #top.half-width .container .box-shadow .calculator label:last-of-type {
        padding: 33px 24px 0
    }

    .calculators #top.half-width .container .box-shadow .calculator label:not(:first-of-type) {
        border-top: 1px solid #e9ebed
    }

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator label {
        padding: 33px 16px
    }

        .calculators #top.half-width .container .box-shadow .calculator label:first-of-type {
            padding: 0 16px 33px
        }

        .calculators #top.half-width .container .box-shadow .calculator label:last-of-type {
            padding: 33px 16px 0
        }
}

.calculators #top.half-width .container .box-shadow .calculator label span {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px
}

    .calculators #top.half-width .container .box-shadow .calculator label span.text-content {
        max-width: 150px;
        margin-left: 12px
    }

    .calculators #top.half-width .container .box-shadow .calculator label span.slash-element {
        margin-left: .5rem
    }

.calculators #top.half-width .container .box-shadow .calculator label input {
    margin-left: auto;
    text-align: left;
    max-width: 150px;
    border: none;
    outline: none;
    background-color: transparent;
    color: #64666b;
    font-size: 18px;
    font-weight: 400
}

@media(max-width:767px) {
    .calculators #top.half-width .container .box-shadow .calculator label input {
        max-width: 100px
    }
}

.calculators #top.half-width .container .box-shadow .calculator label input.text-align-right {
    text-align: right
}

.calculators #top.half-width .container .box-shadow .calculator label input::-webkit-outer-spin-button, .calculators #top.half-width .container .box-shadow .calculator label input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.calculators #top.half-width .container .box-shadow .calculator label input[type=number] {
    -moz-appearance: textfield
}

.calculators #top.half-width .container .box-shadow .calculator button {
    margin: 48px auto 0;
    transition: all .2s ease-in-out
}

.calculators #top.content-with-calculator .container {
    display: flex;
    align-items: center;
    justify-content: center
}

    .calculators #top.content-with-calculator .container .content {
        max-width: 846px;
        text-align: center
    }

    .calculators #top.content-with-calculator .container h2, .calculators #top.content-with-calculator .container h1 {
        color: #222324;
        font-size: 64px;
        font-weight: 700;
        line-height: 74px;
        letter-spacing: 0;
        margin-bottom: 2rem;
        text-align: center
    }

@media(max-width:767px) {
    .calculators #top.content-with-calculator .container h2, .calculators #top.content-with-calculator .container h1 {
        font-size: 44px;
        line-height: normal
    }
}

.calculators #top.content-with-calculator .container h2 span, .calculators #top.content-with-calculator .container h1 span {
    color: #ffc502
}

.calculators #top.content-with-calculator .container p {
    font-size: 20px;
    font-weight: 400;
    line-height: 29px;
    letter-spacing: 0;
    text-align: center
}

@media(max-width:767px) {
    .calculators #top.content-with-calculator .container p {
        font-size: 18px
    }
}

.calculators section#calculator {
    padding-bottom: 80px
}

@media(max-width:767px) {
    .calculators section#calculator {
        padding-bottom: 40px
    }
}

.calculators section#calculator .container #todoApp {
    max-width: 1100px;
    box-shadow: 0 8px 32px 0 #7d808633;
    padding: 32px 32px 72px;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: auto
}

@media(max-width:767px) {
    .calculators section#calculator .container #todoApp {
        padding: 1rem .5rem 2rem
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .calculators section#calculator .container #todoApp {
        max-width: unset
    }
}

.calculators section#calculator .container #todoApp .todoListHeaders {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    text-align: center;
    padding-bottom: 1rem;
    border-bottom: 1px solid #7d808633
}

    .calculators section#calculator .container #todoApp .todoListHeaders span {
        font-size: 16px;
        font-weight: 500;
        line-height: 19px
    }

.calculators section#calculator .container #todoApp #todoList {
    margin: 0;
    padding: 3rem 0;
    display: flex;
    flex-direction: column;
    gap: 2rem
}

    .calculators section#calculator .container #todoApp #todoList li {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        text-align: center;
        align-items: center
    }

        .calculators section#calculator .container #todoApp #todoList li p {
            font-size: 16px;
            font-weight: 500
        }

        .calculators section#calculator .container #todoApp #todoList li div {
            display: flex;
            gap: 5px;
            align-items: center;
            justify-content: center
        }

        .calculators section#calculator .container #todoApp #todoList li .actions {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 1rem
        }

@media(max-width:767px) {
    .calculators section#calculator .container #todoApp #todoList li .actions {
        gap: 0
    }
}

.calculators section#calculator .container #todoApp #todoList li .actions .toggle-button {
    outline: none;
    border: none;
    background-color: transparent
}

    .calculators section#calculator .container #todoApp #todoList li .actions .toggle-button img {
        width: 24px;
        height: 24px
    }

.calculators section#calculator .container #todoApp #todoList li .actions .delete-button {
    outline: none;
    border: none;
    background-color: transparent;
    padding: .5rem;
    border-radius: 50px;
    transition: all .2s ease-in-out
}

    .calculators section#calculator .container #todoApp #todoList li .actions .delete-button:hover {
        background-color: #d3d3d33d
    }

.calculators section#calculator .container #todoApp .addNewTask {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px
}

@media(max-width:767px) {
    .calculators section#calculator .container #todoApp .addNewTask {
        flex-direction: column
    }
}

.calculators section#calculator .container #todoApp .addNewTask input {
    border-radius: 26px;
    padding: 15px 40px;
    border: none;
    outline: none;
    background-color: #efefef
}

@media(max-width:767px) {
    .calculators section#calculator .container #todoApp .addNewTask input {
        padding: 15px 20px
    }
}

.calculators section#calculator .container #roi {
    max-width: 1100px;
    box-shadow: 0 8px 32px 0 #7d808633;
    padding: 48px;
    border-radius: 24px;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 150px;
    color: #323333;
    margin: auto
}

@media(max-width:767px) {
    .calculators section#calculator .container #roi {
        padding: 1rem .5rem 2rem
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .calculators section#calculator .container #roi {
        max-width: unset
    }
}

.calculators section#calculator .container #roi .calculate {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px
}

    .calculators section#calculator .container #roi .calculate label {
        display: flex;
        flex-direction: column;
        gap: 8px
    }

        .calculators section#calculator .container #roi .calculate label span {
            color: #64666b
        }

        .calculators section#calculator .container #roi .calculate label input {
            border-radius: 26px;
            padding: 15px 40px;
            border: none;
            outline: none;
            background-color: #efefef
        }

            .calculators section#calculator .container #roi .calculate label input::-webkit-outer-spin-button, .calculators section#calculator .container #roi .calculate label input::-webkit-inner-spin-button {
                -webkit-appearance: none;
                margin: 0
            }

            .calculators section#calculator .container #roi .calculate label input[type=number] {
                -moz-appearance: textfield
            }

.calculators section#calculator .container #roi .results {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px
}

    .calculators section#calculator .container #roi .results input {
        border: none;
        outline: none;
        background-color: transparent;
        font-size: 32px
    }

    .calculators section#calculator .container #roi .results a {
        margin-top: 2rem
    }

.calculators section#calculator .container main#printableArea {
    border-radius: 26px;
    padding: 2rem 8rem;
    box-shadow: 0 4px 10px 2px rgba(0,0,0,.17)
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .calculators section#calculator .container main#printableArea {
        padding: 2rem;
        margin: 0 1rem
    }
}

.calculators section#calculator .container main#printableArea a.btn-filled {
    color: #fff
}

    .calculators section#calculator .container main#printableArea a.btn-filled:hover {
        cursor: pointer
    }

.calculators section#calculator .container main#printableArea #hoursWorkedText {
    font-size: 16px;
    color: #767676;
    font-weight: 700
}

.calculators section#calculator .container main#printableArea .result-row {
    justify-content: center
}

    .calculators section#calculator .container main#printableArea .result-row .cols {
        display: flex;
        align-items: center;
        margin-right: 2rem
    }

@media(max-width:767px) {
    .calculators section#calculator .container main#printableArea .result-row .cols {
        margin-bottom: 2rem;
        margin-right: 0
    }
}

@media(max-width:767px) {
    .calculators section#calculator .container main#printableArea #form .form-group {
        display: grid
    }
}

.calculators section#calculator .container main#printableArea #form .form-group .form-control {
    border: none;
    text-align: center;
    background-color: #e9e9e9;
    color: #767676;
    border-radius: 8px
}

@media(max-width:767px) {
    .calculators section#calculator .container main#printableArea .table thead tr {
        display: none
    }
}

.calculators section#calculator .container main#printableArea .table thead tr th {
    border-bottom: none;
    border-top: 1px solid #767676;
    color: #767676;
    font-weight: 400;
    text-align: center
}

@media(max-width:767px) {
    .calculators section#calculator .container main#printableArea .table thead tr th {
        border-top: none
    }
}

.calculators section#calculator .container main#printableArea .table tbody tr {
    background-color: transparent
}

@media(max-width:767px) {
    .calculators section#calculator .container main#printableArea .table tbody tr {
        display: grid;
        border-bottom: 1px solid #767676
    }
}

.calculators section#calculator .container main#printableArea .table tbody tr td {
    color: #767676;
    font-weight: 400;
    text-align: center
}

@media(max-width:767px) {
    .calculators section#calculator .container main#printableArea .table tbody tr td {
        display: flex;
        justify-content: space-between;
        border-top: 0
    }

        .calculators section#calculator .container main#printableArea .table tbody tr td:nth-of-type(1)::before {
            content: "Day"
        }

        .calculators section#calculator .container main#printableArea .table tbody tr td:nth-of-type(2)::before {
            content: "Date"
        }

        .calculators section#calculator .container main#printableArea .table tbody tr td:nth-of-type(3)::before {
            content: "Start Time"
        }

        .calculators section#calculator .container main#printableArea .table tbody tr td:nth-of-type(4)::before {
            content: "Finish Time"
        }

        .calculators section#calculator .container main#printableArea .table tbody tr td:nth-of-type(5)::before {
            content: "Break"
        }

        .calculators section#calculator .container main#printableArea .table tbody tr td:nth-of-type(6)::before {
            content: "Hours Worked"
        }
}

.calculators section#calculator .container main#printableArea .table tbody tr td input, .calculators section#calculator .container main#printableArea .table tbody tr td select {
    border: none;
    text-align: center;
    background-color: #e9e9e9;
    color: #767676;
    border-radius: 8px
}

@media(max-width:767px) {
    .calculators section#calculator .container main#printableArea .table tbody tr td input, .calculators section#calculator .container main#printableArea .table tbody tr td select {
        width: 60%
    }
}

@media(min-width:768px) and (max-width:991px) {
    .calculators section#calculator .container main#printableArea .table tbody tr td input, .calculators section#calculator .container main#printableArea .table tbody tr td select {
        width: 100px
    }
}

.calculators section#calculator .container main#printableArea .table tbody tr td input:focus-visible, .calculators section#calculator .container main#printableArea .table tbody tr td select:focus-visible {
    outline-color: #767676
}

.calculators section#app {
    margin: 0 auto 10rem
}

    .calculators section#app .container .row {
        justify-content: center
    }

@media(max-width:767px) {
    .calculators section#app .container .row {
        margin: 2rem
    }
}

.calculators section#app .container .row .col-lg-10 {
    box-shadow: 0 0 10px rgba(100,100,100,.2);
    border-radius: 20px;
    padding: 3rem 1.2rem
}

@media(max-width:767px) {
    .calculators section#app .container .row .col-lg-10 {
        padding: 30px
    }
}

.calculators #bannerGray {
    margin-top: 84px
}

    .calculators #bannerGray h2 {
        max-width: 750px !important
    }

.calculators #copy_faq {
    margin-top: 164px;
    padding-bottom: 6rem
}

@media(min-width:768px) and (max-width:991px) {
    .calculators #copy_faq {
        margin-top: 140px;
        padding-bottom: 8rem
    }
}

@media(max-width:767px) {
    .calculators #copy_faq {
        margin-top: 120px;
        padding-bottom: 8rem
    }
}

.calculators #copy_faq .accordion-section h2 {
    text-align: center;
    font-weight: 700;
    font-size: 36px
}

.calculators #copy_faq .accordion-section .panel-group {
    margin-top: 3rem
}

    .calculators #copy_faq .accordion-section .panel-group .panel-default {
        border-top: 1px solid #9a9ea4;
        padding: 1.5rem 40px
    }

@media(max-width:767px) {
    .calculators #copy_faq .accordion-section .panel-group .panel-default {
        padding: 1.5rem 16px
    }
}

.calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body {
    padding-left: 3rem;
    padding-top: 20px;
    font-size: 1rem;
    line-height: 1.63;
    font-size: 18px;
    font-weight: 400
}

    .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body table {
        color: #222324;
        margin-bottom: 2.5rem
    }

        .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body table thead {
            border-bottom: 1px solid #a5abb7;
            margin-bottom: 1rem
        }

        .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body table tr:not(:last-of-type) {
            border-bottom: 1px dashed #a5abb75e
        }

        .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body table th {
            font-weight: 600;
            padding: .5rem 1rem
        }

        .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body table td {
            padding: .3rem 1rem;
            text-align: center
        }

    .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body ul {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-top: 8px
    }

        .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body ul li::marker {
            font-size: .7em
        }

    .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body p:last-of-type {
        margin: 0;
        padding: 0
    }

    .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-body h3 {
        font-size: 24px;
        font-weight: 500;
        margin: 24px 0 20px
    }

.calculators #copy_faq .accordion-section .panel-group .panel-default .panel-title {
    margin: 0
}

    .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-title a {
        display: block;
        font-size: 1.5rem;
        font-weight: 500
    }

        .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-title a::before {
            font-style: normal;
            font-size: 16px;
            content: url(/img/calculators-app/new/minus-icon.svg);
            margin-right: 1.5rem;
            color: #767676;
            float: left
        }

@media(max-width:767px) {
    .calculators #copy_faq .accordion-section .panel-group .panel-default .panel-title a::before {
        height: 4rem
    }
}

.calculators #copy_faq .accordion-section .panel-group .panel-default .panel-title a.collapsed::before {
    content: url(/img/calculators-app/new/plus-icon.svg)
}

@keyframes bouncing {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(0.5rem)
    }

    100% {
        transform: translateY(0)
    }
}

.pricing_2024_v1 section#pricing-2024 {
    margin-top: 80px
}

    .pricing_2024_v1 section#pricing-2024 h1, .pricing_2024_v1 section#pricing-2024 h2, .pricing_2024_v1 section#pricing-2024 h3, .pricing_2024_v1 section#pricing-2024 p, .pricing_2024_v1 section#pricing-2024 span {
        margin: 0;
        padding: 0
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(max-width:767px) {
    .pricing_2024_v1 section#pricing-2024 {
        margin-top: 64px
    }
}

.pricing_2024_v1 section#pricing-2024 .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 96px
}

    .pricing_2024_v1 section#pricing-2024 .container .top {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }

        .pricing_2024_v1 section#pricing-2024 .container .top .heading {
            margin-bottom: 32px
        }

            .pricing_2024_v1 section#pricing-2024 .container .top .heading h2, .pricing_2024_v1 section#pricing-2024 .container .top .heading h1 {
                font-size: 52px;
                font-weight: 700;
                line-height: 62px;
                color: #222324;
                text-align: center
            }

@media(max-width:767px) {
    .pricing_2024_v1 section#pricing-2024 .container .top .heading h2, .pricing_2024_v1 section#pricing-2024 .container .top .heading h1 {
        font-size: 44px
    }
}

.pricing_2024_v1 section#pricing-2024 .container .top .heading h2 span, .pricing_2024_v1 section#pricing-2024 .container .top .heading h1 span {
    color: #ffc502
}

.pricing_2024_v1 section#pricing-2024 .container .top a {
    margin-bottom: 40px
}

.pricing_2024_v1 section#pricing-2024 .container .top .checks {
    display: flex;
    gap: 18px
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .pricing_2024_v1 section#pricing-2024 .container .top .checks {
        flex-wrap: wrap;
        justify-content: center
    }
}

.pricing_2024_v1 section#pricing-2024 .container .top .checks__singleCheck {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px
}

    .pricing_2024_v1 section#pricing-2024 .container .top .checks__singleCheck p {
        font-family: Nunito Sans;
        font-size: 18px;
        font-weight: 400;
        line-height: 25px;
        letter-spacing: 0;
        text-align: left;
        color: #222324
    }

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer {
        grid-template-columns: 1fr
    }
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox {
    padding: 40px 32px 48px;
    display: flex;
    flex-direction: column;
    gap: 40px;
    box-shadow: 0 5px 24px -2px #0000001f;
    background: #fff;
    border-radius: 24px
}

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox.most-popular {
        border: 1px solid #ffc502;
        position: relative
    }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox.most-popular .most-popular-label {
            position: absolute;
            top: 0;
            right: 32px;
            padding: 5px 10px 8px;
            border-radius: 0 0 8px 8px;
            background-color: #ffc502;
            font-family: Lato;
            font-size: 14px;
            font-weight: 700;
            line-height: 17px;
            letter-spacing: 0;
            text-align: left;
            color: #fff
        }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox.most-popular .pricingTop__heading {
            border-bottom: 1px solid #ffc502 !important
        }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop {
        display: flex;
        flex-direction: column
    }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__heading {
        font-family: Lato;
        font-size: 24px;
        font-weight: 700;
        line-height: 29px;
        letter-spacing: 0;
        text-align: left;
        padding-bottom: 12px;
        border-bottom: 1px solid #dbdbdb;
        color: #222324
    }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__desc {
        margin-top: 12px;
        font-family: Nunito Sans;
        font-size: 16px;
        font-weight: 600;
        line-height: 22px;
        letter-spacing: 0;
        text-align: left;
        color: #6b6b6b
    }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price {
        display: flex;
        align-items: flex-end;
        color: #222324
    }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .dolar {
            font-family: Nunito Sans;
            font-size: 24px;
            font-weight: 800;
            letter-spacing: 0;
            text-align: right
        }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .finalPrice {
            font-family: Lato;
            font-size: 52px;
            font-weight: 700;
            line-height: 1.1;
            letter-spacing: 0;
            text-align: left;
            margin-left: 3px;
            margin-top: 28px
        }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .perMonth {
            font-family: Nunito Sans;
            font-size: 24px;
            font-weight: 800;
            letter-spacing: 0;
            text-align: right
        }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .discount {
            font-family: sans-serif;
            font-size: 32px;
            font-weight: 700;
            line-height: 38.4px;
            text-align: left;
            color: #b7bbc2;
            margin-left: 12px;
            position: relative;
            display: flex
        }

            .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .discount::after {
                content: "";
                position: absolute;
                top: 45%;
                left: -3px;
                width: calc(100% + 6px);
                height: 3px;
                background-color: #b7bbc2
            }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__billed {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin-top: 12px
    }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__billed p {
            font-family: Nunito Sans;
            font-size: 16px;
            font-weight: 600;
            line-height: 22px;
            letter-spacing: 0;
            text-align: left;
            color: #6b6b6b
        }

            .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__billed p span {
                font-weight: 800
            }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.featured {
        padding: 0;
        margin: 0 0 20px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        color: #222324
    }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.featured p.heading {
            font-family: Nunito Sans;
            font-size: 16px;
            font-weight: 700;
            line-height: 22px;
            letter-spacing: 0;
            text-align: left
        }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.featured li {
            list-style: none;
            display: flex;
            gap: 10px;
            align-items: center
        }

            .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.featured li p {
                font-family: Nunito Sans;
                font-size: 16px;
                font-weight: 700;
                line-height: 22px;
                letter-spacing: 0;
                text-align: left
            }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.normal {
        padding: 20px 0 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 16px;
        border-top: 1px solid #dbdbdb;
        color: #222324
    }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.normal li {
            list-style: none;
            display: flex;
            gap: 10px;
            align-items: center
        }

            .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.normal li p {
                font-family: Nunito Sans;
                font-size: 16px;
                font-weight: 400;
                line-height: 22px;
                letter-spacing: 0;
                text-align: left
            }

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth {
    box-shadow: 0 5px 24px -2px #0000001f;
    background: #fff;
    border-radius: 24px;
    padding: 40px 32px;
    gap: 86px;
    grid-column: span 4;
    display: grid;
    grid-template-columns: repeat(4,1fr)
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth {
        grid-column: span 2;
        grid-template-columns: repeat(2,1fr);
        gap: 40px 86px;
        padding: 40px 32px 48px
    }
}

@media(max-width:767px) {
    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth {
        grid-column: span 1;
        grid-template-columns: repeat(1,1fr);
        padding: 40px 32px 48px;
        gap: 40px
    }
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop {
    display: flex;
    flex-direction: column;
    grid-column: span 1
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__heading {
    font-family: Lato;
    font-size: 24px;
    font-weight: 700;
    line-height: 29px;
    letter-spacing: 0;
    text-align: left;
    padding-bottom: 12px;
    border-bottom: 1px solid #dbdbdb;
    color: #222324
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__desc {
    margin-top: 12px;
    font-family: Nunito Sans;
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: 0;
    text-align: left;
    color: #6b6b6b
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__price {
    display: flex;
    align-items: flex-end;
    color: #222324
}

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__price .dolar {
        font-family: Nunito Sans;
        font-size: 24px;
        font-weight: 800;
        letter-spacing: 0;
        text-align: right
    }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__price .finalPrice {
        font-family: Lato;
        font-size: 52px;
        font-weight: 700;
        line-height: 1.1;
        letter-spacing: 0;
        text-align: left;
        margin-left: 3px;
        margin-top: 28px
    }

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__price .perMonth {
        font-family: Nunito Sans;
        font-size: 24px;
        font-weight: 800;
        letter-spacing: 0;
        text-align: right
    }

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px
}

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed p {
        font-family: Nunito Sans;
        font-size: 16px;
        font-weight: 600;
        line-height: 22px;
        letter-spacing: 0;
        text-align: left;
        color: #6b6b6b
    }

        .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed p span {
            font-weight: 800
        }

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList {
    margin-top: 1.5rem;
    grid-column: span 2
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(max-width:767px) {
    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList {
        margin-top: unset;
        grid-column: span 1
    }
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList p.heading {
    font-family: Nunito Sans;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    letter-spacing: 0;
    text-align: left
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList ul.normal {
    padding: 20px 0 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2,250px);
    gap: 16px 8px;
    color: #222324
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(max-width:767px) {
    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList ul.normal {
        grid-template-columns: 1fr
    }
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList ul.normal li {
    list-style: none;
    display: flex;
    gap: 10px;
    align-items: center;
    min-width: 226px
}

    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList ul.normal li p {
        font-family: Nunito Sans;
        font-size: 16px;
        font-weight: 400;
        line-height: 22px;
        letter-spacing: 0;
        text-align: left
    }

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingButton {
    grid-column: span 1;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingButton {
        grid-column-start: 2
    }
}

.pricing_2024_v1 section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingButton a {
    width: 100%
}

@keyframes bouncing {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(0.5rem)
    }

    100% {
        transform: translateY(0)
    }
}

.pricing_2024_v1_index br.tablet-and-mobile {
    display: none
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .pricing_2024_v1_index br.tablet-and-mobile {
        display: block
    }
}

.pricing_2024_v1_index section#pricing-2024 {
    margin-top: 120px
}

    .pricing_2024_v1_index section#pricing-2024 h1, .pricing_2024_v1_index section#pricing-2024 h2, .pricing_2024_v1_index section#pricing-2024 h3, .pricing_2024_v1_index section#pricing-2024 p, .pricing_2024_v1_index section#pricing-2024 span {
        margin: 0;
        padding: 0
    }

    .pricing_2024_v1_index section#pricing-2024 .container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 80px
    }

@media(max-width:767px) {
    .pricing_2024_v1_index section#pricing-2024 .container {
        gap: 56px
    }
}

.pricing_2024_v1_index section#pricing-2024 .container .top {
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    gap: 32px
}

    .pricing_2024_v1_index section#pricing-2024 .container .top h2 {
        font-family: sans-serif;
        font-size: 52px;
        font-weight: 700;
        line-height: 62.4px;
        text-align: left;
        color: #222324;
        max-width: 740px
    }

    .pricing_2024_v1_index section#pricing-2024 .container .top p {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 400;
        line-height: 28.8px;
        text-align: left;
        color: #4f4f4f
    }

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer {
        grid-template-columns: 1fr
    }
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer a.btn-filled {
    font-family: sans-serif
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox {
    padding: 40px 32px 48px;
    display: flex;
    flex-direction: column;
    gap: 48px;
    box-shadow: 0 5px 24px -2px #0000001f;
    background: #fff;
    border-radius: 24px
}

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox.most-popular {
        border: 1px solid #ffc502;
        position: relative
    }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox.most-popular .most-popular-label {
            position: absolute;
            top: 0;
            right: 32px;
            padding: 5px 10px 8px;
            border-radius: 0 0 8px 8px;
            background-color: #ffc502;
            font-family: sans-serif;
            font-size: 14px;
            font-weight: 600;
            line-height: 17px;
            letter-spacing: 0;
            text-align: left;
            color: #fff
        }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop {
        display: flex;
        flex-direction: column
    }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__heading {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 700;
        line-height: 29px;
        letter-spacing: 0;
        text-align: left;
        padding-bottom: 12px;
        color: #222324
    }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__desc {
        font-family: sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 22px;
        letter-spacing: 0;
        text-align: left;
        color: #6b6b6b
    }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price {
        display: flex;
        align-items: flex-end;
        color: #222324
    }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .dolar {
            font-family: sans-serif;
            font-size: 24px;
            font-weight: 800;
            letter-spacing: 0;
            text-align: right
        }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .finalPrice {
            font-family: sans-serif;
            font-size: 52px;
            font-weight: 700;
            line-height: 1.1;
            letter-spacing: 0;
            text-align: left;
            margin-left: 3px;
            margin-top: 28px
        }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .perMonth {
            font-family: sans-serif;
            font-size: 24px;
            font-weight: 800;
            letter-spacing: 0;
            text-align: right
        }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .discount {
            font-family: sans-serif;
            font-size: 32px;
            font-weight: 700;
            line-height: 38.4px;
            text-align: left;
            color: #b7bbc2;
            margin-bottom: 5px;
            margin-left: 12px;
            position: relative;
            display: flex
        }

            .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__price .discount::after {
                content: "";
                position: absolute;
                top: 45%;
                left: -3px;
                width: calc(100% + 6px);
                height: 3px;
                background-color: #b7bbc2
            }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__billed {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin-top: 12px
    }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__billed p {
            font-family: sans-serif;
            font-size: 16px;
            font-weight: 400;
            line-height: 22px;
            letter-spacing: 0;
            text-align: left;
            color: #6b6b6b
        }

            .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingTop__billed p span {
                font-weight: 800
            }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.featured {
        padding: 0;
        margin: 0 0 20px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        color: #222324
    }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.featured p.heading {
            font-family: sans-serif;
            font-size: 16px;
            font-weight: 700;
            line-height: 22px;
            letter-spacing: 0;
            text-align: left;
            margin-bottom: 4px
        }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.featured li {
            list-style: none;
            display: flex;
            gap: 12px;
            align-items: center
        }

            .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.featured li p {
                font-family: sans-serif;
                font-size: 16px;
                font-weight: 600;
                line-height: 22px;
                letter-spacing: 0;
                text-align: left
            }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.normal {
        padding: 20px 0 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 16px;
        border-top: 1px solid #dbdbdb;
        color: #222324
    }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.normal li {
            list-style: none;
            display: flex;
            gap: 12px;
            align-items: center
        }

            .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox .pricingList ul.normal li p {
                font-family: sans-serif;
                font-size: 16px;
                font-weight: 400;
                line-height: 22px;
                letter-spacing: 0;
                text-align: left
            }

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth {
    box-shadow: 0 5px 24px -2px #0000001f;
    background: #fff;
    border-radius: 24px;
    padding: 40px 32px;
    gap: 86px;
    grid-column: span 4;
    display: grid;
    grid-template-columns: repeat(4,1fr)
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth {
        grid-column: span 2;
        grid-template-columns: repeat(2,1fr);
        gap: 40px 86px;
        padding: 40px 32px 48px
    }
}

@media(max-width:767px) {
    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth {
        grid-column: span 1;
        grid-template-columns: repeat(1,1fr);
        padding: 40px 32px 48px;
        gap: 40px
    }
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop {
    display: flex;
    flex-direction: column;
    grid-column: span 1
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__heading {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 29px;
    letter-spacing: 0;
    text-align: left;
    padding-bottom: 12px;
    border-bottom: 1px solid #dbdbdb;
    color: #222324
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__desc {
    margin-top: 12px;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0;
    text-align: left;
    color: #6b6b6b
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__price {
    display: flex;
    align-items: flex-end;
    color: #222324
}

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__price .dolar {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 800;
        letter-spacing: 0;
        text-align: right
    }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__price .finalPrice {
        font-family: sans-serif;
        font-size: 52px;
        font-weight: 700;
        line-height: 1.1;
        letter-spacing: 0;
        text-align: left;
        margin-left: 3px;
        margin-top: 28px
    }

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__price .perMonth {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 800;
        letter-spacing: 0;
        text-align: right
    }

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px
}

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed p {
        font-family: sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 22px;
        letter-spacing: 0;
        text-align: left;
        color: #6b6b6b
    }

        .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed p span {
            font-weight: 800
        }

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList {
    margin-top: 1.5rem;
    grid-column: span 2
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(max-width:767px) {
    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList {
        margin-top: unset;
        grid-column: span 1
    }
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList p.heading {
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    letter-spacing: 0;
    text-align: left
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList ul.normal {
    padding: 20px 0 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2,250px);
    gap: 16px 8px;
    color: #222324
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(max-width:767px) {
    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList ul.normal {
        grid-template-columns: 1fr
    }
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList ul.normal li {
    list-style: none;
    display: flex;
    gap: 10px;
    align-items: center;
    min-width: 226px
}

    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingList ul.normal li p {
        font-family: sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 22px;
        letter-spacing: 0;
        text-align: left
    }

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingButton {
    grid-column: span 1;
    display: flex;
    align-items: center;
    justify-content: center
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingButton {
        grid-column-start: 2
    }
}

.pricing_2024_v1_index section#pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingButton a {
    width: 100%
}

.adds * {
    font-family: sans-serif
}

.adds .hidden {
    opacity: 0;
    transform: translateY(-20px);
    transition: all 1s ease-in-out
}

@media(max-width:767px) {
    .adds .hidden {
        transition: none
    }
}

.adds .show {
    opacity: 1;
    transform: translateY(0)
}

@keyframes slider {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(calc((-108px * 12) + (-80px * 12)))
    }
}

@keyframes slider-mini {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(calc((-108px * 12) + (-40px * 12)))
    }
}

@keyframes carousel-slider {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(calc((-1444px) + (-64px * 12)))
    }
}

.adds .subHeaders {
    display: flex;
    flex-direction: column;
    max-width: 740px;
    margin-bottom: 80px
}

@media(max-width:767px) {
    .adds .subHeaders {
        margin-bottom: 64px
    }
}

.adds .subHeaders > *:not(:last-child) {
    margin-bottom: 32px !important
}

.adds .subHeaders__header {
    color: #222324;
    font-size: 52px;
    font-weight: 700
}

@media(max-width:767px) {
    .adds .subHeaders__header {
        font-size: 36px
    }
}

.adds .subHeaders__header span {
    color: #ffc502
}

.adds .subHeaders__paragraph {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    max-width: 683px
}

@media(max-width:767px) {
    .adds .safari-browser, .adds .normal-browser {
        display: none !important
    }
}

.adds br.desktop {
    display: none
}

@media(min-width:992px) and (max-width:1440px),(min-width:1920px),(min-width:992px) and (max-width:1199px) {
    .adds br.desktop {
        display: block
    }
}

.adds #top {
    position: relative
}

    .adds #top .background-vector {
        position: absolute;
        bottom: 0;
        right: 50%;
        z-index: -1;
        transform: translateX(121%)
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #top .background-vector {
        display: none
    }
}

.adds #top .container {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 80px
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px) {
    .adds #top .container {
        grid-template-columns: 1fr;
        gap: 78px
    }
}

@media(max-width:767px) {
    .adds #top .container {
        grid-template-columns: 1fr;
        gap: 40px
    }
}

.adds #top .container .content {
    display: flex;
    flex-direction: column
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #top .container .content {
        align-items: center;
        justify-content: center
    }
}

.adds #top .container .content h2 {
    font-family: sans-serif;
    font-size: 52px;
    font-weight: 700;
    line-height: 60.32px;
    text-align: left;
    color: #222324;
    margin-bottom: 32px;
    max-width: 440px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #top .container .content h2 {
        text-align: center;
        max-width: unset
    }
}

.adds #top .container .content p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333;
    margin-bottom: 40px;
    max-width: 433px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #top .container .content p {
        max-width: 550px;
        text-align: center
    }
}

.adds #top .container .content .buttons {
    display: flex;
    gap: 24px
}

@media(max-width:767px) {
    .adds #top .container .content .buttons {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 30px
    }
}

.adds #top .container .content .buttons .singleButton span {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 21.6px;
    text-align: left;
    color: #323333
}

.adds #top .container .image img {
    width: 100%
}

.adds #bannerFullContainer .container .content {
    padding: 48px 80px 48px 195px;
    background: #0a1a38;
    border-radius: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    overflow: hidden
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #bannerFullContainer .container .content {
        padding: 48px 40px;
        flex-direction: column;
        gap: 40px;
        align-items: flex-start
    }
}

.adds #bannerFullContainer .container .content .vector {
    position: absolute;
    left: -3rem;
    top: -2.1rem
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #bannerFullContainer .container .content .vector {
        bottom: -3rem;
        right: -2rem;
        left: unset;
        top: unset
    }
}

.adds #bannerFullContainer .container .content p {
    font-family: sans-serif;
    font-size: 28px;
    font-weight: 400;
    line-height: 33.6px;
    text-align: left;
    color: #fff;
    max-width: 750px
}

    .adds #bannerFullContainer .container .content p span {
        font-family: sans-serif;
        font-size: 28px;
        font-weight: 700;
        line-height: 33.6px;
        text-align: left
    }

.adds #carouselGray {
    margin-bottom: 120px;
    margin-top: 60px
}

    .adds #carouselGray .container {
        overflow: hidden;
        position: relative
    }

        .adds #carouselGray .container .blur-left {
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 50px;
            z-index: 10;
            background: linear-gradient(270deg,rgba(248,250,252,0) 0%,#fff 50%)
        }

@media(min-width:768px) and (max-width:991px) {
    .adds #carouselGray .container .blur-left {
        width: 50px
    }
}

@media(max-width:767px) {
    .adds #carouselGray .container .blur-left {
        width: 20px
    }
}

.adds #carouselGray .container .blur-right {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 50px;
    z-index: 10;
    background: linear-gradient(270deg,#fff 50%,rgba(248,250,252,0) 100%)
}

@media(min-width:768px) and (max-width:991px) {
    .adds #carouselGray .container .blur-right {
        width: 50px
    }
}

@media(max-width:767px) {
    .adds #carouselGray .container .blur-right {
        width: 20px
    }
}

.adds #carouselGray .container .carousel__images {
    animation: carousel-slider 55s linear infinite;
    display: flex;
    gap: 64px
}

.adds #green_statistics {
    margin-top: -5.5rem;
    padding: 222px 0 131px;
    background: #f8fafc
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #green_statistics {
        padding: 168px 0 96px
    }
}

@media(max-width:767px) {
    .adds #green_statistics {
        padding: 144px 0 80px
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(max-width:767px) {
    .adds #green_statistics .container {
        display: flex;
        align-items: center;
        justify-content: center
    }
}

.adds #green_statistics .container .boxes {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 36px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #green_statistics .container .boxes {
        display: flex;
        flex-direction: column;
        gap: 40px
    }
}

.adds #green_statistics .container .boxes .box {
    display: flex;
    align-items: center;
    gap: 8px
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .adds #green_statistics .container .boxes .box {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 0
    }
}

.adds #green_statistics .container .boxes .box p {
    margin: 0
}

.adds #green_statistics .container .boxes .box__text-green {
    gap: 10px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #green_statistics .container .boxes .box__text-green {
        display: flex;
        align-items: center;
        justify-content: center
    }
}

.adds #green_statistics .container .boxes .box__text-green p {
    font-family: sans-serif;
    font-size: 52px;
    font-weight: 600;
    text-align: left;
    color: #ffc502
}

@media(max-width:767px) {
    .adds #green_statistics .container .boxes .box__text-green p {
        font-size: 44px
    }
}

.adds #green_statistics .container .boxes .box__text-black p {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 29px;
    letter-spacing: 0;
    text-align: left;
    color: #323333
}

@media(max-width:767px) {
    .adds #green_statistics .container .boxes .box__text-black p {
        font-size: 18px
    }
}

.adds #do_you_know {
    margin: 164px 0
}

@media(max-width:767px) {
    .adds #do_you_know {
        margin: 96px 0
    }
}

.adds #do_you_know .container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px
}

    .adds #do_you_know .container .label {
        padding: 10px 20px;
        background: #f2fcf6;
        border-radius: 8px
    }

        .adds #do_you_know .container .label span {
            font-family: sans-serif;
            font-size: 16px;
            font-weight: 600;
            line-height: 23px;
            text-align: left;
            color: #ffc502
        }

    .adds #do_you_know .container .content {
        display: flex;
        justify-content: space-between;
        width: 100%
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #do_you_know .container .content {
        flex-direction: column;
        gap: 80px
    }
}

@media(max-width:767px) {
    .adds #do_you_know .container .content {
        flex-direction: column;
        gap: 64px
    }
}

.adds #do_you_know .container .content .header {
    max-width: 630px
}

    .adds #do_you_know .container .content .header h2 {
        font-family: sans-serif;
        font-size: 36px;
        font-weight: 600;
        line-height: 43.2px;
        text-align: left;
        color: #222324;
        max-width: 580px
    }

@media(max-width:767px) {
    .adds #do_you_know .container .content .header h2 {
        font-size: 28px
    }
}

.adds #do_you_know .container .content .header h2 span {
    color: #ffc502
}

.adds #do_you_know .container .content .content-boxes {
    max-width: 522px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 80px
}

    .adds #do_you_know .container .content .content-boxes::before {
        content: "";
        position: absolute;
        top: 0;
        left: 29px;
        height: 100%;
        width: 1.5px;
        background-color: #b7bbc2;
        z-index: -2
    }

    .adds #do_you_know .container .content .content-boxes .single-box {
        display: flex;
        align-items: flex-start;
        gap: 32px
    }

        .adds #do_you_know .container .content .content-boxes .single-box:last-of-type {
            background-color: #fff
        }

        .adds #do_you_know .container .content .content-boxes .single-box .image {
            position: relative;
            padding: 13px;
            background: #f2fcf6;
            border-radius: 8px
        }

            .adds #do_you_know .container .content .content-boxes .single-box .image::before {
                content: "";
                position: absolute;
                top: -8px;
                left: 0;
                background-color: #fff;
                width: 100%;
                height: calc(100% + 16px);
                z-index: -1
            }

        .adds #do_you_know .container .content .content-boxes .single-box p {
            font-family: sans-serif;
            font-size: 24px;
            font-weight: 400;
            line-height: 28.8px;
            text-align: left;
            color: #323333;
            margin: 0
        }

@media(max-width:767px) {
    .adds #do_you_know .container .content .content-boxes .single-box p {
        font-size: 18px
    }
}

.adds #free-forever {
    background-color: #f8fafc;
    position: relative;
    overflow: hidden
}

    .adds #free-forever p, .adds #free-forever h2 {
        margin: 0
    }

    .adds #free-forever .vector {
        position: absolute;
        top: -28rem;
        right: -34rem;
        z-index: 1
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #free-forever .vector {
        position: absolute;
        top: unset;
        bottom: -34rem;
        right: -34rem;
        z-index: 1;
        transform: rotate(19deg) scale(.9)
    }
}

@media(max-width:767px) {
    .adds #free-forever .vector {
        position: absolute;
        top: unset;
        bottom: -34rem;
        right: -34rem;
        z-index: 1;
        transform: rotate(19deg) scale(.6)
    }
}

.adds #free-forever .container {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    padding-top: 80px;
    overflow: hidden;
    position: relative;
    z-index: 2
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #free-forever .container {
        grid-template-columns: 1fr;
        gap: 80px
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .adds #free-forever .container {
        grid-template-columns: 1fr;
        gap: 64px
    }
}

.adds #free-forever .container .content {
    max-width: 522px
}

    .adds #free-forever .container .content h2 {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: left;
        color: #222324;
        margin-bottom: 32px
    }

@media(max-width:767px) {
    .adds #free-forever .container .content h2 {
        font-size: 36px
    }
}

.adds #free-forever .container .content h2 span {
    color: #ffc502
}

.adds #free-forever .container .content p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333;
    margin-bottom: 40px
}

.adds #free-forever .container .content .buttons {
    display: flex;
    gap: 24px
}

@media(max-width:767px) {
    .adds #free-forever .container .content .buttons {
        flex-direction: column;
        align-items: flex-start;
        gap: 24px
    }
}

.adds #free-forever .container .free-pricing {
    display: flex
}

    .adds #free-forever .container .free-pricing .table {
        padding: 54px 32px 74px 64px;
        background-color: #fff;
        width: 413px;
        border-radius: 24px 24px 0 0;
        box-shadow: 0 8px 32px 0 #7d808633;
        margin: 0;
        margin-bottom: -2px
    }

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table {
        width: 280px;
        padding: 34px 46px 41px 41px
    }
}

.adds #free-forever .container .free-pricing .table .name {
    margin-bottom: 43px;
    display: flex;
    flex-direction: column;
    gap: 16px
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .name {
        margin-bottom: 15px;
        gap: unset
    }
}

.adds #free-forever .container .free-pricing .table .name h2 {
    font-family: sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 39.09px;
    text-align: left;
    color: #222324
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .name h2 {
        font-size: 21px
    }
}

.adds #free-forever .container .free-pricing .table .name p {
    font-family: sans-serif;
    font-size: 21px;
    font-weight: 400;
    line-height: 26.06px;
    text-align: left;
    color: #6b6b6b
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .name p {
        font-size: 14px
    }
}

.adds #free-forever .container .free-pricing .table .price {
    display: flex;
    align-items: flex-end
}

    .adds #free-forever .container .free-pricing .table .price span {
        font-family: sans-serif;
        font-size: 32.58px;
        font-weight: 800;
        line-height: 39.09px;
        text-align: right;
        color: #222324;
        margin-bottom: 13px
    }

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .price span {
        font-size: 21px
    }
}

.adds #free-forever .container .free-pricing .table .price p {
    font-family: sans-serif;
    font-size: 70.58px;
    font-weight: 700;
    line-height: 84.7px;
    text-align: left;
    color: #222324
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .price p {
        font-size: 45px;
        line-height: unset
    }
}

.adds #free-forever .container .free-pricing .table .desc {
    margin-bottom: 60px
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .desc {
        margin-bottom: 38px;
        margin-top: -9px
    }
}

.adds #free-forever .container .free-pricing .table .desc p {
    font-family: sans-serif;
    font-size: 21.72px;
    font-weight: 400;
    line-height: 26.06px;
    text-align: left;
    color: #6b6b6b
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .desc p {
        font-size: 14px
    }
}

.adds #free-forever .container .free-pricing .table .list ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 21px
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .list ul {
        gap: 14px
    }
}

.adds #free-forever .container .free-pricing .table .list ul li {
    display: flex;
    align-items: flex-start;
    gap: 16px
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .list ul li {
        gap: 11px
    }
}

.adds #free-forever .container .free-pricing .table .list ul li p {
    font-family: sans-serif;
    font-size: 21.72px;
    font-weight: 400;
    line-height: 26.06px;
    text-align: left;
    color: #222324
}

@media(max-width:767px) {
    .adds #free-forever .container .free-pricing .table .list ul li p {
        font-size: 14px
    }
}

.adds #contentBoxes {
    margin-bottom: 164px
}

    .adds #contentBoxes img, .adds #contentBoxes svg, .adds #contentBoxes video {
        width: 100%;
        height: 100%
    }

@media(max-width:767px) {
    .adds #contentBoxes img.img-desktop, .adds #contentBoxes svg.img-desktop, .adds #contentBoxes video.img-desktop {
        display: none
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    .adds #contentBoxes img.img-mobile, .adds #contentBoxes svg.img-mobile, .adds #contentBoxes video.img-mobile {
        display: none
    }
}

.adds #contentBoxes .container .contentBoxes .row {
    grid-template-columns: 1fr;
    display: grid
}

    .adds #contentBoxes .container .contentBoxes .row.twoColumns {
        grid-template-columns: 55% 45%
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes .row.twoColumns {
        grid-template-columns: 1fr
    }
}

.adds #contentBoxes .container .contentBoxes .row.twoColumns > :last-child {
    margin-left: 40px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes .row.twoColumns > :last-child {
        margin-left: 0;
        margin-top: 40px
    }
}

.adds #contentBoxes .container .contentBoxes .row.twoColumns .greenBoxWithImg {
    max-height: 292px
}

@media(min-width:1920px),(min-width:1441px) and (max-width:1919px),(min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:991px) {
    .adds #contentBoxes .container .contentBoxes .row.twoColumns .greenBoxWithImg {
        margin-bottom: -13px
    }

        .adds #contentBoxes .container .contentBoxes .row.twoColumns .greenBoxWithImg video {
            margin-bottom: 0 !important
        }
}

.adds #contentBoxes .container .contentBoxes .row:not(:last-of-type) {
    margin-bottom: 40px
}

.adds #contentBoxes .container .contentBoxes__box {
    border-radius: 24px;
    border: .2px solid #b7bbc22c;
    background: #fff;
    box-shadow: 0 8px 32px 0 rgba(125,128,134,.2);
    display: flex;
    overflow: hidden
}

    .adds #contentBoxes .container .contentBoxes__box h2 {
        color: #222324;
        font-size: 32px;
        font-weight: 600;
        margin-bottom: 12px;
        max-width: 396px
    }

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box h2 {
        font-size: 24px;
        max-width: 321px
    }
}

.adds #contentBoxes .container .contentBoxes__box p {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 32px;
    max-width: 400px
}

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box p {
        font-size: 16px
    }
}

.adds #contentBoxes .container .contentBoxes__box .greenBoxWithImg {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background-color: rgb(245 226 179);
    width: 100%;
    overflow: hidden
}

    .adds #contentBoxes .container .contentBoxes__box .greenBoxWithImg video {
        margin-bottom: -15px
    }

    .adds #contentBoxes .container .contentBoxes__box .greenBoxWithImg.bothCornerRadius {
        border-top-right-radius: 20px;
        border-top-left-radius: 20px;
        padding: 32px 30px 0
    }

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box .greenBoxWithImg.bothCornerRadius {
        border-top-left-radius: 0;
        padding: 20px 20px 0 0
    }
}

.adds #contentBoxes .container .contentBoxes__box .greenBoxWithImg.leftCornerRadius {
    border-top-left-radius: 20px;
    padding: 32px 40px 0
}

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box .greenBoxWithImg.leftCornerRadius {
        padding: 20px 0 0 20px
    }
}

.adds #contentBoxes .container .contentBoxes__box .greenBoxWithImg.rightCornerRadius {
    border-top-right-radius: 20px;
    padding: 32px 40px 0
}

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box .greenBoxWithImg.rightCornerRadius {
        padding: 20px 20px 0 0
    }
}

.adds #contentBoxes .container .contentBoxes__box.fullWidth {
    flex-direction: column;
    padding: 40px 48px 0
}

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.fullWidth {
        padding: 32px 20px 0 0
    }
}

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.fullWidth div:first-of-type {
        margin-left: 20px
    }
}

.adds #contentBoxes .container .contentBoxes__box.textLeft {
    padding: 40px 0 0 48px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textLeft {
        flex-direction: column
    }
}

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textLeft {
        padding: 32px 0 0 20px
    }
}

.adds #contentBoxes .container .contentBoxes__box.textLeft h2 {
    margin-top: 2rem
}

.adds #contentBoxes .container .contentBoxes__box.textLeft div:first-of-type {
    width: 35%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textLeft div:first-of-type {
        width: 100%
    }
}

.adds #contentBoxes .container .contentBoxes__box.textLeft div:last-of-type {
    width: 65%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textLeft div:last-of-type {
        width: 100%
    }
}

.adds #contentBoxes .container .contentBoxes__box.textRight {
    padding: 40px 48px 0 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textRight {
        flex-direction: column-reverse
    }
}

@media(max-width:767px) and (max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textRight {
        padding: 32px 20px 0 0
    }
}

.adds #contentBoxes .container .contentBoxes__box.textRight p {
    margin-bottom: 2rem
}

.adds #contentBoxes .container .contentBoxes__box.textRight div:first-of-type {
    width: 65%
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textRight div:first-of-type {
        width: 100%
    }
}

.adds #contentBoxes .container .contentBoxes__box.textRight div:last-of-type {
    width: 35%;
    margin-left: 32px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textRight div:last-of-type {
        width: 100%
    }
}

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.textRight div:last-of-type {
        margin-left: 20px
    }
}

.adds #contentBoxes .container .contentBoxes__box.smallBox {
    flex-direction: column;
    padding: 32px 20px 0 0
}

    .adds #contentBoxes .container .contentBoxes__box.smallBox div:first-of-type {
        margin-left: 40px
    }

@media(max-width:767px) {
    .adds #contentBoxes .container .contentBoxes__box.smallBox div:first-of-type {
        margin-left: 20px
    }
}

.adds #contentBoxes .container .contentBoxes__box.smallBox img, .adds #contentBoxes .container .contentBoxes__box.smallBox svg {
    max-height: 257px
}

.adds #CompaniesCarousel {
    background-color: #f8fafc;
    padding: 120px 0 164px;
    overflow: hidden;
    z-index: 2;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center
}

    .adds #CompaniesCarousel .CompaniesCarousel {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        max-width: 2465px;
        overflow: hidden
    }

        .adds #CompaniesCarousel .CompaniesCarousel::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 10rem;
            height: 100%;
            z-index: 2;
            background: linear-gradient(90deg,#f8fafc 42%,rgba(255,255,255,0) 100%)
        }

        .adds #CompaniesCarousel .CompaniesCarousel::after {
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            width: 10rem;
            height: 100%;
            z-index: 2;
            background: linear-gradient(270deg,#f8fafc 42%,rgba(255,255,255,0) 100%)
        }

    .adds #CompaniesCarousel .CompaniesCarousel__singleCarousel {
        opacity: .3;
        display: grid;
        grid-template-columns: repeat(24,108px);
        gap: 80px;
        position: relative;
        width: 100%;
        animation: slider 55s linear infinite
    }

@media only screen and (max-width:1900px) and (min-width:1200px) {
    .adds #CompaniesCarousel .CompaniesCarousel__singleCarousel {
        gap: 40px;
        animation: slider-mini 55s linear infinite
    }
}

.adds #CompaniesCarousel .CompaniesCarousel__singleCarousel:nth-of-type(2) {
    margin-left: 3.5rem;
    animation-direction: reverse;
    animation-duration: 55s
}

.adds #CompaniesCarousel .CompaniesCarousel__singleCarousel:nth-of-type(3) {
    margin-left: -2rem;
    animation-duration: 50s
}

.adds #CompaniesCarousel .CompaniesCarousel__singleCarousel:not(:last-child) {
    margin-bottom: 40px
}

.adds #CompaniesCarousel .CompaniesCarousel__singleCarousel .img {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 108px;
    border-radius: 24px;
    border: .2px solid #b7bbc244;
    background: #fff;
    box-shadow: 0 4px 10px 0 rgba(125,128,134,.15)
}

.adds #CompaniesCarousel .CompaniesCarousel .Timely-logo {
    position: absolute;
    top: calc(50% - 115px);
    left: calc(50% - 95px);
    width: 189px;
    height: 189px;
    border-radius: 24px;
    border: .2px solid #b7bbc249;
    background: #fff;
    box-shadow: 0 8px 32px 0 rgba(125,128,134,.2);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px
}

    .adds #CompaniesCarousel .CompaniesCarousel .Timely-logo img {
        width: 100%
    }

.adds #bannerNavi {
    background: #0a1a38;
    padding: 64px 0;
    margin: 180px 0
}

    .adds #bannerNavi .container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        max-width: 842px
    }

        .adds #bannerNavi .container h2 {
            font-family: sans-serif;
            font-size: 44px;
            font-weight: 400;
            line-height: 52.8px;
            text-align: center;
            margin-bottom: 40px;
            color: #fff
        }

            .adds #bannerNavi .container h2 span {
                font-weight: 700
            }

.planner-now {
    background-color: #000
}

    .planner-now a.btn-filled.planner {
        border-radius: 26px;
        padding: 8px 27px;
        font-family: Lato;
        font-size: 18px;
        font-weight: 700;
        line-height: 36px;
        letter-spacing: 0;
        text-align: left
    }

        .planner-now a.btn-filled.planner.basic {
            background: linear-gradient(110.94deg,#2d80eb 36.16%,#2466bc 88.93%);
            box-shadow: 2px 4px 32px 2px #2466bca3;
            color: #fff
        }

    .planner-now img.mobile {
        display: none
    }

@media(max-width:767px) {
    .planner-now img.mobile {
        display: block
    }
}

.planner-now img.desktop {
    display: block
}

@media(max-width:767px) {
    .planner-now img.desktop {
        display: none
    }
}

.planner-now img.desktop-without-tablet {
    display: block
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner-now img.desktop-without-tablet {
        display: none
    }
}

.planner-now img.mobile-and-tablet {
    display: none
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner-now img.mobile-and-tablet {
        display: block
    }
}

.planner-now #top {
    position: relative
}

    .planner-now #top h1, .planner-now #top p {
        margin: 0;
        padding: 0
    }

    .planner-now #top::before {
        content: "";
        position: absolute;
        max-width: 1400px;
        width: 70%;
        height: 40%;
        background-color: #2d80eb;
        border-radius: 50%;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-60%);
        filter: blur(290px)
    }

    .planner-now #top .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 32px
    }

        .planner-now #top .container h1 {
            font-family: Lato;
            font-size: 52px;
            font-weight: 700;
            line-height: 60px;
            letter-spacing: 0;
            text-align: center;
            color: #f3f3f3;
            max-width: 900px
        }

        .planner-now #top .container p {
            font-family: Lato;
            font-size: 18px;
            font-weight: 400;
            line-height: 26px;
            letter-spacing: 0;
            text-align: center;
            color: #f3f3f3;
            max-width: 520px
        }

@media(min-width:768px) and (max-width:991px) {
    .planner-now #top .container p {
        max-width: 450px
    }
}

.planner-now #timeline {
    margin: 68px 0 96px
}

    .planner-now #timeline .container .timeline__row {
        display: grid;
        grid-template-columns: repeat(2,50%)
    }

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row {
        grid-template-columns: 1fr
    }
}

.planner-now #timeline .container .timeline__row:first-of-type .timeline__row__left {
    position: relative
}

    .planner-now #timeline .container .timeline__row:first-of-type .timeline__row__left::after {
        content: "";
        position: absolute;
        top: 10rem;
        right: -9px;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        background-color: #f3f3f3
    }

    .planner-now #timeline .container .timeline__row:first-of-type .timeline__row__left::before {
        content: "";
        position: absolute;
        top: 9.77rem;
        right: -9.5px;
        width: 15px;
        height: 22px;
        background-color: #000
    }

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row:first-of-type .timeline__row__left::after {
        left: -9px
    }

    .planner-now #timeline .container .timeline__row:first-of-type .timeline__row__left::before {
        left: -9.5px
    }
}

.planner-now #timeline .container .timeline__row:first-of-type .timeline__row__left .content {
    margin-top: 10rem
}

.planner-now #timeline .container .timeline__row:first-of-type .timeline__row__right .content {
    margin-top: 10rem
}

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row:first-of-type .timeline__row__right .content {
        margin-top: unset
    }
}

.planner-now #timeline .container .timeline__row__left {
    display: flex;
    justify-content: flex-end;
    position: relative
}

    .planner-now #timeline .container .timeline__row__left::after {
        content: "";
        position: absolute;
        top: 0;
        right: -9px;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        background-color: #f3f3f3
    }

    .planner-now #timeline .container .timeline__row__left::before {
        content: "";
        position: absolute;
        top: -4px;
        right: -9.5px;
        width: 15px;
        height: 22px;
        background-color: #000
    }

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row__left {
        border-left: 3px solid #d1d0d1
    }

        .planner-now #timeline .container .timeline__row__left::after {
            left: -9px
        }

        .planner-now #timeline .container .timeline__row__left::before {
            left: -9.5px
        }
}

.planner-now #timeline .container .timeline__row__left .content {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    width: 434px;
    margin-right: 88px
}

@media(min-width:768px) and (max-width:991px) {
    .planner-now #timeline .container .timeline__row__left .content {
        width: 242px
    }
}

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row__left .content {
        width: unset;
        margin-left: 61px;
        align-items: flex-start
    }
}

.planner-now #timeline .container .timeline__row__left .content span {
    font-family: Lato;
    font-size: 24px;
    font-weight: 400;
    color: #d1d0d1
}

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row__left .content span {
        font-size: 20px
    }
}

.planner-now #timeline .container .timeline__row__left .content h2 {
    font-family: Lato;
    font-size: 44px;
    font-weight: 600;
    color: #f3f3f3;
    text-align: right
}

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row__left .content h2 {
        font-size: 36px;
        text-align: left
    }
}

.planner-now #timeline .container .timeline__row__right {
    display: flex;
    justify-content: flex-start;
    border-left: 3px solid #d1d0d1
}

    .planner-now #timeline .container .timeline__row__right .content {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        width: 434px;
        margin-left: 88px;
        padding-top: 2rem;
        margin-bottom: 7rem
    }

@media(min-width:768px) and (max-width:991px) {
    .planner-now #timeline .container .timeline__row__right .content {
        width: 242px
    }
}

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row__right .content {
        width: 100%;
        margin-left: 61px
    }
}

.planner-now #timeline .container .timeline__row__right .content p {
    font-family: Lato;
    font-size: 24px;
    font-weight: 400;
    color: #f3f3f3;
    margin-bottom: 40px
}

@media(max-width:767px) {
    .planner-now #timeline .container .timeline__row__right .content p {
        margin-bottom: 48px;
        font-size: 18px
    }
}

.planner-now #timeline .container .timeline__row__right .content img {
    width: 100%
}

.planner-now #chessboard {
    position: relative
}

    .planner-now #chessboard::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 80%;
        max-width: 1410px;
        height: 100%;
        opacity: .7;
        background: #2d80eb;
        z-index: -1;
        border-radius: 50%;
        filter: blur(300px)
    }

    .planner-now #chessboard .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }

        .planner-now #chessboard .container .main-image img {
            width: 100%
        }

        .planner-now #chessboard .container h2.header {
            font-family: Lato;
            font-size: 36px;
            font-weight: 700;
            line-height: 43px;
            letter-spacing: 0;
            text-align: center;
            color: #f3f3f3;
            max-width: 1064px;
            margin: 164px 0
        }

@media(max-width:767px) {
    .planner-now #chessboard .container h2.header {
        margin: 120px 0
    }
}

.planner-now #chessboard .container .all-boxes {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 164px
}

@media(min-width:768px) and (max-width:991px) {
    .planner-now #chessboard .container .all-boxes {
        gap: 140px
    }
}

@media(max-width:767px) {
    .planner-now #chessboard .container .all-boxes {
        gap: 96px
    }
}

.planner-now #chessboard .container .all-boxes .box {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 109px
}

@media(min-width:768px) and (max-width:991px) {
    .planner-now #chessboard .container .all-boxes .box {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 48px
    }
}

@media(max-width:767px) {
    .planner-now #chessboard .container .all-boxes .box {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 32px
    }
}

.planner-now #chessboard .container .all-boxes .box__text {
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-width: 433px;
    max-width: 433px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-now #chessboard .container .all-boxes .box__text {
        min-width: unset;
        max-width: unset
    }
}

@media(max-width:767px) {
    .planner-now #chessboard .container .all-boxes .box__text {
        gap: 24px
    }
}

.planner-now #chessboard .container .all-boxes .box__text h2 {
    font-family: Lato;
    font-size: 36px;
    font-weight: 700;
    line-height: 43px;
    letter-spacing: 0;
    text-align: left;
    color: #fff;
    margin: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-now #chessboard .container .all-boxes .box__text h2 {
        text-align: center
    }
}

@media(max-width:767px) {
    .planner-now #chessboard .container .all-boxes .box__text h2 {
        font-size: 28px
    }
}

.planner-now #chessboard .container .all-boxes .box__text p {
    font-family: Lato;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    letter-spacing: 0;
    text-align: left;
    color: #fff;
    margin: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-now #chessboard .container .all-boxes .box__text p {
        text-align: center
    }
}

.planner-now #chessboard .container .all-boxes .box__img img {
    width: 100%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .planner-now #chessboard .container .all-boxes .box:nth-of-type(odd) {
        flex-direction: column-reverse
    }
}

.planner-now #banner {
    margin: 240px 0
}

@media(max-width:767px) {
    .planner-now #banner {
        margin: 180px 0
    }
}

.planner-now #banner .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px
}

    .planner-now #banner .container h2 {
        font-family: Lato;
        font-size: 36px;
        font-weight: 700;
        line-height: 43px;
        letter-spacing: 0;
        text-align: center;
        max-width: 768px;
        color: #fff
    }

.integrations_2024 h2, .integrations_2024 p {
    margin: 0
}

.integrations_2024 .section-header .container {
    display: flex;
    flex-direction: column;
    margin-bottom: 104px
}

@media(max-width:767px) {
    .integrations_2024 .section-header .container {
        margin-bottom: 96px
    }
}

.integrations_2024 .section-header .container h2 {
    font-family: sans-serif;
    font-size: 52px;
    font-weight: 700;
    line-height: 62.4px;
    text-align: left;
    margin-bottom: 32px;
    max-width: 738px
}

@media(max-width:767px) {
    .integrations_2024 .section-header .container h2 {
        font-size: 36px;
        margin-bottom: 28px;
        line-height: normal
    }
}

.integrations_2024 .section-header .container h2 span {
    color: #ffc502
}

.integrations_2024 .section-header .container p {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 28.8px;
    text-align: left;
    color: #323333
}

@media(max-width:767px) {
    .integrations_2024 .section-header .container p {
        font-size: 18px
    }
}

.integrations_2024 #top {
    padding-bottom: 180px
}

@media(max-width:767px) {
    .integrations_2024 #top {
        padding-bottom: 120px !important
    }
}

.integrations_2024 #top .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

    .integrations_2024 #top .container h2, .integrations_2024 #top .container h1 {
        font-family: sans-serif;
        font-size: 64px;
        font-weight: 700;
        line-height: 74.24px;
        text-align: center;
        margin-bottom: 32px;
        text-align: center
    }

@media(max-width:767px) {
    .integrations_2024 #top .container h2, .integrations_2024 #top .container h1 {
        font-size: 44px;
        line-height: normal
    }
}

.integrations_2024 #top .container h2 span, .integrations_2024 #top .container h1 span {
    color: #ffc502
}

.integrations_2024 #top .container p {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    text-align: center;
    color: #323333;
    max-width: 832px;
    text-align: center
}

@media(max-width:767px) {
    .integrations_2024 #top .container p {
        font-size: 18px
    }
}

.integrations_2024 #top .container .buttons {
    display: flex;
    gap: 24px;
    margin-top: 56px
}

    .integrations_2024 #top .container .buttons .singleButton span {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 21.6px;
        text-align: left;
        color: #323333
    }

@media(max-width:767px) {
    .integrations_2024 #top .container .buttons {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 24px
    }
}

.integrations_2024 #top .container .image {
    margin-top: 105px
}

@media(min-width:768px) and (max-width:991px) {
    .integrations_2024 #top .container .image {
        margin-top: 96px
    }
}

@media(max-width:767px) {
    .integrations_2024 #top .container .image {
        margin-top: 64px
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .integrations_2024 #top .container .image img {
        width: 100%
    }
}

.integrations_2024 #features {
    display: flex;
    flex-direction: column;
    margin-bottom: 164px
}

    .integrations_2024 #features .container .box {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 164px
    }

@media(min-width:768px) and (max-width:991px) {
    .integrations_2024 #features .container .box {
        gap: 140px
    }
}

@media(max-width:767px) {
    .integrations_2024 #features .container .box {
        gap: 96px
    }
}

.integrations_2024 #features .container .box__singleBox {
    align-items: center
}

    .integrations_2024 #features .container .box__singleBox.left {
        display: grid;
        grid-template-columns: 1fr 2fr;
        gap: 109px
    }

@media(min-width:768px) and (max-width:991px) {
    .integrations_2024 #features .container .box__singleBox.left {
        display: flex;
        flex-direction: column;
        gap: 64px
    }
}

@media(max-width:767px) {
    .integrations_2024 #features .container .box__singleBox.left {
        display: flex;
        flex-direction: column;
        gap: 40px
    }
}

.integrations_2024 #features .container .box__singleBox.right {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 109px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .integrations_2024 #features .container .box__singleBox.right {
        display: flex;
        flex-direction: column-reverse;
        gap: 64px
    }
}

.integrations_2024 #features .container .box__singleBox .image img {
    width: 100%
}

.integrations_2024 #features .container .box__singleBox .content {
    display: flex;
    flex-direction: column;
    gap: 32px
}

    .integrations_2024 #features .container .box__singleBox .content h2 {
        font-family: sans-serif;
        font-size: 36px;
        font-weight: 700;
        line-height: 43.2px;
        text-align: left;
        color: #222324
    }

@media(max-width:767px) {
    .integrations_2024 #features .container .box__singleBox .content h2 {
        font-size: 28px
    }
}

.integrations_2024 #features .container .box__singleBox .content span {
    width: 88px;
    height: 2px;
    background-color: #ffc502
}

.integrations_2024 #features .container .box__singleBox .content p {
    font-family: sans-serif;
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    text-align: left;
    color: #323333
}

.integrations_2024 #features .container .box a {
    margin-top: -4rem
}

@media(max-width:767px) {
    .integrations_2024 #features .container .box a {
        margin-top: -1rem
    }
}

.integrations_2024 #other-features {
    margin-bottom: 164px
}

    .integrations_2024 #other-features .container .header {
        display: flex;
        flex-direction: column;
        margin-bottom: 63px
    }

        .integrations_2024 #other-features .container .header span {
            font-family: sans-serif;
            font-size: 16px;
            font-weight: 600;
            line-height: 19.2px;
            text-align: left;
            text-transform: uppercase;
            color: #ffc502;
            margin-bottom: 16px
        }

        .integrations_2024 #other-features .container .header h2 {
            font-family: sans-serif;
            font-size: 36px;
            font-weight: 700;
            line-height: 41.76px;
            text-align: left;
            color: #222324
        }

    .integrations_2024 #other-features .container .content {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 62px
    }

@media(min-width:768px) and (max-width:991px) {
    .integrations_2024 #other-features .container .content {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .integrations_2024 #other-features .container .content {
        grid-template-columns: 1fr
    }
}

.integrations_2024 #other-features .container .content .box .image {
    margin-bottom: 40px
}

    .integrations_2024 #other-features .container .content .box .image img {
        width: 100%
    }

.integrations_2024 #other-features .container .content .box h2 {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 22px;
    text-align: left;
    color: #222324;
    margin-bottom: 16px
}

.integrations_2024 #other-features .container .content .box p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333
}

.integrations_2024 #other-features .container .button {
    margin-top: 64px
}

.integrations_2024 #banner {
    background-color: #f8fafc
}

    .integrations_2024 #banner .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 40px;
        padding: 96px 0
    }

        .integrations_2024 #banner .container h2 {
            font-family: sans-serif;
            font-size: 36px;
            font-weight: 700;
            line-height: 45px;
            text-align: center;
            max-width: 846px
        }

@media(max-width:767px) {
    .integrations_2024 #banner .container h2 {
        font-size: 28px;
        line-height: normal;
        padding: 0 3rem
    }
}

.integrations_2024 #banner .container h2 span {
    color: #ffc502
}

.integrations_2024 .section-integration-more-info {
    margin-top: 164px
}

    .integrations_2024 .section-integration-more-info div.limitHeight {
        height: 124px;
        overflow: hidden
    }

    .integrations_2024 .section-integration-more-info .col-lg-12 {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0
    }

        .integrations_2024 .section-integration-more-info .col-lg-12 h2.header {
            margin: 0 0 64px;
            font-family: sans-serif;
            font-size: 36px;
            font-weight: 700;
            line-height: 43.2px;
            text-align: left;
            color: #222324
        }

@media(max-width:767px) {
    .integrations_2024 .section-integration-more-info .col-lg-12 h2.header {
        font-size: 28px;
        line-height: normal
    }
}

.integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph:not(:last-of-type) {
    margin-bottom: 48px
}

.integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph h3 {
    font-family: sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 33.6px;
    text-align: left;
    color: #222324;
    margin: 0 0 24px
}

@media(max-width:767px) {
    .integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph h3 {
        font-size: 24px;
        line-height: normal
    }
}

.integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph h4 {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 28.8px;
    text-align: left;
    color: #323333;
    margin: 0 0 18px
}

@media(max-width:767px) {
    .integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph h4 {
        font-size: 18px;
        line-height: normal
    }
}

.integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333
}

    .integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph p:not(:last-of-type) {
        margin-bottom: 19px
    }

.integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph ul, .integrations_2024 .section-integration-more-info .col-lg-12 section.paragraph ol {
    margin-top: 24px;
    padding-left: 30px;
    display: flex;
    flex-direction: column;
    gap: 24px
}

.integrations_2024 button#btnReadMore {
    margin-top: 32px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    text-align: left;
    border-bottom: 2px solid #ffc502;
    text-decoration: none;
    padding: 0 0 2px;
    transition: all .2s ease-in-out
}

    .integrations_2024 button#btnReadMore:hover {
        color: #1da44c;
        border-bottom: 2px solid #1da44c
    }

.pomodoro section#top p {
    font-family: sans-serif;
    font-size: 24px !important;
    font-weight: 400 !important;
    line-height: 28.8px !important;
    text-align: center
}

@media(max-width:767px) {
    .pomodoro section#top p {
        font-size: 18px !important;
        line-height: normal !important
    }
}

.pomodoro .hidden {
    opacity: 1;
    transform: unset
}

.pomodoro .pomodoro-app {
    width: 100%;
    max-width: 1167px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #4f4f4f;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    box-shadow: 0 8px 32px 0 #7d808633;
    padding: 2rem 2rem 72px;
    border-radius: 24px;
    background-color: #fff
}

@media(max-width:767px) {
    .pomodoro .pomodoro-app {
        padding: 1rem 1rem 2.5rem
    }
}

.pomodoro .pomodoro-app .controll-header {
    display: flex;
    justify-content: center;
    position: relative
}

.pomodoro .pomodoro-app .settings-section {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    gap: 10px;
    margin-left: auto;
    padding-top: 4px
}

.pomodoro .pomodoro-app button {
    border: none;
    outline: none;
    background-color: transparent;
    background-color: initial;
    cursor: pointer
}

.pomodoro .pomodoro-app .interval-controll {
    border-radius: 999px;
    border: 1px solid transparent;
    padding: 8px 16px
}

.pomodoro .pomodoro-app button.active {
    border: 1px solid #ffc502
}

.pomodoro .pomodoro-app .timer {
    color: #000;
    text-align: center;
    font-size: 128px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    padding: 40px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: flex-end
}

@media(max-width:767px) {
    .pomodoro .pomodoro-app .timer {
        font-size: 64px
    }
}

.pomodoro .pomodoro-app .sequence-counter {
    color: #8a8a8a;
    text-align: center;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    transform: translate(40px,-28px)
}

@media(max-width:767px) {
    .pomodoro .pomodoro-app .sequence-counter {
        transform: translate(24px,-15px)
    }
}

.pomodoro .pomodoro-app .sequence-counter.hidden {
    display: none
}

.pomodoro .pomodoro-app .time-controll {
    display: flex;
    position: relative;
    margin: auto;
    gap: 40px
}

.pomodoro .pomodoro-app button.start {
    display: flex;
    padding: 16px 36px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-radius: 36px;
    background: #ffc502;
    width: 192px;
    height: 56px
}

    .pomodoro .pomodoro-app button.start > span {
        color: #fff;
        font-size: 18px;
        font-style: normal;
        font-weight: 600;
        line-height: 22px
    }

.pomodoro .pomodoro-app button.restart {
    display: flex;
    justify-content: center;
    align-items: center
}

.pomodoro .pomodoro-app #start-timer.hidden, .pomodoro .pomodoro-app #pause-timer.hidden, .pomodoro .pomodoro-app #start-timer-icon.hidden, .pomodoro .pomodoro-app #pause-timer-icon.hidden {
    display: none
}

.pomodoro .pomodoro-app .settings-editor-section {
    display: flex;
    justify-content: center;
    gap: 32px;
    margin-bottom: 40px
}

    .pomodoro .pomodoro-app .settings-editor-section label {
        color: #8a8a8a;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 150%;
        padding-left: 8px
    }

.pomodoro .pomodoro-app .time-settings-field {
    display: inline-block;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px
}

.pomodoro .pomodoro-app .input-wrapper {
    position: relative;
    display: inline-block
}

    .pomodoro .pomodoro-app .input-wrapper::after {
        content: "min";
        display: inline-block;
        top: 50%;
        right: 16px;
        transform: translateY(-50%);
        position: absolute;
        overflow: hidden;
        color: #8a8a8a;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        z-index: 0
    }

.pomodoro .pomodoro-app .time-input {
    z-index: 1;
    border-radius: 8px;
    background-color: transparent;
    border: 1px solid #bebebe;
    max-width: 138px;
    height: 56px;
    width: 100%;
    overflow: hidden;
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    padding-left: 16px;
    outline: none;
    position: relative
}

.pomodoro .pomodoro-app .timer-settings {
    display: flex;
    flex-direction: column;
    padding-top: 80px;
    width: -moz-fit-content;
    width: fit-content;
    margin: auto
}

    .pomodoro .pomodoro-app .timer-settings.hidden {
        display: none
    }

.pomodoro .pomodoro-app .settings.active {
    fill: #ffc502;
    color: #ffc502;
    border: none
}

    .pomodoro .pomodoro-app .settings.active > svg {
        fill: #ffc502;
        color: #ffc502
    }

.pomodoro .pomodoro-app .timer-sequence-settings {
    display: flex;
    flex-direction: row;
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal
}

    .pomodoro .pomodoro-app .timer-sequence-settings:not(:last-child) {
        margin-bottom: 20px
    }

    .pomodoro .pomodoro-app .timer-sequence-settings p {
        overflow: hidden;
        color: #8a8a8a;
        text-overflow: ellipsis;
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        margin: 0
    }

    .pomodoro .pomodoro-app .timer-sequence-settings .label {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding-left: 12px;
        padding-top: 2px;
        gap: 5px
    }

.pomodoro .pomodoro-app .checkbox-container {
    display: block;
    position: relative;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 19px;
    height: 19px
}

    .pomodoro .pomodoro-app .checkbox-container input {
        opacity: 0;
        position: absolute;
        cursor: pointer;
        height: 25px;
        width: 25px;
        top: 0;
        left: 0;
        z-index: 2;
        margin: 0
    }

.pomodoro .tooltip {
    opacity: 1 !important
}

.pomodoro .options {
    display: flex
}

@media(max-width:767px) {
    .pomodoro .options {
        margin-top: 4rem
    }
}

.pomodoro .pomodoro-app .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    width: 19px;
    height: 19px;
    border: 1px solid #8a8a8a;
    background-color: #fff;
    border-radius: 2px
}

.pomodoro .pomodoro-app .checkbox-container:hover input ~ .checkmark {
    border-radius: 2px;
    width: 19px;
    height: 19px
}

.pomodoro .pomodoro-app .checkbox-container input:checked ~ .checkmark {
    background-color: #ffc502;
    border-color: transparent
}

.pomodoro .pomodoro-app .checkmark::after {
    content: "";
    position: absolute;
    display: none
}

.pomodoro .pomodoro-app .checkbox-container .checkmark::after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg)
}

.pomodoro .pomodoro-app .checkbox-container input:checked ~ .checkmark::after {
    display: block
}

.pomodoro .pomodoro-app #Timely-pomodoro-full-screen-toggle .hidden {
    display: none
}

.pomodoro .pomodoro-app .tooltip {
    position: relative
}

    .pomodoro .pomodoro-app .tooltip::after {
        content: "In sequential mode timer selection is locked, go to the settings to disable it";
        position: absolute;
        top: calc(100% + 8px);
        left: 50%;
        width: 300px;
        display: none;
        color: #fff;
        background-color: #333;
        transform: translateX(-50%);
        text-align: left;
        padding: 8px;
        border-radius: 8px;
        z-index: 6
    }

    .pomodoro .pomodoro-app .tooltip::before {
        background-color: #333;
        content: " ";
        display: none;
        position: absolute;
        width: 15px;
        height: 15px;
        top: calc(100% + 10px);
        left: 50%;
        z-index: 4;
        transform: translate(-50%,-50%) rotate(45deg)
    }

    .pomodoro .pomodoro-app .tooltip:not(.hidden):hover::after, .pomodoro .pomodoro-app .tooltip:not(.hidden):hover::before {
        display: block
    }

.pomodoro .pomodoro-app-backgrop {
    position: fixed;
    background-color: #fff;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 999999999999999999
}

    .pomodoro .pomodoro-app-backgrop .logo {
        position: fixed;
        top: 32px;
        left: 12.5%;
        display: none
    }

    .pomodoro .pomodoro-app-backgrop > .pomodoro-app {
        position: absolute;
        top: 50%;
        transform: translateY(-50%) translateX(-50%);
        left: 50%;
        border-radius: 32px;
        background: rgba(255,255,255,.5);
        box-shadow: 0 4px 10px 2px rgba(0,0,0,.17);
        padding: 32px;
        padding-bottom: 72px;
        overflow-y: auto
    }

.Timely-components h2, .Timely-components p {
    margin: 0
}

.Timely-components section#component_top {
    padding: 96px 0
}

    .Timely-components section#component_top .container {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 20px
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#component_top .container {
        flex-direction: column;
        align-items: center;
        gap: 48px
    }
}

.Timely-components section#component_top .container .content {
    min-width: 522px;
    display: flex;
    flex-direction: column
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#component_top .container .content {
        align-items: center;
        margin-top: unset;
        min-width: unset
    }
}

.Timely-components section#component_top .container .content h2, .Timely-components section#component_top .container .content h1 {
    font-family: sans-serif;
    font-size: 52px;
    font-weight: 700;
    line-height: 60.32px;
    text-align: left;
    color: #222324;
    margin-bottom: 32px;
    margin-top: 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#component_top .container .content h2, .Timely-components section#component_top .container .content h1 {
        text-align: center
    }
}

.Timely-components section#component_top .container .content h2 span, .Timely-components section#component_top .container .content h1 span {
    color: #ffc502
}

.Timely-components section#component_top .container .content p {
    max-width: 432px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333;
    margin-bottom: 40px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#component_top .container .content p {
        text-align: center
    }
}

.Timely-components section#component_top .container .content .buttons {
    margin-top: 0 !important;
    display: flex;
    align-items: center;
    gap: 24px
}

@media(max-width:767px) {
    .Timely-components section#component_top .container .content .buttons {
        flex-direction: column
    }
}

.Timely-components section#component_top .container .image {
    width: 100%
}

    .Timely-components section#component_top .container .image img {
        width: 100%
    }

.Timely-components section#component_banner-gray {
    background-color: #f8fafc
}

    .Timely-components section#component_banner-gray .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 40px;
        padding: 96px 0
    }

        .Timely-components section#component_banner-gray .container h2 {
            font-family: sans-serif;
            font-size: 36px;
            font-weight: 700;
            line-height: 45px;
            text-align: center;
            max-width: 846px
        }

@media(max-width:767px) {
    .Timely-components section#component_banner-gray .container h2 {
        font-size: 28px;
        line-height: normal;
        padding: 0 3rem
    }
}

.Timely-components section#component_banner-gray .container h2 span {
    color: #ffc502
}

.Timely-components section#components_badges .container {
    display: flex;
    align-items: center;
    gap: 102px;
    flex-wrap: nowrap
}

    .Timely-components section#components_badges .container img {
        width: 100%
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#components_badges .container {
        display: grid;
        grid-template-columns: repeat(4,1fr);
        gap: 48px 40px
    }

        .Timely-components section#components_badges .container img:nth-of-type(5) {
            grid-column: 2/3
        }
}

@media(max-width:767px) {
    .Timely-components section#components_badges .container {
        display: grid;
        grid-template-columns: repeat(3,1fr);
        gap: 40px 30px
    }
}

.Timely-components section#components_green-statistics .container {
    display: flex;
    justify-content: space-between
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#components_green-statistics .container {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 40px
    }
}

@media(max-width:767px) {
    .Timely-components section#components_green-statistics .container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 40px
    }
}

.Timely-components section#components_green-statistics .container .box {
    display: flex;
    gap: 12px
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .Timely-components section#components_green-statistics .container .box {
        align-items: center;
        justify-content: center
    }
}

.Timely-components section#components_green-statistics .container .box p {
    margin: 0
}

.Timely-components section#components_green-statistics .container .box__text-green {
    padding: 8px 12px;
    gap: 10px;
    border-radius: 8px;
    background: #f2fcf6
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#components_green-statistics .container .box__text-green {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 133px
    }
}

@media(max-width:767px) {
    .Timely-components section#components_green-statistics .container .box__text-green {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 109px
    }
}

.Timely-components section#components_green-statistics .container .box__text-green p {
    font-family: sans-serif;
    font-size: 36px;
    font-weight: 600;
    line-height: 43px;
    letter-spacing: 0;
    text-align: left;
    color: #ffc502
}

@media(max-width:767px) {
    .Timely-components section#components_green-statistics .container .box__text-green p {
        font-size: 28px
    }
}

.Timely-components section#components_green-statistics .container .box__text-black p {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 29px;
    letter-spacing: 0;
    text-align: left;
    color: #323333
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#components_green-statistics .container .box__text-black {
        width: 179px
    }
}

.Timely-components section#components_features {
    display: flex;
    flex-direction: column
}

    .Timely-components section#components_features .container .header {
        margin-bottom: 80px
    }

@media(max-width:767px) {
    .Timely-components section#components_features .container .header {
        margin-bottom: 64px
    }
}

.Timely-components section#components_features .container .header h2 {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: center;
    color: #222324
}

@media(max-width:767px) {
    .Timely-components section#components_features .container .header h2 {
        font-size: 36px;
        line-height: 41.76px
    }
}

.Timely-components section#components_features .container .header h2 span {
    color: #ffc502
}

.Timely-components section#components_features .container .box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 164px
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-components section#components_features .container .box {
        gap: 140px
    }
}

@media(max-width:767px) {
    .Timely-components section#components_features .container .box {
        gap: 96px
    }
}

.Timely-components section#components_features .container .box__singleBox {
    align-items: center
}

    .Timely-components section#components_features .container .box__singleBox.left {
        display: grid;
        grid-template-columns: 1fr 2fr;
        gap: 109px
    }

@media(min-width:768px) and (max-width:991px) {
    .Timely-components section#components_features .container .box__singleBox.left {
        display: flex;
        flex-direction: column;
        gap: 64px
    }
}

@media(max-width:767px) {
    .Timely-components section#components_features .container .box__singleBox.left {
        display: flex;
        flex-direction: column;
        gap: 40px
    }
}

.Timely-components section#components_features .container .box__singleBox.right {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 109px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-components section#components_features .container .box__singleBox.right {
        display: flex;
        flex-direction: column-reverse;
        gap: 64px
    }

        .Timely-components section#components_features .container .box__singleBox.right div.summary {
            order: -1
        }
}

.Timely-components section#components_features .container .box__singleBox .image img {
    width: 100%
}

.Timely-components section#components_features .container .box__singleBox .content {
    display: flex;
    flex-direction: column;
    gap: 32px
}

    .Timely-components section#components_features .container .box__singleBox .content h2 {
        font-family: sans-serif;
        font-size: 36px;
        font-weight: 700;
        line-height: 43.2px;
        text-align: left;
        color: #222324
    }

@media(max-width:767px) {
    .Timely-components section#components_features .container .box__singleBox .content h2 {
        font-size: 28px
    }
}

.Timely-components section#components_features .container .box__singleBox .content span {
    width: 88px;
    height: 2px;
    background-color: #ffc502
}

.Timely-components section#components_features .container .box__singleBox .content p {
    font-family: sans-serif;
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    text-align: left;
    color: #323333
}

.Timely-components section#components_features .container .box__singleBox .summary {
    max-width: 800px;
    grid-column: span 2;
    display: flex;
    align-items: flex-start;
    margin: 0 auto
}

    .Timely-components section#components_features .container .box__singleBox .summary p {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 600;
        line-height: 26px;
        text-align: center;
        color: #323333
    }

        .Timely-components section#components_features .container .box__singleBox .summary p img {
            margin-right: 12px
        }

        .Timely-components section#components_features .container .box__singleBox .summary p span {
            color: #ffc502
        }

.Timely-components section#components_features .container .box a {
    margin-top: -4rem
}

@media(max-width:767px) {
    .Timely-components section#components_features .container .box a {
        margin-top: -1rem
    }
}

.Timely-components section#components_features .container .button {
    display: flex;
    width: 100%
}

    .Timely-components section#components_features .container .button button, .Timely-components section#components_features .container .button a {
        margin: 96px auto 0
    }

@media(min-width:768px) and (max-width:991px) {
    .Timely-components section#components_features .container .button button, .Timely-components section#components_features .container .button a {
        margin: 64px auto 0
    }
}

@media(max-width:767px) {
    .Timely-components section#components_features .container .button button, .Timely-components section#components_features .container .button a {
        margin: 48px auto 0
    }
}

.Timely-components section#components_did-you-know-line .container .header {
    display: grid;
    grid-template-columns: minmax(auto,122px) minmax(auto,415px) minmax(auto,1000px);
    gap: 20px
}

@media(min-width:992px) and (max-width:1440px) {
    .Timely-components section#components_did-you-know-line .container .header {
        grid-template-columns: minmax(auto,122px) minmax(auto,415px) minmax(auto,1000px)
    }
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-components section#components_did-you-know-line .container .header {
        grid-template-columns: minmax(auto,122px) minmax(auto,172px) minmax(auto,350px)
    }
}

@media(max-width:767px) {
    .Timely-components section#components_did-you-know-line .container .header {
        grid-template-columns: minmax(auto,122px) 1fr
    }
}

.Timely-components section#components_did-you-know-line .container .header p {
    color: #323333;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    margin-top: 3px
}

.Timely-components section#components_did-you-know-line .container .header div {
    height: 2px;
    background-color: #b7bbc2;
    margin-top: 1rem
}

.Timely-components section#components_did-you-know-line .container .header h2 {
    color: #222324;
    font-size: 36px;
    font-weight: 600
}

    .Timely-components section#components_did-you-know-line .container .header h2 span {
        color: #ffc502
    }

@media(max-width:767px) {
    .Timely-components section#components_did-you-know-line .container .header h2 {
        grid-column: 1/3;
        font-size: 28px
    }
}

.Timely-components section#components_boxes-on-green .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 0;
    background-color: #f2fcf6;
    border-radius: 24px
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-components section#components_boxes-on-green .container {
        padding: 64px 80px
    }
}

@media(max-width:767px) {
    .Timely-components section#components_boxes-on-green .container {
        padding: 48px 24px
    }
}

.Timely-components section#components_boxes-on-green .container span.label {
    color: #ffc502;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 19.2px;
    text-transform: uppercase;
    margin-bottom: 16px
}

.Timely-components section#components_boxes-on-green .container h2.title {
    font-family: sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 43.2px;
    text-align: center;
    color: #222324;
    margin-bottom: 64px;
    max-width: 825px
}

    .Timely-components section#components_boxes-on-green .container h2.title span {
        color: #ffc502
    }

@media(min-width:768px) and (max-width:991px) {
    .Timely-components section#components_boxes-on-green .container h2.title {
        margin-bottom: 80px
    }
}

@media(max-width:767px) {
    .Timely-components section#components_boxes-on-green .container h2.title {
        font-size: 28px;
        line-height: normal
    }
}

.Timely-components section#components_boxes-on-green .container .boxes {
    display: grid;
    grid-template-columns: repeat(2,413px);
    gap: 32px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-components section#components_boxes-on-green .container .boxes {
        grid-template-columns: repeat(1,1fr)
    }
}

.Timely-components section#components_boxes-on-green .container .boxes__singleBox {
    padding: 40px 24px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 10px 0 #7d808626;
    border-radius: 16px
}

    .Timely-components section#components_boxes-on-green .container .boxes__singleBox img {
        margin-bottom: 1rem;
        width: 32px
    }

    .Timely-components section#components_boxes-on-green .container .boxes__singleBox span {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        color: #ffc502;
        margin-bottom: 1rem
    }

    .Timely-components section#components_boxes-on-green .container .boxes__singleBox h2 {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 600;
        line-height: 28.8px;
        text-align: left;
        margin-bottom: 12px;
        color: #222324
    }

    .Timely-components section#components_boxes-on-green .container .boxes__singleBox p {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: left;
        color: #323333
    }

.Timely-components section#components_full-banner-navy-blue {
    background-color: #0a1a38;
    position: relative;
    overflow: hidden
}

    .Timely-components section#components_full-banner-navy-blue .image {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%) translateX(40%)
    }

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-components section#components_full-banner-navy-blue .image {
        display: none
    }
}

.Timely-components section#components_full-banner-navy-blue .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 0
}

    .Timely-components section#components_full-banner-navy-blue .container h2 {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 600;
        line-height: 52.8px;
        text-align: center;
        margin-bottom: 40px;
        color: #fff;
        max-width: 846px
    }

@media(max-width:767px) {
    .Timely-components section#components_full-banner-navy-blue .container h2 {
        font-size: 36px
    }
}

.Timely-components section#components_full-banner-navy-blue .container p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 21.6px;
    text-align: center;
    color: #fff
}

.Timely-components section#components_full-banner-navy-blue .container div.buttons {
    display: flex;
    gap: 24px
}

.Timely-components section#components_full-small-banner {
    background-color: #f8fafc;
    padding: 48px 0;
    display: flex;
    align-items: center;
    justify-content: center
}

    .Timely-components section#components_full-small-banner .container {
        width: 1024px;
        gap: 2rem;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-components section#components_full-small-banner .container {
        padding: 0 15px;
        width: 100%;
        flex-direction: column;
        gap: 40px
    }
}

.Timely-components section#components_full-small-banner .container p {
    font-family: sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 33.6px;
    text-align: left;
    color: #222324
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .Timely-components section#components_full-small-banner .container p {
        text-align: center
    }
}

.Timely-components section#components_full-small-banner .container p span {
    color: #ffc502
}

.Timely-components section#components_full-small-banner .container a, .Timely-components section#components_full-small-banner .container button {
    white-space: nowrap
}

.Timely-components section#components-banner-cta .container .banner {
    background-color: #0a1a38;
    padding: 48px 48px 48px 195px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    border-radius: 24px;
    gap: 40px;
    overflow: hidden
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px) {
    .Timely-components section#components-banner-cta .container .banner {
        padding: 48px 40px;
        flex-direction: column;
        align-items: unset
    }
}

@media(max-width:767px) {
    .Timely-components section#components-banner-cta .container .banner {
        padding: 48px 32px;
        flex-direction: column
    }
}

.Timely-components section#components-banner-cta .container .banner .image {
    position: absolute;
    top: -2.5rem;
    left: -3rem
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px) {
    .Timely-components section#components-banner-cta .container .banner .image {
        top: unset;
        left: unset;
        bottom: -2.5rem;
        right: -2.1rem
    }
}

@media(max-width:767px) {
    .Timely-components section#components-banner-cta .container .banner .image {
        display: none
    }
}

.Timely-components section#components-banner-cta .container .banner .content p {
    font-family: sans-serif;
    font-size: 28px;
    font-weight: 600;
    line-height: 33.6px;
    text-align: left;
    color: #fff
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px) {
    .Timely-components section#components-banner-cta .container .banner .content p {
        max-width: 500px
    }
}

@media(max-width:767px) {
    .Timely-components section#components-banner-cta .container .banner .content p {
        text-align: center
    }
}

.Timely-components section#components-banner-cta .container .banner .content p span {
    color: #ffc502
}

.Timely-components section#components-banner-cta .container .banner a, .Timely-components section#components-banner-cta .container .banner button {
    white-space: nowrap
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px) {
    .Timely-components section#components-banner-cta .container .banner a, .Timely-components section#components-banner-cta .container .banner button {
        width: fit-content
    }
}

@media(max-width:767px) {
    .Timely-components section#components-banner-cta .container .banner a, .Timely-components section#components-banner-cta .container .banner button {
        width: 100%
    }
}

.Timely-components section#components-avaible-platforms .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 40px
}

    .Timely-components section#components-avaible-platforms .container .header {
        display: flex;
        align-items: center;
        justify-content: center
    }

        .Timely-components section#components-avaible-platforms .container .header h2 {
            font-family: sans-serif;
            font-size: 44px;
            font-weight: 700;
            line-height: 51.04px;
            text-align: center;
            color: #222324
        }

@media(max-width:767px) {
    .Timely-components section#components-avaible-platforms .container .header h2 {
        font-size: 36px
    }
}

.Timely-components section#components-avaible-platforms .container .avaible-platforms {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.Timely-components section#components-avaible-platforms .container .avaible-platforms__buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 80px;
    margin-bottom: 40px
}

@media(max-width:767px) {
    .Timely-components section#components-avaible-platforms .container .avaible-platforms__buttons {
        gap: 64px
    }
}

.Timely-components section#components-avaible-platforms .container .avaible-platforms button.single-platform {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: center;
    color: #000;
    background-color: transparent;
    outline: none;
    text-decoration: none;
    border: none;
    padding: 0 0 4px
}

    .Timely-components section#components-avaible-platforms .container .avaible-platforms button.single-platform.active {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 600;
        line-height: 26px;
        text-align: center;
        border-bottom: 2px solid #ffc502
    }

.Timely-components section#components-avaible-platforms .container .avaible-platforms .image img {
    width: 100%;
    display: none
}

    .Timely-components section#components-avaible-platforms .container .avaible-platforms .image img.active {
        display: block
    }

.Timely-components section#component_statistics {
    margin: 120px 0 150px
}

@media(max-width:767px) {
    .Timely-components section#component_statistics {
        margin: 100px 0 120px
    }
}

.Timely-components section#component_statistics .container {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    border-bottom: 2px solid #e9ebed;
    border-top: 2px solid #e9ebed
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#component_statistics .container {
        grid-template-columns: repeat(2,1fr);
        border-bottom: unset;
        border-top: unset
    }
}

.Timely-components section#component_statistics .container .box {
    display: flex;
    flex-direction: column;
    padding: 40px 90px;
    gap: 12px
}

@media(max-width:767px) {
    .Timely-components section#component_statistics .container .box {
        padding: 40px 17px
    }
}

.Timely-components section#component_statistics .container .box:nth-of-type(1), .Timely-components section#component_statistics .container .box:nth-of-type(2), .Timely-components section#component_statistics .container .box:nth-of-type(3) {
    border-right: 2px solid #e9ebed
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .Timely-components section#component_statistics .container .box:nth-of-type(1), .Timely-components section#component_statistics .container .box:nth-of-type(2) {
        border-bottom: 2px solid #e9ebed
    }

    .Timely-components section#component_statistics .container .box:nth-of-type(1), .Timely-components section#component_statistics .container .box:nth-of-type(3) {
        border-left: 2px solid #e9ebed
    }

    .Timely-components section#component_statistics .container .box:nth-of-type(4) {
        border-right: 2px solid #e9ebed
    }
}

.Timely-components section#component_statistics .container .box p {
    margin: 0
}

.Timely-components section#component_statistics .container .box__text-green p {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 600;
    line-height: 51.04px;
    text-align: left
}

@media(max-width:767px) {
    .Timely-components section#component_statistics .container .box__text-green p {
        font-size: 28px
    }
}

.Timely-components section#component_statistics .container .box__text-black p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 21.6px;
    text-align: left;
    color: #323333
}

.Timely-components section#components_certificates {
    margin: 140px 0 164px
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-components section#components_certificates {
        margin: 120px 0 140px
    }
}

@media(max-width:767px) {
    .Timely-components section#components_certificates {
        margin: 96px 0 120px
    }
}

.Timely-components section#components_certificates .container {
    display: flex;
    flex-direction: column;
    gap: 80px
}

@media(max-width:767px) {
    .Timely-components section#components_certificates .container {
        gap: 64px
    }
}

.Timely-components section#components_certificates .container .headers {
    max-width: 630px
}

    .Timely-components section#components_certificates .container .headers h2 {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: left;
        color: #222324;
        margin-bottom: 32px
    }

@media(max-width:767px) {
    .Timely-components section#components_certificates .container .headers h2 {
        font-size: 36px
    }
}

.Timely-components section#components_certificates .container .headers p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333;
    max-width: 520px
}

.Timely-components section#components_certificates .container .boxes {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 62.5px
}

@media(min-width:768px) and (max-width:991px) {
    .Timely-components section#components_certificates .container .boxes {
        grid-template-columns: repeat(2,1fr);
        gap: 64px 80px
    }
}

@media(max-width:767px) {
    .Timely-components section#components_certificates .container .boxes {
        grid-template-columns: 1fr;
        gap: 64px
    }
}

.Timely-components section#components_certificates .container .boxes .singleBox {
    display: flex;
    flex-direction: column;
    gap: 25px
}

    .Timely-components section#components_certificates .container .boxes .singleBox img {
        width: 120px
    }

    .Timely-components section#components_certificates .container .boxes .singleBox div.text {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding-left: 20px;
        border-left: 2px solid #ffc502;
        height: 100%
    }

        .Timely-components section#components_certificates .container .boxes .singleBox div.text h3 {
            font-family: sans-serif;
            font-size: 24px;
            font-weight: 600;
            line-height: 26px;
            text-align: left;
            color: #323333
        }

        .Timely-components section#components_certificates .container .boxes .singleBox div.text p {
            font-family: sans-serif;
            font-size: 18px;
            font-weight: 400;
            line-height: 26px;
            text-align: left;
            color: #323333
        }

.ppc-landings #components_features a, .ppc-landings #components_features button {
    font-family: sans-serif
}

.ppc-landings #fixed-form {
    margin-top: -5.5rem;
    opacity: 0;
    visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    background-color: rgba(255,255,255,.822);
    height: 100vh;
    width: 100vw;
    z-index: 99999999999999999999999;
    transition: all .2s ease-in-out
}

    .ppc-landings #fixed-form.visible {
        opacity: 1;
        visibility: visible
    }

    .ppc-landings #fixed-form .form-box {
        width: 480px;
        padding: 60px 32px 48px;
        display: flex;
        flex-direction: column;
        gap: 48px;
        box-shadow: 0 5px 24px -2px #0000001f;
        background: #fff;
        border-radius: 24px;
        position: relative
    }

        .ppc-landings #fixed-form .form-box .exit-button {
            position: absolute;
            top: 1rem;
            right: 1.5rem;
            font-size: 22px;
            font-weight: 100;
            transform: scaleX(1.2);
            color: #222324;
            cursor: pointer;
            transition: all .2s ease-in-out
        }

            .ppc-landings #fixed-form .form-box .exit-button:hover {
                color: #1da44c
            }

.ppc-landings #top-element {
    padding: 64px 0 120px;
    margin-bottom: 3rem
}

@media(max-width:767px) {
    .ppc-landings #top-element {
        padding-top: 2rem
    }
}

.ppc-landings #top-element .container {
    display: flex;
    gap: 20px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-landings #top-element .container {
        gap: 64px;
        flex-direction: column;
        align-items: center
    }
}

.ppc-landings #top-element .container .content {
    margin-top: 3rem;
    display: flex;
    flex-direction: column;
    min-width: 522px;
    max-width: 522px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-landings #top-element .container .content {
        margin-top: unset;
        align-items: center;
        justify-content: center
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .ppc-landings #top-element .container .content {
        min-width: 563px;
        max-width: 563px
    }
}

@media(max-width:767px) {
    .ppc-landings #top-element .container .content {
        min-width: unset;
        max-width: unset;
        width: 100%
    }
}

.ppc-landings #top-element .container .content h2 {
    font-family: sans-serif;
    font-size: 52px;
    font-weight: 700;
    line-height: 60.32px;
    text-align: left;
    margin-bottom: 32px;
    color: #222324
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-landings #top-element .container .content h2 {
        text-align: center
    }
}

.ppc-landings #top-element .container .content p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333;
    max-width: 434px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-landings #top-element .container .content p {
        max-width: unset;
        text-align: center
    }
}

.ppc-landings #top-element .container .content div.buttons {
    margin-top: 40px;
    display: flex;
    gap: 24px
}

@media(max-width:767px) {
    .ppc-landings #top-element .container .content div.buttons {
        flex-direction: column
    }
}

.ppc-landings #top-element .container .image {
    width: 100%
}

    .ppc-landings #top-element .container .image img {
        width: 100%
    }

.ppc-landings #top-element .container .form {
    width: 100%;
    position: relative
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .ppc-landings #top-element .container .form {
        display: flex;
        align-items: center;
        justify-content: center
    }
}

.ppc-landings #top-element .container .form .pipedriveWebForms {
    width: 480px;
    background-color: #fff;
    box-shadow: 0 8px 32px 0 #7d808633;
    padding: 32px;
    border-radius: 20px
}

@media(max-width:767px) {
    .ppc-landings #top-element .container .form .pipedriveWebForms {
        width: 100%
    }
}

.ppc-landings #top-element .container .green-shadow {
    position: absolute;
    bottom: -3rem;
    right: 0;
    background-color: #f2fcf6;
    border-radius: 20px;
    width: 480px;
    height: 100%;
    z-index: -1
}

@media(min-width:1920px) {
    .ppc-landings #top-element .container .green-shadow {
        bottom: -3rem;
        right: 50%;
        transform: translateX(50%)
    }
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #top-element .container .green-shadow {
        bottom: -2rem;
        right: 50%;
        transform: translateX(calc(50% + 2.5rem))
    }
}

@media(max-width:767px) {
    .ppc-landings #top-element .container .green-shadow {
        display: none
    }
}

.ppc-landings #pricing-2024 .container .top h2 {
    color: #222324 !important;
    font-family: sans-serif !important;
    font-size: 44px !important;
    font-weight: 700 !important;
    line-height: 51.04px !important;
    text-align: left !important
}

    .ppc-landings #pricing-2024 .container .top h2 span {
        color: #ffc502
    }

.ppc-landings #pricing-2024 .container .top p {
    font-family: sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 26px !important;
    text-align: left !important;
    color: #323333 !important
}

.ppc-landings #pricing-2024 .container a, .ppc-landings #pricing-2024 .container button {
    font-family: sans-serif;
    padding: 16px 0 !important;
    width: 100%
}

.ppc-landings #youtube-video {
    margin: 120px 0
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #youtube-video {
        margin: 100px 0
    }
}

@media(max-width:767px) {
    .ppc-landings #youtube-video {
        margin: 80px 0
    }
}

.ppc-landings #youtube-video .container .video-youtube {
    margin: 0 !important
}

.ppc-landings #components_green-statistics .box__text-black {
    display: flex;
    align-items: center
}

    .ppc-landings #components_green-statistics .box__text-black p {
        font-family: sans-serif !important;
        font-size: 18px !important;
        font-weight: 400 !important;
        line-height: 21.6px !important;
        text-align: left !important
    }

.ppc-landings #components_did-you-know-line {
    margin-bottom: 164px
}

    .ppc-landings #components_did-you-know-line p, .ppc-landings #components_did-you-know-line h2 {
        font-family: sans-serif !important
    }

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #components_did-you-know-line {
        margin-bottom: 140px
    }
}

@media(max-width:767px) {
    .ppc-landings #components_did-you-know-line {
        margin-bottom: 120px
    }
}

.ppc-landings #components_boxes-on-green {
    margin: 164px 0 180px
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #components_boxes-on-green {
        margin: 140px 0 164px
    }
}

@media(max-width:767px) {
    .ppc-landings #components_boxes-on-green {
        margin: 120px 0 140px
    }
}

.ppc-landings #components_badges {
    margin: 180px 0
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #components_badges {
        margin: 164px 0
    }
}

@media(max-width:767px) {
    .ppc-landings #components_badges {
        margin: 140px 0
    }
}

.ppc-landings #components_full-banner-navy-blue {
    margin-bottom: 180px
}

.ppc-landings #components_full-small-banner {
    margin-top: 140px
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #components_full-small-banner {
        margin-top: 120px
    }
}

@media(max-width:767px) {
    .ppc-landings #components_full-small-banner {
        margin-top: 96px
    }
}

.ppc-landings #thank-you {
    margin-top: 6rem;
    display: flex;
    flex-direction: column;
    gap: 140px
}

@media(max-width:767px) {
    .ppc-landings #thank-you {
        margin-top: 3rem;
        gap: 96px
    }
}

.ppc-landings #thank-you .container {
    display: flex;
    align-items: center;
    justify-content: space-between
}

    .ppc-landings #thank-you .container .content {
        max-width: 630px
    }

        .ppc-landings #thank-you .container .content h2 {
            font-family: sans-serif;
            font-size: 44px;
            font-weight: 700;
            line-height: 51.04px;
            text-align: left;
            margin-bottom: 32px
        }

        .ppc-landings #thank-you .container .content p {
            font-family: sans-serif;
            font-size: 18px;
            font-weight: 400;
            line-height: 26px;
            text-align: left
        }

    .ppc-landings #thank-you .container .calendly {
        width: 100%
    }

        .ppc-landings #thank-you .container .calendly .box {
            width: 504px;
            height: 600px
        }

.ppc-landings #thank-you-page {
    padding-top: 9rem;
    position: relative
}

@media(min-width:1920px) {
    .ppc-landings #thank-you-page {
        height: calc(100vh - 90px)
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .ppc-landings #thank-you-page {
        padding-top: 4rem
    }
}

.ppc-landings #thank-you-page::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 50%;
    height: calc(100% - 3rem);
    background-color: #f8fafc;
    border-radius: 100px 0 0 0;
    z-index: -1
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .ppc-landings #thank-you-page::after {
        width: 95%;
        height: 71%
    }
}

@media(max-width:767px) {
    .ppc-landings #thank-you-page::after {
        display: none
    }
}

.ppc-landings #thank-you-page .container {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-bottom: 4rem
}

@media(min-width:1920px) {
    .ppc-landings #thank-you-page .container {
        padding-bottom: 0
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .ppc-landings #thank-you-page .container {
        flex-direction: column;
        align-items: center;
        gap: 128px
    }
}

@media(max-width:767px) {
    .ppc-landings #thank-you-page .container {
        flex-direction: column;
        align-items: center;
        gap: 64px
    }
}

.ppc-landings #thank-you-page .container .content {
    max-width: 630px;
    margin-top: 5rem
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .ppc-landings #thank-you-page .container .content {
        max-width: unset;
        margin-top: 0
    }
}

.ppc-landings #thank-you-page .container .content h2 {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: left;
    margin-bottom: 32px
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .ppc-landings #thank-you-page .container .content h2 {
        text-align: center
    }
}

@media(max-width:767px) {
    .ppc-landings #thank-you-page .container .content h2 {
        font-family: sans-serif;
        font-size: 36px;
        font-weight: 700;
        line-height: 41.76px;
        text-align: center
    }
}

.ppc-landings #thank-you-page .container .content p {
    max-width: 520px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .ppc-landings #thank-you-page .container .content p {
        max-width: unset;
        text-align: center
    }
}

@media(max-width:767px) {
    .ppc-landings #thank-you-page .container .content p {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: center
    }
}

.ppc-landings #thank-you-page .container .content .green-arrow {
    position: absolute;
    right: 52%
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .ppc-landings #thank-you-page .container .content .green-arrow {
        display: none
    }
}

.ppc-landings #thank-you-page .container .calendly {
    box-shadow: 0 8px 32px 0 #7d808633;
    height: 600px;
    width: 520px
}

@media(max-width:767px) {
    .ppc-landings #thank-you-page .container .calendly {
        width: 100%;
        height: 100%
    }
}

.ppc-landings #CompaniesCarousel {
    overflow: hidden;
    z-index: 2;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center
}

    .ppc-landings #CompaniesCarousel .subHeaders {
        display: flex;
        flex-direction: column;
        max-width: 630px;
        margin-bottom: 80px
    }

@media(max-width:767px) {
    .ppc-landings #CompaniesCarousel .subHeaders {
        margin-bottom: 64px
    }
}

.ppc-landings #CompaniesCarousel .subHeaders > *:not(:last-child) {
    margin-bottom: 32px
}

.ppc-landings #CompaniesCarousel .subHeaders__header {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: left
}

@media(max-width:767px) {
    .ppc-landings #CompaniesCarousel .subHeaders__header {
        font-size: 36px
    }
}

.ppc-landings #CompaniesCarousel .subHeaders__header span {
    color: #ffc502
}

.ppc-landings #CompaniesCarousel .subHeaders__paragraph {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    max-width: 521px
}

@media(max-width:767px) {
    .ppc-landings #CompaniesCarousel .subHeaders__paragraph {
        font-size: 18px
    }
}

.ppc-landings #CompaniesCarousel .CompaniesCarousel {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 2465px;
    overflow: hidden
}

    .ppc-landings #CompaniesCarousel .CompaniesCarousel::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 10rem;
        height: 100%;
        z-index: 2;
        background: linear-gradient(90deg,#f8fafc 42%,rgba(255,255,255,0) 100%)
    }

    .ppc-landings #CompaniesCarousel .CompaniesCarousel::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 10rem;
        height: 100%;
        z-index: 2;
        background: linear-gradient(270deg,#f8fafc 42%,rgba(255,255,255,0) 100%)
    }

.ppc-landings #CompaniesCarousel .CompaniesCarousel__singleCarousel {
    opacity: .3;
    display: grid;
    grid-template-columns: repeat(24,108px);
    gap: 80px;
    position: relative;
    width: 100%;
    animation: slider 55s linear infinite
}

@media only screen and (max-width:1900px) and (min-width:1200px) {
    .ppc-landings #CompaniesCarousel .CompaniesCarousel__singleCarousel {
        gap: 40px;
        animation: slider-mini 55s linear infinite
    }
}

.ppc-landings #CompaniesCarousel .CompaniesCarousel__singleCarousel:nth-of-type(2) {
    margin-left: 3.5rem;
    animation-direction: reverse;
    animation-duration: 55s
}

.ppc-landings #CompaniesCarousel .CompaniesCarousel__singleCarousel:nth-of-type(3) {
    margin-left: -2rem;
    animation-duration: 50s
}

.ppc-landings #CompaniesCarousel .CompaniesCarousel__singleCarousel:not(:last-child) {
    margin-bottom: 40px
}

.ppc-landings #CompaniesCarousel .CompaniesCarousel__singleCarousel .img {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 108px;
    border-radius: 24px;
    border: .2px solid #b7bbc244;
    background: #fff;
    box-shadow: 0 4px 10px 0 rgba(125,128,134,.15)
}

.ppc-landings #CompaniesCarousel .CompaniesCarousel .Timely-logo {
    position: absolute;
    top: calc(50% - 115px);
    left: calc(50% - 95px);
    width: 189px;
    height: 189px;
    border-radius: 24px;
    border: .2px solid #b7bbc249;
    background: #fff;
    box-shadow: 0 8px 32px 0 rgba(125,128,134,.2);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px
}

    .ppc-landings #CompaniesCarousel .CompaniesCarousel .Timely-logo img {
        width: 100%
    }

.ppc-landings #benefits-switch {
    margin: 164px 0
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #benefits-switch {
        margin: 140px 0
    }
}

@media(max-width:767px) {
    .ppc-landings #benefits-switch {
        margin: 120px 0
    }
}

.ppc-landings #benefits-switch .container {
    display: flex;
    gap: 128px;
    justify-content: space-between;
    align-items: center
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .ppc-landings #benefits-switch .container {
        flex-direction: column;
        align-items: flex-start
    }
}

@media(min-width:768px) and (max-width:1150px),(min-width:768px) and (max-width:991px) {
    .ppc-landings #benefits-switch .container {
        gap: 80px
    }
}

@media(max-width:767px) {
    .ppc-landings #benefits-switch .container {
        gap: 64px
    }
}

.ppc-landings #benefits-switch .container .content {
    max-width: 522px;
    display: flex;
    flex-direction: column;
    gap: 80px
}

@media(max-width:767px) {
    .ppc-landings #benefits-switch .container .content {
        gap: 64px
    }
}

.ppc-landings #benefits-switch .container .content__header h2 {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: left;
    color: #222324
}

@media(max-width:767px) {
    .ppc-landings #benefits-switch .container .content__header h2 {
        font-size: 36px;
        line-height: 41.76px
    }
}

.ppc-landings #benefits-switch .container .content__header h2 span {
    color: #ffc502
}

.ppc-landings #benefits-switch .container .content__boxes {
    display: flex;
    flex-direction: column;
    gap: 48px
}

    .ppc-landings #benefits-switch .container .content__boxes .singleBox {
        border-left: 2px solid #e9ebed;
        padding-left: 16px;
        cursor: pointer;
        transition: all .2s ease-in-out
    }

        .ppc-landings #benefits-switch .container .content__boxes .singleBox h2 {
            font-family: sans-serif;
            font-size: 24px;
            font-weight: 700;
            line-height: 28.8px;
            text-align: left;
            color: #a3a3a3;
            padding-bottom: 12px
        }

        .ppc-landings #benefits-switch .container .content__boxes .singleBox p {
            font-family: sans-serif;
            font-size: 18px;
            font-weight: 400;
            line-height: 26px;
            text-align: left;
            color: #a3a3a3
        }

        .ppc-landings #benefits-switch .container .content__boxes .singleBox.active {
            border-left: 2px solid #ffc502
        }

            .ppc-landings #benefits-switch .container .content__boxes .singleBox.active h2 {
                color: #323333
            }

            .ppc-landings #benefits-switch .container .content__boxes .singleBox.active p {
                color: #323333
            }

.ppc-landings #benefits-switch .container .images {
    max-width: 630px
}

    .ppc-landings #benefits-switch .container .images .singleImg {
        display: none;
        opacity: 0;
        transition: all .2s ease-in-out
    }

        .ppc-landings #benefits-switch .container .images .singleImg img {
            width: 100%
        }

        .ppc-landings #benefits-switch .container .images .singleImg.active {
            display: block;
            opacity: 1
        }

.ppc-landings #customer-stories {
    margin: 140px 0 164px
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #customer-stories {
        margin: 120px 0 140px
    }
}

@media(max-width:767px) {
    .ppc-landings #customer-stories {
        margin: 96px 0 120px
    }
}

.ppc-landings #customer-stories .container {
    display: flex;
    flex-direction: column;
    gap: 80px
}

@media(max-width:767px) {
    .ppc-landings #customer-stories .container {
        gap: 64px
    }
}

.ppc-landings #customer-stories .container .header {
    display: flex;
    flex-direction: column
}

    .ppc-landings #customer-stories .container .header h2 {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: left;
        color: #222324;
        margin-bottom: 32px
    }

    .ppc-landings #customer-stories .container .header p {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: left;
        color: #323333;
        max-width: 521px
    }

.ppc-landings #customer-stories .container .boxes {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 22px
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(max-width:767px) {
    .ppc-landings #customer-stories .container .boxes {
        grid-template-columns: 1fr;
        gap: 32px
    }
}

.ppc-landings #customer-stories .container .boxes .singleBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 32px;
    border-radius: 16px;
    box-shadow: 0 8px 32px 0 #7d808633
}

    .ppc-landings #customer-stories .container .boxes .singleBox img.logo {
        height: 48px;
        margin-bottom: 48px
    }

    .ppc-landings #customer-stories .container .boxes .singleBox p.content {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: left;
        color: #323333;
        margin-bottom: 12px
    }

    .ppc-landings #customer-stories .container .boxes .singleBox span.signature {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: left;
        color: #6b6b6b;
        margin-bottom: 40px
    }

    .ppc-landings #customer-stories .container .boxes .singleBox a {
        display: flex;
        align-items: center;
        cursor: pointer
    }

        .ppc-landings #customer-stories .container .boxes .singleBox a:hover img {
            margin-left: 10px
        }

        .ppc-landings #customer-stories .container .boxes .singleBox a span {
            font-family: sans-serif;
            font-size: 18px;
            font-weight: 600;
            line-height: 22px;
            text-align: left;
            color: #222324
        }

        .ppc-landings #customer-stories .container .boxes .singleBox a img {
            width: 20px;
            margin-left: 6px;
            transition: all .1s ease-in-out
        }

.ppc-landings #components-banner-cta {
    margin: 140px 0 !important
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #components-banner-cta {
        margin: 120px 0 !important
    }
}

@media(max-width:767px) {
    .ppc-landings #components-banner-cta {
        margin: 96px 0 !important
    }
}

.ppc-landings #components-avaible-platforms {
    margin: 164px 0
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings #components-avaible-platforms {
        margin: 140px 0
    }
}

@media(max-width:767px) {
    .ppc-landings #components-avaible-platforms {
        margin: 120px 0
    }
}

.ppc-landings-industries #components_green-statistics {
    margin-bottom: 140px !important
}

@media(max-width:767px) {
    .ppc-landings-industries #components_green-statistics {
        margin-bottom: 120px !important
    }
}

.ppc-landings-industries #youtube-video {
    margin: 140px 0
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings-industries #youtube-video {
        margin: 120px 0
    }
}

@media(max-width:767px) {
    .ppc-landings-industries #youtube-video {
        margin: 96px 0
    }
}

.ppc-landings-industries #pricing-2024 {
    margin-top: 164px !important
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings-industries #pricing-2024 {
        margin-top: 140px !important
    }
}

@media(max-width:767px) {
    .ppc-landings-industries #pricing-2024 {
        margin-top: 120px !important
    }
}

.ppc-landings-industries #components-banner-cta {
    margin-bottom: 140px !important
}

@media(min-width:768px) and (max-width:991px) {
    .ppc-landings-industries #components-banner-cta {
        margin-bottom: 120px !important
    }
}

@media(max-width:767px) {
    .ppc-landings-industries #components-banner-cta {
        margin-bottom: 96px !important
    }
}

.articles_2024 img.mobile {
    display: none
}

@media(max-width:767px) {
    .articles_2024 img.mobile {
        display: block
    }
}

.articles_2024 img.desktop {
    display: block
}

@media(max-width:767px) {
    .articles_2024 img.desktop {
        display: none
    }
}

.articles_2024 #green_statistics {
    margin: 120px 0 150px
}

@media(max-width:767px) {
    .articles_2024 #green_statistics {
        margin: 100px 0 120px
    }
}

.articles_2024 #green_statistics .container {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    border-bottom: 2px solid #e9ebed;
    border-top: 2px solid #e9ebed
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .articles_2024 #green_statistics .container {
        grid-template-columns: repeat(2,1fr);
        border-bottom: unset;
        border-top: unset
    }
}

.articles_2024 #green_statistics .container .box {
    display: flex;
    flex-direction: column;
    padding: 40px 90px;
    gap: 12px
}

@media(max-width:767px) {
    .articles_2024 #green_statistics .container .box {
        padding: 40px 17px
    }
}

.articles_2024 #green_statistics .container .box:nth-of-type(1), .articles_2024 #green_statistics .container .box:nth-of-type(2), .articles_2024 #green_statistics .container .box:nth-of-type(3) {
    border-right: 2px solid #e9ebed
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .articles_2024 #green_statistics .container .box:nth-of-type(1), .articles_2024 #green_statistics .container .box:nth-of-type(2) {
        border-bottom: 2px solid #e9ebed
    }

    .articles_2024 #green_statistics .container .box:nth-of-type(1), .articles_2024 #green_statistics .container .box:nth-of-type(3) {
        border-left: 2px solid #e9ebed
    }

    .articles_2024 #green_statistics .container .box:nth-of-type(4) {
        border-right: 2px solid #e9ebed
    }
}

.articles_2024 #green_statistics .container .box p {
    margin: 0
}

.articles_2024 #green_statistics .container .box__text-green p {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 600;
    line-height: 51.04px;
    text-align: left
}

@media(max-width:767px) {
    .articles_2024 #green_statistics .container .box__text-green p {
        font-size: 28px
    }
}

.articles_2024 #green_statistics .container .box__text-black p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 21.6px;
    text-align: left;
    color: #323333
}

.articles_2024 section#component_top {
    overflow: hidden;
    z-index: 10
}

@media(max-width:767px) {
    .articles_2024 section#component_top {
        padding: 48px 0 !important
    }
}

.articles_2024 section#component_top .container {
    position: relative
}

    .articles_2024 section#component_top .container img.green-circle {
        position: absolute;
        top: 0;
        right: 0;
        z-index: -1
    }

@media(max-width:767px) {
    .articles_2024 section#component_top .container img.green-circle {
        display: none
    }
}

.articles_2024 section#component_top .container img.green-circle:first-of-type {
    right: 0;
    top: -6rem
}

.articles_2024 section#component_top .container img.green-circle:last-of-type {
    top: 0;
    right: -2rem
}

.articles_2024 section#component_top .container .content .buttons {
    font-family: sans-serif
}

    .articles_2024 section#component_top .container .content .buttons .button-wrapper__google a {
        margin-left: .3rem
    }

.articles_2024 section#table-of-content {
    margin-top: 8rem;
    margin-bottom: 80px;
    display: flex;
    align-items: center;
    justify-content: center
}

    .articles_2024 section#table-of-content .container {
        width: 1220px;
        display: flex;
        flex-wrap: wrap;
        gap: 18px 16px
    }

        .articles_2024 section#table-of-content .container a {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 16px;
            padding: 13px 32px;
            border-radius: 8px;
            background-color: #f2fcf6;
            transition: all .2s ease-in-out
        }

            .articles_2024 section#table-of-content .container a:hover span {
                color: #17b54e
            }

            .articles_2024 section#table-of-content .container a span {
                color: #ffc502;
                font-family: sans-serif;
                font-size: 18px;
                font-weight: 600;
                line-height: 26px;
                text-align: left
            }

.articles_2024 section.article {
    margin-bottom: 164px
}

@media(max-width:767px) {
    .articles_2024 section.article {
        margin-bottom: 96px
    }
}

.articles_2024 section.article .container {
    width: 1220px;
    display: flex;
    flex-direction: column
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .articles_2024 section.article .container {
        width: 100%
    }
}

.articles_2024 section.article .container div.article__content {
    width: 850px
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .articles_2024 section.article .container div.article__content {
        width: 100%
    }
}

.articles_2024 section.article .container div.article__content img {
    width: 100%
}

.articles_2024 section.article .container div.article__content:not(:last-of-type) {
    margin-bottom: 66px
}

.articles_2024 section.article .container h2 {
    font-family: sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 43.2px;
    text-align: left;
    color: #222324;
    margin-bottom: 64px;
    position: relative
}

    .articles_2024 section.article .container h2:not(:first-of-type) {
        margin-top: 64px
    }

    .articles_2024 section.article .container h2::after {
        content: "";
        position: absolute;
        width: 88px;
        height: 2px;
        margin-top: 64px;
        left: 0;
        background-color: #ffc502
    }

.articles_2024 section.article .container h3 {
    margin: 40px 0 32px;
    font-family: sans-serif;
    font-size: 28px;
    font-weight: 700
}

.articles_2024 section.article .container h4 {
    margin: 32px 0;
    font-family: sans-serif
}

.articles_2024 section.article .container p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    margin: 32px 0
}

.articles_2024 section.article .container div.image {
    margin: 48px 0
}

    .articles_2024 section.article .container div.image img {
        width: 100%
    }

.articles_2024 section.article .container iframe {
    display: block;
    width: 100%;
    aspect-ratio: 16/9;
    border-radius: 20px;
    margin: 20px 0
}

.articles_2024 section.article .container ol {
    display: flex;
    flex-direction: column;
    gap: 26px
}

    .articles_2024 section.article .container ol li {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px
    }

        .articles_2024 section.article .container ol li p {
            margin: 0;
            padding: 0
        }

.articles_2024 section.article .container ul {
    display: flex;
    flex-direction: column;
    gap: 26px
}

    .articles_2024 section.article .container ul li {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px
    }

        .articles_2024 section.article .container ul li p {
            margin: 0;
            padding: 0
        }

        .articles_2024 section.article .container ul li::marker {
            font-size: .7em
        }

.articles_2024 section.article .container a {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
    text-align: left;
    color: #ffc502;
    text-decoration: underline
}

.articles_2024 section#youtube-video {
    margin: 48px 0
}

    .articles_2024 section#youtube-video .video-youtube {
        box-shadow: none;
        width: 100%;
        margin: 0
    }

    .articles_2024 section#youtube-video .video-youtube__button {
        width: 100px
    }

.average-salary * {
    font-family: sans-serif,sans-serif
}

.average-salary #top-main {
    margin: 84px 0 120px
}

    .average-salary #top-main .container {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 128px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .average-salary #top-main .container {
        grid-template-columns: 1fr;
        gap: 0
    }
}

.average-salary #top-main .container .content {
    margin-top: 4rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 522px
}

@media(max-width:767px) {
    .average-salary #top-main .container .content {
        margin-top: 0
    }
}

.average-salary #top-main .container .content .label {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 22px;
    font-size: 18px;
    border-radius: 8px;
    padding: 12px 36px 13px;
    background-color: #f2fcf6;
    color: #ffc502
}

.average-salary #top-main .container .content .breadcrumbs {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    gap: 8.8px
}

    .average-salary #top-main .container .content .breadcrumbs a {
        color: #7d8086;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 500;
        text-transform: uppercase;
        transition: all .2s ease-in-out
    }

        .average-salary #top-main .container .content .breadcrumbs a:hover {
            color: #4f5052
        }

    .average-salary #top-main .container .content .breadcrumbs p {
        color: #7d8086;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 700;
        line-height: normal;
        text-transform: uppercase;
        margin: 0 !important
    }

.average-salary #top-main .container .content h1 {
    padding: 0;
    color: #222324;
    font-size: 52px;
    font-weight: 700;
    line-height: 116%;
    margin-bottom: 32px
}

    .average-salary #top-main .container .content h1 span {
        color: #ffc502
    }

.average-salary #top-main .container .content h3 {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .average-salary #top-main .container .img {
        display: none
    }
}

.average-salary #top-main .container .img img {
    width: 100%
}

.average-salary #top-single-landing {
    margin: 84px 0 64px
}

    .average-salary #top-single-landing .container .content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        max-width: 847px
    }

@media(max-width:767px) {
    .average-salary #top-single-landing .container .content {
        min-width: 100%
    }
}

.average-salary #top-single-landing .container .content .breadcrumbs {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    gap: 8.8px
}

    .average-salary #top-single-landing .container .content .breadcrumbs a {
        color: #7d8086;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 500;
        text-transform: uppercase;
        transition: all .2s ease-in-out
    }

        .average-salary #top-single-landing .container .content .breadcrumbs a:hover {
            color: #4f5052
        }

    .average-salary #top-single-landing .container .content .breadcrumbs p {
        color: #7d8086;
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 700;
        line-height: normal;
        text-transform: uppercase;
        margin: 0 !important
    }

.average-salary #top-single-landing .container .content h2, .average-salary #top-single-landing .container .content h1 {
    padding: 0;
    color: #222324;
    font-size: 52px;
    font-weight: 700;
    line-height: 116%;
    margin-bottom: 40px
}

    .average-salary #top-single-landing .container .content h2 span, .average-salary #top-single-landing .container .content h1 span {
        color: #ffc502
    }

.average-salary #top-single-landing .container .content img {
    width: 100%
}

.average-salary #simpleTableOfContent .container ul {
    display: grid;
    row-gap: 20px;
    grid-template-columns: repeat(3,1fr);
    padding: 0;
    margin-bottom: 10rem
}

@media(max-width:767px) {
    .average-salary #simpleTableOfContent .container ul {
        grid-template-columns: repeat(2,1fr)
    }
}

.average-salary #simpleTableOfContent .container ul li {
    list-style: none;
    max-width: 85%
}

    .average-salary #simpleTableOfContent .container ul li a {
        color: #323333;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px
    }

        .average-salary #simpleTableOfContent .container ul li a:hover {
            font-weight: 700;
            color: var(--green-500,#ffc502)
        }

.average-salary #content {
    margin-bottom: 15rem
}

    .average-salary #content .container {
        display: grid;
        grid-template-columns: 1fr 320px;
        gap: 120px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .average-salary #content .container {
        grid-template-columns: 1fr
    }
}

.average-salary #content .container .banner {
    padding-left: 35px;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    gap: 32px;
    border-left: 2px solid #b7bbc2
}

    .average-salary #content .container .banner span {
        display: flex;
        padding: 12px 32px 13px;
        border-radius: 8px;
        background-color: #f2fcf6;
        color: #ffc502;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px
    }

        .average-salary #content .container .banner span img {
            margin-right: 16px
        }

    .average-salary #content .container .banner p {
        color: #222324 !important;
        font-size: 24px !important;
        font-weight: 400 !important;
        line-height: 33px !important;
        margin: 0 !important
    }

    .average-salary #content .container .banner a {
        padding: 16px 36px 17px;
        background-color: #ffc502;
        color: #fff;
        border-radius: 36px;
        font-size: 18px;
        font-weight: 600;
        line-height: 22px;
        transition: all .2s ease-in-out
    }

        .average-salary #content .container .banner a:hover {
            background-color: #17b54e
        }

.average-salary #content .container .content {
    display: flex;
    flex-direction: column;
    gap: 32px
}

    .average-salary #content .container .content .banner {
        display: none
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .average-salary #content .container .content .banner {
        display: flex
    }
}

.average-salary #content .container .content tbody th, .average-salary #content .container .content tbody td {
    border: 1px solid #000
}

.average-salary #content .container .content tbody tr:first-of-type, .average-salary #content .container .content tbody tr:first-of-type th {
    text-align: center
}

.average-salary #content .container .content tbody tr:not(:first-of-type) td {
    padding: .2rem .5rem
}

.average-salary #content .container .content h2 {
    color: #222324;
    font-size: 36px;
    font-weight: 700;
    line-height: 116%
}

    .average-salary #content .container .content h2:not(:first-of-type) {
        margin-top: 32px
    }

.average-salary #content .container .content p, .average-salary #content .container .content li {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    margin: 0
}

.average-salary #content .container .content ul {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.average-salary #content .container .sticky-banner {
    position: relative
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .average-salary #content .container .sticky-banner {
        display: none
    }
}

.average-salary #content .container .sticky-banner .content {
    position: sticky;
    top: 10rem;
    gap: 80px
}

    .average-salary #content .container .sticky-banner .content .banner {
        display: flex;
        padding-left: 0 !important;
        border: unset
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .average-salary #content .container .sticky-banner .content .banner {
        display: none
    }
}

.average-salary #content .container .sticky-banner .content .toc-sidebar {
    box-shadow: none;
    padding: 0 10px;
    gap: 16px;
    display: flex;
    flex-direction: column;
    max-height: 300px;
    overflow-y: scroll
}

    .average-salary #content .container .sticky-banner .content .toc-sidebar::-webkit-scrollbar {
        width: 8px
    }

    .average-salary #content .container .sticky-banner .content .toc-sidebar::-webkit-scrollbar-thumb {
        background: #b7bbc2;
        border-radius: 6px
    }

    .average-salary #content .container .sticky-banner .content .toc-sidebar::-webkit-scrollbar-track {
        background: 0 0
    }

    .average-salary #content .container .sticky-banner .content .toc-sidebar li {
        list-style: none
    }

    .average-salary #content .container .sticky-banner .content .toc-sidebar a {
        color: #222324;
        font-size: 16px;
        font-style: normal;
        font-weight: 400
    }

        .average-salary #content .container .sticky-banner .content .toc-sidebar a.active {
            text-decoration: none;
            font-weight: 700
        }

        .average-salary #content .container .sticky-banner .content .toc-sidebar a:hover {
            text-decoration: none;
            font-weight: 700
        }

.average-salary #related-posts {
    border-top: 2px solid #b7bbc2;
    padding-top: 40px;
    margin-top: 40px
}

    .average-salary #related-posts ul {
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 20px;
        list-style: none;
        width: fit-content
    }

        .average-salary #related-posts ul span {
            color: var(--grey-dark-900,#222324);
            font-size: 18px;
            font-style: normal;
            font-weight: 600;
            line-height: 26px
        }

        .average-salary #related-posts ul li {
            display: flex;
            gap: 6px
        }

            .average-salary #related-posts ul li a {
                color: var(--grey-dark-900,#222324);
                font-size: 18px;
                font-style: normal;
                font-weight: 400;
                line-height: 26px;
                text-decoration-line: underline;
                transition: all .2s ease-in-out
            }

                .average-salary #related-posts ul li a:hover {
                    color: var(--green-500,#ffc502)
                }

.enterprise #fixed-form {
    margin-top: -5.5rem;
    opacity: 0;
    visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    background-color: rgba(255,255,255,.822);
    height: 100vh;
    width: 100vw;
    z-index: 99999999999999999999999;
    transition: all .2s ease-in-out
}

    .enterprise #fixed-form.visible {
        opacity: 1;
        visibility: visible
    }

    .enterprise #fixed-form .form-box {
        width: 480px;
        padding: 60px 32px 48px;
        display: flex;
        flex-direction: column;
        gap: 48px;
        box-shadow: 0 5px 24px -2px #0000001f;
        background: #fff;
        border-radius: 24px;
        position: relative
    }

        .enterprise #fixed-form .form-box .exit-button {
            position: absolute;
            top: 1rem;
            right: 1.5rem;
            font-size: 22px;
            font-weight: 100;
            transform: scaleX(1.2);
            color: #222324;
            cursor: pointer;
            transition: all .2s ease-in-out
        }

            .enterprise #fixed-form .form-box .exit-button:hover {
                color: #1da44c
            }

.enterprise #top .container h1 {
    max-width: 1050px;
    font-family: sans-serif;
    font-size: 52px;
    font-weight: 700;
    line-height: 60.32px;
    text-align: center
}

.enterprise #top .container h2 {
    max-width: 630px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: center
}

.enterprise #top .container .main-img {
    width: 100%
}

.enterprise #do_you_know {
    margin: 164px 0
}

@media(max-width:767px) {
    .enterprise #do_you_know {
        margin: 120px 0
    }
}

.enterprise #do_you_know .container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px
}

    .enterprise #do_you_know .container .label {
        padding: 10px 20px;
        background: #f2fcf6;
        border-radius: 8px
    }

        .enterprise #do_you_know .container .label span {
            font-family: sans-serif;
            font-size: 16px;
            font-weight: 600;
            line-height: 23px;
            text-align: left;
            color: #ffc502
        }

    .enterprise #do_you_know .container .content {
        display: flex;
        justify-content: space-between;
        width: 100%
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .enterprise #do_you_know .container .content {
        flex-direction: column;
        gap: 80px
    }
}

@media(max-width:767px) {
    .enterprise #do_you_know .container .content {
        flex-direction: column;
        gap: 64px
    }
}

.enterprise #do_you_know .container .content .header {
    max-width: 630px
}

    .enterprise #do_you_know .container .content .header h2 {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 43.2px;
        text-align: left;
        color: #222324;
        max-width: 580px
    }

@media(max-width:767px) {
    .enterprise #do_you_know .container .content .header h2 {
        font-size: 28px
    }
}

.enterprise #do_you_know .container .content .header h2 span {
    color: #ffc502
}

.enterprise #do_you_know .container .content .content-boxes {
    max-width: 522px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 80px
}

    .enterprise #do_you_know .container .content .content-boxes::before {
        content: "";
        position: absolute;
        top: 0;
        left: 29px;
        height: 100%;
        width: 1.5px;
        background-color: #b7bbc2;
        z-index: -2
    }

    .enterprise #do_you_know .container .content .content-boxes .single-box {
        display: flex;
        align-items: flex-start;
        gap: 32px
    }

        .enterprise #do_you_know .container .content .content-boxes .single-box:last-of-type {
            background-color: #fff
        }

        .enterprise #do_you_know .container .content .content-boxes .single-box .image {
            position: relative;
            padding: 13px;
            background: #f2fcf6;
            border-radius: 8px
        }

            .enterprise #do_you_know .container .content .content-boxes .single-box .image::before {
                content: "";
                position: absolute;
                top: -8px;
                left: 0;
                background-color: #fff;
                width: 100%;
                height: calc(100% + 16px);
                z-index: -1
            }

        .enterprise #do_you_know .container .content .content-boxes .single-box p {
            font-family: sans-serif;
            font-size: 24px;
            font-weight: 400;
            line-height: 28.8px;
            text-align: left;
            color: #323333;
            margin: 0
        }

@media(max-width:767px) {
    .enterprise #do_you_know .container .content .content-boxes .single-box p {
        font-size: 18px
    }
}

.enterprise #do_you_know .container .content .content-boxes .single-box p span {
    font-weight: 600
}

.enterprise #components_boxes-on-green {
    margin: 164px 0 140px
}

@media(max-width:767px) {
    .enterprise #components_boxes-on-green {
        margin: 120px 0 96px
    }
}

.enterprise #bannerFullContainer {
    margin-bottom: 200px
}

    .enterprise #bannerFullContainer .container .content {
        padding: 48px 48px 48px 180px;
        background: #0a1a38;
        border-radius: 24px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative;
        overflow: hidden
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise #bannerFullContainer .container .content {
        padding: 48px 40px;
        flex-direction: column;
        gap: 40px;
        align-items: flex-start
    }
}

@media(max-width:767px) {
    .enterprise #bannerFullContainer .container .content {
        padding: 48px 32px;
        flex-direction: column;
        align-items: center;
        gap: 40px
    }
}

.enterprise #bannerFullContainer .container .content .vector {
    position: absolute;
    left: -3rem;
    top: -2.1rem
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise #bannerFullContainer .container .content .vector {
        bottom: -3rem;
        right: -2rem;
        left: unset;
        top: unset
    }
}

@media(max-width:767px) {
    .enterprise #bannerFullContainer .container .content .vector {
        display: none
    }
}

.enterprise #bannerFullContainer .container .content div.text {
    max-width: 800px
}

    .enterprise #bannerFullContainer .container .content div.text p.strong {
        font-family: sans-serif;
        font-size: 36px;
        font-weight: 600;
        line-height: 43.2px;
        text-align: left;
        margin-bottom: 32px;
        color: #fff
    }

@media(max-width:767px) {
    .enterprise #bannerFullContainer .container .content div.text p.strong {
        font-size: 30px;
        line-height: 33.6px
    }
}

.enterprise #bannerFullContainer .container .content div.text p.strong--smallVariant {
    margin-bottom: 0;
    font-family: sans-serif;
    font-size: 28px;
    font-weight: 600;
    line-height: 33.6px;
    text-align: left;
    color: #fff
}

    .enterprise #bannerFullContainer .container .content div.text p.strong--smallVariant span {
        color: #ffc502
    }

@media(max-width:767px) {
    .enterprise #bannerFullContainer .container .content div.text p.strong--smallVariant {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 600;
        line-height: 28.8px;
        text-align: center
    }
}

.enterprise #bannerFullContainer .container .content div.text p.small {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 21.6px;
    text-align: left;
    color: #fff
}

.enterprise #certificates {
    margin: 140px 0 164px
}

@media(min-width:768px) and (max-width:991px) {
    .enterprise #certificates {
        margin: 120px 0 140px
    }
}

@media(max-width:767px) {
    .enterprise #certificates {
        margin: 96px 0 120px
    }
}

.enterprise #certificates .container {
    display: flex;
    flex-direction: column;
    gap: 80px
}

@media(max-width:767px) {
    .enterprise #certificates .container {
        gap: 64px
    }
}

.enterprise #certificates .container .headers {
    max-width: 630px
}

    .enterprise #certificates .container .headers h2 {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: left;
        color: #222324;
        margin-bottom: 32px
    }

@media(max-width:767px) {
    .enterprise #certificates .container .headers h2 {
        font-size: 36px
    }
}

.enterprise #certificates .container .headers p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333;
    max-width: 520px
}

.enterprise #certificates .container .boxes {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 62.5px
}

@media(min-width:768px) and (max-width:991px) {
    .enterprise #certificates .container .boxes {
        grid-template-columns: repeat(2,1fr);
        gap: 64px 80px
    }
}

@media(max-width:767px) {
    .enterprise #certificates .container .boxes {
        grid-template-columns: 1fr;
        gap: 64px
    }
}

.enterprise #certificates .container .boxes .singleBox {
    display: flex;
    flex-direction: column;
    gap: 25px
}

    .enterprise #certificates .container .boxes .singleBox img {
        width: 120px
    }

    .enterprise #certificates .container .boxes .singleBox div.text {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding-left: 20px;
        border-left: 2px solid #ffc502
    }

        .enterprise #certificates .container .boxes .singleBox div.text h3 {
            font-family: sans-serif;
            font-size: 24px;
            font-weight: 600;
            line-height: 26px;
            text-align: left;
            color: #323333
        }

        .enterprise #certificates .container .boxes .singleBox div.text p {
            font-family: sans-serif;
            font-size: 18px;
            font-weight: 400;
            line-height: 26px;
            text-align: left;
            color: #323333
        }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise #pricing-2024 {
        margin-top: 96px
    }
}

@media(max-width:767px) {
    .enterprise #pricing-2024 {
        margin-top: 80px
    }
}

.enterprise #pricing-2024 .container .top {
    align-items: center;
    text-align: center !important
}

    .enterprise #pricing-2024 .container .top h2 {
        font-size: 44px !important;
        font-weight: 700 !important;
        line-height: 51.04px !important;
        text-align: center !important
    }

    .enterprise #pricing-2024 .container .top p {
        font-size: 18px !important;
        font-weight: 400 !important;
        line-height: 26px !important;
        text-align: center !important
    }

.enterprise #pricing-2024 .container .pricingContainer .singleBox .pricingTop__heading {
    display: flex
}

.enterprise #pricing-2024 .container .pricingContainer .singleBox--green {
    border: 1px solid #ffc502;
    background-color: #f2fcf6 !important
}

.enterprise #pricing-2024 .container .pricingContainer .singleBox span.green-label {
    font-size: 14px;
    font-weight: 600;
    line-height: 16.8px;
    text-align: left;
    color: #fff;
    padding: 5px 10px;
    background-color: #ffc502;
    margin-left: 12px;
    border-radius: 500px
}

.enterprise #pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__heading {
    padding-bottom: unset !important;
    border-bottom: unset !important
}

.enterprise #pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed {
    margin-top: 32px !important;
    max-width: 241px
}

    .enterprise #pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed p {
        font-size: 16px;
        font-weight: 400;
        line-height: 23px;
        text-align: left;
        color: #222324 !important
    }

.enterprise #reviews {
    background-color: #f8fafc;
    padding-top: 80px
}

@media(max-width:767px) {
    .enterprise #reviews {
        margin-top: 120px
    }
}

.enterprise #reviews .subHeaders {
    max-width: 630px
}

.enterprise #reviews .subHeaders__header {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: left
}

.enterprise #reviews .subHeaders__paragraph {
    max-width: 520px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left
}

.enterprise #CompaniesCarousel {
    background-color: #fff
}

@media(max-width:767px) {
    .enterprise #CompaniesCarousel {
        padding: 96px 0 140px
    }
}

.enterprise #components_features .container .box__singleBox {
    gap: 40px 109px !important
}

    .enterprise #components_features .container .box__singleBox .features-icons {
        grid-column: span 2;
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(max-width:767px) {
    .enterprise #components_features .container .box__singleBox .features-icons {
        justify-content: center;
        gap: 32px
    }
}

.enterprise #components_features .container .box__singleBox .features-icons__singleIcon {
    width: 158px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 27px
}

    .enterprise #components_features .container .box__singleBox .features-icons__singleIcon p {
        font-size: 16px;
        font-weight: 400;
        line-height: 23px;
        text-align: center
    }

.enterprise #components_features .container .box__singleBox .features-button {
    grid-column: span 2;
    width: fit-content;
    margin: 40px auto
}

@media(max-width:767px) {
    .enterprise #components_features .container .box__singleBox .features-button {
        margin: 10px auto
    }
}

.enterprise #component_top .content {
    margin-top: 0 !important
}

.enterprise #component_top .small-content {
    min-width: 450px !important;
    width: 450px !important
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .enterprise #component_top .small-content {
        width: 100% !important;
        min-width: unset !important
    }
}

.enterprise-v2 #imgOnGray {
    margin-top: 164px;
    padding-bottom: 105px;
    position: relative
}

@media(max-width:1410px) {
    .enterprise-v2 #imgOnGray {
        padding: 32px 0 0
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .enterprise-v2 #imgOnGray {
        margin-top: 140px
    }
}

@media(max-width:767px) {
    .enterprise-v2 #imgOnGray {
        margin-top: 120px
    }
}

.enterprise-v2 #imgOnGray div.img {
    display: block;
    position: absolute;
    bottom: 0;
    right: 0
}

@media(max-width:1410px) {
    .enterprise-v2 #imgOnGray div.img {
        position: relative;
        text-align: right;
        margin-top: 40px
    }

        .enterprise-v2 #imgOnGray div.img img {
            width: 100%
        }
}

.enterprise-v2 #imgOnGray .container {
    margin-right: auto;
    padding-right: 15px;
    display: flex;
    flex-direction: column
}

    .enterprise-v2 #imgOnGray .container img.small-logo {
        width: 32px
    }

    .enterprise-v2 #imgOnGray .container h2 {
        font-size: 36px;
        font-weight: 700;
        margin-bottom: 24px
    }

@media(max-width:767px) {
    .enterprise-v2 #imgOnGray .container h2 {
        font-size: 28px;
        font-weight: 700;
        line-height: 33.6px
    }
}

.enterprise-v2 #reviews {
    background-color: transparent;
    padding-top: 0;
    overflow-x: hidden;
    overflow-y: visible
}

    .enterprise-v2 #reviews .reviews {
        max-height: 100%;
        padding: 1rem
    }

    .enterprise-v2 #reviews .scrollMargin {
        margin-bottom: 40px !important
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .enterprise-v2 #bannerFullContainer .vector {
        top: unset !important;
        bottom: -4rem !important
    }
}

.enterprise-v3 #components_green-statistics .container .box {
    align-items: center
}

.enterprise-v3 #components_green-statistics .container .box__text-black p {
    font-size: 18px !important;
    line-height: 21.6px !important
}

.enterprise-v3 #fixed-form {
    margin-top: -5.5rem;
    opacity: 0;
    visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    background-color: rgba(255,255,255,.822);
    height: 100vh;
    width: 100vw;
    z-index: 99999999999999999999999;
    transition: all .2s ease-in-out
}

    .enterprise-v3 #fixed-form.visible {
        opacity: 1;
        visibility: visible
    }

    .enterprise-v3 #fixed-form .form-box {
        width: 480px;
        padding: 60px 32px 48px;
        display: flex;
        flex-direction: column;
        gap: 48px;
        box-shadow: 0 5px 24px -2px #0000001f;
        background: #fff;
        border-radius: 24px;
        position: relative
    }

        .enterprise-v3 #fixed-form .form-box .exit-button {
            position: absolute;
            top: 1rem;
            right: 1.5rem;
            font-size: 22px;
            font-weight: 100;
            transform: scaleX(1.2);
            color: #222324;
            cursor: pointer;
            transition: all .2s ease-in-out
        }

            .enterprise-v3 #fixed-form .form-box .exit-button:hover {
                color: #1da44c
            }

.enterprise-v3 #top {
    margin-bottom: 140px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #top {
        margin-bottom: 120px
    }
}

@media(max-width:767px) {
    .enterprise-v3 #top {
        margin-bottom: 96px
    }
}

.enterprise-v3 #top .container h1 {
    max-width: 841px;
    font-family: sans-serif;
    font-size: 52px;
    font-weight: 700;
    line-height: 60.32px;
    text-align: center
}

@media(max-width:767px) {
    .enterprise-v3 #top .container h1 {
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: center
    }
}

.enterprise-v3 #top .container h2 {
    max-width: 630px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: center
}

.enterprise-v3 #top .container .main-img {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

    .enterprise-v3 #top .container .main-img img {
        max-width: 1300px
    }

.enterprise-v3 #top .container div.buttons {
    margin: 0
}

.enterprise-v3 #top .container div.small-informations {
    margin: 12px 0 64px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

    .enterprise-v3 #top .container div.small-informations span {
        text-align: center;
        font-size: 14px;
        font-weight: 400;
        line-height: 16.8px;
        text-align: center;
        color: #8a8a8a
    }

.enterprise-v3 #bannerFullContainer {
    margin: 140px 0
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #bannerFullContainer {
        margin: 120px 0
    }
}

@media(max-width:767px) {
    .enterprise-v3 #bannerFullContainer {
        margin: 96px 0
    }
}

.enterprise-v3 #bannerFullContainer .container .content {
    padding: 48px 48px 48px 180px;
    background: #0a1a38;
    border-radius: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    overflow: hidden
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #bannerFullContainer .container .content {
        padding: 48px 40px;
        flex-direction: column;
        gap: 40px;
        align-items: flex-start
    }
}

@media(max-width:767px) {
    .enterprise-v3 #bannerFullContainer .container .content {
        padding: 48px 32px;
        flex-direction: column;
        align-items: center;
        gap: 40px
    }
}

.enterprise-v3 #bannerFullContainer .container .content .vector {
    position: absolute;
    left: -3rem;
    top: -2.7rem
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #bannerFullContainer .container .content .vector {
        bottom: -3rem;
        right: -2rem;
        left: unset;
        top: unset
    }
}

@media(max-width:767px) {
    .enterprise-v3 #bannerFullContainer .container .content .vector {
        display: none
    }
}

.enterprise-v3 #bannerFullContainer .container .content div.text {
    max-width: 800px
}

    .enterprise-v3 #bannerFullContainer .container .content div.text p.strong {
        font-family: sans-serif;
        font-size: 28px;
        font-weight: 600;
        line-height: 33.6px;
        text-align: left;
        color: #fff
    }

        .enterprise-v3 #bannerFullContainer .container .content div.text p.strong span {
            color: #ffc502
        }

@media(max-width:767px) {
    .enterprise-v3 #bannerFullContainer .container .content div.text p.strong {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 600;
        line-height: 28.8px;
        text-align: center
    }
}

.enterprise-v3 #bannerFullContainer .container .content div.text p.small {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 21.6px;
    text-align: left;
    color: #fff
}

.enterprise-v3 #reviews {
    background-color: transparent;
    padding-top: 0;
    overflow-x: hidden;
    overflow-y: visible
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #reviews {
        margin-top: 120px
    }
}

@media(max-width:767px) {
    .enterprise-v3 #reviews {
        margin-top: 96px
    }
}

.enterprise-v3 #reviews .reviews {
    max-height: 100%;
    padding: .2rem 0 1.8rem
}

.enterprise-v3 #reviews .scrollMargin {
    margin-bottom: 40px !important
}

.enterprise-v3 #components_features .container {
    display: flex;
    flex-direction: column;
    align-items: center
}

.enterprise-v3 #components_certificates .container {
    align-items: center
}

    .enterprise-v3 #components_certificates .container .headers {
        display: flex;
        flex-direction: column;
        align-items: center;
        max-width: unset !important;
        text-align: center
    }

        .enterprise-v3 #components_certificates .container .headers p {
            text-align: center !important
        }

.enterprise-v3 #content-with-graph {
    margin: 140px 0
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #content-with-graph {
        margin: 120px 0
    }
}

@media(max-width:767px) {
    .enterprise-v3 #content-with-graph {
        margin: 96px 0
    }
}

.enterprise-v3 #content-with-graph .container {
    display: flex;
    justify-content: space-around;
    position: relative
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #content-with-graph .container {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 21px
    }
}

@media(max-width:767px) {
    .enterprise-v3 #content-with-graph .container {
        flex-direction: column;
        gap: 56px
    }
}

.enterprise-v3 #content-with-graph .container img.lines {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .enterprise-v3 #content-with-graph .container img.lines {
        display: none
    }
}

.enterprise-v3 #content-with-graph .container div.content-box {
    width: 386px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .enterprise-v3 #content-with-graph .container div.content-box {
        width: 100%
    }
}

.enterprise-v3 #content-with-graph .container div.content-box h2 {
    font-size: 28px;
    font-weight: 700;
    line-height: 33.41px;
    text-align: center;
    color: #222324;
    min-height: 66px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #content-with-graph .container div.content-box h2 {
        font-size: 24px;
        line-height: 28.64px
    }
}

@media(max-width:767px) {
    .enterprise-v3 #content-with-graph .container div.content-box h2 {
        font-size: 18px;
        font-weight: 600;
        line-height: 26px
    }
}

.enterprise-v3 #content-with-graph .container div.content-box p {
    font-size: 28px;
    font-weight: 400;
    line-height: 33.41px;
    text-align: center;
    color: #222324
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #content-with-graph .container div.content-box p {
        font-size: 24px;
        line-height: 28.64px
    }
}

@media(max-width:767px) {
    .enterprise-v3 #content-with-graph .container div.content-box p {
        font-size: 18px;
        line-height: 26px
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #pricing-2024 {
        margin-top: 96px
    }
}

@media(max-width:767px) {
    .enterprise-v3 #pricing-2024 {
        margin-top: 80px
    }
}

.enterprise-v3 #pricing-2024 .container .top {
    align-items: center;
    text-align: center !important
}

    .enterprise-v3 #pricing-2024 .container .top h2 {
        font-size: 44px !important;
        font-weight: 700 !important;
        line-height: 51.04px !important;
        text-align: center !important
    }

    .enterprise-v3 #pricing-2024 .container .top p {
        font-size: 18px !important;
        font-weight: 400 !important;
        line-height: 26px !important;
        text-align: center !important
    }

.enterprise-v3 #pricing-2024 .container .pricingContainer .singleBox .pricingTop__heading {
    display: flex
}

.enterprise-v3 #pricing-2024 .container .pricingContainer .singleBox--green {
    border: 1px solid #ffc502;
    background-color: #f2fcf6 !important
}

.enterprise-v3 #pricing-2024 .container .pricingContainer .singleBox span.green-label {
    font-size: 14px;
    font-weight: 600;
    line-height: 16.8px;
    text-align: left;
    color: #fff;
    padding: 5px 10px;
    background-color: #ffc502;
    margin-left: 12px;
    border-radius: 500px
}

.enterprise-v3 #pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__heading {
    padding-bottom: unset !important;
    border-bottom: unset !important
}

.enterprise-v3 #pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed {
    margin-top: 32px !important;
    max-width: 241px
}

    .enterprise-v3 #pricing-2024 .container .pricingContainer .singleBox-fullWidth .pricingTop__billed p {
        font-size: 16px;
        font-weight: 400;
        line-height: 23px;
        text-align: left;
        color: #222324 !important
    }

.enterprise-v3 #CompaniesCarousel {
    padding: 0 !important;
    margin: 140px 0 180px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .enterprise-v3 #CompaniesCarousel {
        margin: 120px 0 164px
    }
}

@media(max-width:767px) {
    .enterprise-v3 #CompaniesCarousel {
        margin: 96px 0 120px
    }
}

.enterprise-v3 div.section-header {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 80px;
    max-width: 844px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px
}

@media(max-width:767px) {
    .enterprise-v3 div.section-header {
        margin-bottom: 64px
    }
}

.enterprise-v3 div.section-header h2 {
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: center;
    color: #222324
}

@media(max-width:767px) {
    .enterprise-v3 div.section-header h2 {
        font-size: 36px;
        font-weight: 700;
        line-height: 43.2px;
        text-align: left
    }
}

.enterprise-v3 div.section-header p {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: center;
    color: #323333;
    max-width: 521px
}

@media(max-width:767px) {
    .enterprise-v3 div.section-header p {
        text-align: left
    }
}

.applications-2024 * {
    font-family: sans-serif
}

.applications-2024 #footer-redesign {
    margin-top: 10rem
}

.applications-2024 img.mobile {
    display: none
}

@media(max-width:767px) {
    .applications-2024 img.mobile {
        display: block
    }
}

.applications-2024 img.desktop {
    display: block
}

@media(max-width:767px) {
    .applications-2024 img.desktop {
        display: none
    }
}

.applications-2024 section#top-main {
    margin: 120px 0 164px
}

@media(min-width:768px) and (max-width:991px) {
    .applications-2024 section#top-main {
        margin: 64px 0 140px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .applications-2024 section#top-main {
        margin: 48px 0 120px
    }
}

.applications-2024 section#top-main .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

    .applications-2024 section#top-main .container h1 {
        font-family: sans-serif;
        font-size: 52px;
        font-weight: 700;
        line-height: 60.32px;
        text-align: center;
        color: #222324
    }

@media(max-width:767px) {
    .applications-2024 section#top-main .container h1 {
        font-size: 44px;
        line-height: 51.04px
    }
}

.applications-2024 section#top-main .container h1 span {
    color: #ffc502
}

.applications-2024 section#top-main .container h2 {
    max-width: 630px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: center;
    color: #323333
}

.applications-2024 section#top-main .container img {
    margin-top: 120px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .applications-2024 section#top-main .container img {
        margin-top: 80px
    }
}

.applications-2024 section#all-apps {
    margin-bottom: 240px
}

    .applications-2024 section#all-apps .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 80px
    }

@media(max-width:767px) {
    .applications-2024 section#all-apps .container {
        gap: 64px
    }
}

.applications-2024 section#all-apps .container .header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px;
    max-width: 630px
}

    .applications-2024 section#all-apps .container .header h2 {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: center;
        color: #000
    }

@media(max-width:767px) {
    .applications-2024 section#all-apps .container .header h2 {
        font-size: 36px;
        line-height: 41.76px
    }
}

.applications-2024 section#all-apps .container .header p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: center;
    color: #323333
}

.applications-2024 section#all-apps .container .boxes {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 32px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .applications-2024 section#all-apps .container .boxes {
        grid-template-columns: 1fr
    }
}

.applications-2024 section#all-apps .container .boxes__singleBox {
    padding: 40px 48px;
    box-shadow: 0 8px 32px 0 #7d808633;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

    .applications-2024 section#all-apps .container .boxes__singleBox div.image {
        padding: 12px;
        border-radius: 8px;
        background-color: #f2fcf6;
        margin-bottom: 32px
    }

        .applications-2024 section#all-apps .container .boxes__singleBox div.image img {
            width: 32px
        }

    .applications-2024 section#all-apps .container .boxes__singleBox h2 {
        font-family: sans-serif;
        font-size: 28px;
        font-weight: 700;
        line-height: 33.6px;
        text-align: left;
        color: #222324;
        margin-bottom: 20px
    }

    .applications-2024 section#all-apps .container .boxes__singleBox p {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: left;
        color: #323333;
        margin-bottom: 40px;
        max-width: 528px
    }

.applications-2024 section#component_top {
    overflow: hidden;
    z-index: 10;
    padding: 96px 0 0
}

@media(max-width:767px) {
    .applications-2024 section#component_top {
        padding: 48px 0 0 !important
    }
}

.applications-2024 section#component_top .container {
    position: relative;
    gap: 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .applications-2024 section#component_top .container {
        gap: 32px
    }
}

.applications-2024 section#component_top .container img.green-circle {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1
}

@media(max-width:767px) {
    .applications-2024 section#component_top .container img.green-circle {
        display: none
    }
}

.applications-2024 section#component_top .container img.green-circle:first-of-type {
    right: 0;
    top: -6rem
}

.applications-2024 section#component_top .container img.green-circle:last-of-type {
    top: 0;
    right: -2rem
}

.applications-2024 section#component_top .container .content .top-breadcrumb {
    display: flex;
    gap: 8px;
    text-transform: uppercase;
    margin-bottom: 24px
}

    .applications-2024 section#component_top .container .content .top-breadcrumb a, .applications-2024 section#component_top .container .content .top-breadcrumb span {
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 500;
        line-height: 14.4px;
        text-align: left;
        color: #7d8086
    }

    .applications-2024 section#component_top .container .content .top-breadcrumb p {
        font-family: sans-serif;
        font-size: 12px;
        font-weight: 700;
        line-height: 14.4px;
        text-align: left;
        color: #7d8086;
        margin-bottom: 0
    }

.applications-2024 section#component_top .container .content .buttons {
    font-family: sans-serif
}

    .applications-2024 section#component_top .container .content .buttons .button-wrapper__google a {
        margin-left: .3rem
    }

.applications-2024 section#components_features {
    margin: 180px 0
}

@media(min-width:768px) and (max-width:991px) {
    .applications-2024 section#components_features {
        margin: 164px 0
    }
}

@media(max-width:767px) {
    .applications-2024 section#components_features {
        margin: 120px 0 96px
    }
}

.applications-2024 section#components-avaible-platforms {
    margin: 180px 0
}

@media(min-width:768px) and (max-width:991px) {
    .applications-2024 section#components-avaible-platforms {
        margin: 164px 0
    }
}

@media(max-width:767px) {
    .applications-2024 section#components-avaible-platforms {
        margin: 120px 0 140px
    }
}

.applications-2024 #download-now .container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .applications-2024 #download-now .container {
        display: grid;
        grid-template-columns: 125px 1fr;
        gap: 48px 20px
    }
}

.applications-2024 #download-now .container p {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    text-align: left;
    color: #323333
}

.applications-2024 #download-now .container div.line {
    width: 200px;
    height: 2px;
    background-color: #b7bbc2
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .applications-2024 #download-now .container div.line {
        width: 100%
    }
}

.applications-2024 #download-now .container div.buttons {
    margin-top: 12px;
    display: flex;
    gap: 20px
}

    .applications-2024 #download-now .container div.buttons a {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .applications-2024 #download-now .container div.buttons {
        grid-column: span 2;
        align-items: center;
        justify-content: center
    }
}

@media(max-width:767px) {
    .applications-2024 #download-now .container div.buttons {
        flex-direction: column
    }

        .applications-2024 #download-now .container div.buttons a {
            min-width: 200px;
            text-align: center
        }
}

.applications-2024 #copy_faq {
    margin-top: 164px;
    padding-bottom: 6rem
}

@media(min-width:768px) and (max-width:991px) {
    .applications-2024 #copy_faq {
        margin-top: 140px;
        padding-bottom: 8rem
    }
}

@media(max-width:767px) {
    .applications-2024 #copy_faq {
        margin-top: 120px;
        padding-bottom: 8rem
    }
}

.applications-2024 #copy_faq .accordion-section h2 {
    text-align: center;
    font-weight: 700;
    font-size: 36px
}

.applications-2024 #copy_faq .accordion-section .panel-group {
    margin-top: 3rem
}

    .applications-2024 #copy_faq .accordion-section .panel-group .panel-default {
        border-top: 1px solid #9a9ea4;
        padding: 1.5rem 40px
    }

@media(max-width:767px) {
    .applications-2024 #copy_faq .accordion-section .panel-group .panel-default {
        padding: 1.5rem 16px
    }
}

.applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body {
    padding-left: 3rem;
    padding-top: 20px;
    font-size: 1rem;
    line-height: 1.63;
    font-size: 18px;
    font-weight: 400
}

    .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body table {
        color: #222324;
        margin-bottom: 2.5rem
    }

        .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body table thead {
            border-bottom: 1px solid #a5abb7;
            margin-bottom: 1rem
        }

        .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body table tr:not(:last-of-type) {
            border-bottom: 1px dashed #a5abb75e
        }

        .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body table th {
            font-weight: 600;
            padding: .5rem 1rem
        }

        .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body table td {
            padding: .3rem 1rem;
            text-align: center
        }

    .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body ul {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-top: 8px
    }

        .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body ul li::marker {
            font-size: .7em
        }

    .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body p:last-of-type {
        margin: 0;
        padding: 0
    }

    .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-body h3 {
        font-size: 24px;
        font-weight: 500;
        margin: 24px 0 20px
    }

.applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-title {
    margin: 0
}

    .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-title a {
        display: block;
        font-size: 1.5rem;
        font-weight: 500
    }

        .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-title a::before {
            font-style: normal;
            font-size: 16px;
            content: url(/img/calculators-app/new/minus-icon.svg);
            margin-right: 1.5rem;
            color: #767676;
            float: left
        }

@media(max-width:767px) {
    .applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-title a::before {
        height: 4rem
    }
}

.applications-2024 #copy_faq .accordion-section .panel-group .panel-default .panel-title a.collapsed::before {
    content: url(/img/calculators-app/new/plus-icon.svg)
}

@keyframes carousel-slider {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(calc((-1444px) + (-64px * 12)))
    }
}

.free-demo section#top-demo {
    margin: 0;
    padding: 70px 0;
    background-color: #0a1a38;
    position: relative;
    overflow: hidden
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#top-demo {
        padding: 70px 0 300px
    }
}

@media(max-width:767px) {
    .free-demo section#top-demo {
        padding: 70px 0 200px
    }
}

.free-demo section#top-demo img.tc-logo {
    position: absolute;
    top: 50%;
    right: -10rem;
    transform: translateY(-50%)
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .free-demo section#top-demo img.tc-logo {
        display: none
    }
}

.free-demo section#top-demo .container {
    padding: 0 6rem;
    position: relative;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 32px
}

@media(max-width:767px) {
    .free-demo section#top-demo .container {
        padding: 0 15px;
        align-items: center;
        justify-content: center
    }
}

.free-demo section#top-demo .container h1 {
    max-width: 522px;
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: left;
    color: #fff;
    margin: 0
}

    .free-demo section#top-demo .container h1 span {
        color: #ffc502
    }

@media(max-width:767px) {
    .free-demo section#top-demo .container h1 {
        text-align: center
    }
}

.free-demo section#top-demo .container p {
    max-width: 464px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #fff;
    margin: 0
}

@media(max-width:767px) {
    .free-demo section#top-demo .container p {
        text-align: center
    }
}

.free-demo section#top-demo .container a {
    color: #ffc502
}

    .free-demo section#top-demo .container a:hover {
        color: #fff
    }

.free-demo section#top-demo .container img.green-arrow {
    position: absolute;
    top: 2rem;
    left: 45%;
    transform: rotateZ(315deg)
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#top-demo .container img.green-arrow {
        bottom: -60%;
        left: 0;
        top: unset;
        transform: unset
    }
}

@media(max-width:767px) {
    .free-demo section#top-demo .container img.green-arrow {
        display: none
    }
}

.free-demo section#agenda-and-form {
    margin: 64px 0 96px
}

    .free-demo section#agenda-and-form .container {
        padding: 0 6rem;
        display: flex;
        position: relative
    }

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .free-demo section#agenda-and-form .container {
        flex-direction: column-reverse;
        align-items: center;
        gap: 96px
    }
}

@media(max-width:767px) {
    .free-demo section#agenda-and-form .container {
        padding: 0 15px
    }
}

.free-demo section#agenda-and-form .container div.free-demo__calendly-widget {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    position: absolute;
    right: 6rem;
    top: -26rem
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .free-demo section#agenda-and-form .container div.free-demo__calendly-widget {
        position: relative;
        right: unset;
        top: unset;
        margin-top: -40%
    }
}

.free-demo section#agenda-and-form .container div.free-demo__calendly-widget .calendly-inline-widget iframe {
    box-shadow: 0 4px 10px 2px rgba(0,0,0,.17) !important;
    border-radius: 26px !important;
    width: 420px
}

@media(max-width:767px) {
    .free-demo section#agenda-and-form .container div.free-demo__calendly-widget .calendly-inline-widget iframe {
        width: 350px
    }
}

.free-demo section#agenda-and-form .container div.free-demo__calendly-widget .calendly-mobile {
    overflow-y: initial !important
}

.free-demo section#agenda-and-form .container div.free-demo__calendly-widget a.btn-outline {
    display: none;
    color: #ffc502
}

    .free-demo section#agenda-and-form .container div.free-demo__calendly-widget a.btn-outline:hover {
        color: #fff
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#agenda-and-form .container div.free-demo__calendly-widget a.btn-outline {
        display: flex
    }
}

.free-demo section#agenda-and-form .container div.list {
    width: 100%
}

    .free-demo section#agenda-and-form .container div.list p.list-header {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 400;
        line-height: 28.64px;
        text-align: left;
        color: #333;
        margin-bottom: 18px
    }

    .free-demo section#agenda-and-form .container div.list ul {
        padding: 0;
        margin-bottom: 0;
        width: 100%;
        max-width: 520px;
        display: grid;
        grid-template-rows: repeat(3,auto);
        grid-template-columns: repeat(2,1fr);
        grid-auto-flow: column;
        gap: 14px
    }

        .free-demo section#agenda-and-form .container div.list ul li {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 4px 0
        }

            .free-demo section#agenda-and-form .container div.list ul li span {
                font-family: Lato;
                font-size: 16px;
                font-weight: 700;
                line-height: 20.8px;
                text-align: right;
                color: #fff;
                background-color: #ffc502;
                border-radius: 200px;
                padding: 5px 6px
            }

            .free-demo section#agenda-and-form .container div.list ul li p {
                font-family: sans-serif;
                font-size: 16px;
                font-weight: 400;
                line-height: 23px;
                text-align: left;
                color: #0a1a38;
                margin: 0
            }

.free-demo section#carousel {
    transition-delay: 1000ms;
    margin-bottom: 56px
}

    .free-demo section#carousel .container {
        overflow: hidden;
        position: relative
    }

        .free-demo section#carousel .container .blur-left {
            position: absolute;
            top: 0;
            left: 0;
            height: 100%;
            width: 50px;
            z-index: 10;
            background: linear-gradient(270deg,rgba(248,250,252,0) 0%,#fff 50%)
        }

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#carousel .container .blur-left {
        width: 50px
    }
}

@media(max-width:767px) {
    .free-demo section#carousel .container .blur-left {
        width: 20px
    }
}

.free-demo section#carousel .container .blur-right {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 50px;
    z-index: 10;
    background: linear-gradient(270deg,#fff 50%,rgba(248,250,252,0) 100%)
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#carousel .container .blur-right {
        width: 50px
    }
}

@media(max-width:767px) {
    .free-demo section#carousel .container .blur-right {
        width: 20px
    }
}

.free-demo section#carousel .container .carousel__images {
    animation: carousel-slider 55s linear infinite;
    display: flex;
    gap: 64px
}

.free-demo section#reviews {
    margin-top: 164px
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#reviews {
        margin-top: 144px
    }
}

@media(max-width:767px) {
    .free-demo section#reviews {
        margin-top: 120px
    }
}

.free-demo section#reviews .container {
    display: flex;
    flex-direction: column;
    gap: 96px
}

@media(max-width:767px) {
    .free-demo section#reviews .container {
        gap: 64px
    }
}

.free-demo section#reviews .container header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 32px
}

    .free-demo section#reviews .container header h2 {
        margin: 0;
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 52.51px;
        text-align: center;
        color: #222324;
        max-width: 740px
    }

@media(max-width:767px) {
    .free-demo section#reviews .container header h2 {
        font-size: 36px;
        line-height: 42.96px
    }
}

.free-demo section#reviews .container header p {
    margin: 0;
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 28.64px;
    text-align: center;
    color: #323333;
    max-width: 632px
}

@media(max-width:767px) {
    .free-demo section#reviews .container header p {
        font-size: 18px;
        line-height: 24px
    }
}

.free-demo section#reviews .container header div.stars {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px
}

    .free-demo section#reviews .container header div.stars p {
        margin: 0;
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 21.48px;
        text-align: left;
        color: #7d8086
    }

.free-demo section#reviews .container div.boxes {
    display: flex;
    gap: 21px;
    margin: 0
}

    .free-demo section#reviews .container div.boxes::-webkit-scrollbar {
        display: none
    }

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .free-demo section#reviews .container div.boxes {
        overflow-x: auto;
        padding: .3rem .3rem .45rem
    }
}

.free-demo section#reviews .container div.boxes .column {
    padding: 0;
    width: 33.33%;
    display: flex;
    flex-direction: column;
    gap: 36px
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#reviews .container div.boxes .column {
        width: unset;
        min-width: 420px
    }
}

@media(max-width:767px) {
    .free-demo section#reviews .container div.boxes .column {
        width: unset;
        min-width: 375px
    }
}

.free-demo section#reviews .container div.boxes .column .single-box {
    padding: 32px 28px;
    border: .2px solid #b7bbc233;
    box-shadow: 0 4px 10px 0 #7d808626;
    border-radius: 24px
}

    .free-demo section#reviews .container div.boxes .column .single-box p.content, .free-demo section#reviews .container div.boxes .column .single-box p.company {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 400;
        line-height: 26.4px;
        text-align: left;
        color: #222324;
        max-width: 358px
    }

        .free-demo section#reviews .container div.boxes .column .single-box p.content span, .free-demo section#reviews .container div.boxes .column .single-box p.company span {
            color: #ffc502;
            font-weight: 600
        }

.free-demo section#youtube-video {
    margin-top: 200px
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#youtube-video {
        margin-top: 144px
    }
}

@media(max-width:767px) {
    .free-demo section#youtube-video {
        margin-top: 120px
    }
}

.free-demo section#youtube-video .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 72px
}

@media(max-width:767px) {
    .free-demo section#youtube-video .container {
        gap: 64px
    }
}

.free-demo section#youtube-video .container .header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px;
    max-width: 630px
}

    .free-demo section#youtube-video .container .header span.label {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 600;
        line-height: 32px;
        text-align: center;
        color: #ffc502
    }

@media(max-width:767px) {
    .free-demo section#youtube-video .container .header span.label {
        font-size: 16px;
        line-height: 19.09px
    }
}

.free-demo section#youtube-video .container .header h2 {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: center;
    color: #333
}

@media(max-width:767px) {
    .free-demo section#youtube-video .container .header h2 {
        font-size: 36px;
        line-height: 43px
    }
}

.free-demo section#youtube-video .container .video-youtube {
    margin: 0
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#youtube-video .container .video-youtube {
        width: 100%
    }
}

.free-demo section#usefull-functions {
    margin-top: 144px
}

@media(max-width:767px) {
    .free-demo section#usefull-functions {
        margin-top: 120px
    }
}

.free-demo section#usefull-functions .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 72px
}

@media(max-width:767px) {
    .free-demo section#usefull-functions .container {
        gap: 64px
    }
}

.free-demo section#usefull-functions .container .header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 16px
}

    .free-demo section#usefull-functions .container .header h2 {
        font-family: sans-serif;
        font-size: 36px;
        font-weight: 700;
        line-height: 42.96px;
        text-align: center;
        color: #222324
    }

    .free-demo section#usefull-functions .container .header p {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 400;
        line-height: 32px;
        text-align: center;
        color: #333;
        max-width: 740px
    }

@media(max-width:767px) {
    .free-demo section#usefull-functions .container .header p {
        font-size: 18px;
        line-height: 24px
    }
}

.free-demo section#usefull-functions .container .boxes {
    width: 100%;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .free-demo section#usefull-functions .container .boxes {
        grid-template-columns: repeat(2,1fr)
    }
}

@media(max-width:767px) {
    .free-demo section#usefull-functions .container .boxes {
        grid-template-columns: 1fr
    }
}

.free-demo section#usefull-functions .container .boxes__singleBox {
    padding: 37.5px 44px 57.5px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    background-color: #f8fafc;
    border-radius: 16px
}

    .free-demo section#usefull-functions .container .boxes__singleBox img {
        width: 44px
    }

    .free-demo section#usefull-functions .container .boxes__singleBox p {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 600;
        line-height: 26px;
        text-align: left;
        max-width: 216px;
        margin-bottom: 0
    }

.free-demo #footer-redesign {
    margin-top: 11rem
}

#navbar-container {
    font-family: sans-serif;
    height: 90px;
    width: 100%
}

    #navbar-container a.btn-filled {
        line-height: 20px
    }

    #navbar-container #navbar-2024 {
        position: fixed;
        width: 100%;
        z-index: 999999999999;
        display: block
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    #navbar-container #navbar-2024 {
        display: none
    }
}

#navbar-container #navbar-2024 #navbar-menu {
    background-color: #fff;
    padding: 20px 0;
    display: block;
    box-shadow: none;
    transition: all .2s ease-in-out
}

    #navbar-container #navbar-2024 #navbar-menu .container .menu {
        display: flex;
        align-items: center
    }

        #navbar-container #navbar-2024 #navbar-menu .container .menu a.navbar-menu-link, #navbar-container #navbar-2024 #navbar-menu .container .menu button.navbar-menu-link {
            display: flex;
            gap: 6px;
            align-items: center;
            font-size: 16px;
            font-weight: 600;
            line-height: 23px;
            color: #222324;
            background-color: transparent;
            outline: none;
            border: none;
            padding: 0;
            transition: color .1s ease-in-out
        }

            #navbar-container #navbar-2024 #navbar-menu .container .menu a.navbar-menu-link p, #navbar-container #navbar-2024 #navbar-menu .container .menu button.navbar-menu-link p {
                margin: 0
            }

            #navbar-container #navbar-2024 #navbar-menu .container .menu a.navbar-menu-link:hover, #navbar-container #navbar-2024 #navbar-menu .container .menu button.navbar-menu-link:hover {
                color: #ffc502
            }

        #navbar-container #navbar-2024 #navbar-menu .container .menu .product-button svg, #navbar-container #navbar-2024 #navbar-menu .container .menu .integrations-button svg, #navbar-container #navbar-2024 #navbar-menu .container .menu .solutions-button svg {
            transition: transform .1s ease-in-out
        }

        #navbar-container #navbar-2024 #navbar-menu .container .menu .product-button.active svg, #navbar-container #navbar-2024 #navbar-menu .container .menu .integrations-button.active svg, #navbar-container #navbar-2024 #navbar-menu .container .menu .solutions-button.active svg {
            transform: rotate(180deg)
        }

    #navbar-container #navbar-2024 #navbar-menu .container .menu__logo {
        margin-right: 40px
    }

    #navbar-container #navbar-2024 #navbar-menu .container .menu__content-links {
        display: flex;
        gap: 60px
    }

    #navbar-container #navbar-2024 #navbar-menu .container .menu__register-links {
        margin-left: auto;
        display: flex;
        align-items: center;
        gap: 32px
    }

        #navbar-container #navbar-2024 #navbar-menu .container .menu__register-links div.border-buttons {
            display: flex;
            gap: 24px
        }

            #navbar-container #navbar-2024 #navbar-menu .container .menu__register-links div.border-buttons div.border {
                width: 1px;
                background-color: #222324;
                border: none !important
            }

#navbar-container #navbar-2024 #navbar-product-item {
    display: none;
    padding-top: 16px;
    height: 100vh;
    background-color: #d4d6dab2
}

    #navbar-container #navbar-2024 #navbar-product-item.active {
        display: block
    }

    #navbar-container #navbar-2024 #navbar-product-item .container .box {
        width: 100%;
        background-color: #fff;
        border-radius: 24px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        box-shadow: 0 8px 32px 0 #7d808666
    }

    #navbar-container #navbar-2024 #navbar-product-item .container .box__content {
        padding: 40px 48px 48px;
        display: flex;
        justify-content: space-between
    }

        #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column {
            width: 260px;
            display: flex;
            flex-direction: column;
            gap: 32px
        }

            #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column a.header-link {
                display: flex;
                align-items: center;
                gap: 12px;
                transition: all .1s ease-in-out
            }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column a.header-link:hover p, #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column a.header-link:hover svg {
                    color: #ffc502
                }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column a.header-link p {
                    font-size: 18px;
                    font-weight: 700;
                    line-height: 26px;
                    text-align: left;
                    color: #222324;
                    text-transform: uppercase;
                    margin: 0
                }

            #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column div.list {
                display: flex;
                flex-direction: column;
                gap: 12px
            }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column div.list ul {
                    list-style: none;
                    margin: 0;
                    padding-left: 34px;
                    display: flex;
                    flex-direction: column;
                    gap: 10px
                }

                    #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column div.list ul li a.link {
                        font-size: 18px;
                        font-weight: 400;
                        line-height: 26px;
                        text-align: left;
                        transition: all .1s ease-in-out
                    }

                        #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column div.list ul li a.link:hover {
                            color: #ffc502
                        }

        #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner {
            width: 308px;
            display: flex;
            flex-direction: column;
            gap: 32px
        }

            #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner a.small-banner {
                width: 308px;
                height: 114px;
                background-color: #f8fafc;
                border-radius: 8px;
                padding-left: 20px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                overflow: hidden;
                position: relative;
                transition: all .2s ease-in-out
            }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner a.small-banner:hover div.img-with-content span {
                    color: #2d80eb
                }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner a.small-banner div.img-with-content {
                    display: flex;
                    gap: 8px
                }

                    #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner a.small-banner div.img-with-content img {
                        width: 26px
                    }

                    #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner a.small-banner div.img-with-content span {
                        font-weight: 800;
                        color: #000;
                        font-size: 18px
                    }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner a.small-banner p {
                    font-size: 18px;
                    font-weight: 700;
                    line-height: 21.6px;
                    text-align: left;
                    color: #222324;
                    margin: 0;
                    position: absolute;
                    top: calc(50% - 12px)
                }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner a.small-banner img {
                    margin-left: auto
                }

            #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner div.content {
                padding: 0 28px 0 20px;
                display: flex;
                flex-direction: column;
                gap: 32px
            }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner div.content p {
                    font-size: 18px;
                    font-weight: 400;
                    line-height: 26px;
                    text-align: left;
                    color: #323333;
                    margin: 0
                }

                    #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner div.content p span {
                        color: #2d80eb;
                        font-weight: 600
                    }

                #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner div.content ul {
                    list-style: none;
                    margin: 0;
                    padding: 0;
                    display: flex;
                    flex-direction: column;
                    gap: 10px
                }

                    #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner div.content ul li a {
                        display: flex;
                        align-items: center;
                        gap: 12px
                    }

                        #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner div.content ul li a:hover p, #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner div.content ul li a:hover svg {
                            color: #2d80eb
                        }

                        #navbar-container #navbar-2024 #navbar-product-item .container .box__content .single-column--planner div.content ul li a p {
                            font-size: 18px;
                            font-weight: 400;
                            line-height: 26px;
                            text-align: left;
                            color: #323333;
                            margin: 0
                        }

    #navbar-container #navbar-2024 #navbar-product-item .container .box__content__links {
        display: flex
    }

    #navbar-container #navbar-2024 #navbar-product-item .container .box__footer {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 32px;
        padding: 12px 48px;
        background-color: #f8fafc
    }

        #navbar-container #navbar-2024 #navbar-product-item .container .box__footer .border-separator {
            width: 1px;
            height: 24px;
            background-color: #b7bbc2
        }

        #navbar-container #navbar-2024 #navbar-product-item .container .box__footer a.link {
            font-size: 16px;
            font-weight: 400;
            line-height: 23px;
            text-align: center;
            color: #222324;
            transition: all .1s ease-in-out
        }

#navbar-container #navbar-2024 #navbar-integration-item {
    display: none;
    padding-top: 16px;
    height: 100vh;
    background-color: #d4d6dab2
}

    #navbar-container #navbar-2024 #navbar-integration-item.active {
        display: block
    }

    #navbar-container #navbar-2024 #navbar-integration-item .container .box {
        width: 100%;
        background-color: #fff;
        border-radius: 24px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        box-shadow: 0 8px 32px 0 #7d808666
    }

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__content {
        padding: 40px 48px 48px;
        display: flex;
        justify-content: space-between
    }

        #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            flex-direction: column
        }

            #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column:first-of-type {
                gap: 40px
            }

            #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column:last-of-type {
                gap: 16px
            }

            #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row {
                margin: 0;
                padding: 0;
                display: flex;
                flex-direction: column
            }

                #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row .lists {
                    display: flex;
                    gap: 32px;
                    justify-content: space-between
                }

@media(min-width:1920px) {
    #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row .lists {
        gap: 93px
    }
}

#navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row p.header-list {
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
    text-align: left;
    color: #222324;
    margin-bottom: 12px
}

#navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row .single-list {
    width: 260px
}

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row .single-list ul {
        display: flex;
        flex-direction: column;
        list-style: none;
        padding: 0;
        margin: 0;
        gap: 10px
    }

        #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row .single-list ul li {
            width: fit-content
        }

            #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row .single-list ul li a.check-link {
                display: flex;
                align-items: center;
                gap: 10px;
                transition: all .1s ease-in-out
            }

                #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row .single-list ul li a.check-link:hover p {
                    color: #ffc502
                }

                #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column .row .single-list ul li a.check-link p {
                    font-size: 18px;
                    font-weight: 400;
                    line-height: 26px;
                    text-align: left;
                    color: #323333;
                    margin: 0
                }

#navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column a.small-banner {
    width: 308px;
    height: 114px;
    background-color: #f8fafc;
    border-radius: 8px;
    padding-left: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    overflow: hidden;
    position: relative;
    transition: all .1s ease-in-out
}

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column a.small-banner:hover p {
        color: #ffc502
    }

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column a.small-banner p {
        font-size: 18px;
        font-weight: 700;
        line-height: 21.6px;
        text-align: left;
        color: #222324;
        margin: 0;
        position: absolute;
        top: calc(50% - 12px)
    }

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column a.small-banner img {
        margin-left: auto
    }

#navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column a.arrow-button {
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    text-align: left;
    color: #ffc502;
    display: flex;
    align-items: center;
    transition: all .1s ease-in-out;
    gap: 11px
}

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column a.arrow-button:hover {
        gap: 13px
    }

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__content .single-column a.arrow-button p {
        margin: 0
    }

#navbar-container #navbar-2024 #navbar-integration-item .container .box__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 32px;
    padding: 12px 48px;
    background-color: #f8fafc
}

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__footer .border-separator {
        width: 1px;
        height: 24px;
        background-color: #b7bbc2
    }

    #navbar-container #navbar-2024 #navbar-integration-item .container .box__footer a.link {
        font-size: 16px;
        font-weight: 400;
        line-height: 23px;
        text-align: center;
        color: #222324;
        transition: all .1s ease-in-out
    }

#navbar-container #navbar-2024 #navbar-solution-item {
    display: none;
    padding-top: 16px;
    height: 100vh;
    background-color: #d4d6dab2
}

    #navbar-container #navbar-2024 #navbar-solution-item.active {
        display: block
    }

    #navbar-container #navbar-2024 #navbar-solution-item .container .box {
        width: 100%;
        background-color: #fff;
        border-radius: 24px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        box-shadow: 0 8px 32px 0 #7d808666
    }

    #navbar-container #navbar-2024 #navbar-solution-item .container .box__content {
        padding: 40px 48px 48px;
        display: flex;
        justify-content: space-between
    }

        #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column {
            width: 260px;
            display: flex;
            flex-direction: column;
            gap: 32px
        }

            #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column a.header-link {
                display: flex;
                align-items: center;
                gap: 12px;
                transition: all .1s ease-in-out
            }

                #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column a.header-link:hover p, #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column a.header-link:hover svg {
                    color: #ffc502
                }

                #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column a.header-link p {
                    font-size: 18px;
                    font-weight: 700;
                    line-height: 26px;
                    text-align: left;
                    color: #222324;
                    text-transform: uppercase;
                    margin: 0
                }

            #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column div.header-link {
                display: flex;
                align-items: center;
                gap: 12px;
                transition: all .1s ease-in-out;
                cursor: default
            }

                #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column div.header-link p {
                    font-size: 18px;
                    font-weight: 700;
                    line-height: 26px;
                    text-align: left;
                    color: #222324;
                    text-transform: uppercase;
                    margin: 0
                }

            #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column div.list {
                display: flex;
                flex-direction: column;
                gap: 12px
            }

                #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column div.list ul {
                    list-style: none;
                    margin: 0;
                    padding-left: 34px;
                    display: flex;
                    flex-direction: column;
                    gap: 10px
                }

                    #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column div.list ul li {
                        display: flex;
                        flex-direction: column
                    }

                        #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column div.list ul li a.link {
                            font-size: 18px;
                            font-weight: 400;
                            line-height: 26px;
                            text-align: left;
                            transition: all .1s ease-in-out
                        }

                            #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column div.list ul li a.link:hover {
                                color: #ffc502
                            }

                        #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column div.list ul li span.desc {
                            font-size: 16px;
                            font-weight: 400;
                            line-height: 23px;
                            text-align: left;
                            color: #7d8086;
                            cursor: default
                        }

        #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column--planner {
            width: 308px;
            display: flex;
            flex-direction: column;
            gap: 32px
        }

            #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column--planner div.content {
                background-color: #f8fafc;
                border-radius: 8px;
                padding: 12px 20px;
                display: flex;
                flex-direction: column
            }

                #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column--planner div.content img {
                    width: 100%;
                    border-radius: 4px;
                    margin-bottom: 16px
                }

                #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column--planner div.content p {
                    font-size: 16px;
                    font-weight: 400;
                    line-height: 23px;
                    color: #323333;
                    margin-bottom: 21px
                }

                #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column--planner div.content a {
                    font-size: 16px;
                    font-weight: 600;
                    line-height: 23px;
                    color: #222324
                }

                    #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column--planner div.content a:hover {
                        color: #ffc502
                    }

        #navbar-container #navbar-2024 #navbar-solution-item .container .box__content .single-column--margin {
            margin-top: 2.2rem
        }

    #navbar-container #navbar-2024 #navbar-solution-item .container .box__content__links {
        display: flex
    }

    #navbar-container #navbar-2024 #navbar-solution-item .container .box__footer {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 32px;
        padding: 12px 48px;
        background-color: #f8fafc
    }

        #navbar-container #navbar-2024 #navbar-solution-item .container .box__footer .border-separator {
            width: 1px;
            height: 24px;
            background-color: #b7bbc2
        }

        #navbar-container #navbar-2024 #navbar-solution-item .container .box__footer a.link {
            font-size: 16px;
            font-weight: 400;
            line-height: 23px;
            text-align: center;
            color: #222324;
            transition: all .1s ease-in-out
        }

#navbar-container #navbar-2024-mobile {
    position: fixed;
    width: 100%;
    z-index: 999999999999;
    display: none
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    #navbar-container #navbar-2024-mobile {
        display: block
    }
}

#navbar-container #navbar-2024-mobile #navbar-menu-mobile {
    background-color: #fff;
    box-shadow: none
}

    #navbar-container #navbar-2024-mobile #navbar-menu-mobile .hamburger-bar {
        padding: 20px 0
    }

        #navbar-container #navbar-2024-mobile #navbar-menu-mobile .hamburger-bar .container {
            display: flex;
            justify-content: space-between;
            align-items: center
        }

            #navbar-container #navbar-2024-mobile #navbar-menu-mobile .hamburger-bar .container .buttons-mobile {
                display: flex;
                align-items: center;
                gap: 16px
            }

@media only screen and (max-width:380px) {
    #navbar-container #navbar-2024-mobile #navbar-menu-mobile .hamburger-bar .container .buttons-mobile {
        gap: 4px
    }

        #navbar-container #navbar-2024-mobile #navbar-menu-mobile .hamburger-bar .container .buttons-mobile a.btn-filled {
            padding: 16px 30px 17px
        }
}

#navbar-container #navbar-2024-mobile #navbar-menu-mobile .hamburger-bar .container .buttons-mobile .hamburger-button {
    background-color: transparent;
    border: none;
    outline: none;
    padding: 8px 10px;
    width: 48px;
    height: 48px
}

#navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile {
    display: none;
    height: calc(100dvh - 93px);
    width: 100%;
    overflow-y: scroll;
    flex-direction: column;
    justify-content: space-between
}

    #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile.active {
        display: flex
    }

#navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__content a, #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__content button {
    display: flex;
    padding: 20px 0;
    border: none;
    border-bottom: 1px solid #e9ebed;
    background-color: transparent;
    outline: none;
    width: 100%
}

    #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__content a .container, #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__content button .container {
        display: flex;
        gap: 10px
    }

        #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__content a .container.submenu, #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__content button .container.submenu {
            justify-content: space-between
        }

        #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__content a .container p, #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__content button .container p {
            font-size: 18px;
            font-weight: 600;
            line-height: 26px;
            text-align: left;
            color: #222324;
            margin: 0
        }

#navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 32px;
    padding: 12px 48px;
    background-color: #f8fafc
}

@media(max-width:767px) {
    #navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__footer {
        gap: 20px;
        padding: 12px 0
    }
}

#navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__footer .border-separator {
    width: 1px;
    height: 24px;
    background-color: #b7bbc2
}

#navbar-container #navbar-2024-mobile #navbar-menu-mobile .menu-mobile__footer a.link {
    font-size: 16px;
    font-weight: 400;
    line-height: 23px;
    text-align: center;
    color: #222324;
    transition: all .1s ease-in-out
}

#navbar-container #navbar-2024-mobile #navbar-menu-mobile .back-button {
    width: 100%;
    padding: 20px 0 18px;
    border-bottom: 1px solid #e9ebed;
    position: sticky;
    display: none;
    box-shadow: 0 6px 10px -4px #7d808626
}

    #navbar-container #navbar-2024-mobile #navbar-menu-mobile .back-button.active {
        display: flex
    }

    #navbar-container #navbar-2024-mobile #navbar-menu-mobile .back-button button {
        width: 100%;
        background-color: transparent;
        border: none;
        outline: none
    }

        #navbar-container #navbar-2024-mobile #navbar-menu-mobile .back-button button .container {
            display: flex;
            align-items: center;
            gap: 21px
        }

            #navbar-container #navbar-2024-mobile #navbar-menu-mobile .back-button button .container p {
                font-size: 18px;
                font-weight: 600;
                line-height: 26px;
                text-align: left;
                color: #222324;
                margin: 0
            }

#navbar-container #navbar-2024-mobile #navbar-product-item-mobile {
    background-color: #fff;
    height: calc(100dvh - 160px);
    width: 100%;
    overflow-y: scroll;
    flex-direction: column;
    justify-content: space-between;
    padding: 25px 0 95px;
    margin-top: -1px;
    display: none
}

    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile.active {
        display: flex
    }

    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container {
        display: flex;
        flex-direction: column;
        gap: 40px
    }

        #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column {
            width: 260px;
            display: flex;
            flex-direction: column;
            gap: 32px
        }

            #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column a.header-link {
                display: flex;
                align-items: center;
                gap: 12px;
                transition: all .1s ease-in-out
            }

                #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column a.header-link:hover p, #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column a.header-link:hover svg {
                    color: #ffc502
                }

                #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column a.header-link p {
                    font-size: 18px;
                    font-weight: 700;
                    line-height: 26px;
                    text-align: left;
                    color: #222324;
                    text-transform: uppercase;
                    margin: 0
                }

            #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column div.list {
                display: flex;
                flex-direction: column;
                gap: 12px
            }

                #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column div.list ul {
                    list-style: none;
                    margin: 0;
                    padding-left: 34px;
                    display: flex;
                    flex-direction: column;
                    gap: 10px
                }

                    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column div.list ul li {
                        padding: 4px 0
                    }

                        #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column div.list ul li a.link {
                            font-size: 18px;
                            font-weight: 400;
                            line-height: 26px;
                            text-align: left;
                            transition: all .1s ease-in-out
                        }

                            #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column div.list ul li a.link:hover {
                                color: #ffc502
                            }

        #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner {
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 32px
        }

            #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner a.small-banner {
                height: 114px;
                background-color: #f8fafc;
                border-radius: 8px;
                padding: 12px 25% 0;
                display: flex;
                justify-content: space-between;
                align-items: center;
                overflow: hidden
            }

@media(min-width:768px) and (max-width:991px) {
    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner a.small-banner {
        padding: 0 15% 0
    }
}

@media(max-width:767px) {
    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner a.small-banner {
        padding: 0 0 0 20px
    }
}

#navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner a.small-banner:hover div.img-with-content span {
    color: #2d80eb
}

#navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner a.small-banner div.img-with-content {
    display: flex;
    gap: 8px
}

    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner a.small-banner div.img-with-content img {
        width: 26px
    }

    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner a.small-banner div.img-with-content span {
        font-weight: 800;
        color: #000;
        font-size: 18px
    }

#navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner a.small-banner p {
    font-size: 18px;
    font-weight: 700;
    line-height: 21.6px;
    text-align: left;
    color: #222324;
    margin: 0
}

#navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner div.content {
    padding: 0 28px 0 20px;
    display: flex;
    flex-direction: column;
    gap: 32px
}

    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner div.content p {
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: left;
        color: #323333;
        margin: 0
    }

        #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner div.content p span {
            color: #2d80eb;
            font-weight: 600
        }

    #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner div.content ul {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px
    }

        #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner div.content ul li a {
            display: flex;
            align-items: center;
            gap: 12px
        }

            #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner div.content ul li a:hover p, #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner div.content ul li a:hover svg {
                color: #2d80eb
            }

            #navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container .single-column--planner div.content ul li a p {
                font-size: 18px;
                font-weight: 400;
                line-height: 26px;
                text-align: left;
                color: #323333;
                margin: 0
            }

#navbar-container #navbar-2024-mobile #navbar-product-item-mobile .container__links {
    display: flex
}

#navbar-container #navbar-2024-mobile #navbar-integration-item-mobile {
    background-color: #fff;
    height: calc(100dvh - 160px);
    width: 100%;
    overflow-y: scroll;
    flex-direction: column;
    justify-content: space-between;
    padding: 25px 0 95px;
    margin-top: -1px;
    display: none
}

    #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile.active {
        display: flex
    }

    #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container {
        display: flex;
        flex-direction: column;
        gap: 40px
    }

        #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container .single-column {
            display: flex;
            flex-direction: column;
            gap: 16px
        }

            #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container .single-column p.header-list {
                font-size: 18px;
                font-weight: 700;
                line-height: 26px;
                text-align: left;
                color: #222324;
                margin-bottom: 12px
            }

            #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container .single-column .single-list ul {
                display: flex;
                flex-direction: column;
                list-style: none;
                padding: 0;
                margin: 0;
                gap: 10px
            }

                #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container .single-column .single-list ul li {
                    padding: 4px 0
                }

                    #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container .single-column .single-list ul li a.check-link {
                        display: flex;
                        align-items: center;
                        gap: 10px;
                        transition: all .1s ease-in-out
                    }

                        #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container .single-column .single-list ul li a.check-link:hover p {
                            color: #ffc502
                        }

                        #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container .single-column .single-list ul li a.check-link p {
                            font-size: 18px;
                            font-weight: 400;
                            line-height: 26px;
                            text-align: left;
                            color: #323333;
                            margin: 0
                        }

        #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container a.small-banner {
            height: 114px;
            background-color: #f8fafc;
            border-radius: 8px;
            padding: 0 25% 0;
            display: flex;
            justify-content: space-between;
            align-items: center;
            overflow: hidden
        }

@media(min-width:768px) and (max-width:991px) {
    #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container a.small-banner {
        padding: 0 15% 0
    }
}

@media(max-width:767px) {
    #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container a.small-banner {
        padding: 0 0 0 20px
    }
}

#navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container a.small-banner p {
    font-size: 18px;
    font-weight: 700;
    line-height: 21.6px;
    text-align: left;
    color: #222324;
    margin: 0
}

#navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container a.arrow-button {
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    text-align: left;
    color: #ffc502;
    display: flex;
    align-items: center;
    transition: all .1s ease-in-out;
    gap: 11px
}

    #navbar-container #navbar-2024-mobile #navbar-integration-item-mobile .container a.arrow-button p {
        margin: 0
    }

#navbar-container #navbar-2024-mobile #navbar-solution-item-mobile {
    background-color: #fff;
    height: calc(100dvh - 160px);
    width: 100%;
    overflow-y: scroll;
    flex-direction: column;
    justify-content: space-between;
    padding: 25px 0 95px;
    margin-top: -1px;
    display: none
}

    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile.active {
        display: flex
    }

    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container {
        display: flex;
        flex-direction: column;
        gap: 40px
    }

        #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column {
            width: 260px;
            display: flex;
            flex-direction: column;
            gap: 32px
        }

        #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner {
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 32px
        }

            #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner div.content {
                background-color: #f8fafc;
                border-radius: 8px;
                padding: 12px 20px;
                display: flex;
                gap: 16px
            }

@media(max-width:767px) {
    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner div.content {
        flex-direction: column
    }
}

#navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner div.content img {
    width: 100%;
    max-width: 268px;
    max-height: 114px;
    object-fit: cover;
    border-radius: 4px
}

@media(max-width:767px) {
    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner div.content img {
        max-width: unset
    }
}

#navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner div.content div.text {
    display: flex;
    justify-content: center;
    flex-direction: column
}

    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner div.content div.text p {
        font-size: 16px;
        font-weight: 400;
        line-height: 23px;
        color: #323333;
        margin-bottom: 21px
    }

    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner div.content div.text a {
        font-size: 16px;
        font-weight: 600;
        line-height: 23px;
        color: #222324
    }

        #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column--planner div.content div.text a:hover {
            color: #ffc502
        }

#navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column a.header-link {
    display: flex;
    align-items: center;
    gap: 12px;
    transition: all .1s ease-in-out
}

    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column a.header-link:hover p, #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column a.header-link:hover svg {
        color: #ffc502
    }

    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column a.header-link p {
        font-size: 18px;
        font-weight: 700;
        line-height: 26px;
        text-align: left;
        color: #222324;
        text-transform: uppercase;
        margin: 0
    }

#navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column div.header-link {
    display: flex;
    align-items: center;
    gap: 12px;
    transition: all .1s ease-in-out
}

    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column div.header-link p {
        font-size: 18px;
        font-weight: 700;
        line-height: 26px;
        text-align: left;
        color: #222324;
        text-transform: uppercase;
        margin: 0
    }

#navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column div.list {
    display: flex;
    flex-direction: column;
    gap: 12px
}

    #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column div.list ul {
        list-style: none;
        margin: 0;
        padding-left: 34px;
        display: flex;
        flex-direction: column;
        gap: 10px
    }

        #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column div.list ul li {
            padding: 4px 0;
            display: flex;
            flex-direction: column
        }

            #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column div.list ul li a.link {
                font-size: 18px;
                font-weight: 400;
                line-height: 26px;
                text-align: left;
                transition: all .1s ease-in-out
            }

                #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column div.list ul li a.link:hover {
                    color: #ffc502
                }

            #navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container .single-column div.list ul li span.desc {
                font-size: 16px;
                font-weight: 400;
                line-height: 23px;
                text-align: left;
                color: #7d8086
            }

#navbar-container #navbar-2024-mobile #navbar-solution-item-mobile .container__links {
    display: flex
}

.planner-pricing {
    font-family: Lato
}

    .planner-pricing h1, .planner-pricing h2, .planner-pricing h3, .planner-pricing h4, .planner-pricing p {
        margin: 0
    }

    .planner-pricing #top {
        display: flex;
        padding: 0;
        margin: 80px 0
    }

        .planner-pricing #top .container {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 32px
        }

            .planner-pricing #top .container h1 {
                font-size: 52px;
                font-weight: 700;
                line-height: 62.4px;
                text-align: center;
                color: #222324
            }

                .planner-pricing #top .container h1 span {
                    color: #2d80eb
                }

            .planner-pricing #top .container p {
                font-size: 18px;
                font-weight: 400;
                line-height: 24px;
                text-align: center;
                max-width: 522px
            }

    .planner-pricing #pricing-white .container {
        display: flex;
        align-items: center;
        justify-content: center
    }

        .planner-pricing #pricing-white .container .boxes {
            width: 866px;
            display: grid;
            grid-template-columns: repeat(2,1fr);
            gap: 40px
        }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .planner-pricing #pricing-white .container .boxes {
        gap: 20px
    }
}

@media(max-width:767px) {
    .planner-pricing #pricing-white .container .boxes {
        grid-template-columns: 1fr
    }
}

.planner-pricing #pricing-white .container .boxes__single-box {
    width: 100%;
    background-color: #fff;
    padding: 20px 20px 48px;
    box-shadow: 0 6px 24px 0 #0000002b;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    gap: 40px
}

    .planner-pricing #pricing-white .container .boxes__single-box div.top-section {
        display: flex;
        flex-direction: column;
        background-color: #fff;
        border: 1px solid #2d7feb41;
        padding: 24px;
        border-radius: 24px;
        color: #222324
    }

        .planner-pricing #pricing-white .container .boxes__single-box div.top-section div.price {
            display: flex;
            align-items: flex-end;
            gap: 3px
        }

            .planner-pricing #pricing-white .container .boxes__single-box div.top-section div.price span {
                font-family: Nunito Sans;
                font-size: 36px;
                font-weight: 800;
                line-height: 49.1px
            }

            .planner-pricing #pricing-white .container .boxes__single-box div.top-section div.price p {
                font-family: Lato;
                font-size: 72px;
                font-weight: 700;
                line-height: 86.4px
            }

        .planner-pricing #pricing-white .container .boxes__single-box div.top-section h2 {
            font-size: 32px;
            font-weight: 700;
            line-height: 38.4px;
            margin-bottom: 12px
        }

        .planner-pricing #pricing-white .container .boxes__single-box div.top-section p.desc {
            font-size: 18px;
            font-weight: 500;
            line-height: 24px;
            margin-bottom: 24px;
            color: #6b6b6b
        }

        .planner-pricing #pricing-white .container .boxes__single-box div.top-section p.period {
            font-size: 18px;
            font-weight: 500;
            line-height: 21.6px;
            margin-bottom: 12px;
            color: #6b6b6b
        }

        .planner-pricing #pricing-white .container .boxes__single-box div.top-section p.users {
            font-size: 18px;
            font-weight: 500;
            line-height: 21.6px;
            margin-bottom: 40px;
            color: #6b6b6b
        }

            .planner-pricing #pricing-white .container .boxes__single-box div.top-section p.users span {
                font-weight: 800
            }

    .planner-pricing #pricing-white .container .boxes__single-box div.features {
        padding: 0 24px
    }

        .planner-pricing #pricing-white .container .boxes__single-box div.features p.list-header {
            font-size: 18px;
            font-weight: 700;
            line-height: 21.6px;
            color: #222324;
            margin-bottom: 16px
        }

        .planner-pricing #pricing-white .container .boxes__single-box div.features ul {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 16px
        }

            .planner-pricing #pricing-white .container .boxes__single-box div.features ul li {
                display: flex;
                align-items: baseline;
                gap: 10px
            }

                .planner-pricing #pricing-white .container .boxes__single-box div.features ul li p {
                    font-size: 18px;
                    font-weight: 500;
                    line-height: 24px;
                    text-align: left;
                    color: #313131
                }

.planner-pricing #pricing-white .container .boxes__single-box--blue div.top-section {
    display: flex;
    flex-direction: column;
    background: linear-gradient(104.16deg,#2d80eb 16.09%,#2466bc 83.91%,#2466bc 83.91%);
    box-shadow: none;
    padding: 24px;
    border-radius: 24px;
    color: #fff
}

    .planner-pricing #pricing-white .container .boxes__single-box--blue div.top-section div.price {
        display: flex;
        align-items: flex-end;
        gap: 3px
    }

        .planner-pricing #pricing-white .container .boxes__single-box--blue div.top-section div.price span {
            font-family: Nunito Sans;
            font-size: 36px;
            font-weight: 800;
            line-height: 49.1px;
            color: #fff
        }

        .planner-pricing #pricing-white .container .boxes__single-box--blue div.top-section div.price p {
            font-family: Lato;
            font-size: 72px;
            font-weight: 700;
            line-height: 86.4px;
            color: #fff
        }

    .planner-pricing #pricing-white .container .boxes__single-box--blue div.top-section h2 {
        font-size: 32px;
        font-weight: 700;
        line-height: 38.4px;
        margin-bottom: 12px;
        color: #fff
    }

    .planner-pricing #pricing-white .container .boxes__single-box--blue div.top-section p.desc {
        font-size: 18px;
        font-weight: 500;
        line-height: 24px;
        margin-bottom: 24px;
        color: #fff
    }

    .planner-pricing #pricing-white .container .boxes__single-box--blue div.top-section p.period {
        font-size: 18px;
        font-weight: 500;
        line-height: 21.6px;
        margin-bottom: 12px;
        color: #fff
    }

    .planner-pricing #pricing-white .container .boxes__single-box--blue div.top-section p.users {
        font-size: 18px;
        font-weight: 800;
        line-height: 21.6px;
        text-transform: uppercase;
        margin-bottom: 40px;
        color: #fff
    }

.planner-pricing #pricing-transparent {
    width: 100%;
    position: relative;
    margin-top: 88px
}

    .planner-pricing #pricing-transparent::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        max-width: 700px;
        width: 100%;
        height: 700px;
        border-radius: 10000px;
        background-color: #2d80eb;
        z-index: -1;
        filter: blur(20vw)
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    .planner-pricing #pricing-transparent::after {
        top: 60%;
        height: 50vh;
        filter: blur(300px)
    }
}

.planner-pricing #pricing-transparent .container {
    display: flex;
    align-items: center;
    justify-content: center
}

    .planner-pricing #pricing-transparent .container .boxes {
        width: 866px;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 40px
    }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .planner-pricing #pricing-transparent .container .boxes {
        gap: 20px
    }
}

@media(max-width:767px) {
    .planner-pricing #pricing-transparent .container .boxes {
        grid-template-columns: 1fr
    }
}

.planner-pricing #pricing-transparent .container .boxes__single-box {
    width: 100%;
    position: relative;
    background: linear-gradient(112.54deg,rgba(234,242,253,0.12) 10.29%,rgba(234,242,253,0) 100.35%);
    padding: 20px 20px 48px;
    box-shadow: 0 6px 24px 0 #0000002b;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    gap: 40px;
    border: 1px solid rgba(255,255,255,.1)
}

    .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section {
        display: flex;
        flex-direction: column;
        padding: 24px;
        border-radius: 24px;
        color: #fff;
        border: 1px solid #2d7feb41
    }

        .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section div.price {
            display: flex;
            align-items: flex-end;
            gap: 3px
        }

            .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section div.price span {
                font-family: Nunito Sans;
                font-size: 36px;
                font-weight: 800;
                line-height: 49.1px
            }

            .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section div.price p {
                font-family: Lato;
                font-size: 72px;
                font-weight: 700;
                line-height: 86.4px
            }

        .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section h2 {
            font-size: 32px;
            font-weight: 700;
            line-height: 38.4px;
            margin-bottom: 12px
        }

        .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section p.desc {
            font-size: 18px;
            font-weight: 500;
            line-height: 24px;
            margin-bottom: 24px;
            color: #fff
        }

        .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section p.period {
            font-size: 18px;
            font-weight: 500;
            line-height: 21.6px;
            margin-bottom: 12px;
            color: #fff
        }

        .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section p.users {
            font-size: 18px;
            font-weight: 500;
            line-height: 21.6px;
            margin-bottom: 40px;
            color: #fff
        }

            .planner-pricing #pricing-transparent .container .boxes__single-box div.top-section p.users span {
                font-weight: 800
            }

    .planner-pricing #pricing-transparent .container .boxes__single-box div.features {
        padding: 0 24px
    }

        .planner-pricing #pricing-transparent .container .boxes__single-box div.features p.list-header {
            font-size: 18px;
            font-weight: 700;
            line-height: 21.6px;
            color: #fff;
            margin-bottom: 16px
        }

        .planner-pricing #pricing-transparent .container .boxes__single-box div.features ul {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 16px
        }

            .planner-pricing #pricing-transparent .container .boxes__single-box div.features ul li {
                display: flex;
                align-items: baseline;
                gap: 10px
            }

                .planner-pricing #pricing-transparent .container .boxes__single-box div.features ul li p {
                    font-size: 18px;
                    font-weight: 500;
                    line-height: 24px;
                    text-align: left;
                    color: #fff;
                    margin: 0
                }

.planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section {
    display: flex;
    flex-direction: column;
    border: none;
    background: linear-gradient(104.16deg,#2d80eb 16.09%,#2466bc 83.91%,#2466bc 83.91%);
    box-shadow: none;
    padding: 24px;
    border-radius: 24px;
    color: #fff
}

    .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section a.btn-filled-planner--white {
        display: inline-block;
        font-family: Lato;
        font-size: 18px;
        font-weight: 700;
        line-height: 21.6px;
        color: #fff;
        text-align: center;
        padding: 16px 32px;
        border-radius: 100px;
        text-decoration: none;
        background-color: transparent;
        background: linear-gradient(125.47deg,rgba(255,255,255,0.2) 61.21%,rgba(36,102,188,0.2) 100%);
        transition: all .2s ease-in-out
    }

        .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section a.btn-filled-planner--white:hover {
            filter: brightness(.95);
            background: linear-gradient(125.47deg,rgba(255,255,255,0.2) 82.21%,rgba(36,102,188,0.2) 100%)
        }

    .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section div.price {
        display: flex;
        align-items: flex-end;
        gap: 3px
    }

        .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section div.price span {
            font-family: Nunito Sans;
            font-size: 36px;
            font-weight: 800;
            line-height: 49.1px;
            color: #fff
        }

        .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section div.price p {
            font-family: Lato;
            font-size: 72px;
            font-weight: 700;
            line-height: 86.4px;
            color: #fff
        }

    .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section h2 {
        font-size: 32px;
        font-weight: 700;
        line-height: 38.4px;
        margin-bottom: 12px;
        color: #fff
    }

    .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section p.desc {
        font-size: 18px;
        font-weight: 500;
        line-height: 24px;
        margin-bottom: 24px;
        color: #fff
    }

    .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section p.period {
        font-size: 18px;
        font-weight: 500;
        line-height: 21.6px;
        margin-bottom: 12px;
        color: #fff
    }

    .planner-pricing #pricing-transparent .container .boxes__single-box--blue div.top-section p.users {
        font-size: 18px;
        font-weight: 800;
        line-height: 21.6px;
        text-transform: uppercase;
        margin-bottom: 40px;
        color: #fff
    }

.planner-pricing #compare-table {
    margin: 164px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

    .planner-pricing #compare-table .container .table-heading {
        margin-bottom: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column
    }

        .planner-pricing #compare-table .container .table-heading h2 {
            font-size: 41px;
            font-weight: 800;
            text-align: center;
            margin-bottom: 32px
        }

        .planner-pricing #compare-table .container .table-heading p {
            font-family: Lato;
            font-size: 18px;
            font-weight: 400;
            line-height: 24px;
            text-align: center;
            max-width: 522px
        }

    .planner-pricing #compare-table .container .comparison {
        margin: 0 auto;
        font-size: 14px;
        font-weight: 700;
        text-align: center
    }

        .planner-pricing #compare-table .container .comparison .tick {
            color: #1b1b20
        }

        .planner-pricing #compare-table .container .comparison table.content-table:not(:first-of-type) {
            margin-top: 24px
        }

        .planner-pricing #compare-table .container .comparison table {
            width: 100%;
            margin: 0 auto;
            border-collapse: collapse;
            border-spacing: 120px;
            table-layout: fixed;
            position: relative
        }

            .planner-pricing #compare-table .container .comparison table.fixed-bar {
                position: sticky;
                position: -webkit-sticky;
                top: 6.2rem;
                background-color: #fff;
                z-index: 10
            }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px),(min-width:992px) and (max-width:1199px),(max-width:767px) {
    .planner-pricing #compare-table .container .comparison table.fixed-bar {
        top: unset
    }
}

.planner-pricing #compare-table .container .comparison table tr th:first-of-type, .planner-pricing #compare-table .container .comparison table tr td:first-of-type {
    width: 400px
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .planner-pricing #compare-table .container .comparison table tr th:first-of-type, .planner-pricing #compare-table .container .comparison table tr td:first-of-type {
        width: fit-content
    }
}

@media(max-width:767px) {
    .planner-pricing #compare-table .container .comparison table tr th:first-of-type, .planner-pricing #compare-table .container .comparison table tr td:first-of-type {
        width: fit-content
    }
}

.planner-pricing #compare-table .container .comparison table tr th:not(:first-of-type), .planner-pricing #compare-table .container .comparison table tr td:not(:first-of-type) {
    padding: 0 4rem
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .planner-pricing #compare-table .container .comparison table tr th:not(:first-of-type), .planner-pricing #compare-table .container .comparison table tr td:not(:first-of-type) {
        padding: 0 1rem
    }
}

@media(max-width:767px) {
    .planner-pricing #compare-table .container .comparison table tr th:not(:first-of-type), .planner-pricing #compare-table .container .comparison table tr td:not(:first-of-type) {
        padding: 0
    }
}

.planner-pricing #compare-table .container .comparison table thead tr th {
    empty-cells: show;
    padding: 10px
}

    .planner-pricing #compare-table .container .comparison table thead tr th.tl {
        border-bottom: none
    }

        .planner-pricing #compare-table .container .comparison table thead tr th.tl::after {
            content: "";
            position: absolute;
            background-color: #fff;
            width: 100%;
            height: 100%;
            top: -1rem;
            left: 0;
            z-index: -1;
            margin-left: -7rem
        }

    .planner-pricing #compare-table .container .comparison table thead tr th.compare-heading {
        font-family: Lato;
        font-size: 24px;
        font-weight: 700;
        line-height: 28.8px;
        text-align: center;
        color: #222324;
        margin-bottom: 12px
    }

    .planner-pricing #compare-table .container .comparison table thead tr th.price-info {
        text-align: center;
        border-bottom: none
    }

        .planner-pricing #compare-table .container .comparison table thead tr th.price-info a {
            display: block
        }

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    .planner-pricing #compare-table .container .comparison table thead tr th.price-info a {
        padding: 16px 45px
    }
}

@media(max-width:767px) {
    .planner-pricing #compare-table .container .comparison table thead tr th.price-info a {
        display: none
    }
}

.planner-pricing #compare-table .container .comparison table thead tr th.price-info .price-now {
    margin: 0 auto;
    font-family: Lato;
    font-size: 32px;
    font-weight: 700;
    line-height: 38px;
    letter-spacing: 0;
    margin-top: 12px
}

    .planner-pricing #compare-table .container .comparison table thead tr th.price-info .price-now span.dolar {
        font-family: Nunito Sans;
        font-size: 16px;
        font-weight: 800;
        line-height: 22px;
        text-align: right;
        margin-right: 3px
    }

.planner-pricing #compare-table .container .comparison table thead tr th.price-info .add-margin {
    margin-bottom: 47px
}

.planner-pricing #compare-table .container .comparison table thead tr th.price-info .price-anually {
    font-family: Lato;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    text-align: center;
    color: #222324;
    margin: .5rem auto 24px
}

.planner-pricing #compare-table .container .comparison table thead tr th.price-info a {
    margin-bottom: 1.5rem
}

.planner-pricing #compare-table .container .comparison table thead tr th.price-info .btn-outline {
    padding: 15px 0;
    width: 100%;
    font-size: 16px;
    margin-top: .5rem
}

.planner-pricing #compare-table .container .comparison table tbody tr:nth-of-type(2n) {
    background-color: #fafafa;
    border-radius: 8px
}

.planner-pricing #compare-table .container .comparison table tbody tr td {
    font-size: 16px;
    font-weight: 500;
    line-height: 21px;
    color: #222324;
    empty-cells: show;
    padding: 16px 24px
}

    .planner-pricing #compare-table .container .comparison table tbody tr td.header {
        font-family: Lato;
        font-size: 18px;
        font-weight: 700;
        line-height: 21px;
        text-align: left;
        color: #222324
    }

    .planner-pricing #compare-table .container .comparison table tbody tr td:first-child {
        text-align: left
    }

.use-cases * {
    font-family: sans-serif
}

.use-cases p, .use-cases h1, .use-cases h2, .use-cases h3, .use-cases h4 {
    margin: 0;
    padding: 0
}

.use-cases .button-wrapper__google span {
    font-size: 18px;
    font-weight: 400;
    line-height: 21.6px;
    color: #323333;
    margin-right: 6px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#top {
        padding-bottom: 96px
    }
}

@media(max-width:767px) {
    .use-cases section#top {
        padding-bottom: 80px
    }
}

.use-cases section#top .container {
    display: flex;
    align-items: center;
    gap: 4rem
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#top .container {
        flex-direction: column;
        gap: 96px
    }
}

@media(max-width:767px) {
    .use-cases section#top .container {
        flex-direction: column;
        gap: 56px
    }
}

.use-cases section#top .container .content {
    min-width: 480px;
    width: 480px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#top .container .content {
        min-width: unset;
        width: 542px
    }
}

@media(max-width:767px) {
    .use-cases section#top .container .content {
        min-width: unset;
        width: 100%
    }
}

.use-cases section#top .container .content h1 {
    font-size: 52px;
    font-weight: 700;
    line-height: 60.32px;
    text-align: left;
    color: #222324;
    margin-bottom: 48px;
    max-width: 475px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#top .container .content h1 {
        text-align: center;
        max-width: unset
    }
}

@media(max-width:767px) {
    .use-cases section#top .container .content h1 {
        font-size: 44px;
        line-height: 51.04px
    }
}

.use-cases section#top .container .content h1 span {
    color: #ffc502
}

.use-cases section#top .container .content div.paragraph {
    display: flex;
    gap: 24px;
    margin-bottom: 58px
}

@media(max-width:767px) {
    .use-cases section#top .container .content div.paragraph__single {
        text-align: center
    }
}

.use-cases section#top .container .content div.paragraph__single img {
    margin-bottom: 14px
}

.use-cases section#top .container .content div.paragraph__single p {
    font-size: 16px;
    font-weight: 400;
    line-height: 23px;
    text-align: left
}

@media(max-width:767px) {
    .use-cases section#top .container .content div.paragraph__single p {
        text-align: center
    }
}

.use-cases section#top .container .content div.buttons {
    display: flex;
    align-items: center;
    gap: 24px
}

@media(max-width:767px) {
    .use-cases section#top .container .content div.buttons {
        flex-direction: column
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#top .container .content div.buttons {
        justify-content: center
    }
}

.use-cases section#top .container .image {
    width: 100%
}

    .use-cases section#top .container .image img {
        width: 100%
    }

.use-cases section#content-with-illustrations {
    margin-top: 144px
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations {
        margin-top: 120px
    }
}

.use-cases section#content-with-illustrations .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 128px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#content-with-illustrations .container {
        gap: 72px
    }
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container {
        gap: 56px
    }
}

.use-cases section#content-with-illustrations .container .header {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 32px
}

    .use-cases section#content-with-illustrations .container .header p {
        font-size: 24px;
        font-weight: 400;
        line-height: 29.05px;
        text-align: center;
        color: #222324;
        max-width: 630px
    }

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .header p {
        font-size: 18px;
        line-height: 26px
    }
}

.use-cases section#content-with-illustrations .container .header h2 {
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: center;
    color: #222324;
    max-width: 846px
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .header h2 {
        font-size: 36px;
        line-height: 42.96px
    }
}

.use-cases section#content-with-illustrations .container .content {
    display: flex;
    flex-direction: column;
    gap: 180px;
    width: 100%
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content {
        gap: 120px
    }
}

.use-cases section#content-with-illustrations .container .content .row:first-of-type {
    display: flex;
    justify-content: space-around
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#content-with-illustrations .container .content .row:first-of-type {
        flex-direction: column-reverse;
        align-items: center;
        gap: 64px
    }
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:first-of-type {
        flex-direction: column-reverse;
        align-items: center;
        gap: 56px
    }
}

.use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes {
    max-width: 522px;
    height: fit-content;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 80px
}

    .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes::before {
        content: "";
        position: absolute;
        top: 0;
        left: 29px;
        height: 100%;
        width: 1.5px;
        background-color: #ffc502;
        z-index: -2
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes {
        max-width: 100%;
        width: 100%
    }
}

.use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box {
    display: flex;
    align-items: flex-start;
    gap: 32px
}

    .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box:last-of-type {
        background-color: #fff
    }

    .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box div.image {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center
    }

        .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box div.image::before {
            content: "";
            position: absolute;
            top: -16px;
            left: 0;
            background-color: #fff;
            width: 100%;
            height: calc(100% + 32px);
            z-index: -1
        }

    .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box div.text h2 {
        font-size: 28px;
        font-weight: 700;
        line-height: 33.41px;
        text-align: left;
        color: #222324;
        margin-bottom: 32px
    }

        .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box div.text h2 span {
            color: #ffc502
        }

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box div.text h2 {
        font-size: 24px;
        line-height: 28.64px
    }
}

.use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box div.text p {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #222324
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:first-of-type .content-boxes .single-box div.text p {
        font-size: 16px;
        line-height: 23px
    }
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:first-of-type .image img.illustration {
        width: 100%
    }
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:first-of-type .image img.illustration img {
        width: 100%
    }
}

.use-cases section#content-with-illustrations .container .content .row:last-of-type {
    display: flex;
    justify-content: space-around;
    position: relative
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#content-with-illustrations .container .content .row:last-of-type {
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 21px
    }
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:last-of-type {
        flex-direction: column;
        gap: 56px
    }
}

.use-cases section#content-with-illustrations .container .content .row:last-of-type img.lines {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:last-of-type img.lines {
        display: none
    }
}

.use-cases section#content-with-illustrations .container .content .row:last-of-type div.content-box {
    width: 386px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 28px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:last-of-type div.content-box {
        width: 100%
    }
}

.use-cases section#content-with-illustrations .container .content .row:last-of-type div.content-box h2 {
    font-size: 28px;
    font-weight: 700;
    line-height: 33.41px;
    text-align: center;
    color: #222324;
    min-height: 66px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#content-with-illustrations .container .content .row:last-of-type div.content-box h2 {
        font-size: 24px;
        line-height: 28.64px
    }
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:last-of-type div.content-box h2 {
        font-size: 18px;
        font-weight: 600;
        line-height: 26px
    }
}

.use-cases section#content-with-illustrations .container .content .row:last-of-type div.content-box p {
    font-size: 28px;
    font-weight: 400;
    line-height: 33.41px;
    text-align: center;
    color: #222324
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#content-with-illustrations .container .content .row:last-of-type div.content-box p {
        font-size: 24px;
        line-height: 28.64px
    }
}

@media(max-width:767px) {
    .use-cases section#content-with-illustrations .container .content .row:last-of-type div.content-box p {
        font-size: 18px;
        line-height: 26px
    }
}

.use-cases section#how-to-use-Timely {
    margin: 180px 0
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#how-to-use-Timely {
        margin: 144px 0 180px
    }
}

@media(max-width:767px) {
    .use-cases section#how-to-use-Timely {
        margin: 120px 0
    }
}

.use-cases section#how-to-use-Timely .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 120px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#how-to-use-Timely .container {
        gap: 72px
    }
}

.use-cases section#how-to-use-Timely .container .header h2 {
    font-weight: 700;
    font-size: 44px;
    line-height: 51.04px;
    text-align: center;
    color: #222324;
    max-width: 846px
}

    .use-cases section#how-to-use-Timely .container .header h2 span {
        color: #ffc502
    }

@media(max-width:767px) {
    .use-cases section#how-to-use-Timely .container .header h2 {
        font-size: 36px;
        line-height: 42.96px
    }
}

.use-cases section#how-to-use-Timely .container .content {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 96px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#how-to-use-Timely .container .content {
        gap: 72px
    }
}

.use-cases section#how-to-use-Timely .container .content .single-box {
    display: flex;
    align-items: center;
    gap: 78px
}

    .use-cases section#how-to-use-Timely .container .content .single-box:nth-of-type(2n) {
        flex-direction: row-reverse
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#how-to-use-Timely .container .content .single-box {
        gap: 32px;
        flex-direction: column !important
    }
}

@media(max-width:767px) {
    .use-cases section#how-to-use-Timely .container .content .single-box {
        gap: 48px;
        flex-direction: column !important
    }
}

.use-cases section#how-to-use-Timely .container .content .single-box__content {
    width: 100%;
    max-width: 433px;
    display: flex;
    flex-direction: column
}

@media(max-width:767px),(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#how-to-use-Timely .container .content .single-box__content {
        max-width: unset
    }
}

.use-cases section#how-to-use-Timely .container .content .single-box__content span {
    font-size: 28px;
    font-weight: 700;
    line-height: 33.41px;
    text-align: left;
    color: #ffc502;
    position: relative;
    margin-bottom: 44px
}

    .use-cases section#how-to-use-Timely .container .content .single-box__content span::after {
        content: "";
        position: absolute;
        bottom: -12px;
        left: 0;
        width: 58px;
        height: 2px;
        background-color: #ffc502
    }

.use-cases section#how-to-use-Timely .container .content .single-box__content h2 {
    font-size: 36px;
    font-weight: 700;
    line-height: 42.96px;
    text-align: left;
    color: #333;
    margin-bottom: 32px
}

@media(max-width:767px) {
    .use-cases section#how-to-use-Timely .container .content .single-box__content h2 {
        font-size: 28px;
        line-height: 33.41px
    }
}

.use-cases section#how-to-use-Timely .container .content .single-box__content p {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #222324
}

@media(max-width:767px) {
    .use-cases section#how-to-use-Timely .container .content .single-box__content p {
        font-size: 16px;
        line-height: 23px
    }
}

.use-cases section#how-to-use-Timely .container .content .single-box__image {
    width: 100%
}

    .use-cases section#how-to-use-Timely .container .content .single-box__image img {
        width: 100%
    }

.use-cases section.gray-content {
    margin: 80px 0;
    background-color: #f8fafc;
    padding: 102.5px 0;
    position: relative;
    overflow: hidden
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section.gray-content {
        padding: 96px 0
    }
}

@media(max-width:767px) {
    .use-cases section.gray-content {
        padding: 72px 0
    }
}

.use-cases section.gray-content img.background-cover-desktop {
    display: block;
    position: absolute;
    top: 0;
    right: 0
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section.gray-content img.background-cover-desktop {
        display: none
    }
}

.use-cases section.gray-content img.background-cover-mobile {
    display: none;
    margin-top: 64px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section.gray-content img.background-cover-mobile {
        display: block
    }
}

.use-cases section.gray-content .container {
    display: flex;
    align-items: center;
    gap: 4rem
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section.gray-content .container {
        gap: 72px;
        flex-direction: column
    }
}

@media(max-width:767px) {
    .use-cases section.gray-content .container {
        gap: 56px;
        flex-direction: column
    }
}

.use-cases section.gray-content .container h2 {
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: left;
    margin-bottom: 32px
}

@media(max-width:767px) {
    .use-cases section.gray-content .container h2 {
        font-size: 36px;
        line-height: 42.96px
    }
}

.use-cases section.gray-content .container p {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    text-align: left;
    color: #323333;
    margin-bottom: 48px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section.gray-content .container p {
        font-size: 24px;
        line-height: 28.64px
    }
}

@media(max-width:767px) {
    .use-cases section.gray-content .container p {
        font-size: 18px;
        line-height: 26px
    }
}

.use-cases section.gray-content .container .text {
    width: 100%;
    max-width: 478px;
    display: flex;
    flex-direction: column;
    display: block
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section.gray-content .container .text {
        max-width: unset
    }
}

.use-cases section.gray-content .container .text-with-button {
    width: 100%;
    max-width: 478px;
    display: flex;
    flex-direction: column
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section.gray-content .container .text-with-button {
        max-width: unset
    }
}

.use-cases section.gray-content .container div.buttons {
    display: flex;
    align-items: center;
    gap: 24px
}

.use-cases section.gray-content .container div.buttons--mobile {
    display: none
}

@media(max-width:767px) {
    .use-cases section.gray-content .container div.buttons--mobile {
        display: flex
    }
}

@media(max-width:767px) {
    .use-cases section.gray-content .container div.buttons {
        flex-direction: column;
        align-items: flex-start
    }
}

.use-cases section.gray-content .container .image {
    width: 100%
}

    .use-cases section.gray-content .container .image img {
        width: 100%
    }

.use-cases section#Timely-supports {
    margin: 120px 0 180px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#Timely-supports {
        margin: 120px 0
    }
}

@media(max-width:767px) {
    .use-cases section#Timely-supports {
        margin: 120px 0 96px
    }
}

.use-cases section#Timely-supports .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 72px
}

    .use-cases section#Timely-supports .container .header h2 {
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: center;
        color: #222324;
        max-width: 678px
    }

        .use-cases section#Timely-supports .container .header h2 span {
            color: #ffc502
        }

@media(max-width:767px) {
    .use-cases section#Timely-supports .container .header h2 {
        font-size: 36px;
        line-height: 42.96px
    }
}

.use-cases section#Timely-supports .container .content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 48px
}

    .use-cases section#Timely-supports .container .content .single-box {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2,1fr);
        border-radius: 16px;
        box-shadow: 0 4px 10px 0 #7d808626;
        overflow: hidden
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#Timely-supports .container .content .single-box {
        grid-template-columns: 1fr
    }
}

.use-cases section#Timely-supports .container .content .single-box__image {
    width: 100%;
    background-color: #f8fafc;
    display: flex;
    justify-content: center;
    padding-top: 1rem
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#Timely-supports .container .content .single-box__image {
        height: 344px;
        overflow: hidden
    }
}

@media(max-width:767px) {
    .use-cases section#Timely-supports .container .content .single-box__image {
        padding: 1rem 1rem 0;
        max-height: 181px;
        overflow: hidden
    }
}

@media(max-width:767px) {
    .use-cases section#Timely-supports .container .content .single-box__image img {
        width: 100%
    }
}

.use-cases section#Timely-supports .container .content .single-box__image--center {
    align-items: center
}

.use-cases section#Timely-supports .container .content .single-box__content {
    width: 100%;
    padding: 32px 30.5px
}

    .use-cases section#Timely-supports .container .content .single-box__content h2 {
        font-size: 28px;
        font-weight: 700;
        line-height: 33.41px;
        text-align: left;
        color: #222324;
        margin-bottom: 16px
    }

@media(max-width:767px) {
    .use-cases section#Timely-supports .container .content .single-box__content h2 {
        font-size: 24px;
        line-height: 28.64px
    }
}

.use-cases section#Timely-supports .container .content .single-box__content p.paragraph {
    font-size: 16px;
    font-weight: 400;
    line-height: 23px;
    text-align: left;
    color: #323333;
    margin-bottom: 32px;
    max-width: 500px
}

@media(max-width:767px) {
    .use-cases section#Timely-supports .container .content .single-box__content p.paragraph {
        font-size: 16px;
        line-height: 23px
    }
}

.use-cases section#Timely-supports .container .content .single-box__content div.best-for {
    display: flex;
    flex-direction: column;
    gap: 12px
}

    .use-cases section#Timely-supports .container .content .single-box__content div.best-for h3 {
        font-size: 16px;
        font-weight: 700;
        line-height: 23px;
        text-align: left;
        color: #323333
    }

    .use-cases section#Timely-supports .container .content .single-box__content div.best-for div.labels {
        display: flex;
        gap: 26px;
        border-radius: 8px
    }

@media(max-width:767px) {
    .use-cases section#Timely-supports .container .content .single-box__content div.best-for div.labels {
        flex-direction: column;
        align-items: flex-start
    }
}

.use-cases section#Timely-supports .container .content .single-box__content div.best-for div.labels__single {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 12px 24px;
    background-color: #f2fcf6;
    border-radius: 8px
}

    .use-cases section#Timely-supports .container .content .single-box__content div.best-for div.labels__single p {
        font-size: 16px;
        font-weight: 700;
        line-height: 23px;
        text-align: left;
        color: #ffc502
    }

.use-cases section#reviews {
    margin-top: 180px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .use-cases section#reviews {
        margin-top: 120px
    }
}

@media(max-width:767px) {
    .use-cases section#reviews {
        margin-top: 96px;
        overflow-x: scroll
    }
}

.use-cases section#reviews .container {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px
}

@media(max-width:767px) {
    .use-cases section#reviews .container {
        grid-template-columns: repeat(2,80vw);
        padding-top: 1rem;
        padding-bottom: 1rem
    }
}

.use-cases section#reviews .container .single-box {
    display: flex;
    flex-direction: column;
    padding: 32px;
    border-radius: 16px;
    box-shadow: 0 4px 10px 0 #7d808626;
    position: relative
}

    .use-cases section#reviews .container .single-box img.review-icon {
        position: absolute;
        bottom: 32px;
        right: 32px
    }

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#reviews .container .single-box img.review-icon {
        position: relative;
        bottom: unset;
        right: unset;
        width: 75px;
        margin-bottom: 24px
    }
}

.use-cases section#reviews .container .single-box p.text {
    font-size: 18px;
    font-weight: 400;
    line-height: 26.4px;
    text-align: left;
    color: #222324;
    margin-bottom: 24px
}

    .use-cases section#reviews .container .single-box p.text span {
        color: #ffc502
    }

.use-cases section#reviews .container p.reviewer-name {
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    text-align: left;
    color: #222324
}

.use-cases section#reviews .container p.reviewer-position {
    font-size: 18px;
    font-weight: 400;
    line-height: 26.4px;
    text-align: left;
    color: #222324
}

.use-cases section#otherTemplates {
    margin: 200px 0 164px;
    width: 100vw;
    overflow: hidden
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#otherTemplates {
        margin: 144px 0 120px;
        overflow: visible
    }
}

.use-cases section#otherTemplates .container {
    display: flex;
    flex-direction: column;
    gap: 84px
}

@media(max-width:767px) {
    .use-cases section#otherTemplates .container {
        gap: 72px
    }
}

.use-cases section#otherTemplates .container div.header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px
}

    .use-cases section#otherTemplates .container div.header h2 {
        font-size: 52px;
        font-weight: 700;
        line-height: 60.32px;
        text-align: center
    }

@media(max-width:767px) {
    .use-cases section#otherTemplates .container div.header h2 {
        font-size: 36px;
        line-height: 42.96px;
        text-align: left
    }
}

.use-cases section#otherTemplates .container div.header p {
    font-size: 24px;
    font-weight: 400;
    line-height: 29.05px;
    text-align: center
}

@media(max-width:767px) {
    .use-cases section#otherTemplates .container div.header p {
        font-size: 24px;
        line-height: 29.05px;
        text-align: left
    }
}

.use-cases section#otherTemplates .container .cards {
    display: flex;
    gap: 20px;
    transition: all .3s ease-in-out
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#otherTemplates .container .cards {
        overflow: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#otherTemplates .container .cards::-webkit-scrollbar {
        display: none
    }
}

.use-cases section#otherTemplates .container .cards .card {
    flex: 0 0 522px;
    flex-direction: column;
    border: none;
    padding: 50px 69px 57px;
    background-color: #f2fcf6;
    border-radius: 24px;
    gap: 32px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#otherTemplates .container .cards .card {
        flex: 0 0 330px;
        padding: 50px 30px 100px
    }
}

.use-cases section#otherTemplates .container .cards .card h2 {
    color: #222324;
    font-size: 24px;
    font-weight: 700
}

.use-cases section#otherTemplates .container .cards .card p {
    color: #323333;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px
}

.use-cases section#otherTemplates .container .buttons {
    display: flex;
    gap: 16px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#otherTemplates .container .buttons {
        display: none
    }
}

.use-cases section#otherTemplates .container .buttons_button {
    background-color: transparent;
    border: none;
    outline: none;
    opacity: 1;
    transition: all .2s ease-in-out
}

    .use-cases section#otherTemplates .container .buttons_button:disabled {
        opacity: .3
    }

    .use-cases section#otherTemplates .container .buttons_button.before {
        transform: rotateY(180deg)
    }

.use-cases section#banner-gray {
    margin: 160px 0;
    background-color: #f8fafc;
    padding: 80px 0
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .use-cases section#banner-gray {
        margin: 72px 0 160px;
        padding: 72px 0 96px
    }
}

.use-cases section#banner-gray .container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

    .use-cases section#banner-gray .container h2 {
        font-size: 52px;
        font-weight: 700;
        line-height: 62.05px;
        text-align: center;
        color: #222324;
        margin-bottom: 32px;
        max-width: 842px
    }

@media(max-width:767px) {
    .use-cases section#banner-gray .container h2 {
        font-size: 36px;
        line-height: 42.96px
    }
}

.use-cases section#banner-gray .container h2 span {
    color: #ffc502
}

.use-cases section#banner-gray .container p {
    font-size: 24px;
    font-weight: 400;
    line-height: 28.64px;
    text-align: center;
    color: #323333;
    margin-bottom: 40px;
    max-width: 842px
}

@media(max-width:767px) {
    .use-cases section#banner-gray .container p {
        font-size: 18px;
        line-height: 24px
    }
}

.all-features h1, .all-features h2, .all-features p, .all-features span {
    margin: 0;
    padding: 0
}

.all-features #navbar-2024, .all-features #navbar-2024-mobile {
    position: static !important
}

.all-features section#top {
    margin: 164px 0 240px !important;
    padding: 0 !important
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .all-features section#top {
        margin: 136px 0 144px !important
    }
}

@media(max-width:767px) {
    .all-features section#top {
        margin: 40px 0 120px !important
    }
}

.all-features section#top .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

    .all-features section#top .container h1 {
        font-size: 64px;
        font-weight: 700;
        line-height: 74.24px;
        text-align: center;
        color: #222324;
        max-width: 1061px;
        margin-bottom: 32px
    }

        .all-features section#top .container h1 span {
            color: #ffc502
        }

@media(max-width:767px) {
    .all-features section#top .container h1 {
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: center
    }
}

.all-features section#top .container p {
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    text-align: center;
    color: #323333;
    max-width: 704px;
    margin-bottom: 40px
}

@media(max-width:767px) {
    .all-features section#top .container p {
        font-size: 18px;
        font-weight: 400;
        line-height: 26px;
        text-align: center
    }
}

.all-features section#top .container div.buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    margin: 0
}

.all-features section#features-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 28px;
    margin-bottom: 56px
}

    .all-features section#features-header h2 {
        font-family: sans-serif;
        font-size: 44px;
        font-weight: 700;
        line-height: 51.04px;
        text-align: center;
        color: #222324
    }

    .all-features section#features-header p {
        font-family: sans-serif;
        font-size: 24px;
        font-weight: 400;
        line-height: 32px;
        text-align: center;
        color: #323333;
        max-width: 730px
    }

.all-features section#features-sticky-element {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    width: 100%;
    border-bottom: 1px solid #e0e0e0;
    background-color: #fff;
    position: sticky;
    top: -1px;
    z-index: 999999999
}

@media(max-width:767px) {
    .all-features section#features-sticky-element {
        gap: 15px
    }
}

.all-features section#features-sticky-element button {
    padding: 23.5px 0;
    width: 166px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background-color: transparent;
    outline: none;
    border: none;
    position: relative;
    font-size: 24px;
    font-weight: 400;
    line-height: 28.64px;
    transition: all .1s ease-in-out
}

@media(max-width:767px) {
    .all-features section#features-sticky-element button {
        font-size: 18px;
        line-height: 21.48px;
        width: 110px
    }
}

.all-features section#features-sticky-element button::after {
    content: "";
    width: 100%;
    height: 0;
    background-color: #ffc502;
    position: absolute;
    bottom: 0;
    left: 0;
    transition: all .05s ease-in-out
}

.all-features section#features-sticky-element button:hover {
    background-color: #f2fcf6
}

    .all-features section#features-sticky-element button:hover::after {
        content: "";
        width: 100%;
        height: 3px;
        background-color: #ffc502;
        position: absolute;
        bottom: 0;
        left: 0
    }

.all-features section#features-sticky-element button p {
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 28.64px;
    text-align: left;
    color: #333
}

.all-features section#features-sticky-element button img {
    width: 30px
}

.all-features section.single-feature {
    display: flex;
    flex-direction: column
}

    .all-features section.single-feature .container .header {
        margin-bottom: 80px
    }

@media(max-width:767px) {
    .all-features section.single-feature .container .header {
        margin-bottom: 64px
    }
}

.all-features section.single-feature .container .header h2 {
    font-family: sans-serif;
    font-size: 44px;
    font-weight: 700;
    line-height: 51.04px;
    text-align: center;
    color: #222324
}

@media(max-width:767px) {
    .all-features section.single-feature .container .header h2 {
        font-size: 36px;
        line-height: 41.76px
    }
}

.all-features section.single-feature .container .header h2 span {
    color: #ffc502
}

.all-features section.single-feature .container .header p {
    color: #333
}

@media(max-width:767px) {
    .all-features section.single-feature .container .header p {
        font-size: 16px;
        font-weight: 400;
        line-height: 23px;
        text-align: left
    }
}

.all-features section.single-feature .container .box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 164px
}

@media(min-width:768px) and (max-width:991px) {
    .all-features section.single-feature .container .box {
        gap: 140px
    }
}

@media(max-width:767px) {
    .all-features section.single-feature .container .box {
        gap: 96px
    }
}

.all-features section.single-feature .container .box__singleBox {
    align-items: center
}

    .all-features section.single-feature .container .box__singleBox.left {
        display: grid;
        grid-template-columns: 1fr 2fr;
        gap: 109px
    }

@media(min-width:768px) and (max-width:991px) {
    .all-features section.single-feature .container .box__singleBox.left {
        display: flex;
        flex-direction: column;
        gap: 64px
    }
}

@media(max-width:767px) {
    .all-features section.single-feature .container .box__singleBox.left {
        display: flex;
        flex-direction: column;
        gap: 40px
    }
}

.all-features section.single-feature .container .box__singleBox .image img {
    width: 100%
}

.all-features section.single-feature .container .box__singleBox .content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 32px
}

    .all-features section.single-feature .container .box__singleBox .content h2 {
        font-family: sans-serif;
        font-size: 36px;
        font-weight: 700;
        line-height: 43.2px;
        text-align: left;
        color: #222324
    }

@media(max-width:767px) {
    .all-features section.single-feature .container .box__singleBox .content h2 {
        font-size: 28px
    }
}

.all-features section.single-feature .container .box__singleBox .content span {
    width: 88px;
    height: 2px;
    background-color: #ffc502
}

.all-features section.single-feature .container .box__singleBox .content p {
    font-family: sans-serif;
    font-size: 18px;
    line-height: 26px;
    font-weight: 400;
    text-align: left;
    color: #323333
}

.all-features section.single-feature .container .box__singleBox .summary {
    max-width: 800px;
    grid-column: span 2;
    display: flex;
    align-items: flex-start;
    margin: 0 auto
}

    .all-features section.single-feature .container .box__singleBox .summary p {
        font-family: sans-serif;
        font-size: 18px;
        font-weight: 600;
        line-height: 26px;
        text-align: center;
        color: #323333
    }

        .all-features section.single-feature .container .box__singleBox .summary p img {
            margin-right: 12px
        }

        .all-features section.single-feature .container .box__singleBox .summary p span {
            color: #ffc502
        }

.all-features section.single-feature .container .button {
    display: flex;
    width: 100%
}

    .all-features section.single-feature .container .button button, .all-features section.single-feature .container .button a {
        margin: 96px auto 0
    }

@media(min-width:768px) and (max-width:991px) {
    .all-features section.single-feature .container .button button, .all-features section.single-feature .container .button a {
        margin: 64px auto 0
    }
}

@media(max-width:767px) {
    .all-features section.single-feature .container .button button, .all-features section.single-feature .container .button a {
        margin: 48px auto 0
    }
}

.all-features section.gray-boxes .container {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 24px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all-features section.gray-boxes .container {
        grid-template-columns: 1fr
    }
}

.all-features section.gray-boxes .container .single-box {
    display: flex;
    flex-direction: column;
    padding: 50px 64px 20px;
    background-color: #f8fafc;
    border: .2px solid;
    border-radius: 24px;
    border-image-source: linear-gradient(125.51deg,#f8fafc 22.1%,#b7bbc2 94.14%);
    position: relative
}

@media(max-width:767px) {
    .all-features section.gray-boxes .container .single-box {
        padding: 50px 30px 20px
    }
}

.all-features section.gray-boxes .container .single-box span {
    position: absolute;
    top: 0;
    right: 70px;
    align-self: flex-end;
    background-color: #d9f7e3;
    border-radius: 0 0 8px 8px;
    padding: 5px 10px;
    text-transform: uppercase;
    color: #ffc502;
    font-size: 14px;
    font-weight: 600;
    text-align: left
}

@media(max-width:767px) {
    .all-features section.gray-boxes .container .single-box span {
        right: 37px
    }
}

.all-features section.gray-boxes .container .single-box img {
    width: 100%
}

.all-features section.gray-boxes .container .single-box h2 {
    font-size: 32px;
    font-weight: 600;
    line-height: 38.19px;
    text-align: left;
    color: #222324;
    margin: 20px 0 12px
}

@media(max-width:767px) {
    .all-features section.gray-boxes .container .single-box h2 {
        font-size: 24px;
        font-weight: 700;
        line-height: 28.64px
    }
}

.all-features section.gray-boxes .container .single-box p {
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    text-align: left;
    color: #323333;
    min-height: 80px
}

@media(max-width:767px) {
    .all-features section.gray-boxes .container .single-box p {
        font-size: 16px;
        font-weight: 400;
        line-height: 23px;
        min-height: 120px
    }
}

.all-features div.track-feature, .all-features div.analyze-feature, .all-features div.manage-feature {
    margin: 164px 0 140px
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px) {
    .all-features div.track-feature, .all-features div.analyze-feature, .all-features div.manage-feature {
        margin: 96px 0 120px
    }
}

@media(max-width:767px) {
    .all-features div.track-feature, .all-features div.analyze-feature, .all-features div.manage-feature {
        margin: 96px 0
    }
}

.all-features div.text-line {
    margin: 164px 0
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .all-features div.text-line {
        margin: 120px 0
    }
}

@media(max-width:767px) {
    .all-features div.text-line {
        margin: 96px 0
    }
}

.all-features div.text-line .container {
    display: grid;
    grid-template-columns: 1fr 1.6fr;
    gap: 20px
}

@media(max-width:767px) {
    .all-features div.text-line .container {
        grid-template-columns: 1fr;
        gap: 24px
    }
}

.all-features div.text-line .container div.line {
    display: grid;
    grid-template-columns: 259px 1fr;
    gap: 20px
}

@media(min-width:768px) and (max-width:991px) {
    .all-features div.text-line .container div.line {
        grid-template-columns: 162px 1fr
    }
}

.all-features div.text-line .container div.line div:first-of-type {
    width: 259px;
    font-family: sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 26px;
    text-align: left;
    color: #323333
}

@media(min-width:768px) and (max-width:991px) {
    .all-features div.text-line .container div.line div:first-of-type {
        width: 162px
    }
}

.all-features div.text-line .container div.line div:last-of-type {
    width: 100%;
    height: 2px;
    background-color: #b7bbc2;
    margin-top: 13px
}

.all-features div.text-line .container div.content {
    font-family: sans-serif;
    font-size: 36px;
    font-weight: 600;
    line-height: 42.96px;
    text-align: left;
    color: #222324
}

    .all-features div.text-line .container div.content span {
        color: #ffc502
    }

@media(max-width:767px) {
    .all-features div.text-line .container div.content {
        font-size: 28px;
        font-weight: 600;
        line-height: 32.48px;
        text-align: left
    }
}

.all-features section#component_banner-gray {
    margin: 164px 0
}

    .all-features section#component_banner-gray .container {
        gap: 0
    }

        .all-features section#component_banner-gray .container h2 {
            max-width: 845px;
            font-family: sans-serif;
            font-size: 52px;
            font-weight: 700;
            line-height: 62.4px;
            text-align: center;
            color: #222324;
            margin-bottom: 32px
        }

@media(max-width:767px) {
    .all-features section#component_banner-gray .container h2 {
        font-size: 36px;
        line-height: 42.96px
    }
}

.all-features section#component_banner-gray .container p {
    max-width: 737px;
    font-family: sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 28.64px;
    text-align: center;
    color: #323333;
    margin-bottom: 40px
}

@media(max-width:767px) {
    .all-features section#component_banner-gray .container p {
        font-size: 18px;
        line-height: 24px
    }
}

.all-features section#reviews {
    background-color: transparent;
    padding-top: 0;
    overflow-x: hidden;
    overflow-y: visible
}

    .all-features section#reviews .reviews {
        max-height: 100%;
        padding: 1rem
    }

    .all-features section#reviews .scrollMargin {
        margin-bottom: 40px !important
    }

.all-features section#custom-services {
    margin: 180px 0;
    padding: 96px 0 120px;
    background-color: #f8fafc
}

@media(min-width:992px) and (max-width:1199px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    .all-features section#custom-services {
        margin: 120px 0
    }
}

.all-features section#custom-services .container {
    display: flex;
    flex-direction: column;
    gap: 67px
}

    .all-features section#custom-services .container header {
        display: flex;
        flex-direction: column;
        align-items: flex-start
    }

        .all-features section#custom-services .container header span {
            margin-bottom: 40px;
            background-color: #d9f7e3;
            padding: 10px 5px;
            border-radius: 8px;
            color: #ffc502;
            font-size: 14px;
            font-weight: 600;
            line-height: 16.71px
        }

        .all-features section#custom-services .container header h2 {
            margin-bottom: 32px;
            font-size: 44px;
            font-weight: 700;
            line-height: 51.04px;
            text-align: left;
            color: #222324
        }

@media(max-width:767px) {
    .all-features section#custom-services .container header h2 {
        font-size: 36px;
        line-height: 41.76px
    }
}

.all-features section#custom-services .container header p {
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    text-align: left;
    color: #323333
}

@media(max-width:767px) {
    .all-features section#custom-services .container header p {
        font-size: 18px;
        line-height: 26px
    }
}

.all-features section#custom-services .container div.boxes {
    display: grid;
    grid-template-columns: repeat(3,324px);
    gap: 109px
}

@media(min-width:768px) and (max-width:991px),(min-width:992px) and (max-width:1199px) {
    .all-features section#custom-services .container div.boxes {
        grid-template-columns: repeat(2,324px);
        gap: 40px 20px
    }
}

@media(max-width:767px) {
    .all-features section#custom-services .container div.boxes {
        grid-template-columns: 278px;
        gap: 0
    }
}

.all-features section#custom-services .container div.boxes__single-box {
    padding: 32px 38px 32px 35px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    border-left: 2px solid #b7bbc2
}

@media(max-width:767px) {
    .all-features section#custom-services .container div.boxes__single-box {
        padding: 38px 0 36px;
        border-left: unset;
        border-top: 2px solid #b7bbc2
    }
}

.all-features section#custom-services .container div.boxes__single-box h2 {
    font-size: 32px;
    font-weight: 700;
    line-height: 38.19px;
    text-align: left;
    color: #ffc502
}

.all-features section#custom-services .container div.boxes__single-box p {
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    text-align: left;
    color: #222324
}

@media(max-width:767px) {
    .all-features section#custom-services .container div.boxes__single-box p {
        font-size: 16px;
        line-height: 23px
    }
}

.notion-top-margin {
    margin-top: 50px
}

@media(max-width:767px) {
    .notion-top-margin {
        margin-top: 90px
    }
}

.row {
    margin: 0;
    padding: 0
}

@media(min-width:1200px) {
    .container {
        max-width: 1310px
    }
}

@media(min-width:1920px) {
    .container {
        max-width: 1494px
    }
}

.hidden {
    opacity: 0;
    transform: translateY(-20px);
    transition: all 1s ease-in-out
}

@media(max-width:767px) {
    .hidden {
        transition: none
    }
}

.show {
    opacity: 1;
    transform: translateY(0)
}

.ui-datepicker-div {
    z-index: 123123123123 !important
}

.calendly-overlay div.calendly-popup-close {
    top: 90px
}

.async-hide {
    opacity: 0 !important
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto
}

a, a:visited, a:hover, a:focus, a:active {
    color: #1b1b20;
    text-decoration: none
}

button {
    cursor: pointer
}

body {
    overflow-x: hidden;
    font-weight: 300;
    position: relative;
    font-family: nunito sans,sans-serif;
    background-color: #fff;
    color: #1b1b20
}

h1, h2, h3, h4, h5, h6 {
    letter-spacing: 0;
    cursor: default;
    font-family: lato,sans-serif
}

.color-white {
    color: #fff
}

h1.active-before-element::before {
    top: -2rem !important;
    opacity: 1 !important
}

h1::before {
    content: attr(pseudoElementContent);
    position: absolute;
    top: -4rem;
    left: 50%;
    transform: translateX(-50%);
    width: fit-content;
    opacity: 0;
    font-size: 14px;
    font-family: lato,sans-serif;
    text-transform: uppercase;
    transition: all 1s ease-in-out
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    h1::before {
        width: 100%
    }
}

h1.subheader-green::before {
    color: #ffc502
}

h1.subheader-blue::before {
    color: #2d80eb
}

b, strong {
    font-weight: 700
}

.special__paragraph-heading {
    font-size: 14px;
    font-family: lato,sans-serif;
    color: #ffc502;
    text-transform: uppercase;
    text-align: center;
    font-weight: 700
}

@media(max-width:767px) {
    .special__paragraph-heading {
        margin-bottom: 2rem;
        text-align: left
    }
}

.new-label {
    position: relative
}

    .new-label::after {
        content: attr(new-data-label);
        position: absolute;
        top: -1px;
        left: calc(100% + 8px);
        padding: 2px 8px;
        color: #fff;
        font-size: 14px;
        font-weight: 700;
        background-color: #ffc502;
        border-radius: 1000px;
        display: flex;
        justify-content: center;
        align-items: center
    }

.new-label-green::after {
    background-color: #ffc502
}

h2.subheader {
    font-size: 17px;
    font-weight: 300;
    line-height: 1.5em;
    margin-top: 20px
}

a.btn-outline, button.btn-outline {
    font-family: sans-serif;
    font-size: 18px;
    border-radius: 36px;
    border: 1px solid #ffc502;
    padding: 16px 36px 17px;
    color: #000;
    font-weight: 700;
    outline: none;
    transition: all .1s ease-in-out
}

    a.btn-outline:hover, button.btn-outline:hover {
        background-color: #ffc502;
        color: #fff
    }

    a.btn-outline.secondary, button.btn-outline.secondary {
        font-size: 18px;
        border-radius: 36px;
        border: 1px solid #000;
        padding: 16px 36px 17px;
        color: #000;
        font-weight: 600;
        outline: none;
        background-color: transparent;
        transition: all .1s ease-in-out
    }

        a.btn-outline.secondary:hover, button.btn-outline.secondary:hover {
            background-color: transparent;
            border: 1px solid #ffc502
        }

    a.btn-outline.black, button.btn-outline.black {
        font-size: 18px;
        border-radius: 36px;
        border: 1px solid #222324;
        padding: 16px 36px 17px;
        color: #222324;
        font-weight: 700;
        outline: none;
        transition: all .1s ease-in-out;
        background-color: transparent
    }

        a.btn-outline.black:hover, button.btn-outline.black:hover {
            border: 1px solid #ffc502;
            background-color: #ffc502;
            color: #fff
        }

    a.btn-outline.white, button.btn-outline.white {
        font-size: 18px;
        border-radius: 36px;
        border: 1px solid #fff;
        padding: 16px 36px 17px;
        color: #fff;
        font-weight: 700;
        outline: none;
        transition: all .1s ease-in-out;
        background-color: transparent
    }

        a.btn-outline.white:hover, button.btn-outline.white:hover {
            border: 1px solid #ffc502;
            color: #ffc502
        }

a.btn-filled, button.btn-filled {
    font-family: sans-serif;
    font-size: 18px;
    border-radius: 36px;
    padding: 16px 36px 17px;
    color: #fff;
    font-weight: 600;
    outline: none;
    border: none;
    transition: all .2s ease-in-out;
    text-align: center
}

@media(max-width:991px) {
    a.btn-filled, button.btn-filled {
        border: unset
    }
}

a.btn-filled.white, button.btn-filled.white {
    background-color: #fff
}

    a.btn-filled.white:hover, a.btn-filled.white:focus, button.btn-filled.white:hover, button.btn-filled.white:focus {
        background: #fafffd
    }

a.btn-filled.green, button.btn-filled.green {
    background-color: #ffc502
}

    a.btn-filled.green:hover, a.btn-filled.green:focus, button.btn-filled.green:hover, button.btn-filled.green:focus {
        color: #fff !important;
        background: #1da44c
    }

a.btn-filled.grey, button.btn-filled.grey {
    background-color: #f3f3f3;
    color: #1b1b20 !important
}

    a.btn-filled.grey:hover, a.btn-filled.grey:focus, button.btn-filled.grey:hover, button.btn-filled.grey:focus {
        color: #1b1b20 !important;
        background: #ddd
    }

a.btn-filled.blue, button.btn-filled.blue {
    background-color: #3c91e6
}

    a.btn-filled.blue:hover, a.btn-filled.blue:focus, button.btn-filled.blue:hover, button.btn-filled.blue:focus {
        color: #fff !important;
        background: #1b78d4
    }

a.btn-filled.red, button.btn-filled.red {
    background-color: #eb5160
}

    a.btn-filled.red:hover, a.btn-filled.red:focus, button.btn-filled.red:hover, button.btn-filled.red:focus {
        color: #fff !important;
        background: #dd2c3e
    }

a.btn-filled.yellow, button.btn-filled.yellow {
    background-color: #f7b801
}

    a.btn-filled.yellow:hover, a.btn-filled.yellow:focus, button.btn-filled.yellow:hover, button.btn-filled.yellow:focus {
        color: #fff !important;
        background: #dfa601
    }

a.btn-filled.black, button.btn-filled.black {
    background-color: #1b1b20
}

    a.btn-filled.black:hover, a.btn-filled.black:focus, button.btn-filled.black:hover, button.btn-filled.black:focus {
        color: #fff !important
    }

a.btn-highlighted, button.btn-highlighted {
    font-weight: 700;
    border-radius: 26px;
    background-color: unset
}

a.btn-read-more, button.btn-read-more {
    background: #f3f3f3;
    border-radius: 26px;
    color: #1b1b20;
    font-size: 14px;
    font-family: nunito sans,sans-serif;
    font-weight: 700;
    border: none;
    padding: 12px 37px
}

@media(max-width:767px) {
    a.btn-read-more, button.btn-read-more {
        padding: 12px 10px;
        font-size: 13px
    }
}

a.btn-read-more:hover, a.btn-read-more:focus, button.btn-read-more:hover, button.btn-read-more:focus {
    background: #d9d9d9
}

a.btn-filled:disabled, button.btn-filled:disabled {
    background-color: #9a9ea4;
    cursor: unset
}

    a.btn-filled:disabled:hover, button.btn-filled:disabled:hover {
        background-color: #9a9ea4;
        cursor: unset
    }

.btn-filled-mobileSmaller {
    width: fit-content !important;
    font-weight: 600 !important
}

@media(min-width:1200px) and (max-width:1440px) {
    .btn-filled-mobileSmaller {
        font-size: 12px !important;
        padding: 12px 18px !important
    }
}

section#extra_header .container .row .col-sm-12 {
    margin: 5rem 0 0
}

    section#extra_header .container .row .col-sm-12 p {
        text-align: center;
        width: 80%;
        margin: 0 auto 2rem
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    section#extra_header .container .row .col-sm-12 p {
        width: 100%
    }
}

section#bottomCta {
    text-align: center;
    margin: 0 2rem
}

    section#bottomCta .row {
        position: relative;
        background-color: #f3f3f3;
        padding: 5rem 0;
        border-radius: 26px
    }

        section#bottomCta .row .greenSmallSkewCircle, section#bottomCta .row .redSmallCircle, section#bottomCta .row .blueSmallCircle, section#bottomCta .row .greenSmallCircle {
            position: absolute;
            z-index: 1
        }

@media(max-width:767px) {
    section#bottomCta .row .greenSmallSkewCircle, section#bottomCta .row .redSmallCircle, section#bottomCta .row .blueSmallCircle, section#bottomCta .row .greenSmallCircle {
        display: none
    }
}

section#bottomCta .row .greenSmallSkewCircle {
    top: -3rem;
    left: 19rem
}

@media(min-width:768px) and (max-width:991px) {
    section#bottomCta .row .greenSmallSkewCircle {
        top: -1rem;
        left: 6rem
    }
}

section#bottomCta .row .redSmallCircle {
    top: -1rem;
    right: 10rem
}

section#bottomCta .row .blueSmallCircle {
    left: 4rem;
    bottom: 4rem
}

section#bottomCta .row .greenSmallCircle {
    right: 6rem;
    bottom: 5rem
}

section#bottomCta .row .col-sm-12 h2 {
    font-size: 42px;
    font-weight: 800;
    width: 60%;
    margin: 0 auto 3rem
}

@media(max-width:767px) {
    section#bottomCta .row .col-sm-12 h2 {
        font-size: 36px;
        width: 80%
    }
}

section#bottomCta .row .col-sm-12 p {
    font-size: 21px;
    font-weight: 500;
    margin: 0 auto 3rem;
    width: 65%
}

section#bottomCta .row .col-sm-12 .button-container .btn-filled {
    margin-right: 1rem;
    color: #1b1b20
}

section#bottomCta .row .col-sm-12 .button-container .btn-highlighted {
    padding: 12px 57px;
    color: #1b1b20 !important;
    border: 1px solid #f7b801;
    border-radius: 26px
}

    section#bottomCta .row .col-sm-12 .button-container .btn-highlighted:hover, section#bottomCta .row .col-sm-12 .button-container .btn-highlighted:focus {
        border: 1px solid #1b1b20
    }

@media(max-width:767px) {
    section#bottomCta .row .col-sm-12 .button-container button, section#bottomCta .row .col-sm-12 .button-container .btn-filled {
        width: 90%;
        margin-right: 0;
        margin-bottom: .5rem
    }
}

section#values.mainPageFAQ {
    margin: 5rem auto
}

#values {
    background-color: #fff;
    margin: 5rem auto;
    position: relative
}

    #values .bs-example {
        padding-top: 7rem
    }

    #values .row {
        border-radius: 6px
    }

        #values .row .col-lg-6, #values .row .col-lg-12 {
            position: relative;
            bottom: 5rem
        }

            #values .row .col-lg-6 .header, #values .row .col-lg-12 .header {
                text-align: center;
                margin-bottom: 2rem
            }

            #values .row .col-lg-6 h2, #values .row .col-lg-12 h2 {
                font-size: 32px;
                font-weight: 800;
                position: relative;
                z-index: 1
            }

            #values .row .col-lg-6 .card, #values .row .col-lg-12 .card {
                background-color: #fff;
                margin-bottom: 1rem;
                border: none;
                border-top: 1px solid rgba(27,27,32,.15);
                border-radius: 0
            }

                #values .row .col-lg-6 .card .card-header, #values .row .col-lg-12 .card .card-header {
                    border: none;
                    background-color: #fff;
                    border-radius: 0
                }

                    #values .row .col-lg-6 .card .card-header button, #values .row .col-lg-12 .card .card-header button {
                        font-size: 20px;
                        font-weight: 700;
                        font-family: lato,sans-serif;
                        color: #1b1b20;
                        text-align: left
                    }

@media(max-width:991px) {
    #values .row .col-lg-6 .card .card-header button, #values .row .col-lg-12 .card .card-header button {
        white-space: normal
    }
}

#values .row .col-lg-6 .card .card-header button i, #values .row .col-lg-12 .card .card-header button i {
    opacity: .6;
    font-size: 14px;
    margin-right: 1rem
}

#values .row .col-lg-6 .card .card-body, #values .row .col-lg-12 .card .card-body {
    padding: 0 2rem 1.25rem
}

    #values .row .col-lg-6 .card .card-body p, #values .row .col-lg-12 .card .card-body p {
        font-size: 16px;
        font-weight: 600;
        line-height: 2
    }

    #values .row .col-lg-6 .card .card-body ul li, #values .row .col-lg-12 .card .card-body ul li {
        font-weight: 700
    }

#values .row .col-lg-6 img, #values .row .col-lg-12 img {
    margin-bottom: 4rem;
    z-index: 1;
    position: relative
}

#values .row .right {
    text-align: end
}

#integrations-old {
    padding: 7rem 0 4rem;
    background-color: #f3f3f3;
    margin-bottom: 5rem
}

@media(max-width:991px) {
    #integrations-old .container .row {
        flex-direction: column
    }
}

#integrations-old .container .row .left-container {
    display: flex;
    align-items: center
}

#integrations-old .container .row .col-lg-5 {
    justify-content: center;
    display: flex;
    flex-direction: column
}

    #integrations-old .container .row .col-lg-5 p.green {
        color: #00bf71;
        margin-bottom: 1rem;
        font-size: 16px;
        font-weight: 600
    }

    #integrations-old .container .row .col-lg-5 h2 {
        font-size: 36px;
        font-weight: 700;
        position: relative;
        z-index: 1
    }

    #integrations-old .container .row .col-lg-5 p {
        margin: 1rem 0 0;
        font-size: 18px;
        font-weight: 600;
        color: #1b1b20
    }

    #integrations-old .container .row .col-lg-5 .btn-check-integrations {
        color: #00bf71;
        font-size: 16px;
        font-weight: 800;
        margin-top: 3rem;
        white-space: nowrap;
        padding-bottom: 2rem
    }

        #integrations-old .container .row .col-lg-5 .btn-check-integrations:hover {
            text-decoration: underline;
            color: #008a51
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #integrations-old .container .row .col-lg-5 {
        text-align: center
    }

        #integrations-old .container .row .col-lg-5 h2 {
            width: 100%;
            margin: 1rem auto
        }
}

#integrations-old .container .row .col-lg-7 img {
    width: 52px;
    height: 52px
}

#integrations-old .container .row .col-lg-7 .wrapper:nth-of-type(1) a:nth-of-type(2) img {
    width: 75px;
    height: 75px
}

#integrations-old .container .row .col-lg-7 .wrapper:nth-of-type(2) a:nth-of-type(2) img {
    width: 46px;
    height: 54px
}

#integrations-old .container .row .col-lg-7 .wrapper:nth-of-type(4) a:nth-of-type(2) img {
    width: 42px;
    height: 52px
}

#integrations-old .container .row .col-lg-7 .white-bg {
    margin-bottom: 2rem;
    margin-left: 4rem;
    width: 120px;
    height: 120px;
    border-radius: 31px;
    transition: all .2s ease-in-out;
    background-color: #fff;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    position: relative;
    box-shadow: 4px 2px 16px 0 rgba(0,0,0,.06)
}

    #integrations-old .container .row .col-lg-7 .white-bg:hover {
        box-shadow: 2px -3px 26px 0 rgba(200,215,243,.5)
    }

        #integrations-old .container .row .col-lg-7 .white-bg:hover > .integration-name {
            transform: scale(1.07)
        }

#integrations-old .container .row .col-lg-7 .wrapper {
    display: flex;
    justify-content: flex-end
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #integrations-old .container .row .col-lg-7 .white-bg {
        margin-left: 5px;
        margin-right: 5px
    }

    #integrations-old .container .row .col-lg-7 .wrapper {
        justify-content: space-evenly
    }

        #integrations-old .container .row .col-lg-7 .wrapper:nth-of-type(1) {
            margin-top: 4rem
        }
}

@media(min-width:768px) and (max-width:991px) and (min-width:768px) and (max-width:991px),(max-width:767px) and (min-width:768px) and (max-width:991px) {
    #integrations-old .container .row .col-lg-7 .wrapper {
        justify-content: space-evenly
    }
}

#integrations--new {
    padding: 4rem 0;
    background-color: #f3f3f3;
    margin-bottom: 5rem;
    background-image: url(/img/integration_component/bgr.png);
    background-repeat: no-repeat;
    background-position: center
}

    #integrations--new .container {
        display: flex;
        align-items: center;
        justify-content: center
    }

        #integrations--new .container .row {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column
        }

            #integrations--new .container .row p.green {
                color: #00bf71;
                margin-bottom: 1.5rem;
                margin-top: 0 !important;
                font-size: 14px;
                font-weight: 700;
                text-transform: uppercase
            }

            #integrations--new .container .row h2 {
                font-size: 36px;
                font-weight: 700;
                position: relative;
                z-index: 1;
                text-transform: uppercase;
                margin-bottom: 1.5rem;
                text-align: center
            }

            #integrations--new .container .row p {
                font-size: 18px;
                font-weight: 500;
                color: #1b1b20;
                text-align: center
            }

                #integrations--new .container .row p:nth-of-type(2) {
                    width: 60%
                }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #integrations--new .container .row p:nth-of-type(2) {
        width: calc(1.5 * 60%)
    }
}

#integrations--new .container .row p:last-of-type {
    width: 45%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #integrations--new .container .row p:last-of-type {
        width: calc(1.5 * 45%)
    }
}

#integrations--new .container .row a {
    color: #fff
}

    #integrations--new .container .row a:hover {
        cursor: pointer
    }

#integrations--new .container .row .btn-check-integrations {
    color: #00bf71;
    font-size: 16px;
    font-weight: 800;
    margin-top: 3rem;
    white-space: nowrap;
    padding-bottom: 2rem
}

    #integrations--new .container .row .btn-check-integrations:hover {
        text-decoration: underline;
        color: #008a51
    }

#integrations--new .container .row .btn-filled {
    margin-bottom: 2.5rem
}

#integrations--new .container .row .integrations--new__image-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin: 2.5rem 0 3rem
}

    #integrations--new .container .row .integrations--new__image-wrapper a {
        margin: 0 .3rem
    }

        #integrations--new .container .row .integrations--new__image-wrapper a img {
            width: 90px
        }

#social-proof {
    padding-bottom: 5rem
}

    #social-proof .container .row {
        padding-top: 2rem;
        padding-bottom: 1rem;
        display: flex;
        border-bottom: solid 1px #d8d8d8
    }

        #social-proof .container .row .col-sm-12 h2 {
            font-weight: 700;
            font-size: 16px;
            color: #1b1b20;
            text-align: center;
            position: relative;
            letter-spacing: 0
        }

            #social-proof .container .row .col-sm-12 h2:before, #social-proof .container .row .col-sm-12 h2:after {
                content: "";
                width: 15rem;
                height: 1px;
                background: #d8d8d8;
                position: absolute;
                top: 50%
            }

@media(max-width:1200px) {
    #social-proof .container .row .col-sm-12 h2:before, #social-proof .container .row .col-sm-12 h2:after {
        display: none
    }
}

#social-proof .container .row .col-sm-12 h2:after {
    margin-left: .7rem;
    width: 20rem
}

#social-proof .container .row .col-sm-12 h2:before {
    margin-left: -20.7rem;
    width: 20rem
}

#social-proof .container .row .col-lg-2 {
    text-align: center;
    margin: 1rem 0;
    align-items: center;
    display: flex;
    justify-content: center
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #social-proof .container .row .col-lg-2 {
        margin: 20px 0
    }
}

@media(max-width:767px) {
    #social-proof .container .row .col-lg-2 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center
    }
}

#social-proof .container .row .col-lg-2 .wrapper {
    display: flex;
    flex-direction: column
}

    #social-proof .container .row .col-lg-2 .wrapper .stars {
        margin-bottom: .5rem
    }

#social-proof .container .row .col-lg-2 .right {
    align-items: flex-start
}

#social-proof .container .row .col-lg-2 .logos {
    width: 60%
}

#social-proof .container .row .col-lg-2 .bigger {
    width: 80%;
    mix-blend-mode: darken
}

@media(max-width:767px) {
    #social-proof .container .row .col-lg-2 .bigger, #social-proof .container .row .col-lg-2 .usp, #social-proof .container .row .col-lg-2 .dsv {
        width: 35%
    }
}

.jobs section#top, .affiliate section#top {
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover
}

    .jobs section#top .container .row .col-sm-12 h1, .affiliate section#top .container .row .col-sm-12 h1 {
        font-size: 48px;
        font-weight: 700;
        color: #fff;
        text-align: center;
        margin: 0 auto 2rem
    }

    .jobs section#top .container .row .col-sm-12 p, .affiliate section#top .container .row .col-sm-12 p {
        font-size: 18px;
        font-weight: 400;
        color: #fff;
        text-align: center;
        width: 70%;
        margin: 0 auto
    }

section#big_cta {
    padding-bottom: 11rem;
    padding-top: 7rem
}

    section#big_cta .container .row {
        position: relative
    }

        section#big_cta .container .row .greenSmallSkewCircle, section#big_cta .container .row .redSmallCircle, section#big_cta .container .row .blueSmallCircle, section#big_cta .container .row .greenSmallCircle {
            position: absolute;
            z-index: 1
        }

@media(max-width:767px) {
    section#big_cta .container .row .greenSmallSkewCircle, section#big_cta .container .row .redSmallCircle, section#big_cta .container .row .blueSmallCircle, section#big_cta .container .row .greenSmallCircle {
        display: none
    }
}

section#big_cta .container .row .greenSmallSkewCircle {
    top: -3rem;
    left: 19rem
}

section#big_cta .container .row .redSmallCircle {
    top: -1rem;
    right: 10rem
}

section#big_cta .container .row .blueSmallCircle {
    left: 4rem;
    bottom: 4rem
}

section#big_cta .container .row .greenSmallCircle {
    right: 6rem;
    bottom: 5rem
}

section#big_cta .container .row .basic-cta-col {
    background-color: #f3f3f3;
    border-radius: 13px;
    text-align: center
}

    section#big_cta .container .row .basic-cta-col h2 {
        padding-top: 4rem;
        font-size: 42px;
        font-weight: 800;
        margin: auto auto 2rem;
        text-align: center;
        width: 67%
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    section#big_cta .container .row .basic-cta-col h2 {
        width: 80%;
        margin: 0 auto 2rem
    }
}

section#big_cta .container .row .basic-cta-col p {
    font-size: 21px;
    font-weight: 700;
    margin: 3rem auto;
    padding-top: 0
}

section#big_cta .container .row .basic-cta-col a {
    margin-bottom: 4rem;
    padding: 1rem
}

section#big_cta .container .row .basic-cta-col .btn-filled {
    padding: 1rem 4.5rem
}

@media(min-width:768px) and (max-width:991px) {
    section#big_cta .container .row .basic-cta-col .btn-filled {
        width: 40%
    }
}

@media(max-width:767px) {
    section#big_cta .container .row .basic-cta-col .btn-filled {
        width: 100%
    }
}

section#top.backgroundTop {
    background-image: url(/img/backgroundTop.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

@media(max-width:767px) {
    section#top.backgroundTop {
        background-image: none
    }
}

section#top {
    padding: 6rem 0
}

@media(max-width:767px) {
    section#top {
        padding: 0 0 2rem !important
    }
}

section#top > .container > .row {
    justify-content: center
}

    section#top > .container > .row h1.seoHeader {
        font-family: nunito sans,sans-serif;
        color: #1b1b20;
        font-size: 14px;
        font-weight: 700
    }

    section#top > .container > .row .none {
        display: none
    }

    section#top > .container > .row h1, section#top > .container > .row h2.subheader {
        font-weight: 700;
        color: #1b1b20;
        font-size: 52px;
        line-height: 1.1;
        width: 93%;
        margin-right: auto
    }

@media(min-width:768px) and (max-width:991px) {
    section#top > .container > .row h1, section#top > .container > .row h2.subheader {
        font-size: 46px
    }
}

@media(max-width:767px) {
    section#top > .container > .row h1, section#top > .container > .row h2.subheader {
        text-align: center;
        width: 100%;
        font-size: 34px
    }
}

@media(max-width:767px) {
    section#top > .container > .row h1, section#top > .container > .row p.para {
        text-align: center
    }
}

section#top > .container > .row .ue-hero-main p, section#top > .container > .row .col-ld-6 p, section#top > .container > .row .col-md-6 p {
    font-family: nunito sans,sans-serif;
    font-size: 20px;
    color: #1b1b20;
    margin: 2rem 0 4rem
}

    section#top > .container > .row .ue-hero-main p.para, section#top > .container > .row .col-ld-6 p.para, section#top > .container > .row .col-md-6 p.para {
        margin: 2rem 0;
        width: 81%;
        margin-right: auto
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    section#top > .container > .row .ue-hero-main p.para, section#top > .container > .row .col-ld-6 p.para, section#top > .container > .row .col-md-6 p.para {
        width: 100%
    }
}

section#top > .container > .row .ue-hero-main ul.top_list, section#top > .container > .row .col-ld-6 ul.top_list, section#top > .container > .row .col-md-6 ul.top_list {
    padding: 1rem;
    margin-bottom: 2rem
}

    section#top > .container > .row .ue-hero-main ul.top_list li, section#top > .container > .row .col-ld-6 ul.top_list li, section#top > .container > .row .col-md-6 ul.top_list li {
        list-style-type: none;
        padding-bottom: .5rem
    }

@media(max-width:767px) {
    section#top > .container > .row .ue-hero-main ul.top_list li, section#top > .container > .row .col-ld-6 ul.top_list li, section#top > .container > .row .col-md-6 ul.top_list li {
        text-align: center;
        padding-bottom: 0
    }
}

section#top > .container > .row .ue-hero-main .form .form-wrapper, section#top > .container > .row .col-ld-6 .form .form-wrapper, section#top > .container > .row .col-md-6 .form .form-wrapper {
    margin-bottom: .5rem;
    display: flex;
    flex-direction: column;
    align-items: center
}

    section#top > .container > .row .ue-hero-main .form .form-wrapper .btn-filled, section#top > .container > .row .col-ld-6 .form .form-wrapper .btn-filled, section#top > .container > .row .col-md-6 .form .form-wrapper .btn-filled {
        padding: 17px 0;
        width: 100%;
        border-radius: 8px
    }

    section#top > .container > .row .ue-hero-main .form .form-wrapper input, section#top > .container > .row .col-ld-6 .form .form-wrapper input, section#top > .container > .row .col-md-6 .form .form-wrapper input {
        width: 100%;
        margin-bottom: 1rem;
        border: none;
        box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
        border-radius: 26px;
        background-color: #fff !important;
        color: #767676 !important
    }

    section#top > .container > .row .ue-hero-main .form .form-wrapper .terms-submission, section#top > .container > .row .col-ld-6 .form .form-wrapper .terms-submission, section#top > .container > .row .col-md-6 .form .form-wrapper .terms-submission {
        margin: 0;
        font-size: 11px;
        width: 100%
    }

        section#top > .container > .row .ue-hero-main .form .form-wrapper .terms-submission label, section#top > .container > .row .col-ld-6 .form .form-wrapper .terms-submission label, section#top > .container > .row .col-md-6 .form .form-wrapper .terms-submission label {
            display: flex;
            flex-wrap: wrap;
            font-size: 14px;
            color: #767676;
            align-items: center;
            padding: 10px 0;
            margin-bottom: 1rem
        }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    section#top > .container > .row .ue-hero-main .form .form-wrapper .terms-submission label, section#top > .container > .row .col-ld-6 .form .form-wrapper .terms-submission label, section#top > .container > .row .col-md-6 .form .form-wrapper .terms-submission label {
        font-size: 11px
    }
}

section#top > .container > .row .ue-hero-main .form .form-wrapper .terms-submission label:hover, section#top > .container > .row .col-ld-6 .form .form-wrapper .terms-submission label:hover, section#top > .container > .row .col-md-6 .form .form-wrapper .terms-submission label:hover {
    cursor: pointer
}

section#top > .container > .row .ue-hero-main .form .form-wrapper .terms-submission label input, section#top > .container > .row .col-ld-6 .form .form-wrapper .terms-submission label input, section#top > .container > .row .col-md-6 .form .form-wrapper .terms-submission label input {
    margin-right: .5rem;
    width: auto;
    margin-bottom: 0
}

section#top > .container > .row .ue-hero-main .form .form-wrapper .terms-submission a, section#top > .container > .row .col-ld-6 .form .form-wrapper .terms-submission a, section#top > .container > .row .col-md-6 .form .form-wrapper .terms-submission a {
    color: #ffc502;
    margin: 0 2px
}

section#top > .container > .row .ue-hero-main .form .button-wrapper, section#top > .container > .row .col-ld-6 .form .button-wrapper, section#top > .container > .row .col-md-6 .form .button-wrapper {
    display: flex;
    align-items: center
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    section#top > .container > .row .ue-hero-main .form .button-wrapper, section#top > .container > .row .col-ld-6 .form .button-wrapper, section#top > .container > .row .col-md-6 .form .button-wrapper {
        flex-direction: column
    }
}

section#top > .container > .row .ue-hero-main .form .button-wrapper button, section#top > .container > .row .col-ld-6 .form .button-wrapper button, section#top > .container > .row .col-md-6 .form .button-wrapper button {
    width: 50%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    section#top > .container > .row .ue-hero-main .form .button-wrapper button, section#top > .container > .row .col-ld-6 .form .button-wrapper button, section#top > .container > .row .col-md-6 .form .button-wrapper button {
        width: 80%
    }
}

section#top > .container > .row .ue-hero-main .form .button-wrapper .button-wrapper__google, section#top > .container > .row .col-ld-6 .form .button-wrapper .button-wrapper__google, section#top > .container > .row .col-md-6 .form .button-wrapper .button-wrapper__google {
    margin-left: 4rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    section#top > .container > .row .ue-hero-main .form .button-wrapper .button-wrapper__google, section#top > .container > .row .col-ld-6 .form .button-wrapper .button-wrapper__google, section#top > .container > .row .col-md-6 .form .button-wrapper .button-wrapper__google {
        margin-left: 0;
        margin-top: 1rem
    }
}

section#top > .container > .row .ue-hero-main .form .button-wrapper .button-wrapper__google span, section#top > .container > .row .col-ld-6 .form .button-wrapper .button-wrapper__google span, section#top > .container > .row .col-md-6 .form .button-wrapper .button-wrapper__google span {
    font-size: 1rem;
    color: #767676
}

section#top > .container > .row .ue-hero-main .form .button-wrapper .button-wrapper__google img, section#top > .container > .row .col-ld-6 .form .button-wrapper .button-wrapper__google img, section#top > .container > .row .col-md-6 .form .button-wrapper .button-wrapper__google img {
    margin-left: .2rem;
    width: 32px
}

section#top > .container > .row .ue-hero-main .form.is_logged, section#top > .container > .row .col-ld-6 .form.is_logged, section#top > .container > .row .col-md-6 .form.is_logged {
    display: flex;
    white-space: nowrap;
    text-align: center
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    section#top > .container > .row .ue-hero-main .form.is_logged, section#top > .container > .row .col-ld-6 .form.is_logged, section#top > .container > .row .col-md-6 .form.is_logged {
        align-items: center;
        flex-direction: column
    }
}

section#top > .container > .row .ue-hero-main .form.is_logged .btn-filled, section#top > .container > .row .col-ld-6 .form.is_logged .btn-filled, section#top > .container > .row .col-md-6 .form.is_logged .btn-filled {
    padding: 15px 40px
}

section#top > .container > .row .ue-hero-main .form.is_logged a, section#top > .container > .row .col-ld-6 .form.is_logged a, section#top > .container > .row .col-md-6 .form.is_logged a {
    width: 200px
}

section#top > .container > .row .ue-hero-main .form.is_logged span, section#top > .container > .row .col-ld-6 .form.is_logged span, section#top > .container > .row .col-md-6 .form.is_logged span {
    display: block;
    font-size: 16px;
    font-weight: 300;
    padding: 15px
}

@media(max-width:767px) {
    section#top > .container > .row .ue-hero-main .form.is_logged span, section#top > .container > .row .col-ld-6 .form.is_logged span, section#top > .container > .row .col-md-6 .form.is_logged span {
        padding: 1rem
    }
}

section#top > .container > .row .ue-hero-main img, section#top > .container > .row .col-ld-6 img, section#top > .container > .row .col-md-6 img {
    width: 100%
}

section#top > .container > .row .ue-hero-main div#lottie svg, section#top > .container > .row .col-ld-6 div#lottie svg, section#top > .container > .row .col-md-6 div#lottie svg {
    height: 470px !important
}

section#top > .container > .row .left {
    padding: 3rem;
    border-radius: 6px;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    background-color: rgba(255,255,255,.9)
}

@media(max-width:767px) {
    section#top > .container > .row .left {
        padding: 1rem
    }
}

section#top > .container > .row .ue-hero-main.display {
    margin-top: 17rem;
    margin-bottom: 3rem;
    left: 10rem;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    background-color: rgba(255,255,255,.9);
    border-radius: 6px;
    animation: fade 3s ease-out;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center
}

@media(max-width:1477px) {
    section#top > .container > .row .ue-hero-main.display {
        left: 3rem
    }
}

@media(max-width:1250px) {
    section#top > .container > .row .ue-hero-main.display {
        left: 1rem
    }
}

@media(max-width:767px) {
    section#top > .container > .row .ue-hero-main.display {
        display: none
    }
}

@keyframes fade {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

section#top > .container > .row .ue-hero-main.display div.circle-content {
    width: 70px;
    height: 70px;
    border-radius: 100%;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    background-color: rgba(255,255,255,.9);
    position: relative;
    top: -2.4rem;
    display: flex;
    align-items: center;
    justify-content: center
}

    section#top > .container > .row .ue-hero-main.display div.circle-content img {
        border-radius: 100%;
        width: 70px;
        height: 70px
    }

section#top > .container > .row .ue-hero-main.display p.strong {
    font-weight: 700;
    margin-bottom: 1rem
}

section#top > .container > .row .ue-hero-main.display p {
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    margin-top: 0;
    padding: 0 2rem;
    margin-bottom: 3rem
}

section#top > .container > .row .ue-hero-main.display .review-company {
    width: 20%;
    margin-bottom: 3rem
}

section#extra-copy {
    margin-top: 3rem
}

    section#extra-copy .container .row .extra-text h2 {
        font-size: 36px;
        font-weight: 800;
        text-align: center
    }

@media(max-width:767px) {
    section#extra-copy .container .row .extra-text h2 {
        text-align: left;
        line-height: 1.25
    }
}

#feature-section .container {
    margin-top: 4rem
}

@media(max-width:767px) {
    #feature-section .container {
        margin-top: 2rem
    }
}

#feature-section .container .col-sm-12 {
    margin-bottom: 6rem
}

    #feature-section .container .col-sm-12 h2 {
        text-align: center;
        font-size: 48px;
        font-weight: 700;
        color: #1b1b20;
        z-index: 1;
        position: relative
    }

#feature-section .container .row {
    margin: 0 auto;
    display: flex;
    align-items: center
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #feature-section .container .row:nth-of-type(2), #feature-section .container .row:nth-of-type(4), #feature-section .container .row:nth-of-type(6) {
        flex-direction: column-reverse
    }
}

@media(max-width:767px) {
    #feature-section .container .row img {
        width: 100%;
        height: 6%
    }
}

@media(max-width:991px) {
    #feature-section .container .row .col-lg-5 div.text {
        text-align: center
    }
}

#feature-section .container .row .col-lg-5 div.text h2 {
    margin-bottom: 2rem;
    font-size: 36px;
    text-align: left;
    padding-right: 7rem;
    font-weight: 700
}

    #feature-section .container .row .col-lg-5 div.text h2 span.green {
        color: #00bf71;
        font-weight: 700
    }

#feature-section .container .row .col-lg-5 div.text p {
    margin-bottom: 2rem;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    color: #1b1b20;
    font-family: nunito sans,sans-serif;
    padding-right: 5rem
}

    #feature-section .container .row .col-lg-5 div.text p span {
        font-weight: 800
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #feature-section .container .row .col-lg-5 div.text h2, #feature-section .container .row .col-lg-5 div.text p {
        padding-right: 0;
        width: 80%;
        margin-left: auto;
        margin-right: auto
    }
}

#feature-section .container .row .col-lg-5 div.text a:active, #feature-section .container .row .col-lg-5 div.text a:focus, #feature-section .container .row .col-lg-5 div.text a:visited {
    outline: none;
    text-decoration: none;
    color: #1b1b20
}

#feature-section .container .row .col-lg-5 div.text a .more {
    font-family: nunito sans,sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #3c91e6
}

    #feature-section .container .row .col-lg-5 div.text a .more:hover {
        color: #1b78d4
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #feature-section .container .row .col-lg-5 div.text h2, #feature-section .container .row .col-lg-5 div.text p {
        text-align: center
    }
}

#feature-section .container .row .col-lg-8 {
    text-align: center
}

#feature-section .container .row .col-sm-12 {
    text-align: center;
    margin-top: 2rem;
    margin-bottom: 7rem
}

#prizes {
    margin-bottom: 10rem
}

@media(max-width:991px) {
    #prizes {
        margin-bottom: 5rem
    }
}

@media(max-width:991px) {
    #prizes .container .row {
        flex-direction: column-reverse
    }
}

#prizes .container .row .left {
    flex-direction: column;
    display: flex;
    justify-content: flex-end
}

    #prizes .container .row .left .wrapper {
        justify-content: space-between;
        display: flex
    }

@media(min-width:768px) and (max-width:991px) {
    #prizes .container .row .left .wrapper {
        justify-content: space-around
    }
}

#prizes .container .row .left .wrapper img {
    margin-bottom: 1rem;
    box-shadow: 9px 7px 50px 0 rgba(101,105,167,.08);
    width: 95%;
    height: 88%
}

    #prizes .container .row .left .wrapper img:hover {
        box-shadow: 2px -3px 26px 0 rgba(200,215,243,.5)
    }

#prizes .container .row .right {
    display: flex;
    align-items: center;
    flex-direction: column
}

@media(max-width:991px) {
    #prizes .container .row .right {
        margin-bottom: 6rem
    }
}

#prizes .container .row .right .text, #prizes .container .row .right .medals-wrapper {
    width: 90%;
    margin-left: auto
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #prizes .container .row .right .text, #prizes .container .row .right .medals-wrapper {
        width: 100%;
        text-align: center
    }
}

#prizes .container .row .right .text h2 {
    font-size: 36px;
    font-weight: 700;
    width: 67%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #prizes .container .row .right .text h2 {
        width: 100%;
        text-align: center
    }
}

#prizes .container .row .right .text p {
    margin: 2rem 0;
    color: #1b1b20;
    font-size: 18px;
    font-weight: 600
}

#prizes .container .row .right .medals-wrapper {
    display: flex
}

@media(max-width:767px) {
    #prizes .container .row .right .medals-wrapper {
        display: block
    }
}

#prizes .container .row .right .medals-wrapper .special-logo {
    display: flex;
    align-items: center
}

@media(max-width:767px) {
    #prizes .container .row .right .medals-wrapper .special-logo {
        justify-content: center
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #prizes .container .row .right .medals-wrapper .col {
        margin-bottom: 1rem
    }
}

#prizes .container .row .right .medals-wrapper .col img {
    width: 100%
}

@media(max-width:767px) {
    #prizes .container .row .right .medals-wrapper .col img {
        width: 45%;
        height: 100%
    }
}

#sign-up-cta {
    margin-bottom: 10rem
}

    #sign-up-cta .container {
        background-color: #f3f3f3;
        text-align: center;
        padding-top: 58px;
        padding-bottom: 58px;
        border-radius: 26px
    }

@media(max-width:575px) {
    #sign-up-cta .container {
        text-align: center;
        padding-top: 120px;
        padding-bottom: 120px;
        width: 100%
    }
}

#sign-up-cta .container .row {
    align-items: center;
    justify-content: space-between;
    width: 70%;
    margin: 0 auto;
    flex-direction: row;
    position: relative
}

    #sign-up-cta .container .row .greenSmallSkewCircle, #sign-up-cta .container .row .redSmallCircle, #sign-up-cta .container .row .blueSmallCircle, #sign-up-cta .container .row .greenSmallCircle {
        position: absolute;
        z-index: 1
    }

@media(max-width:767px) {
    #sign-up-cta .container .row .greenSmallSkewCircle, #sign-up-cta .container .row .redSmallCircle, #sign-up-cta .container .row .blueSmallCircle, #sign-up-cta .container .row .greenSmallCircle {
        display: none
    }
}

#sign-up-cta .container .row .greenSmallSkewCircle {
    top: -4rem;
    left: 6rem
}

#sign-up-cta .container .row .redSmallCircle {
    top: -4rem;
    right: -5rem
}

@media(min-width:768px) and (max-width:991px) {
    #sign-up-cta .container .row .redSmallCircle {
        right: 0
    }
}

#sign-up-cta .container .row .blueSmallCircle {
    left: -4rem;
    bottom: -4rem
}

@media(min-width:768px) and (max-width:991px) {
    #sign-up-cta .container .row .blueSmallCircle {
        left: 0
    }
}

#sign-up-cta .container .row .greenSmallCircle {
    right: -8rem;
    bottom: -5rem
}

@media(min-width:768px) and (max-width:991px) {
    #sign-up-cta .container .row .greenSmallCircle {
        right: 0
    }
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #sign-up-cta .container .row {
        flex-direction: column;
        width: 100%
    }
}

#sign-up-cta .container .row .schedule-demo-par {
    font-size: 21px;
    font-weight: 500;
    font-family: nunito sans,sans-serif;
    color: #1b1b20;
    margin-bottom: 0;
    line-height: 1.43
}

    #sign-up-cta .container .row .schedule-demo-par span {
        font-weight: 700
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #sign-up-cta .container .row .schedule-demo-par {
        margin-bottom: 2rem
    }
}

#sign-up-cta .container .row button {
    color: #1b1b20
}

    #sign-up-cta .container .row button:hover, #sign-up-cta .container .row button:focus {
        color: #000 !important
    }

#reviews, #features-perks {
    margin-bottom: 5rem
}

    #reviews .container .row .carousel-fade .carousel-item, #features-perks .container .row .carousel-fade .carousel-item {
        opacity: 0;
        transition-duration: 1s;
        transition-property: opacity
    }

        #reviews .container .row .carousel-fade .carousel-item.active, #reviews .container .row .carousel-fade .carousel-item-next.carousel-item-left, #reviews .container .row .carousel-fade .carousel-item-prev.carousel-item-right, #features-perks .container .row .carousel-fade .carousel-item.active, #features-perks .container .row .carousel-fade .carousel-item-next.carousel-item-left, #features-perks .container .row .carousel-fade .carousel-item-prev.carousel-item-right {
            opacity: 1
        }

    #reviews .container .row .carousel-fade .active.carousel-item-left, #reviews .container .row .carousel-fade .active.carousel-item-right, #features-perks .container .row .carousel-fade .active.carousel-item-left, #features-perks .container .row .carousel-fade .active.carousel-item-right {
        opacity: 0
    }

    #reviews .container .row .carousel-fade .carousel-item-next, #reviews .container .row .carousel-fade .carousel-item-prev, #reviews .container .row .carousel-fade .carousel-item.active, #reviews .container .row .carousel-fade .active.carousel-item-left, #reviews .container .row .carousel-fade .active.carousel-item-prev, #features-perks .container .row .carousel-fade .carousel-item-next, #features-perks .container .row .carousel-fade .carousel-item-prev, #features-perks .container .row .carousel-fade .carousel-item.active, #features-perks .container .row .carousel-fade .active.carousel-item-left, #features-perks .container .row .carousel-fade .active.carousel-item-prev {
        transform: translateX(0);
        transform: translate3d(0,0,0)
    }

    #reviews .container .row .header, #features-perks .container .row .header {
        display: flex;
        flex-direction: column;
        justify-content: center
    }

        #reviews .container .row .header h2, #features-perks .container .row .header h2 {
            text-align: left;
            font-size: 48px;
            font-weight: 800;
            color: #1b1b20;
            line-height: 1.33;
            width: 86%
        }

@media(max-width:767px) {
    #reviews .container .row .header h2, #features-perks .container .row .header h2 {
        width: 92%;
        font-size: 40px;
        margin: 0 auto;
        text-align: center
    }
}

#reviews .container .row .header h2 span.green, #features-perks .container .row .header h2 span.green {
    color: #00bf71
}

#reviews .container .row .carousel, #features-perks .container .row .carousel {
    display: flex;
    flex-direction: row;
    padding-left: 0;
    padding-right: 0
}

    #reviews .container .row .carousel .customer-review, #reviews .container .row .carousel .perk-content, #features-perks .container .row .carousel .customer-review, #features-perks .container .row .carousel .perk-content {
        padding: 1.5rem 0 1rem;
        display: flex
    }

@media(max-width:991px) {
    #reviews .container .row .carousel .customer-review, #reviews .container .row .carousel .perk-content, #features-perks .container .row .carousel .customer-review, #features-perks .container .row .carousel .perk-content {
        width: 100%
    }
}

#reviews .container .row .carousel .customer-review img.reviewer, #reviews .container .row .carousel .perk-content img.reviewer, #features-perks .container .row .carousel .customer-review img.reviewer, #features-perks .container .row .carousel .perk-content img.reviewer {
    width: auto;
    border-radius: 100%;
    margin-right: 1rem
}

#reviews .container .row .carousel .customer-review img, #reviews .container .row .carousel .perk-content img, #features-perks .container .row .carousel .customer-review img, #features-perks .container .row .carousel .perk-content img {
    width: 100%
}

@media(max-width:991px) {
    #reviews .container .row .carousel .customer-review img, #reviews .container .row .carousel .perk-content img, #features-perks .container .row .carousel .customer-review img, #features-perks .container .row .carousel .perk-content img {
        display: none
    }
}

#reviews .container .row .carousel .customer-review .text, #reviews .container .row .carousel .perk-content .text, #features-perks .container .row .carousel .customer-review .text, #features-perks .container .row .carousel .perk-content .text {
    box-shadow: 26px 16px 20px 0 rgba(33,31,45,.02);
    border: solid 1px rgba(33,31,45,.1);
    padding: 1.5rem 3rem 5rem 5rem;
    display: flex;
    justify-content: center;
    flex-direction: column;
    background-color: #fff;
    border-radius: 8px
}

    #reviews .container .row .carousel .customer-review .text .review-description, #reviews .container .row .carousel .perk-content .text .review-description, #features-perks .container .row .carousel .customer-review .text .review-description, #features-perks .container .row .carousel .perk-content .text .review-description {
        font-size: 22px;
        color: #211f2d;
        position: relative;
        font-weight: 700;
        font-family: nunito sans,sans-serif
    }

@media(max-width:991px) {
    #reviews .container .row .carousel .customer-review .text .review-description, #reviews .container .row .carousel .perk-content .text .review-description, #features-perks .container .row .carousel .customer-review .text .review-description, #features-perks .container .row .carousel .perk-content .text .review-description {
        padding-top: 2rem
    }
}

#reviews .container .row .carousel .customer-review .text p, #reviews .container .row .carousel .perk-content .text p, #features-perks .container .row .carousel .customer-review .text p, #features-perks .container .row .carousel .perk-content .text p {
    font-size: 16px;
    font-weight: 600
}

    #reviews .container .row .carousel .customer-review .text p strong, #reviews .container .row .carousel .perk-content .text p strong, #features-perks .container .row .carousel .customer-review .text p strong, #features-perks .container .row .carousel .perk-content .text p strong {
        opacity: 1
    }

    #reviews .container .row .carousel .customer-review .text p span, #reviews .container .row .carousel .perk-content .text p span, #features-perks .container .row .carousel .customer-review .text p span, #features-perks .container .row .carousel .perk-content .text p span {
        opacity: .6
    }

@media(max-width:991px) {
    #reviews .container .row .carousel .customer-review .text p, #reviews .container .row .carousel .perk-content .text p, #features-perks .container .row .carousel .customer-review .text p, #features-perks .container .row .carousel .perk-content .text p {
        padding-bottom: 1rem
    }
}

@media(max-width:768px) {
    #reviews .container .row .carousel .customer-review .text p, #reviews .container .row .carousel .perk-content .text p, #features-perks .container .row .carousel .customer-review .text p, #features-perks .container .row .carousel .perk-content .text p {
        font-size: 18px
    }
}

#reviews .container .row .description, #features-perks .container .row .description {
    display: flex;
    align-items: center;
    margin: 5rem auto 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #reviews .container .row .description, #features-perks .container .row .description {
        flex-direction: column
    }
}

#reviews .container .row .description .text, #features-perks .container .row .description .text {
    margin-left: 7rem
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #reviews .container .row .description .text, #features-perks .container .row .description .text {
        margin-left: 0;
        text-align: center;
        margin-top: 2rem
    }
}

#reviews .container .row .description .text p, #features-perks .container .row .description .text p {
    font-size: 16px;
    font-weight: 600;
    margin: 2.5rem auto 0;
    width: 80%;
    text-align: center
}

#reviews .carousel-item-next, #reviews .carousel-item-prev, #features-perks .carousel-item-next, #features-perks .carousel-item-prev {
    position: absolute
}

#pricing {
    margin-top: 7rem
}

    #pricing .container .row {
        text-align: center
    }

        #pricing .container .row .col-sm-12 p {
            font-size: 1.5rem;
            font-weight: 700;
            color: #00bf71
        }

        #pricing .container .row .col-sm-12 h3 {
            margin-bottom: 4rem;
            font-weight: 800;
            font-size: 2.25rem;
            color: #1b1b20
        }

    #pricing .col-md-4 {
        padding-right: 2.625rem
    }

@media(max-width:991px) {
    #pricing {
        flex-direction: column
    }

        #pricing .col-md-3 {
            max-width: 720px;
            margin: 0 auto 2rem
        }
}

#pricing .card {
    box-shadow: 0 0 16px rgba(200,215,243,.5);
    border: 0;
    padding-bottom: 35px;
    border-radius: 13px
}

    #pricing .card:hover {
        box-shadow: 2px -3px 26px 0 rgba(200,215,243,.5)
    }

    #pricing .card .list-group:first-child .list-group-item {
        border-top: 1px solid rgba(200,215,243,.5)
    }

#pricing h5 {
    font-size: 24px;
    color: #00bf71;
    text-transform: uppercase;
    letter-spacing: 1.64px;
    font-weight: 900;
    margin-top: 15px
}

#pricing h4 {
    margin: 3rem 1.5rem;
    font-weight: 800;
    font-size: 50px
}

    #pricing h4 span {
        display: inline-block;
        left: -5px;
        top: -16px;
        text-align: left
    }

    #pricing h4 .pricing-seats-period {
        font-size: 14px;
        font-family: lato,sans-serif;
        font-weight: 600;
        color: #1b1b20;
        letter-spacing: 0;
        vertical-align: top;
        margin-top: .5rem
    }

#pricing .smaller-margin {
    margin: 2rem 1.5rem -.8rem
}

#pricing .wrapper {
    display: flex
}

#posts {
    margin: 5rem 0 3rem;
    padding: 3rem 0;
    background-color: #f3f3f3
}

    #posts .container .row {
        width: auto;
        justify-content: center
    }

        #posts .container .row .special-paragraph {
            font-size: 14px;
            color: #ffc502;
            font-weight: 700;
            text-align: left;
            text-transform: uppercase;
            margin-bottom: 2rem
        }

@media(max-width:767px) {
    #posts .container .row .special-paragraph {
        text-align: center
    }
}

@media(min-width:768px) and (max-width:991px) {
    #posts .container .row .special-paragraph {
        text-align: center
    }
}

@media(max-width:767px) {
    #posts .container .row .col-sm-12 {
        padding-right: 1rem
    }
}

@media(max-width:767px) {
    #posts .container .row .col-sm-12 h5 {
        text-align: center
    }
}

#posts .container .row .col-sm-12 h2 {
    font-size: 48px;
    font-weight: 800;
    text-align: center;
    margin-bottom: 5rem
}

@media(max-width:767px) {
    #posts .container .row .col-sm-12 h2 {
        font-size: 28px
    }
}

#posts .container .row .header-text {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 3rem;
    padding-left: 0
}

    #posts .container .row .header-text h2 {
        margin-bottom: 0
    }

    #posts .container .row .header-text button a {
        color: #fff
    }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #posts .container .row .header-text .check-all-posts-desktop {
        display: none
    }
}

#posts .container .row .col-lg-4, #posts .container .row .col-lg-3 {
    margin-bottom: 1rem
}

@media(min-width:768px) and (max-width:991px) {
    #posts .container .row .col-lg-4, #posts .container .row .col-lg-3 {
        display: flex;
        flex-direction: column;
        align-items: center
    }
}

#posts .container .row .col-lg-4 img, #posts .container .row .col-lg-3 img {
    width: 100%
}

@media(min-width:768px) and (max-width:991px) {
    #posts .container .row .col-lg-4 img, #posts .container .row .col-lg-3 img {
        width: 100%
    }
}

#posts .container .row .col-lg-4 img.more-padding, #posts .container .row .col-lg-3 img.more-padding {
    padding-bottom: 1rem
}

#posts .container .row .col-lg-4 .text, #posts .container .row .col-lg-3 .text {
    padding-left: 1rem
}

@media(max-width:767px) {
    #posts .container .row .col-lg-4 .text, #posts .container .row .col-lg-3 .text {
        padding: 1rem 0
    }
}

#posts .container .row .col-lg-4 .text h2, #posts .container .row .col-lg-3 .text h2 {
    font-size: 24px;
    font-weight: 800;
    position: relative;
    z-index: 1;
    line-height: 1.42;
    font-family: nunito sans,sans-serif;
    letter-spacing: normal
}

#posts .container .row .col-lg-4 .text .read-more, #posts .container .row .col-lg-3 .text .read-more {
    font-size: 1rem;
    color: #ffc502;
    font-weight: 700
}

#posts .container .row .col-lg-4 .text .company-name, #posts .container .row .col-lg-3 .text .company-name {
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #3c91e6;
    font-size: 15px;
    font-weight: 700;
    padding-top: 2rem
}

#posts .container .mobile-button-container {
    text-align: center
}

    #posts .container .mobile-button-container button {
        display: none
    }

        #posts .container .mobile-button-container button a {
            color: #fff
        }

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #posts .container .mobile-button-container button {
        display: inline-block
    }
}

#bottom {
    margin: 0 2rem
}

    #bottom .container {
        background-color: #f3f3f3;
        border-radius: 26px;
        padding: 4rem 0
    }

        #bottom .container .row .ue-hero-main h2 {
            margin: 0 auto 3rem;
            font-size: 42px;
            font-weight: 800;
            text-align: center;
            color: #1b1b20
        }

@media(min-width:768px) and (max-width:991px) {
    #bottom .container .row .ue-hero-main h2 {
        width: 90%
    }
}

#bottom .container .row .ue-hero-main p {
    font-size: 21px;
    font-weight: 500;
    color: #1b1b20;
    margin: 0 auto 3rem;
    width: 65%;
    text-align: center
}

@media(min-width:768px) and (max-width:991px) {
    #bottom .container .row .ue-hero-main p {
        width: 88%
    }
}

#bottom .container .row .ue-hero-main .form {
    width: 50%;
    margin: 0 auto
}

@media(max-width:767px) {
    #bottom .container .row .ue-hero-main .form {
        width: 90%
    }
}

@media(min-width:768px) and (max-width:991px) {
    #bottom .container .row .ue-hero-main .form {
        width: 75%
    }
}

#bottom .container .row .ue-hero-main .form .form-wrapper {
    text-align: center
}

    #bottom .container .row .ue-hero-main .form .form-wrapper input {
        border: none;
        outline: none
    }

        #bottom .container .row .ue-hero-main .form .form-wrapper input[type=email] {
            border-radius: 26px;
            box-shadow: 0 0 0 3px #f7b801
        }

            #bottom .container .row .ue-hero-main .form .form-wrapper input[type=email]:hover {
                box-shadow: 0 0 0 3px #f7b801
            }

@media(max-width:767px) {
    #bottom .container .row .ue-hero-main .form .form-wrapper input[type=email] {
        margin-bottom: 1rem;
        width: 100%
    }
}

#bottom .container .row .ue-hero-main .form .form-wrapper button {
    padding: 16px 20px;
    color: #1b1b20;
    font-weight: 700;
    font-size: 16px;
    box-shadow: 0 0 0 3px #f7b801;
    position: relative;
    left: -3rem
}

@media(max-width:767px) {
    #bottom .container .row .ue-hero-main .form .form-wrapper button {
        left: 0;
        width: 100%;
        padding: 12px 20px
    }
}

#bottom .container .row .ue-hero-main .form .form-wrapper button:hover {
    color: #000;
    box-shadow: 0 0 0 3px #f7b801
}

#bottom .container .row .ue-hero-main .form .terms-submission {
    margin: 8px 0;
    font-size: 11px;
    color: #1b1b20;
    opacity: .6;
    width: 100%
}

@media(max-width:767px) {
    #bottom .container .row .ue-hero-main .form .terms-submission label {
        flex-wrap: wrap
    }
}

#bottom .container .row .ue-hero-main .form .terms-submission label:hover {
    cursor: pointer
}

#bottom .container .row .ue-hero-main .form .terms-submission label input {
    margin-right: .3rem
}

#bottom .container .row .ue-hero-main .form .terms-submission a {
    color: #ffc502;
    text-decoration: underline;
    margin: 0 2px;
    font-weight: 600
}

.inline-form-tc input[type=email] {
    border: 1px solid #1b1b20;
    outline: none;
    font-size: 1rem;
    padding: 1rem 60px 1rem 1.5rem;
    color: #767676
}

    .inline-form-tc input[type=email]:hover, .inline-form-tc input[type=email]:focus, .inline-form-tc input[type=email]:active {
        box-shadow: 0 0 0 3px #dfa601
    }

@media(max-width:767px) {
    .inline-form-tc input[type=email] {
        font-size: 11px;
        padding: 16px 5px 12px 20px
    }
}

@media(min-width:768px) and (max-width:991px) {
    .inline-form-tc input[type=email] {
        font-size: 14px;
        padding: 18px 35px 17px 20px
    }
}

.inline-form-tc p {
    font-size: 13px;
    margin: .7rem 0
}

.inline-form-tc button {
    padding: 15px 30px;
    color: #fff;
    font-weight: 700
}

@media(max-width:767px) {
    .inline-form-tc button {
        width: 35%
    }
}

a.plugin_buttons {
    display: flex;
    align-items: center;
    justify-content: left;
    width: 70%;
    margin: 2rem 0 0
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    a.plugin_buttons {
        margin: 1rem auto
    }
}

@media(min-width:768px) and (max-width:991px) {
    a.plugin_buttons {
        width: 50%
    }
}

@media(max-width:767px) {
    a.plugin_buttons {
        width: 70%
    }
}

a.plugin_buttons img {
    width: 40px;
    height: 40px;
    margin: auto 1rem auto 0
}

p.plugins_additional {
    margin: 1rem 0 2rem !important;
    font-size: 13px !important;
    width: auto !important
}

    p.plugins_additional a {
        color: #00bf71 !important
    }

        p.plugins_additional a:hover {
            color: #008a51 !important
        }

@media(max-width:767px) {
    .calendly-overlay .calendly-popup {
        top: 200px !important
    }
}

@media(max-width:767px) {
    .calendly-overlay {
        top: 75px !important
    }
}

@media(max-width:767px) {
    .calendly-overlay div.calendly-popup-close {
        top: 50px !important
    }
}

.booking-paragraph {
    margin: 2rem 0 4rem;
    display: flex;
    justify-content: center;
    align-items: center
}

@media(max-width:767px) {
    .booking-paragraph {
        flex-direction: column
    }
}

.booking-paragraph p {
    margin-bottom: 0;
    font-weight: 700;
    padding-right: 1rem
}

.booking-paragraph a {
    color: #ffc502 !important;
    cursor: pointer;
    font-weight: 700
}

#breadcrumbs .container {
    padding-left: 15px !important;
    padding-right: 15px !important
}

    #breadcrumbs .container .row {
        margin-left: 0;
        margin-top: 2rem;
        font-size: 14px;
        font-family: nunito sans,sans-serif;
        color: #1b1b20;
        font-weight: 700
    }

        #breadcrumbs .container .row .breadcrumbs__active {
            color: #ffc502;
            font-weight: 700
        }

.partners-marketplace #top {
    padding-bottom: 1rem
}

    .partners-marketplace #top .top__partnersMarketplace {
        display: flex;
        align-items: center;
        flex-direction: column
    }

@media(max-width:767px) {
    .partners-marketplace #top .top__partnersMarketplace {
        align-items: flex-start;
        margin-top: 3rem
    }
}

.partners-marketplace #top .top__partnersMarketplace h1 {
    text-align: center;
    width: 100% !important;
    margin: .9rem
}

@media(max-width:767px) {
    .partners-marketplace #top .top__partnersMarketplace h1 {
        margin: 0 0 2rem;
        text-align: left !important
    }
}

.partners-marketplace #top .top__partnersMarketplace h2 {
    margin: 2rem 0;
    font-weight: 700
}

.partners-marketplace #top .top__partnersMarketplace p {
    color: #767676;
    font-size: 18px
}

@media(max-width:767px) {
    .partners-marketplace #top .top__partnersMarketplace p {
        text-align: left
    }
}

.partners-marketplace #partnersMarketplaceContent {
    margin-bottom: 2rem
}

    .partners-marketplace #partnersMarketplaceContent h3 {
        margin-top: 3rem;
        margin-bottom: 2rem;
        font-weight: 700
    }

@media(max-width:767px) {
    .partners-marketplace #partnersMarketplaceContent h3 {
        margin-left: 1rem
    }
}

.partners-marketplace #partnersMarketplaceContent .row {
    flex-wrap: nowrap
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .partners-marketplace #partnersMarketplaceContent .row {
        flex-wrap: wrap
    }
}

.partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box {
    margin: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 30px;
    border-radius: 26px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    background-color: #fff
}

    .partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box:hover {
        box-shadow: 0 1px 2px 1px rgba(0,0,0,.23)
    }

@media(min-width:768px) and (max-width:991px) {
    .partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box {
        align-items: flex-start
    }
}

.partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box .partners-marketplace__content-box--top {
    display: flex;
    align-items: center;
    width: 100%;
    margin-bottom: 1rem
}

    .partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box .partners-marketplace__content-box--top img {
        width: 60px;
        margin-right: 2rem
    }

    .partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box .partners-marketplace__content-box--top h2 {
        margin: 0;
        font-size: 1.5rem;
        font-weight: 700
    }

.partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box .partners-marketplace__content-box--text span {
    color: #fff;
    background-color: #adb5bd;
    border-radius: 20px;
    padding: 4px 20px;
    font-size: 11px
}

    .partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box .partners-marketplace__content-box--text span.free {
        color: #fff;
        background-color: #00bf71;
        border-radius: 20px;
        padding: 4px 20px;
        font-size: 11px
    }

.partners-marketplace #partnersMarketplaceContent .row .partners-marketplace__content-box .partners-marketplace__content-box--text p {
    margin: 1rem 0 0
}

.partners-marketplace #partnersMarketplaceContent .partners-marketplace__icons {
    max-width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 4rem 0
}

@media(max-width:767px) {
    .partners-marketplace #partnersMarketplaceContent .partners-marketplace__icons {
        margin: 2rem 0;
        justify-content: space-evenly;
        flex-direction: column
    }
}

.partners-marketplace #partnersMarketplaceContent .partners-marketplace__icons img {
    width: 10%
}

@media(max-width:767px) {
    .partners-marketplace #partnersMarketplaceContent .partners-marketplace__icons img {
        width: 35%;
        height: auto;
        margin-bottom: 2rem
    }
}

#bannerBookaDemoBlack {
    padding-bottom: 0;
    padding-top: 0;
    margin: 7rem 0;
    position: relative;
    overflow: hidden
}

@media(max-width:767px) {
    #bannerBookaDemoBlack {
        margin-top: -2rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #bannerBookaDemoBlack {
        margin: 5rem 0
    }
}

#bannerBookaDemoBlack .row {
    position: relative
}

@media(max-width:767px) {
    #bannerBookaDemoBlack .row {
        margin-right: 0;
        margin-left: 0
    }
}

#bannerBookaDemoBlack .container {
    background-color: #1b1b20;
    border-radius: 20px
}

    #bannerBookaDemoBlack .container .text-cta {
        display: flex;
        padding-left: 4rem;
        flex-direction: column;
        justify-content: space-evenly
    }

@media(min-width:768px) and (max-width:991px) {
    #bannerBookaDemoBlack .container .text-cta {
        position: absolute;
        padding: 5rem 0 3rem 5rem
    }
}

@media(max-width:767px) {
    #bannerBookaDemoBlack .container .text-cta {
        overflow-x: hidden;
        position: static;
        padding-left: 1rem
    }
}

@media(max-width:767px) {
    #bannerBookaDemoBlack .container .text-cta .paragraph-text {
        margin-bottom: 3rem;
        margin-right: 0;
        padding-right: 2rem
    }
}

#bannerBookaDemoBlack .container .text-cta h2 {
    font-size: 48px;
    font-weight: 700;
    color: #fff;
    padding-right: 6rem
}

@media(max-width:767px) {
    #bannerBookaDemoBlack .container .text-cta h2 {
        font-size: 36px;
        padding-top: 2rem;
        padding-right: 0
    }
}

@media(min-width:768px) and (max-width:991px) {
    #bannerBookaDemoBlack .container .text-cta h2 {
        font-size: 46px;
        padding-right: 0
    }
}

::selection {
    background: #ffc502
}

#black-banner-fullsize {
    background-color: #1b1b20;
    margin-top: 8rem
}

    #black-banner-fullsize .container--custom {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        padding-top: 0 !important
    }

@media(max-width:767px) {
    #black-banner-fullsize .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #black-banner-fullsize .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    #black-banner-fullsize .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    #black-banner-fullsize .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    #black-banner-fullsize .container--custom {
        width: 1440px
    }
}

#black-banner-fullsize .container--custom .row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 9rem 0
}

@media(max-width:767px) {
    #black-banner-fullsize .container--custom .row {
        padding: 3.5rem 0
    }
}

#black-banner-fullsize .container--custom .row p {
    font-size: 36px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    width: 70%;
    margin-bottom: 2.5rem
}

@media(min-width:768px) and (max-width:991px) {
    #black-banner-fullsize .container--custom .row p {
        font-size: 32px;
        width: 100%
    }
}

@media(max-width:767px) {
    #black-banner-fullsize .container--custom .row p {
        font-size: 28px;
        width: 100%
    }
}

#table-setup {
    background: #f3f3f3;
    background: linear-gradient(0deg,#f3f3f3 0%,#fff 100%);
    padding-bottom: 7.5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #table-setup {
        padding-bottom: 4rem
    }
}

#table-setup .container--custom {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    padding-top: 7.5rem;
    margin-left: auto;
    margin-right: auto
}

@media(max-width:767px) {
    #table-setup .container--custom {
        padding: 4rem 1.5rem
    }
}

@media(min-width:768px) and (max-width:991px) {
    #table-setup .container--custom {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(min-width:992px) and (max-width:1440px) {
    #table-setup .container--custom {
        width: 85%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    #table-setup .container--custom {
        width: 1400px
    }
}

@media(min-width:1920px) {
    #table-setup .container--custom {
        width: 1440px
    }
}

#table-setup .container--custom .table-setup__heading {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column
}

@media(max-width:767px) {
    #table-setup .container--custom .table-setup__heading {
        align-items: flex-start
    }
}

#table-setup .container--custom .table-setup__heading h2 {
    font-size: 36px;
    font-weight: 700;
    margin: 1.5rem 0 4rem;
    width: 55%;
    text-align: center
}

@media(max-width:767px) {
    #table-setup .container--custom .table-setup__heading h2 {
        align-items: flex-start;
        width: 100%;
        text-align: left
    }
}

#table-setup .container--custom .table-setup__boxes {
    width: 100%;
    display: flex
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #table-setup .container--custom .table-setup__boxes {
        flex-direction: column
    }
}

@media(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    #table-setup .container--custom .table-setup__boxes div:not(:first-of-type)::after {
        content: "";
        background-color: #767676;
        position: absolute;
        left: 0;
        top: 0;
        width: 1px;
        height: 85%
    }
}

#table-setup .container--custom .table-setup__boxes--box {
    width: 25%;
    padding: 3.5rem 3rem 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative
}

@media(min-width:768px) and (max-width:991px) {
    #table-setup .container--custom .table-setup__boxes--box {
        flex-direction: row;
        width: 100%;
        border-left: 0;
        border-top: 1px solid #767676;
        padding: 1.5rem 3rem 0;
        align-items: center;
        justify-content: center
    }
}

@media(max-width:767px) {
    #table-setup .container--custom .table-setup__boxes--box {
        flex-direction: row;
        width: 100%;
        border-left: 0;
        border-top: 2px solid #767676;
        padding: 1.5rem 1rem 0
    }
}

#table-setup .container--custom .table-setup__boxes--box span {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffc502;
    border-radius: 100px;
    width: 64px;
    height: 64px;
    color: #fff;
    margin-bottom: 3.5rem;
    font-size: 24px
}

@media(min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:991px),(max-width:767px) {
    #table-setup .container--custom .table-setup__boxes--box span {
        margin-right: 1.5rem;
        padding: 1.5rem
    }
}

#table-setup .container--custom .table-setup__boxes--box p {
    font-size: 22px
}

#table-setup .container--custom .table-setup__button {
    margin-top: 3rem;
    display: flex;
    align-items: center;
    justify-content: center
}

#parallaxScroll {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 7.5rem;
    padding-bottom: 7.5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    #parallaxScroll {
        width: 100%;
        padding-right: 5rem;
        padding-left: 5rem;
        padding-top: 7.5rem;
        margin-left: auto;
        margin-right: auto
    }
}

@media(max-width:767px) and (max-width:767px),(min-width:768px) and (max-width:991px) and (max-width:767px),(min-width:768px) and (max-width:1150px) and (max-width:767px) {
    #parallaxScroll {
        padding: 4rem 1.5rem
    }
}

@media(max-width:767px) and (min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:991px) and (min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) and (min-width:768px) and (max-width:991px) {
    #parallaxScroll {
        width: 767px;
        padding: 4rem 1.5rem
    }
}

@media(max-width:767px) and (min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:991px) and (min-width:992px) and (max-width:1440px),(min-width:768px) and (max-width:1150px) and (min-width:992px) and (max-width:1440px) {
    #parallaxScroll {
        width: 85%
    }
}

@media(max-width:767px) and (min-width:1441px) and (max-width:1919px),(min-width:768px) and (max-width:991px) and (min-width:1441px) and (max-width:1919px),(min-width:768px) and (max-width:1150px) and (min-width:1441px) and (max-width:1919px) {
    #parallaxScroll {
        width: 1400px
    }
}

@media(max-width:767px) and (min-width:1920px),(min-width:768px) and (max-width:991px) and (min-width:1920px),(min-width:768px) and (max-width:1150px) and (min-width:1920px) {
    #parallaxScroll {
        width: 1440px
    }
}

#parallaxScroll .btn-filled {
    align-self: center;
    z-index: 10
}

#parallaxScroll h2.blackHeader {
    width: 50%;
    text-align: center;
    font-weight: 600
}

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #parallaxScroll h2.blackHeader {
        width: 100%
    }
}

#parallaxScroll .content {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    margin-bottom: -4rem;
    margin-top: -10rem;
    margin-bottom: -11rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    #parallaxScroll .content {
        grid-template-columns: 1fr;
        margin-bottom: -5rem
    }
}

@media(min-width:1151px) and (max-width:1600px) {
    #parallaxScroll .content {
        margin-top: -6rem
    }
}

@media(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    #parallaxScroll .content {
        margin-top: 1rem
    }
}

@media(max-width:767px) {
    #parallaxScroll .content {
        margin-top: 0
    }
}

@media only screen and (min-width:1151px) {
    #parallaxScroll .content .left {
        padding-left: 30%
    }
}

#parallaxScroll .content .left div {
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding-right: 5rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    #parallaxScroll .content .left div {
        height: fit-content;
        padding-right: 0;
        margin-bottom: 8rem
    }
}

#parallaxScroll .content .left div h2 {
    margin-bottom: 3.5rem;
    font-size: 36px;
    font-weight: 700;
    max-width: 80%
}

@media only screen and (max-width:1500px) {
    #parallaxScroll .content .left div h2 {
        max-width: 100%
    }
}

#parallaxScroll .content .left div h3 {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.44
}

#parallaxScroll .content .left div p {
    font-size: 18px;
    line-height: 1.44;
    margin-bottom: 1rem
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    #parallaxScroll .content .left div img {
        margin-top: 2rem;
        width: 100%
    }
}

@media only screen and (min-width:1151px) {
    #parallaxScroll .content .left .section {
        opacity: 0
    }
}

@media only screen and (min-width:1151px) {
    #parallaxScroll .content .left .active {
        opacity: 1;
        transition: all .5s ease-in-out
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    #parallaxScroll .content .scrollmagic-pin-spacer {
        display: none !important
    }
}

#parallaxScroll .content .right {
    height: 100vh;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 90px;
    margin: 0 !important;
    position: relative
}

@media(max-width:767px),(min-width:768px) and (max-width:991px),(min-width:768px) and (max-width:1150px) {
    #parallaxScroll .content .right {
        display: none
    }
}

#parallaxScroll .content .right img {
    width: 102%;
    margin-right: -1.5rem;
    position: absolute;
    opacity: 0;
    transition: all .7s ease-in-out
}

#parallaxScroll .content .right .active {
    position: relative;
    opacity: 1
}

.section-integration-more-info {
    position: relative;
    margin-top: -90px;
    margin-bottom: 121px
}

    .section-integration-more-info div.limitHeight {
        display: block;
        position: relative;
        content-visibility: auto
    }

    .section-integration-more-info div.limitHeight {
        height: 70px;
        overflow: hidden
    }

@media(max-width:767px) {
    .section-integration-more-info div.limitHeight {
        height: 65px
    }
}

.section-integration-more-info h2 {
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
    margin: 2rem
}

@media(max-width:767px) {
    .section-integration-more-info h2 {
        margin: 2rem 0;
        text-align: left
    }
}

.section-integration-more-info p {
    line-height: 1.89
}

.section-integration-more-info h3, .section-integration-more-info h4 {
    font-weight: 700;
    margin: 2rem 0
}

.section-integration-more-info button.btn-success {
    color: #ffc502;
    font-weight: 700
}

    .section-integration-more-info button.btn-success:hover {
        text-decoration: underline;
        color: #ffc502
    }

.video-youtube__container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    height: 100%;
    margin-bottom: 5rem;
    width: 100%;
    overflow: hidden
}

    .video-youtube__container::after {
        padding-top: 56.25%;
        display: block;
        content: ""
    }

    .video-youtube__container img {
        width: 100%
    }

    .video-youtube__container .homepage__video--img-button {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        width: 155px;
        height: 155px
    }

@media(max-width:767px) {
    .video-youtube__container .homepage__video--img-button {
        width: 52px;
        height: 52px
    }
}

.video-youtube__container iframe {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.Timely-redirect {
    background-color: #2d80eb;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: .3rem 0;
    position: relative;
    z-index: 999
}

    .Timely-redirect a {
        color: #fff !important;
        font-size: 14px;
        margin-right: 11%
    }

@media(min-width:1920px) {
    .Timely-redirect a {
        margin-right: 21%
    }
}

@media(min-width:1441px) and (max-width:1919px) {
    .Timely-redirect a {
        margin-right: 14%
    }
}

@media(max-width:767px) {
    .Timely-redirect a {
        margin-right: 8%
    }
}

.Timely-redirect a:hover {
    cursor: pointer
}

.planner-redirect-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background-color: #2d80eb;
    color: #fff;
    padding: .5rem 0;
    position: relative;
    z-index: 999
}

    .planner-redirect-menu a {
        color: #fff !important
    }

        .planner-redirect-menu a:hover {
            cursor: pointer
        }

        .planner-redirect-menu a span {
            text-decoration: underline !important;
            font-weight: 700;
            margin-left: 1rem
        }

.validation-form {
    display: flex;
    flex-direction: column;
    position: relative
}

@media(min-width:768px) and (max-width:991px) {
    .validation-form {
        width: 70%
    }
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    .validation-form {
        align-items: center
    }
}

.validation-form input {
    padding: 1rem;
    border-radius: 8px;
    border: solid 1px #e9e9e9;
    margin-bottom: 1.5rem
}

    .validation-form input[type=email] {
        margin-top: 1.5rem;
        width: 100%
    }

    .validation-form input[type=password] {
        margin-bottom: 1rem;
        width: 100%
    }

.validation-form__registerButtons {
    display: flex;
    align-items: center;
    justify-content: center
}

@media(max-width:767px) {
    .validation-form__registerButtons {
        flex-direction: column;
        width: 100%
    }
}

.validation-form__registerButtons input {
    border-radius: 26px;
    padding: 18px 40px;
    color: #fff !important;
    background-color: #ffc502;
    margin-bottom: 0;
    font-weight: 700
}

@media(max-width:767px) {
    .validation-form__registerButtons input {
        width: 100%
    }
}

.validation-form__registerButtons .onHover:hover {
    cursor: pointer;
    background-color: #1da44c
}

.validation-form__registerButtons p {
    margin: 0 .5rem 0 1rem
}

.error-input-border {
    outline: none !important;
    border-color: red !important
}

#password-front-validation {
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
    visibility: hidden;
    margin-bottom: 1.5rem;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.17);
    z-index: 999;
    border-radius: 13px;
    position: absolute;
    top: 40px;
    right: -57%
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #password-front-validation {
        width: fit-content;
        top: -92px;
        right: 0
    }
}

#password-front-validation::before {
    content: "";
    position: absolute;
    background-color: #f3f3f3;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.17);
    width: 15px;
    height: 15px;
    bottom: -50;
    left: -7px;
    transform: rotate(45deg);
    z-index: 999
}

@media(max-width:767px),(min-width:768px) and (max-width:991px) {
    #password-front-validation::before {
        display: none
    }
}

#password-front-validation .password-validation-content {
    padding: 1rem;
    z-index: 99999;
    background-color: #f3f3f3;
    border-radius: 13px
}

#password-front-validation .password-validation-content-header-text {
    display: none
}

#password-front-validation .password-validation-content .password-validation-content-check-icon::after {
    content: "✔";
    font-style: normal !important;
    margin-right: 1rem;
    color: #ffc502;
    width: 28px !important;
    margin-right: 10px
}

#password-front-validation .password-validation-content .password-validation-content-check-icon-not-passed::after {
    content: "•";
    font-style: normal !important;
    color: #000;
    margin-right: 14px
}

#articles_carousel {
    margin-bottom: 104px;
    width: 100vw;
    overflow: hidden
}

    #articles_carousel .container {
        display: flex;
        flex-direction: column;
        overflow: hidden
    }

        #articles_carousel .container span {
            color: #1f1f1f;
            font-size: 36px;
            font-weight: 700;
            margin-bottom: 40px
        }

        #articles_carousel .container .features__heading {
            display: flex;
            flex-direction: column;
            align-items: center
        }

            #articles_carousel .container .features__heading h2 {
                font-size: 36px;
                font-weight: 700;
                margin-bottom: 2rem
            }

        #articles_carousel .container .cards {
            display: flex;
            gap: 35px;
            transition: all .3s ease-in-out;
            margin-bottom: 1rem
        }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #articles_carousel .container .cards {
        margin-top: 1.5rem
    }
}

@media(max-width:767px) {
    #articles_carousel .container .cards {
        padding: 1rem;
        -ms-overflow-style: none;
        scrollbar-width: none
    }
}

@media(max-width:767px) {
    #articles_carousel .container .cards::-webkit-scrollbar {
        display: none
    }
}

#articles_carousel .container .cards .card {
    flex: 0 0 calc(34% - 35px);
    border: none;
    border-radius: 20px;
    box-shadow: 0 2px 4px 2px rgba(0,0,0,.07);
    transition: all .2s ease-in-out
}

@media(min-width:768px) and (max-width:991px) {
    #articles_carousel .container .cards .card {
        flex: 0 0 calc(49% - 35px)
    }
}

@media(max-width:767px) {
    #articles_carousel .container .cards .card {
        flex: 0 0 calc(92%)
    }
}

#articles_carousel .container .cards .card:hover {
    box-shadow: 0 2px 7px 5px rgba(0,0,0,.07)
}

#articles_carousel .container .cards .card a {
    display: flex;
    flex-direction: column;
    padding: 32px;
    gap: 20px
}

#articles_carousel .container .cards .card img.main {
    background: #f2fcf6;
    border-radius: 8px;
    padding: 12px;
    width: 48px
}

#articles_carousel .container .cards .card p {
    font-size: 24px;
    font-weight: 700
}

    #articles_carousel .container .cards .card p span {
        font-size: 24px;
        font-weight: 700
    }

#articles_carousel .container .buttons, #articles_carousel .container .buttons-mobile {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    margin-bottom: 20px
}

#articles_carousel .container .buttons_button, #articles_carousel .container .buttons-mobile_button {
    background-color: transparent;
    border: none;
    outline: none;
    opacity: 1;
    transition: all .2s ease-in-out
}

    #articles_carousel .container .buttons_button:disabled, #articles_carousel .container .buttons-mobile_button:disabled {
        opacity: .3
    }

    #articles_carousel .container .buttons_button.before, #articles_carousel .container .buttons-mobile_button.before {
        transform: rotateY(180deg)
    }

@media(min-width:768px) and (max-width:991px),(max-width:767px) {
    #articles_carousel .container .buttons {
        display: none
    }
}

#articles_carousel .container .buttons-mobile {
    justify-content: center
}

@media(min-width:768px) and (max-width:991px) {
    #articles_carousel .container .buttons-mobile {
        align-items: center;
        justify-content: center;
        margin-top: 20px
    }
}

@media(max-width:767px) {
    #articles_carousel .container .buttons-mobile {
        align-items: center;
        justify-content: flex-start;
        margin-left: .6rem
    }
}

@media(min-width:992px) and (max-width:1199px),(min-width:992px) and (max-width:1440px),(min-width:1441px) and (max-width:1919px),(min-width:1920px) {
    #articles_carousel .container .buttons-mobile {
        display: none
    }
}

#bannerGray {
    background-color: #f8fafc;
    padding: 72px 0 96px;
    margin-top: 164px
}

    #bannerGray .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center
    }

        #bannerGray .container h2 {
            color: #222324;
            text-align: center;
            font-size: 52px;
            font-weight: 700;
            margin-bottom: 32px;
            max-width: 864px
        }

@media(max-width:767px) {
    #bannerGray .container h2 {
        font-size: 36px
    }
}

#bannerGray .container h2 span {
    color: #ffc502
}

#bannerGray .container p {
    color: #323333;
    text-align: center;
    font-size: 24px;
    font-weight: 400;
    margin-bottom: 40px
}

@media(max-width:767px) {
    #bannerGray .container p {
        font-size: 18px
    }
}

#bannerGray .container a {
    padding: 16px 36px 17px;
    border-radius: 36px;
    background: #ffc502;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    transition: background-color .2s ease-in-out
}

    #bannerGray .container a:hover {
        background-color: #17b54e
    }

span.industries-label, h1.industries-label {
    font-size: 14px;
    font-family: lato,sans-serif;
    text-transform: uppercase;
    color: #ffc502;
    font-weight: 700;
    margin-bottom: -1rem
}

span.free-comunication-label.margin-bottom-sm {
    margin-bottom: 16px
}

span.free-comunication-label.margin-bottom-md {
    margin-bottom: 24px
}

span.free-comunication-label.margin-top-md {
    margin: 42px 0 0
}

span.free-comunication-label.light-green {
    padding: 10px 20px;
    border-radius: 8px;
    font-family: Lato;
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    color: #ffc502;
    background-color: #f2fcf6
}

span.free-comunication-label.malachite {
    padding: 4px 6px;
    border-radius: 6px;
    font-family: Lato;
    font-size: 14px;
    font-weight: 700;
    line-height: 22px;
    text-align: left;
    color: #fff;
    background-color: #ffc502
}

#branding_carousel {
    display: flex;
    flex-direction: column;
    gap: 64px;
    margin: 2rem 0 3rem
}

@media(max-width:767px) {
    #branding_carousel {
        gap: 40px;
        margin: 2rem 0 0
    }
}

#branding_carousel .green_bar {
    width: 100%;
    background-color: #ffc502;
    padding: 12px 0
}

@media(max-width:767px) {
    #branding_carousel .green_bar {
        padding: 20px 0
    }
}

#branding_carousel .green_bar .container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 64px
}

@media(max-width:767px) {
    #branding_carousel .green_bar .container {
        flex-direction: column;
        gap: 20px
    }
}

#branding_carousel .green_bar .container .item {
    display: flex;
    gap: 6px
}

    #branding_carousel .green_bar .container .item p {
        font-family: Nunito Sans;
        font-size: 18px;
        font-weight: 700;
        line-height: 24.55px;
        text-align: left;
        color: #fff;
        margin: 0
    }

#branding_carousel .container .carousel {
    overflow: hidden;
    position: relative
}

    #branding_carousel .container .carousel .blur-left {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 50px;
        z-index: 10;
        background: linear-gradient(270deg,rgba(248,250,252,0) 0%,#fff 50%)
    }

@media(min-width:768px) and (max-width:991px) {
    #branding_carousel .container .carousel .blur-left {
        width: 50px
    }
}

@media(max-width:767px) {
    #branding_carousel .container .carousel .blur-left {
        width: 20px
    }
}

#branding_carousel .container .carousel .blur-right {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 50px;
    z-index: 10;
    background: linear-gradient(270deg,#fff 50%,rgba(248,250,252,0) 100%)
}

@media(min-width:768px) and (max-width:991px) {
    #branding_carousel .container .carousel .blur-right {
        width: 50px
    }
}

@media(max-width:767px) {
    #branding_carousel .container .carousel .blur-right {
        width: 20px
    }
}

#branding_carousel .container .carousel .carousel__images {
    animation: carousel-slider 55s linear infinite;
    display: flex;
    gap: 64px
}

section#youtube-video {
    display: flex;
    align-items: center;
    justify-content: center
}

    section#youtube-video .container {
        display: flex;
        align-items: center;
        justify-content: center
    }

    section#youtube-video .video-youtube {
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        height: 100%;
        width: 80%;
        overflow: hidden;
        aspect-ratio: 16/9;
        margin: 5rem 0 2rem;
        box-shadow: rgba(99,99,99,.5) 0 2px 8px 0;
        border-radius: 30px
    }

@media(max-width:767px) {
    section#youtube-video .video-youtube {
        width: 100%;
        margin: 2rem 0 3rem
    }
}

section#youtube-video .video-youtube::after {
    padding-top: 56.25%;
    display: block;
    content: ""
}

section#youtube-video .video-youtube img#play-video {
    width: 100%
}

section#youtube-video .video-youtube__button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%)
}

@media(max-width:767px) {
    section#youtube-video .video-youtube__button {
        width: 70px;
        height: 70px
    }
}

section#youtube-video .video-youtube iframe {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#infoBar {
    background-color: #0a1a38;
    padding: 8px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    gap: 8px
}

@media(max-width:767px) {
    #infoBar {
        flex-direction: column
    }
}

#infoBar p {
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    text-align: center;
    color: #fff;
    margin-bottom: 0
}

#infoBar a {
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    text-align: center;
    color: #ffc502;
    display: flex;
    transition: all .2s ease-in-out
}

    #infoBar a:hover {
        color: #1da44c
    }

.buttons {
    margin-top: 2rem;
    display: flex;
    gap: 24px
}

@media(max-width:767px) {
    .buttons {
        flex-direction: column;
        align-items: center;
        justify-content: center
    }
}