@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-Bold-web.ttf") format("ttf"), url("../fonts/BradescoSans-Bold.eot") format("eot"), url("../fonts/BradescoSans-Bold.woff") format("woff"), url("../fonts/BradescoSans-Bold.woff2") format("woff2");
    font-weight: bold;
    font-style: normal
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-BoldItalic-web.ttf") format("ttf"), url("../fonts/BradescoSans-BoldItalic.eot") format("eot"), url("../fonts/BradescoSans-BoldItalic.woff") format("woff"), url("../fonts/BradescoSans-BoldItalic.woff2") format("woff2");
    font-weight: bold;
    font-style: italic
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-Condensed-web.ttf") format("ttf"), url("../fonts/BradescoSans-Condensed.eot") format("eot"), url("../fonts/BradescoSans-Condensed.woff") format("woff"), url("../fonts/BradescoSans-Condensed.woff2") format("woff2");
    font-weight: 400;
    font-style: condensed
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-Italic-web.ttf") format("ttf"), url("../fonts/BradescoSans-Italic.eot") format("eot"), url("../fonts/BradescoSans-Italic.woff") format("woff"), url("../fonts/BradescoSans-Italic.woff2") format("woff2");
    font-weight: 400;
    font-style: italic
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-Light-web.ttf") format("ttf"), url("../fonts/BradescoSans-Light.eot") format("eot"), url("../fonts/BradescoSans-Light.woff") format("woff"), url("../fonts/BradescoSans-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-LightItalic-web.ttf") format("ttf"), url("../fonts/BradescoSans-LightItalic.eot") format("eot"), url("../fonts/BradescoSans-LightItalic.woff") format("woff"), url("../fonts/BradescoSans-LightItalic.woff2") format("woff2");
    font-weight: 300;
    font-style: italic
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-Medium-web.ttf") format("ttf"), url("../fonts/BradescoSans-Medium.eot") format("eot"), url("../fonts/BradescoSans-Medium.woff") format("woff"), url("../fonts/BradescoSans-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-MediumItalic-web.ttf") format("ttf"), url("../fonts/BradescoSans-MediumItalic-web.eot") format("eot"), url("../fonts/BradescoSans-MediumItalic-web.woff") format("woff"), url("../fonts/BradescoSans-MediumItalic-web.woff2") format("woff2");
    font-weight: 500;
    font-style: italic
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-Regular-web.ttf") format("ttf"), url("../fonts/BradescoSans-Regular.eot") format("eot"), url("../fonts/BradescoSans-Regular.woff") format("woff"), url("../fonts/BradescoSans-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-SemiBold-web.ttf") format("ttf"), url("../fonts/BradescoSans-SemiBold.eot") format("eot"), url("../fonts/BradescoSans-SemiBold.woff") format("woff"), url("../fonts/BradescoSans-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-SemiBoldItalic-web.ttf") format("ttf"), url("../fonts/BradescoSans-SemiBoldItalic.eot") format("eot"), url("../fonts/BradescoSans-SemiBoldItalic.woff") format("woff"), url("../fonts/BradescoSans-SemiBoldItalic.woff2") format("woff2");
    font-weight: 600;
    font-style: italic
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-Thin-web.ttf") format("ttf"), url("../fonts/BradescoSans-Thin.eot") format("eot"), url("../fonts/BradescoSans-Thin.woff") format("woff"), url("../fonts/BradescoSans-Thin.woff2") format("woff2");
    font-weight: 100;
    font-style: normal
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-ThinItalic-web.ttf") format("ttf"), url("../fonts/BradescoSans-ThinItalic.eot") format("eot"), url("../fonts/BradescoSans-ThinItalic.woff") format("woff"), url("../fonts/BradescoSans-ThinItalic.woff2") format("woff2");
    font-weight: 100;
    font-style: italic
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-XBold-web.ttf") format("ttf"), url("../fonts/BradescoSans-XBold.eot") format("eot"), url("../fonts/BradescoSans-XBold.woff") format("woff"), url("../fonts/BradescoSans-XBold.woff2") format("woff2");
    font-weight: 800;
    font-style: normal
}

@font-face {
    font-family: "Bradesco";
    src: url("../fonts/BradescoSans-XBoldItalic-web.ttf") format("ttf"), url("../fonts/BradescoSans-XBoldItalic.eot") format("eot"), url("../fonts/BradescoSans-XBoldItalic.woff") format("woff"), url("../fonts/BradescoSans-XBoldItalic.woff2") format("woff2");
    font-weight: 800;
    font-style: italic
}

body {
    font-family: Bradesco;
    background-color: #ffffff;
}

body.meu-cartao {
    margin-bottom: 35px;
}

html {
    scroll-behavior: smooth;
}

a {
    text-decoration: none;
}

.credit {
    background: #FFF !important;
}


/* HEADER-TOP*/
.header-top-bar {
    background: linear-gradient(270deg, #F56077 0%, #C20757 52%, #B41A83 100%);
    color: #FFFFFF;
    height: 43px;
    padding-top: 6px;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99999;
    width: 100%;
}

.header-top-bar .access-acount {
    color: #FFFFFF;
    font-size: 13px;
    text-transform: uppercase;
    float: left;
    width: 175px;
    padding-top: 4px;
}

.header-top-bar .access-acount img {
    width: 20px;
    margin-right: 8px;
    float: left;
}

.header-top-bar .access-acount span {
    margin-top: 2px;
    float: left;
}

.header-top-bar .access-acount span::after {
    content: "";
    height: 20px;
    width: 2px;
    position: absolute;
    background: #000;
    margin-left: 15px;
    opacity: 0.25;
}

.header-top-bar label {
    float: left;
    color: white;
    letter-spacing: 1.5px;
    font-size: 12px;
    font-weight: 700;
    margin-top: 6px;
    margin-right: 5px;
    margin-left: 10px;
}

.header-top-bar .form-control {
    float: left;
    height: 28px;
    padding: 0px;
    border-radius: 30px;
    border: 0px;
    margin-top: 1px;
}

.header-top-bar .form-control.agency {
    width: 55px;
}

.header-top-bar .form-control.account {
    width: 85px;
}

.header-top-bar .form-control.account {
    width: 85px;
}

.header-top-bar .form-control.digit {
    width: 28px;
    margin-left: 8px;
    margin-right: 10px;
}

.header-top-bar .form-control.cpf {
    width: 180px;
    font-size: 14px;
    margin-right: 10px;
    text-align: center;
}

.header-top-bar .form-control::placeholder {
    color: #000;
}

.header-top-bar .btn-confirm {
    float: left;
    background: #b41a83;
    border-radius: 3px;
    border: 0px;
    color: #fff;
    height: 28px;
    font-size: 12px;
    font-weight: 600;
}

.header-top-bar input.remember {
    float: left;
    margin-left: 15px;
    margin-top: 8px;
}

.header-top-bar .form-check-label {
    margin-left: 5px;
}

.header-top-bar .how-to-use {
    margin-left: 10px;
}

.header-top-bar .how-to-use::before {
    content: "";
    height: 20px;
    width: 1px;
    position: absolute;
    background: #000;
    margin-top: 5px;
    opacity: 0.25;
}

.header-top-bar .how-to-use a {
    padding-left: 20px;
    display: block;
    color: #ffffff;
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-decoration: none;
    line-height: 28px;
    padding-right: 14px;
    cursor: pointer;
}

.header-top-bar .how-to-use a::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    background: url('../images/icons/seta.png') 0px 0px no-repeat;
    width: 8px;
    height: 4px;
}

.header-top-bar .interrogation {
    margin: 0px 10px;
    height: 26px;
    width: 28px;
    height: 28px;
    display: table;
    background: url('../images/icons/icon-duvida-cpf.png') 0px 0px no-repeat;
}

.header-top-bar .accessibility {
    float: left;
    color: #fff;
    opacity: 0.8;
    font-size: 11px;
    text-transform: uppercase;
    margin-left: 5px;
}

.header-top-bar .accessibility span {
    padding-left: 12px;
    padding-right: 10px;
}

.header-top-bar .accessibility img {
    width: 32px;
}

.header-top-bar .accessibility::before {
    content: '';
    width: 1px;
    height: 20px;
    background: #7f7faf;
    position: absolute;
    display: block;
    margin-top: 4px;
}


/* MENU HEADER */
.menu-header {
    background-color: #fff;
    paddinG: 0px 0px 0px 0px;
    min-height: 75px;
    margin-top: 30px;
}

.menu-header .nav-link {
    padding-top: 14px;
    color: rgba(0, 0, 0, .55);
    opacity: 0.5;
    font-weight: 600;
}

.menu-header .link-my-card {
    min-width: 110px;
}

.menu-header .menu-item-active::after {
    content: url('/html/classic/produtos-servicos/cartoes/assets/images/details/03.png');
    position: absolute;
    top: 50px;
}

.menu-header .menu-active::after {
    content: url('/html/classic/produtos-servicos/cartoes/assets/images/details/03.png');
    position: absolute;
    top: 70px;
    margin-left: 8px;
}

.menu-header .menu-item-active>a::after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: middle;
    content: url('/html/classic/produtos-servicos/cartoes/assets/images/icons/next.png');
    transform: rotateZ(90deg);
    border: 0;
}

.menu-header .item-active {
    color: #E1173F;
    opacity: 1;
}

.menu-item-active .nav-link {
    color: #E1173F;
    opacity: 1;
}

.menu-header .credit-options {
    display: none;
}

.menu-header .credit-options .nav-link {
    min-width: auto;
}

.menu-header .credit-options::after {
    content: url('/html/classic/produtos-servicos/cartoes/assets/images/icons/next.png');
    transform: rotateZ(180deg);
    display: block;
    height: 20px;
    padding-bottom: 35px;
}

.menu-header .show-options {
    display: flex;
    animation-delay: 2s;
    min-width: 490px;
}

.menu-header .navbar-collapse.show {
    z-index: 200;
    background: #fff;
}

.menu-header .navbar-collapse {
    overflow-x: clip;
}

.menu-header .dropdown:hover .dropdown-content {
    display: block;
}

.menu-header .navbar-nav>li {
    padding-left: 15px;
    padding-right: 15px;
}

/* FOOTER */
.footer {
    background: transparent linear-gradient(90deg, #B41A83 0%, #B41A83 6%, #C20758 60%, #F36279 100%) 0% 0% no-repeat padding-box !important;
    color: white;
    text-align: center;
    padding-top: 20px;
}

.footer .follow {
    color: white;
}

.footer .follow .social-icons {
    text-align: left;
    float: left;
    margin-bottom: 20px;
}

.footer .follow .social-icons .title {
    margin-top: 10px;
    float: left;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
    margin-right: 10px;
}

.footer .follow .social-icons img {
    filter: none;
    width: 35px;
    border: 1px solid #ffffff;
    border-radius: 50%;
    padding: 6px;
    margin: 2px;
}

.footer .text p {
    text-align: left;
    font-size: 12px;
    opacity: 0.7;
    margin-left: 30px;
}

.footer .text a {
    color: white;
}

.footer .logo-bottom img {
    width: 145px;
    margin-top: 1rem;
    margin-bottom: 20px;
}

.footer hr {
    height: 2px;
    float: left;
    width: 100%;
    margin: 0.2rem 0;
}

.footer .links-bottom {
    margin: 10px;
}

.footer .links-bottom a {
    color: #fff;
    font-size: 12px;
    letter-spacing: 1px;
    font-weight: 300;
    border-right: 1px solid;
    margin-right: 5px;
    padding: 0 3px;
    opacity: 0.7;
}

.footer .links-bottom a:last-child {
    border: 0px;
}

.footer .follow .social-icons .icon-tiktok {
    padding: 0px;
}

.links-uteis {
    background: #ebebeb;
    align-items: center;
    padding: 0.625rem 0rem;
    position: relative;
    z-index: 3;
}

.links-uteis ul {
    margin-bottom: 0;
    padding-left: 0;
    list-style-type: none;
}

.links-uteis ul li {
    color: #3c3c3c;
    display: inline;
    font-weight: 700;
    padding-right: 25px;
    font-size: 12px;
}

.links-uteis ul li::after {
    content: '';
    border: solid #e5435f;
    border-width: 0 0.125rem 0.125rem 0;
    display: inline-block;
    padding: 3px;
    transform: rotate(45deg);
    cursor: pointer;
    top: -3px;
    left: 8px;
    position: relative;
}

/* BREADCRUMB */
.breadcrumb-top {
    padding: 10px 16px;
    list-style: none;
    z-index: 999;
    position: absolute;
    margin-top: 12px;
}

.breadcrumb-top li {
    display: inline;
    color: #eee;
    font-size: 14px;
}

.breadcrumb-top li a {
    color: rgba(255, 255, 255, .55);
    text-decoration: none;
}

.breadcrumb-top li+li:before {
    padding: 8px;
    color: rgba(255, 255, 255, .55);
    content: "\003E";
}

.banner .title {
    text-align: left;
    color: #fff;
    font-size: 30px;
    font-weight: 700;
    padding-top: 145px;
    max-width: 550px;
}

.banner .info {
    max-width: 165px;
    font-size: 11px;
    float: right;
    margin-top: 40px;
    color: #fff;
}

.banner .splide__pagination {
    left: auto;
    right: 50px;
    bottom: 100px;
}

.banner .carousel-indicators li:hover {
    background-color: #6e6e6e;
    transform: scale(1.5);
}

.banner .new-banner-carousel .img-desk {
    display: block !important;
}

.banner .new-banner-carousel .img-mob {
    display: none !important;
}

.banner .new-banner-carousel {
    margin-top: -1px;
    margin-bottom: -6px;
}

.banner .new-banner-carousel .c-dots {
    position: absolute;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 1rem 0;
    list-style-type: none;
    bottom: 100px;
    right: 60px;
}

.banner .new-banner-carousel .c-dots li {
    margin: 0 8px;
}

.banner .new-banner-carousel .c-dots li button {
    display: block;
    width: 0.5rem;
    height: 0.5rem;
    padding: 0;
    border: none;
    border-radius: 100%;
    background-color: #6e6e6e;
    text-indent: -9999px;
}

.banner .new-banner-carousel .c-dots li.slick-active button {
    border-color: #E1173F;
    animation: slider 8.5s linear infinite;
    animation-direction: unset;
    transform: rotate(45deg);
    transform: scale(2.5);
    -webkit-mask-image: radial-gradient(circle at 50%, transparent 33%, #fff calc(33% + 1px));
    mask-image: radial-gradient(circle at 50%, transparent 33%, #fff calc(33% + 1px));
    opacity: 1;
}

/* CAROUSEL FIND CARD */
.carousel-find-card .splide__list {
    margin-right: -10% !important;
}

.carousel-find-card .item-card {
    opacity: 0.65;
    margin-top: 172px;
}

.carousel-find-card .is-active>.item-card {
    opacity: 1;
    padding: 10px 0px;
}

.carousel-find-card .item-card-body {
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: 0.25rem;
    margin-top: -50px;
    text-align: center;
    padding: 20px;
    padding-top: 50px;
    box-shadow: 0 5px 4px 0 rgb(0 0 0 / 6%), 0 5px 16px 0 rgb(0 0 0 / 5%);
    min-height: 157px;
}

.carousel-find-card .item-card-body .title {
    margin-top: 15px;
    font-size: 16px;
    color: #47484C;
    font-weight: bold;
    margin-bottom: 20px;
}

.carousel-find-card .item-card .info-card {
    display: none;
}

.carousel-find-card .is-active>.item-card .item-card-content .item-card-body .info-card {
    display: block;
}

.carousel-find-card .is-active>.item-card {
    margin-top: 10px;
}

.carousel-find-card .item-card-body p {
    font-size: 12px;
    color: #555;
}

.carousel-find-card .item-card-body .btn {
    background: #E1173F 0% 0% no-repeat padding-box;
    border-radius: 24px;
    width: 100%;
    height: 42px;
    margin-top: 10px;
    letter-spacing: 0px;
    color: #FFFFFF;
    border: none;
    font-size: 14px;
    font-weight: 600;
}

.carousel-find-card .item-card-body .btn-more {
    background: #fff;
    border: 2px solid #E1173F;
    color: #E1173F;
    font-weight: 600;
}

.carousel-find-card .item-card-content img {
    padding: 10px;
    max-height: 165px;
    margin: 0 auto;
    display: block;
}

.carousel-find-card .is-active .item-card-content img {
    max-height: 100%;
    padding: 15px 20px;
}

.carousel-find-card .item-card {
    padding: 30px 0px 0px 15px;
    cursor: pointer;
}

.carousel-find-card .splide__track {
    padding-bottom: 50px;
}

.carousel-find-card .splide__pagination {
    display: none;
}

.carousel-find-card .splide__arrows {
    width: 350px;
}

.carousel-find-card .splide__arrows .splide__arrow--prev {
    right: 60px;
    left: auto;
    top: 100%;
}

.carousel-find-card .splide__arrows .splide__arrow--next {
    top: 100%;
}

.carousel-find-card .splide__arrow svg {
    fill: #E1173F;
    height: 28px;
    width: 28px;
    top: 10px;
    position: absolute;
    right: 12px;
}

.carousel-find-card .splide__arrows .splide__arrow--next svg {
    right: 0px;
}

.carousel-find-card .my-slider-progress {
    width: calc(50% - 120px);
    float: right;
    margin-right: 120px;
    height: 5px;
    border: 1px solid #E1173F;
    background: transparent;
}

.carousel-find-card .my-slider-progress-bar {
    background: #E1173F;
    height: 3px;
    transition: width 400ms ease;
    width: 0;
}

.carousel-find-card .splide__arrow {
    background: transparent;
    border: 1px solid #E1173F;
    height: 40px;
    width: 40px;
}

.cards-text {
    padding-right: 25px;
    padding-top: 50px;
}

.cards-text-margin {
    margin-bottom: -20px;
}

.cards-text p {
    font: normal normal bold 20px/57px Bradesco;
    color: #E1173F;
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-bottom: 20px;
    text-align: right;
}

.cards-text h3 {
    font: normal normal bold 45px/50px Bradesco;
    letter-spacing: 0px;
    color: #47484C;
    text-align: right;
    margin-bottom: 40px;
}

.cards-text-buttons {
    height: 60px;
    float: right;
}

.cards-text .cards-text-buttons .btn-left {
    background: #E1173F;
    border-radius: 24px;
    font-size: 14px;
    color: #FFFFFF;
    height: 48px;
    width: 210px;
    margin-left: 15px;
    border: 0px;
    font-weight: 600;
    float: left;
}

.cards-text .cards-text-buttons .btn-right {
    background: #fff;
    border-radius: 24px;
    font-size: 14px;
    color: #E1173F;
    border: 2px solid #E1173F;
    height: 48px;
    width: 180px;
    margin-left: 15px;
    font-weight: 600;
    float: right;
}


/* backgrounds */
.background-first {
    background-image: url('../images/backgrounds/01.png');
    background-image: -webkit-image-set(url('../images/backgrounds/01.webp') 1x);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
}

.background-second {
    background-image: url('../images/backgrounds/02.png');
    background-image: -webkit-image-set(url('../images/backgrounds/02.webp') 1x);
    background-repeat: no-repeat;
    background-position-y: 0;
    background-size: cover;
    margin-top: -2rem;
    background-position-x: center;
}


/* Vantagens */
.advantages .advantages-content {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 15px;
    padding: 40px 50px;
    max-width: 1140px;
    margin: 0 auto;
    margin-top: 2rem;
    z-index: 1;
    position: relative;
    min-height: 470px;
}

.advantages .title h3 {
    font-size: 20px;
    letter-spacing: 4px;
    color: #E22147;
    text-transform: uppercase;
    font-weight: 700;
    display: inline-block;
}

.advantages .title img {
    font-size: 20px;
    letter-spacing: 4px;
    color: #E22147;
    text-transform: uppercase;
}

.advantages h1 {
    font-size: 40px;
    color: #47484C;
    font-weight: 700;
    margin-bottom: 0px;
}

.advantages .title.mobile {
    display: none;
}

.advantages .advantages-cards {
    padding-top: 30px;
}

.advantages .advantages-cards .item {
    text-align: center;
    color: #6D6E71;
    border-radius: 24px;
    height: 155px;
    font-weight: 600;
    padding-top: 25px;
    padding-bottom: 30px;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 20px;
}

.advantages .advantages-cards h4 {
    margin-top: 15px;
    font-size: 14px;
}

.advantages .advantages-cards .item.selected,
.advantages .advantages-cards .item:hover {
    background: transparent linear-gradient(91deg, #CC092F 0%, #CC092F 53%, #B41A83 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0 4px 15px 0 #00000045;
    color: #FFFFFF;
    cursor: pointer;
}


/* image livelo */
.advantages .advantages-cards .item .image-livelo {
    background-image: url('../images/advantages/livelo.svg');
    width: 61px;
    height: 50px;
    margin: 0 auto;
    background-size: cover;
    background-repeat: no-repeat;
    display: block;
    margin-top: 25px;
    margin-top: 25px;
}

.advantages-cards .item.selected>.image-livelo,
.advantages-cards .item:hover>.image-livelo {
    background-image: url('../images/advantages/white/livelo.svg');
    background-repeat: no-repeat;
    margin-top: 23px;
    background-position-y: -8px;
}


/* image disney */
.advantages .advantages-cards .item .image-disney {
    background-image: url('../images/advantages/menu.svg');
    background-repeat: no-repeat;
    width: 61px;
    height: 50px;
    margin: 0 auto;
    display: block;
    margin-top: 25px;
    margin-left: 23px;
}

.advantages-cards .item.selected>.image-disney,
.advantages-cards .item:hover>.image-disney {
    background-image: url('../images/advantages/white/menu.svg');
    background-repeat: no-repeat;
    margin-left: 23px;
}

/* image cinemark   */
.advantages .advantages-cards .item .image-cinemark {
    background-image: url('../images/advantages/cinemark.svg');
    background-repeat: no-repeat;
    width: 61px;
    height: 42px;
    margin: 0 auto;
    display: block;
    margin-top: 25px;
}

.advantages-cards .item.selected>.image-cinemark,
.advantages-cards .item:hover>.image-cinemark {
    background-image: url('../images/advantages/white/cinemark.svg');
    margin-top: 25px;
}


/* image ofertas exclusivas */
.advantages .advantages-cards .item .image-ofertas-exclusivas {
    background-image: url('../images/advantages/ofertas-exclusivas.svg');
    width: 47.09px;
    height: 47.09px;
    margin: 0 auto;
    display: block;
}

.advantages-cards .item.selected>.image-ofertas-exclusivas,
.advantages-cards .item:hover>.image-ofertas-exclusivas {
    background-image: url('../images/advantages/white/ofertas-exclusivas.svg');
}


/* image veloe  */
.advantages .advantages-cards .item .image-veloe {
    background-image: url('../images/advantages/veloe.svg');
    width: 91px;
    height: 36px;
    margin: 0 auto;
    display: block;
    margin-top: 35px;
    background-size: contain;
    background-repeat: no-repeat;
}

.advantages-cards .item.selected>.image-veloe,
.advantages-cards .item:hover>.image-veloe {
    background-image: url('../images/advantages/white/veloe.svg');
}


/* image pagamento por aproximacao  */
.advantages .advantages-cards .item .image-pagamento-por-aproximacao {
    background-image: url('../images/advantages/contactclass.svg');
    width: 60px;
    height: 55px;
    margin: 0 auto;
    display: block;
    background-repeat: no-repeat;
}

.advantages-cards .item.selected>.image-pagamento-por-aproximacao,
.advantages-cards .item:hover>.image-pagamento-por-aproximacao {
    background-image: url('../images/advantages/white/contactclass.svg');
}

.advantages .advantages-cards .item .image-pagamento-por-aproximacao.credito {
    background-image: url('../images/advantages/pagamento-por-aproximacao.svg');
    width: 56.75px;
    height: 56.75px;
    margin: 0 auto;
    display: block;
    background-repeat: no-repeat;
}

.advantages-cards .item.selected>.image-pagamento-por-aproximacao.credito,
.advantages-cards .item:hover>.image-pagamento-por-aproximacao.credito {
    background-image: url('../images/advantages/white/pagamento-por-aproximacao.svg');
}


/* image carteiras digitais  */
.advantages .advantages-cards .item .image-carteiras-digitais {
    background-image: url('../images/advantages/pagamento-por-aproximacao.svg');
    width: 56.75px;
    height: 56.75px;
    margin: 0 auto;
    display: block;
}

.advantages-cards .item.selected>.image-carteiras-digitais,
.advantages-cards .item:hover>.image-carteiras-digitais {
    background-image: url('../images/advantages/white/pagamento-por-aproximacao.svg');
}


/* image cartao virtual  */
.advantages .advantages-cards .item .image-cartao-virtual {
    background-image: url('../images/advantages/cartao-virtual.svg');
    width: 64px;
    height: 44px;
    margin: 0 auto;
    display: block;
}

.advantages-cards .item.selected>.image-cartao-virtual,
.advantages-cards .item:hover>.image-cartao-virtual {
    background-image: url('../images/advantages/white/cartao-virtual.svg');
}


/* image app cartoes  */
.advantages .advantages-cards .item .image-app-cartoes {
    background-image: url('../images/advantages/app-cartoes.svg');
    width: 52.7px;
    height: 52.7px;
    margin: 0 auto;
    display: block;
}

.advantages-cards .item.selected>.image-app-cartoes,
.advantages-cards .item:hover>.image-app-cartoes {
    background-image: url('../images/advantages/white/app-cartoes.svg');
}


/* image internet  */
.advantages .advantages-cards .item .image-internet {
    background-image: url('../images/advantages/internet.svg');
    width: 51px;
    height: 51px;
    background-size: contain;
    margin: 0 auto;
    display: block;
}

.advantages-cards .item.selected>.image-internet,
.advantages-cards .item:hover>.image-internet {
    background-image: url('../images/advantages/white/internet.svg');
}


/* image aplicativo  */
.advantages .advantages-cards .item .image-aplicativo {
    background-image: url('../images/advantages/aplicativo.svg');
    width: 43px;
    height: 53px;
    margin: 0 auto;
    display: block;
    background-size: contain;
}

.advantages-cards .item.selected>.image-aplicativo,
.advantages-cards .item:hover>.image-aplicativo {
    background-image: url('../images/advantages/white/aplicativo.svg');
}

.item-advantages-selected {
    max-width: 363px;
    margin: 0 auto;
}

.item-advantages-selected img {
    margin-left: auto;
    width: 100%;
}

.item-advantages-selected img.center {
    margin: 0 auto;
    padding-right: 0;
}

.item-advantages-selected h2 {
    font-size: 32px;
    color: #47484C;
    font-weight: 700;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.item-advantages-selected p {
    margin-bottom: 20px;
}

.item-advantages-selected a {
    border: 2px solid #E1173F;
    border-radius: 30px;
    color: #E1173F;
    font-weight: 600;
    font-size: 14px;
    display: inline-block;
    min-width: 153px;
    text-align: center;
    height: 48px;
    line-height: 43px;
    padding-left: 47px;
    padding-right: 47px;
}

.item-advantages-selected a.btn-livelo {
    padding: 0;
    min-width: 170px;
    margin: 5px 0;
}

.item-advantages-selected a.btn-c-digital {
    padding: 0;
    min-width: 110px;
    margin: 5px 0;
}

.item-advantages-selected .link-download {
    border: 0px;
    color: #47484C;
    font-weight: 700;
    padding-left: 0px;
    padding-right: 20px;
    display: inline-block;
    min-width: 100px;
}

#livelo-advantage img {
    max-width: 200px;
    margin: 3rem 0;
}

#disney-advantage img {
    max-width: 70px;
    margin-right: auto;
    margin-bottom: 15px;
}

#cinemark-advantage img {
    max-width: 84px;
    margin-right: 60px;
    margin-bottom: 15px;
}

#ofertas-exclusivas-advantage img {
    max-width: 84px;
    margin-right: 60px;
    margin-bottom: 15px;
}

#veloe-advantage img {
    max-width: 130px;
    margin-right: 60px;
    margin-bottom: 15px;
}

#veloe-advantage p {
    padding-right: 12px;
}

#pagamento-por-aproximacao-advantage img {
    max-width: 98px;
    margin-right: 80px;
    margin-bottom: 15px;
}

#carteiras-digitais-advantage img {
    max-width: 98px;
    margin-right: 80px;
    margin-bottom: 15px;
}

#cartao-virtual-advantage img {
    margin-right: 80px;
    max-width: 109px;
    margin-bottom: 15px;
}

#app-cartoes-advantage img {
    margin-right: 60px;
    max-width: 89px;
    margin-bottom: 15px;
}

#internet-advantage img {
    margin-right: 80px;
    max-width: 80px;
    margin-bottom: 15px;
}

#aplicativo-advantage img {
    margin-right: 68px;
    max-width: 80px;
    margin-bottom: 15px;
}

/* PROMOTIONS */
.promotions {
    padding-top: 185px;
}

.promotions .container-fluid {
    padding: 0;
}

.promotions .title img {
    display: inline-block;
}

.promotions .title h3 {
    font-size: 20px;
    letter-spacing: 4px;
    color: #E1173F;
    text-transform: uppercase;
    display: inline-block;
    font-weight: 700;
    margin-bottom: 0px;
    margin-left: 10px;
}

.promotions .title h1 {
    color: #47484C;
    font-weight: 700;
    font-size: 45px;
}

.banner-promotions .splide {
    margin-bottom: 100px;
}

.banner-promotions .splide__slide {
    padding: 60px 20px;
}

.banner-promotions .splide__slide .slide-promotion {
    background-color: #ddd;
    background-size: cover;
    height: 410px;
    border-radius: 30px;
    box-shadow: inset 0px -230px 50px 0 rgba(0, 0, 0, 0.5);
    color: #fff;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
    padding: 0 30px;
    width: 700px;
    margin: 0 auto;
}

.banner-promotions .splide__slide.is-active {
    padding: 20px;
}

.banner-promotions .splide__slide .slide-promotion:hover {
    background-size: contain;
    box-shadow: inset 0px -475px 50px 0 rgba(0, 0, 0, 0.4);
    height: 450px;
}

.banner-promotions .splide__slide .slide-promotion.bg:hover {
    background-size: contain;
    box-shadow: inset 0px -475px 50px 0 rgba(0, 0, 0, 0.8);
    height: 450px;
}

.banner-promotions .splide__slide:hover>.slide-promotion {
    box-shadow: inset 0px -475px 50px 0 rgba(0, 0, 0, 0.7);
}

.banner-promotions .splide__slide .slide-promotion-0 {
    background-image: url('../images/promotions/card-diversao.jpg');
    /* background-image: -webkit-image-set( url('../images/promotions/card-diversao.webp') 1x); */
}

.banner-promotions .splide__slide .slide-promotion-1 {
    background-image: url('../images/promotions/01.jpg');
    /* background-image: -webkit-image-set( url('../images/promotions/01.webp') 1x); */
}

.banner-promotions .splide__slide .slide-promotion-1.credito {
    background-image: url('../images/promotions/01-credito.jpg');
    /* background-image: -webkit-image-set( url('../images/promotions/01-credito.webp') 1x); */
}

.banner-promotions .splide__slide .slide-promotion-3.credito {
    background-image: url('../images/promotions/03-credito.jpg');
    /* background-image: -webkit-image-set( url('../images/promotions/03-credito.webp') 1x); */
    background-size: cover;
}

.banner-promotions .splide__slide .slide-promotion-2 {
    background-image: url('../images/promotions/02.jpg');
    /* background-image: -webkit-image-set( url('../images/promotions/02.webp') 1x); */
}

.banner-promotions .splide__slide .slide-promotion-0:hover {
    background: transparent linear-gradient(90deg, #CC092F 0%, #B41A83 100%) 0% 0% no-repeat padding-box;
}

.banner-promotions .splide__slide .slide-promotion p {
    font-size: 40px;
    line-height: 20px;
}

.banner-promotions .splide__slide .slide-promotion b {
    display: block;
    font-weight: 700;
    margin-bottom: 20px;
    line-height: 50px;
}

.banner-promotions .splide__slide .slide-promotion span {
    font-size: 22px;
    font-weight: normal;
    line-height: normal;
    display: none;
    color: #fff !important;
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
}

.banner-promotions .splide__slide .slide-promotion:hover>p .text-info {
    display: block;
}

.banner-promotions .splide__arrow {
    background-color: #fff;
    border-radius: 4px;
    height: 60px;
    opacity: 0.8;
    top: calc(50% - 25px);
    width: 42px;
}

.banner-promotions .splide__arrow:hover {
    opacity: 1;
}

.banner-promotions .splide__arrow--prev {
    left: calc(22%);
}

.banner-promotions .splide__arrow--next {
    right: calc(22%);
}

.banner-promotions .splide__arrow svg {
    fill: #E1173F;
    height: 30px;
    width: 30px;
    position: absolute;
    left: 12px;
    top: 20px;
}

.banner-promotions .splide__arrow--prev svg {
    right: 12px;
    left: auto;
}

.banner-promotions .splide__pagination {
    display: none;
}

/* MY CARD */
.my-card {
    color: #fff;
}

.my-card .title {
    font-weight: 700;
    margin-top: 100px;
    margin-right: 50px;
}

.my-card .title .detail {
    width: 22px;
    height: 3px;
    background-color: #fff;
    float: left;
    margin-top: 10px;
    margin-right: 10px;
}

.my-card .title h3 {
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 4px;
}

.my-card .title h1 {
    font-size: 37px;
    font-weight: 700;
}

.my-card .my-card-content .buttons {
    padding: 20px 50px;
    margin-bottom: 35px;
    margin-top: 15px;
}

.my-card .my-card-content .buttons button {
    background-color: transparent;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 4px;
    height: 40px;
    border: 0px;
    font-size: 16px;
    font-weight: 700;
    color: #FFFFFF;
    margin-top: 20px;
    width: 180px;
    font-size: 14px;
    height: 60px;
    display: block;
    margin: 0 auto
}

.my-card .my-card-content .buttons button.active,
.my-card .my-card-content .buttons button:hover {
    background-color: #f22f55;
}

.my-card .my-card-content .buttons button img {
    width: 26px;
    margin-right: 10px;
}

.my-card .carousel-my-card .carousel-benefits,
.my-card .carousel-my-card .carousel-secure {
    display: none;
}

.my-card .carousel-my-card .carousel-benefits.selected,
.my-card .carousel-my-card .carousel-secure.selected {
    display: block;
}

.my-card .carousel-my-card .splide__slide {
    background-color: #f22f55;
    padding: 20px 30px 20px 30px;
}

.my-card .carousel-my-card .splide__slide h5 {
    margin-top: 20px;
    font-weight: 700;
    font-size: 24px;
    text-transform: uppercase;
    letter-spacing: 1.25px;
}

.my-card .carousel-my-card .splide__slide p {
    font-size: 14px;
    padding-right: 20px;
}

.my-card .carousel-my-card .splide__slide img {
    width: 72px;
    margin: 30px auto 0px auto;
    display: block;
}

.my-card .carousel-my-card .splide__slide button {
    max-width: 280px;
    font-weight: 700;
    color: #E1173F;
    background: #FFFFFF;
    border-radius: 25px;
    height: 44px;
    margin-top: 0px;
    margin-bottom: 20px;
    border: none;
    font-size: 14px;
    width: 100%;
}

.my-card .carousel-my-card .splide__slide button:hover {
    opacity: 1;
}

.my-card .carousel-my-card .splide__arrow {
    background-color: #fff;
    border-radius: 7px;
    height: 58px;
    width: 42px;
    opacity: 0.8;
}

.my-card .carousel-my-card .splide__arrow--prev {
    left: -20px;
}

.my-card .carousel-my-card .splide__arrow--next {
    right: -20px;
}

.my-card .carousel-my-card .splide__arrow:hover {
    opacity: 1;
}

.my-card .carousel-my-card .splide__arrow svg {
    fill: #E1173F;
    height: 30px;
    width: 30px;
    position: absolute;
    left: 13px;
    top: 20px;
}

.my-card .carousel-my-card .splide__arrow--prev svg {
    right: 14px;
    left: auto;
}

.my-card .carousel-my-card .splide__pagination {
    display: none;
}

.image-section-my-card {
    background-image: url('../images/backgrounds/big-woman.png');
    background-image: -webkit-image-set(url('../images/backgrounds/big-woman.webp') 1x);
    background-repeat: no-repeat;
    background-size: cover;
    height: 800px;
    margin: 0 auto;
    display: block;
    margin-top: -100px;
}

/* New My Card */
.my-card .meu-cartao-carousel .slick__slider {
    background-color: #F22F55;
    padding: 20px 30px;
    width: 575px;
    min-height: 255px;
    height: auto;
}

.my-card .meu-cartao-carousel .slick__slider img {
    width: 60px;
    margin: 30px auto 0px auto;
    display: block;
}

.my-card .meu-cartao-carousel .slick__slider h5 {
    margin-top: 20px;
    font-weight: 700;
    font-size: 24px;
    text-transform: uppercase;
    letter-spacing: 1.25px;
    color: #FFF;
}

.my-card .meu-cartao-carousel .slick__slider p {
    font-size: 14px;
    padding-right: 20px;
    color: #FFF;
}

.my-card .meu-cartao-carousel .slick__slider button {
    max-width: 280px;
    font-weight: 700;
    color: #E1173F;
    background: #FFFFFF;
    border-radius: 25px;
    height: 44px;
    margin-top: 0px;
    margin-bottom: 69px;
    border: none;
    font-size: 14px;
    width: 100%;
    margin-left: 29px;
}

.my-card #arrow__prev,
.my-card #arrow__next {
    position: absolute;
    z-index: 3;
    background-color: #fff;
    border: none;
    border-radius: 7px;
    height: 58px;
    width: 42px;
    opacity: 0.8;
    cursor: pointer;
    bottom: 145px;
}


.my-card #arrow__prev:hover,
.my-card #arrow__next:hover {
    opacity: 1;
}

.my-card #arrow__prev {
    background-image: url('../images/icons/svg/arrow-left.svg');
    background-repeat: no-repeat;
    background-position: center;
    left: -10px;
}

.my-card #arrow__next {
    background-image: url('../images/icons/svg/arrow-right.svg');
    background-repeat: no-repeat;
    background-position: center;
    right: 0;
}

.my-card .meu-cartao-carousel .dots-meu-cartao {
    opacity: 0;
    position: absolute;
    bottom: 15px;
    z-index: -1;
    display: flex;
}

/* SERVICES */
.services {
    background-color: #ffffff;
    padding: 40px;
    z-index: 998;
    position: relative;
    margin-bottom: 0px;
}

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

.services .title h3 {
    font: normal normal bold 20px/57px Bradesco;
    letter-spacing: 4px;
    color: #E1173F;
    text-transform: uppercase;
    margin-bottom: 0;
    display: inline-block;
    margin-right: 10px;
}

.services .title h1 {
    font-size: 40px;
    color: #47484C;
    margin-bottom: 60px;
    font-weight: 700;
}

.padding-item-service {
    padding-left: 30px;
    padding-right: 30px;
}

.services .btn-more {
    background: #E1173F;
    color: #FFFFFF;
    font-weight: 700;
    font-size: 15px;
    border: 0px;
    padding: 15px 60px;
    margin: 0 auto;
    display: block;
    border-radius: 30px;
    margin-top: 30px;
    margin-bottom: 20px;
}

.card-service {
    width: 100%;
    cursor: pointer;
    background: #FFFFFF;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 4px;
    height: 160px;
    margin-bottom: 30px;
}

.card-service .animation {
    width: 80px;
    position: relative;
    left: -25px;
    top: 35px;
    height: 1px;
}

.card-service:hover .animation {
    animation-name: slidein;
    animation-fill-mode: forwards;
    right: -25px;
    left: 0;
    width: calc(100% + 30px);
    top: 40px;
    transition: width 0.8s;
}

.card-service:hover .animation img.icon-arrow {
    height: 4.5rem;
    width: 4.5rem;
    padding: 1.6rem;
    transition: width 1s;
    transition: height 1s;
    transition-delay: .5s;
}

.card-service .animation img {
    background: transparent linear-gradient(90deg, #CC092F 0%, #B41A83 100%) 0% 0% no-repeat padding-box;
    height: 80px;
    width: 80px;
    border-radius: 17px;
    padding: 20px;
    margin-left: auto;
}

.card-service .animation .icon-arrow {
    display: none;
}

.card-service:hover .animation .icon {
    display: none;
}

.card-service:hover .animation .icon-arrow {
    display: block;
}

.services .card-service .text {
    padding-top: 30px;
    padding-left: 80px;
    padding-right: 30px;
}

.services .card-service:hover .text {
    padding-left: 25px;
}

.services .card-service:hover {
    margin-left: -10px;
    transition: margin 1s;
    transition-delay: .5s;
}

.services .card-service .text h2 {
    font-size: 18px;
    color: #505050;
    font-weight: 600;
}

.services .card-service:hover h2 {
    color: #E1173F;
}

.services .card-service .text p {
    font-size: 17px;
    color: #505050;
}

/* CUSTOM PAGE DEBIT */
.debit .background-first {
    background-repeat: no-repeat;
    background-position-y: -185px;
    background-position-x: left;
    background-size: contain;
}

.debit .background-second {
    background-size: 1550px;
    background-position-y: 0px;
}

.debit .my-card .title {
    margin-top: 60px;
    margin-left: 60px;
}

.facilities .item-advantages-selected {
    padding-top: 40px;
    padding-bottom: 30px;
}

.facilities .title {
    padding-bottom: 30px;
}

.facilities .advantages-cards .item {
    max-width: 130px;
    margin: 0 auto;
    display: block;
}

/* SECTION BENEFITS DEBIT */
.section-benefits {
    padding-top: 50px;
}

.section-benefits .title img {
    display: inline-block;
}

.section-benefits .title h3 {
    font-size: 20px;
    letter-spacing: 4px;
    color: #E1173F;
    text-transform: uppercase;
    text-align: right;
    font-weight: 700;
    margin-bottom: 0px;
    margin-left: 10px;
}

.section-benefits .title h1 {
    color: #47484C;
    font-weight: 700;
    font-size: 45px;
    text-align: right;
    margin-bottom: 40px;
}

.section-benefits .card-benefits {
    background-color: #fff;
    padding: 15px 20px;
    min-height: 255px;
    text-align: center;
    border-radius: 2px;
    box-shadow: -1px 0px 6px rgb(0 0 0 / 15%);
    margin: 0px;
    margin-bottom: 20px;
}

.section-benefits .card-benefits .image {
    height: 75px;
}

.section-benefits .card-benefits img {
    margin-top: 10px;
    margin-bottom: 30px;
    max-height: 70px;
}

.section-benefits .card-benefits p {
    font-size: 12px;
    padding: 0px 2.5px;
}

.section-benefits .card-benefits a {
    border: none;
    padding: 12px 35px;
    border-radius: 30px;
    font-weight: 600;
    font-size: 14px;
    display: inline-block;
    background: #E1173F;
    color: #fff;
    margin-top: 10px
}

.section-benefits .card-benefits img.image-disney {
    margin-bottom: 10px;
    margin-top: 0px;
}

.section-benefits .card-benefits img.image-cinemark {
    margin-top: 25px;
}

.cards-content .row {
    display: flex;
    justify-content: center;
}

.cards-content .row>div {
    padding-left: 7.5px;
    padding-right: 7.5px;
}

.page-my-card .footer {
    padding-bottom: 60px;
}


/* SECTION BANNER PAGE MY CARD */
.banner-my-card {
    background-image: url('../images/carousel/02.png');
    background-image: -webkit-image-set(url('../images/carousel/02.webp') 1x);
    position: relative;
    z-index: -1;
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: center;
    margin-top: -25px;
    width: 100%;
    height: 65vh;
}

.banner-my-card h3 {
    font-size: 60px;
    color: rgba(255, 255, 255, 1);
    font-weight: bold;
    margin-top: 15vh;
    max-width: 600px;
    line-height: 70px;
}

.banner-my-card h3 br {
    display: none;
}

/* SECTION SELECT CATEGORY */
.select-category-card-content {
    background: transparent linear-gradient(77deg, #CC092F 0%, #CC092F 61%, #b41a83 100%) 0% 0%;
    padding: 60px 140px;
    border-radius: 25px;
    margin-top: -10px;
    position: relative;
    color: #fff;
    top: -20px;
    z-index: 1;
}

.select-category-card h3 {
    font-weight: 700;
    font-size: 28px;
    margin-bottom: 45px;
}

.select-category-card .options-category {
    max-width: 600px;
    margin: 0 auto;
}

.select-category-card .option-credit,
.select-category-card .option-debit {
    background-color: #fff;
    border-radius: 20px 5px 5px 20px;
    color: #505050;
    width: 100%;
    height: 85px;
    max-width: 230px;
    opacity: 0.5;
    cursor: pointer;
}

.select-category-card .option-credit .icon,
.select-category-card .option-debit .icon {
    background: #E4E5E9;
    height: 85px;
    width: 85px;
    float: left;
    border-radius: 19px;
}

.select-category-card .option-credit.active,
.select-category-card .option-debit.active {
    opacity: 1;
}

.select-category-card .option-credit.active .icon,
.select-category-card .option-debit.active .icon {
    background: transparent linear-gradient(269deg, #CC092F 0%, #B41A83 100%) 0% 0% no-repeat padding-box;
}

.select-category-card .option-credit p,
.select-category-card .option-debit p {
    float: left;
    color: #505050;
    font-size: 22px;
    font-weight: 700;
    line-height: 83px;
    margin: 0;
    width: calc(100% - 85px);
    text-align: center;
}

.select-category-card .option-credit .icon {
    padding: 19px 23px;
}

.select-category-card .option-credit .icon img {
    width: 38px;
}

.select-category-card .option-debit .icon {
    padding: 28px 23px;
}

.select-category-card .option-debit .icon img {
    width: 38px;
}

/* SECTION SELECT FLAG */
.select-flag-card {
    background-image: url('../images/backgrounds/04.png');
    background-image: -webkit-image-set(url('../images/backgrounds/04.webp') 1x);
    padding-top: 75px;
    background-size: 500px;
    background-repeat: no-repeat;
    background-position-x: right;
}

.select-flag-card-content {
    padding: 0px 140px 0px 140px;
}

.select-flag-card h3 {
    font-weight: bold;
    font-size: 28px;
    color: #E1173F;
    margin-bottom: 40px;
}

.select-flag-card .options-select-flag-card {
    background: #fff;
    padding: 40px;
    border-radius: 40px;
    max-width: 800px;
    margin: 0 auto;
    margin-bottom: -75px;
    position: relative;
    z-index: 1;
    min-height: 156px;
}

.select-flag-card .options-select-flag-card .flags-content {
    margin: 0 auto;
}

.select-flag-card .options-select-flag-card .option-debit-selected {
    max-width: 400px;
}

.select-flag-card .options-select-flag-card .option-debit-selected .flag-amex {
    display: none;
}

.select-flag-card .options-select-flag-card .option-debit-selected .flag-mastercard {
    display: none;
}

.select-flag-card .options-select-flag-card img {
    margin: 0 auto;
    display: block;
    filter: grayscale(1);
    opacity: 0.6;
}

.select-flag-card .options-select-flag-card img:hover {
    filter: grayscale(0);
    opacity: 1;
}

.select-flag-card .options-select-flag-card .flag {
    cursor: pointer;
}

.select-flag-card .options-select-flag-card .flag {
    cursor: pointer;
    position: absolute;
}

.select-flag-card .flags-content.option-debit-selected .flag.flag-elo {
    margin-left: 200px;
}

.select-flag-card .options-select-flag-card .flag.active>img,
.select-flag-card .options-select-flag-card .flag:hover>img {
    filter: grayscale(0);
    opacity: 1;
}

.select-flag-card .options-select-flag-card .image-margin {
    margin-top: 15px;
}

/* SECTION SELECT CARD */
.select-card {
    background-image: url('../images/backgrounds/05.png');
    background-image: -webkit-image-set(url('../images/backgrounds/05.webp') 1x);
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: center;
    padding-top: 140px;
    color: #fff;
    padding-bottom: 120px;
    background: transparent linear-gradient(77deg, #CC092F 0%, #CC092F 61%, #b41a83 100%) 0% 0%;
    border-radius: 46px 46px 0 0;
}

.select-card .select-card-content {
    padding: 0px;
}

.select-card h3 {
    font-weight: 700;
    font-size: 28px;
    letter-spacing: 1px;
    padding-left: 140px;
}

.select-card .search {
    float: right;
    width: 260px;
    position: relative;
}

.select-card .search .field {
    float: right;
    width: 260px;
    border-bottom: 1px solid #ddd;
    height: 30px;
}

.select-card .search .field input {
    background: transparent;
    border: 0px;
    color: #fff;
    font-weight: 300;
    padding-bottom: 5px;
    width: calc(100% - 50px);
    font-size: 14px;
    height: 30px;
}

.select-card .search .field input::placeholder {
    color: #fff;
}

.select-card .search .field input:focus-visible,
.select-card .search .field input:focus-visible {
    outline: 0px;
}

.select-card .search-list {
    background: #fff;
    width: 100%;
    max-height: 320px;
    overflow-y: scroll;
    margin-top: -1px;
    color: #333;
    font-size: 15px;
    position: absolute;
    z-index: 3;
    top: 30px;
    box-shadow: 0px 1px 1px 2px #2424241a;
}

.select-card .search-list ul {
    list-style: none;
    padding: 0;
    margin-bottom: 0;
}

.select-card .search-list ul li {
    padding: 15px;
}

.select-card .search-list ul li.selected {
    background: #f1f1f1;
}

.select-card .search-list ul li:hover {
    background: rgb(0 0 0 / 7%);
}

.select-card .item-card {
    min-height: 250px;
    opacity: 0.8;
    cursor: pointer;
    text-align: center;
}

.select-card .item-card .image {
    padding: 0px 5px;
    padding-top: 40px;
}

.select-card .item-card:active .image,
.select-card .item-card:hover .image {
    padding-top: 15px;
    transition: padding 1s;
}

.select-card .item-card.active .image {
    padding-top: 15px;
    transition: padding 1s;
}

.select-card .item-card h2 {
    font-size: 15px;
    text-align: center;
    font-weight: 700;
}

.select-card .item-card h2 {
    font-size: 15px;
    text-align: center;
    font-weight: 700;
}

.select-card-carousel {
    display: none;
}

.select-card-carousel.active {
    display: block;
}

.select-card .select-card-carousel {
    padding-top: 30px;
}

.select-card .select-card-carousel .info {
    height: 40px;
    display: none;
    padding-top: 10px;
}

.select-card .item-card:active .info,
.select-card .item-card:hover .info {
    display: block;
}

.select-card .item-card.active .info {
    display: block;
}

.select-card .item-card:active,
.select-card .item-card:hover {
    opacity: 1;
}

.select-card .item-card.active {
    opacity: 1;
}

.select-card .select-card-carousel .splide__pagination {
    display: none;
}

.select-card .select-card-carousel .splide__arrows {
    width: 350px;
}

.select-card .select-card-carousel .splide__arrows .splide__arrow--prev {
    right: 60px;
    left: auto;
    top: 100%;
}

.select-card .select-card-carousel .splide__arrows .splide__arrow--next {
    top: 100%;
}

.select-card .select-card-carousel .splide__arrow svg {
    fill: #fff;
    height: 12px;
    width: 12px;
}

.select-card .select-card-carousel .my-slider-progress {
    width: calc(50% - 120px);
    float: right;
    margin-right: 120px;
    height: 5px;
    border: 1px solid #fff;
    background: transparent;
}

.select-card .select-card-carousel .my-slider-progress-bar {
    background: #fff;
    height: 3px;
    transition: width 400ms ease;
    width: 0;
}

.select-card .select-card-carousel .splide__arrow {
    background: transparent;
    border: 1px solid #fff;
}

.select-card-carousel-splide .splide__track {
    padding-bottom: 30px;
}

.select-cards-responsive {
    display: none;
}

.select-card .search .field .close {
    float: right;
}

.grafismo-mulher {
    background-repeat: no-repeat;
    margin-top: -22.6rem;
    margin-left: 60.9rem;
    margin-bottom: 2.2rem;
    float: right;
    position: relative;
}


/* SECTION HAVE CARD QUESTION */
.have-card-question {
    background: #cc092f;
    box-shadow: 0px -5px 20px rgba(0, 0, 0, 0.18);
    border-radius: 20px 20px 0px 0px;
    text-align: center;
    position: fixed;
    bottom: 0px;
    width: 100%;
    height: 50px;
    z-index: 1074;
    text-transform: uppercase;
}

.have-card-question h2 {
    color: #fff;
    font-size: 18px;
    padding-top: 13px;
}

.have-card-question a {
    color: #fff;
}


/* SECTION INFO MORE */
.info-more-card {
    background: #fff;
    border-radius: 40px 40px 0px 0px;
    margin-top: -40px;
    padding-top: 60px;
}

.info-more-card .tab-header ul {
    padding: 0px;
    display: flex;
    width: 100%;
    list-style: none;
    padding: 0px 100px;
    border-bottom: 1px solid #ddd;
}

.info-more-card .tab-header ul li {
    flex: 0 0 auto;
    width: 25%;
    border-bottom: 10px;
    text-align: center;
    padding-bottom: 10px;
    color: #666;
    cursor: pointer;
}

.info-more-card .tab-header ul li.active:after {
    content: "";
    background: transparent linear-gradient(74deg, #E1173F 80%, #B81D7C 98%, #bb116f 100%) 0% 0%;
    height: 5px;
    width: 80%;
    display: block;
    border-radius: 0px 0px 5px 5px;
    position: relative;
    top: 15px;
    margin: 0 auto;
}

.info-more-card .mosaic {
    padding-bottom: 100px;
    padding-left: 100px;
    padding-right: 100px;
    padding-top: 30px;
}

.info-more-card .mosaic .item-mosaic {
    background-size: cover;
    height: 235px;
    color: #fff;
    margin: 5px;
    width: calc(100% - 10px);
}

.info-more-card .mosaic .item-mosaic h2 {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 18px;
    padding-right: 50px;
}

.info-more-card .mosaic .item-mosaic p {
    text-transform: none;
    font-size: 13px;
}

.info-more-card .mosaic .item-mosaic .item-mosaic-content {
    padding: 20px;
}

.info-more-card .mosaic .item-mosaic button {
    background: transparent;
    color: #fff;
    text-transform: uppercase;
    border: 0px;
    border-bottom: 1px solid #ddd;
    font-size: 18px;
    font-weight: 600;
    margin: 0 auto;
    display: none;
}

.info-more-card .mosaic .item-mosaic .item-mosaic-text {
    margin-top: 140px;
}

.info-more-card .mosaic .item-mosaic .item-mosaic-content {
    background-color: rgb(0, 0, 0, 0.4);
    height: 235px;
    display: -ms-flexbox;
    display: flex;
    align-items: end;
}

.info-more-card .mosaic .item-mosaic:hover .item-mosaic-content {
    background: transparent linear-gradient(74deg, #e1173fc2 80%, #B81D7C 98%, #bb116f 100%) 0% 0%;
    justify-content: center;
}

.info-more-card .mosaic .item-mosaic:hover button {
    display: -ms-flexbox;
    display: grid;
}

.info-more-card .mosaic .item-mosaic:hover h2 {
    text-align: center;
    padding-right: 0;
}

.info-more-card .mosaic .item-mosaic:hover p {
    text-align: center;
}

.info-more-card .mosaic .item-mosaic:hover .item-mosaic-content {
    align-items: center;
    width: 100%;
}

.info-more-card .mosaic .item-mosaic:hover .item-mosaic-text {
    margin-top: 0px;
}

.info-more-card .mosaic .row>div {
    padding: 0;
}

.info-more-card .item-mosaic.large {
    margin-bottom: 10px;
}

.info-more-card .item-mosaic.large,
.info-more-card .item-mosaic.large .item-mosaic-content {
    height: 475px;
}

.info-more-card .item-mosaic.small {
    height: 232.5px;
    margin-bottom: 10px;
}

.info-more-card .item-mosaic.small .item-mosaic-content {
    height: 232.5px;
}

.info-more-card .tab-content {
    display: none;
}

.info-more-card .tab-content.active {
    display: block;
}

.info-more-card .tab-content .search {
    padding-bottom: 20px;
    padding-top: 20px;
}

.info-more-card .tab-content .search h5 {
    text-align: right;
    font-size: 15px;
    line-height: 20px;
    margin-top: 5px;
    padding-right: 20px;
    color: #5e5e5e;
}

.info-more-card .tab-content .search .field {
    border-bottom: none;
    width: calc(100% - 10px);
    position: relative;
}

.info-more-card .search-list {
    background: #fff;
    width: 250px;
    margin-top: 7px !important;
    color: #333;
    font-size: 15px;
    z-index: 10;
    border-radius: 40px;
    height: 35px;
    padding-left: 9px;
}

.info-more-card .search-list ul {
    list-style: none;
    padding: 0;
    margin-bottom: 0;
}

.info-more-card .search-list ul li {
    padding: 15px;
}

.info-more-card .search-list ul li.selected {
    background: #f1f1f1;
}

.info-more-card .tab-content .search .field input {
    background: transparent;
    color: #555;
    font-weight: 300;
    padding-bottom: 5px;
    width: calc(100% - 30px);
    font-size: 14px;
    height: 30px;
    border: 0px;
}

.info-more-card .tab-content .search .field input:focus-visible {
    outline: 0px;
}

.info-more-card .content-annuity {
    color: #333;
    padding: 50px 0px 60px 0px;
}

.info-more-card .content-annuity h2 {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 10px;
}

.info-more-card .content-annuity h3 {
    font-size: 18px;
    font-weight: 600;
    margin-top: 30px;
}

.info-more-card .content-annuity h4 {
    font-size: 18px;
    margin: 40px 0px;
}

.info-more-card .content-annuity p {
    margin-bottom: 5px;
}

.info-more-card .content-annuity .box {
    margin-left: 35px;
}

.info-more-card .link {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.info-more-card .link a {
    margin-bottom: 30px;
    font-size: 12px;
}

.info-more-card .link a {
    text-decoration: underline;
    line-height: 20px;
}

.info-more-card .link p {
    font-size: 12px;
}

.info-more-card .link img {
    width: 32px;
    margin-left: 8px;
    float: left;
    margin-right: 10px;
    margin-top: 10px;
}

.info-more-card .link>div {
    float: left;
}

.info-more-card .image {
    margin-bottom: 10px;
}

.page-my-card .nao-correntista {
    display: flex !important;
}


/* MODAL DESBLOQUEIO */
.link-modal {
    cursor: pointer;
}

.modal-unlock {
    background: rgba(98, 28, 39, 0.64);
    z-index: 9999999;
    opacity: 1 !important;
}

.modal-unlock .modal-dialog {
    margin-top: 25vh;
}

.modal-unlock .modal-content {
    border: 0px;
    border-radius: 2px;
    text-align: center;
}

.modal-unlock .close {
    width: 15px;
    height: 25px;
    position: absolute;
    right: 20px;
    top: 15px;
    z-index: 9999;
    background-image: none;
    opacity: 1;
    padding: 0;
}

.modal-unlock .close:focus {
    box-shadow: none;
}

.modal-unlock .close img {
    width: 15px;
}

.modal-unlock .icon {
    max-width: 50px;
    margin: 50px auto 30px auto;
    display: block;
}

.modal-unlock h2 {
    font-size: 20px;
    margin: 10px 0px;
}

.modal-unlock p {
    padding: 15px 40px;
}

.dropdown-active {
    display: block;
}

.slide-1-ajuste {
    font-size: 29px;
}

@keyframes slider {
    20% {
        transform: rotate(45deg);
        transform: scale(3);
        background-image: linear-gradient(to right, transparent 100%, #E1173F 0);
    }

    40% {
        transform: rotate(90deg);
        transform: scale(3);
        background-image: linear-gradient(to right, transparent 75%, #E1173F 0);
    }

    60% {
        transform: rotate(90deg);
        transform: scale(3);
        background-image: linear-gradient(to right, transparent 50%, #E1173F 0);
    }

    80% {
        transform: rotate(90deg);
        transform: scale(3);
        background-image: linear-gradient(to right, transparent 25%, #E1173F 0);
    }

    100% {
        transform: rotate(90deg);
        transform: scale(3);
        background-image: linear-gradient(to top, transparent 0%, #E1173F 0);
    }
}

@media (max-width: 1600px) {
    .footer .container {
        max-width: 1250px;
    }

    .links-uteis .container {
        max-width: 1250px;
    }
}

@media screen and (min-width: 1500px) and (max-width: 1700px) {
    .grafismo-mulher {
        margin-top: -22.6rem !important;
    }

    .services {
        margin-top: 0rem;
    }
}

@media screen and (min-width: 1700px) {

    .my-card #arrow__prev,
    .my-card #arrow__next {
        bottom: 365px;
    }

    .image-section-my-card {
        height: 898px;
        margin-left: 70px;
        margin-top: -25px;
    }

    .grafismo-mulher {
        margin-top: -25.6rem;
        width: auto;
    }

    .services {
        margin-top: -3rem;
    }
}

@media (max-width: 1450px) {
    .banner-promotions .splide__slide .slide-promotion {
        width: 600px;
        height: 350px;
    }

    .banner-promotions .splide__slide .slide-promotion:hover {
        height: 400px;
        background-size: contain;
    }
}

@media (min-width: 1400px) {
    .menu-header .container {
        max-width: 1360px;
    }
}

@media (max-width: 1400px) {
    .header-top-bar .container {
        max-width: 1280px;
    }

    .banner-my-card h3 {
        font-size: 55px;
        max-width: 590px;
    }
}

@media (max-width: 1366px) {
    .carousel-find-card .is-active>.item-card {
        margin-top: 25px;
    }
}

@media (max-width: 1280px) {
    .header-top-bar .accessibility {
        display: none;
    }

    .header-top-bar .container {
        max-width: 1140px;
    }
}

@media (max-width: 1250px) {
    .banner-promotions .splide__slide .slide-promotion {
        width: 500px;
        height: 290px;
    }

    .banner-promotions .splide__slide .slide-promotion:hover {
        height: 320px;
    }

    .banner-promotions .splide__slide .slide-promotion p {
        font-size: 30px;
        line-height: 15px;
    }
}

@media (max-width: 1200px) {
    .footer .links-bottom a {
        border: 0px;
        display: block;
        margin-bottom: 15px;
    }

    .footer .follow .social-icons .title {
        float: none;
        text-align: center;
    }

    .footer .follow .social-icons {
        float: none;
        max-width: 260px;
        margin-left: auto;
        margin-right: auto;
    }

    .footer .text p {
        text-align: center;
        margin-top: 10px;
        margin-left: 0px;
    }

    .links-uteis ul li {
        border-bottom: 0.0625rem solid #999;
        display: block;
        padding: 8px 0px;
    }

    .links-uteis ul li::after {
        float: right;
        margin-top: 8px;
        left: 0;
    }

    .banner .title {
        font-size: 52px;
        padding-top: 125px;
    }

    .carousel-find-card .splide__track {
        min-width: 100%;
    }

    .carousel-find-card .item-card-body {
        min-height: auto;
    }

    .advantages .advantages-cards .item {
        padding-left: 0;
        padding-right: 0;
    }

    .advantages .advantages-cards .item>div {
        transform: rotate(0deg);
        transform: scale(0.8);
    }

    .advantages .advantages-cards .item .image-veloe {
        transform: rotate(0deg);
        transform: scale(0.6);
    }

    .advantages .advantages-cards h4 {
        font-size: 12px;
        padding: 0px 5px;
    }


    .my-card #arrow__prev,
    .my-card #arrow__next {
        bottom: 150px;
    }

    .services {
        padding: 40px 0px;
    }

    .services-background {
        background-color: #e7e7e7;
    }

    .services .card-service .text h2 {
        font-size: 16px;
    }

    .services .card-service .text {
        padding-left: 75px;
        padding-right: 20px
    }

    .services .card-service .text p {
        font-size: 14px;
    }

    .services .btn-more {
        margin-top: 10px;
        margin-bottom: 0px;
    }

    .info-more-card .tab-header ul {
        padding: 0px;
    }

    .info-more-card .mosaic {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (max-width: 1140px) {
    .how-to-use {
        display: none;
    }

    .header-top-bar .container {
        max-width: 1000px;
    }
}

@media (max-width: 1100px) {
    .banner-promotions .splide__slide .slide-promotion:hover {
        height: 300px;
    }

    .banner-promotions .splide__slide .slide-promotion p {
        font-size: 25px;
    }
}

@media (max-width: 992px) {
    .header-top-bar .access-acount {
        display: none;
    }

    .header-top-bar .container {
        max-width: 830px;
    }

    .breadcrumb-top {
        top: 135px;
        padding: 5px;
    }

    .banner {
        margin-top: 126px;
    }

    .banner .title {
        font-size: 40px;
        padding-top: 100px;
        line-height: 45px;
    }

    .banner .info {
        max-width: 300px;
        float: left;
        margin-top: 0px;
    }

    .banner .splide__pagination {
        bottom: 50px;
    }

    .carousel-find-card .splide__list {
        margin-right: 0% !important;
    }

    .carousel-find-card .splide__track {
        min-width: 100%;
    }

    .background-second {
        background-image: url('../images/backgrounds/03.png');
        background-image: -webkit-image-set(url('../images/backgrounds/03.webp') 1x);
        background-position-y: 200px;
    }

    .item-advantages-selected {
        border-top: 1px solid #ddd;
        padding-top: 50px;
        max-width: 100%;
        margin-top: 20px;
    }

    .banner-promotions .splide__arrow--prev {
        left: calc(15%);
    }

    .banner-promotions .splide__arrow--next {
        right: calc(15%);
    }

    .image-section-my-card {
        display: none;
    }

    .my-card {
        padding-bottom: 40px;
    }

    .services {
        margin-top: 0px;
    }

    .debit .background-second {
        background-image: url('../images/backgrounds/02.png');
        background-image: -webkit-image-set(url('../images/backgrounds/02.webp') 1x);
        background-position-y: 0px;
        background-size: 1300px;
    }

    .debit .my-card .title {
        margin-top: 0px;
        margin-left: 0px;
    }

    .banner-my-card {
        margin-top: 110px;
        height: 350px;
        background-position-y: center;
    }

    .banner-my-card h3 {
        font-size: 44px;
        color: rgba(255, 255, 255, 1);
        font-weight: bold;
        max-width: 405px;
        line-height: normal;
    }

    .select-flag-card-content {
        padding: 0;
    }

    .select-card .select-card-content {
        padding: 0 40px;
    }

    .select-card h3 {
        padding-left: 0px;
    }

    .info-more-card .tab-header ul li {
        font-size: 13px;
    }
}

@media (max-width: 991px) {
    .menu-header {
        position: fixed;
        left: 0;
        z-index: 99999;
        width: 100%;
        top: 40px;
        margin: 0;
    }

    .menu-header .navbar-nav {
        align-items: center;
    }

    .menu-header .nav-link {
        color: #E1173F;
        text-transform: uppercase;
        opacity: 1;
    }

    .menu-header .menu-item-active::after,
    .menu-header .credit-options::after {
        display: none;
    }

    .menu-header .nav-item {
        text-align: center;
        font-size: 18px;
        margin-bottom: 15px;
    }

    .menu-header .menu-item-active a::after {
        display: inline-block;
        margin-left: 0.255em;
        vertical-align: 0.255em;
        content: "";
        border-top: 0.3em solid;
        border-right: 0.3em solid transparent;
        border-bottom: 0;
        border-left: 0.3em solid transparent;
        transform: rotateZ(0deg);
    }

    .menu-header .menu-item-active a.dropdown-item::after {
        display: none;
    }

    .menu-header .navbar-collapse {
        height: 100% !important;
    }

    .menu-header .menu-active::after {
        display: none;
    }

    .menu-header a.dropdown-item {
        color: #E1173F;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 1.6px;
        padding: 0.7 rem 1rem;
    }

    .dropdown-item.active,
    .dropdown-item:active {
        background-color: #FFF;
    }

    .menu-header .dropdown-menu {
        text-align: center;
        border: none;
        background: none;
    }

    .menu-header .show-options {
        min-width: auto;
    }

    .navbar-toggler:focus {
        box-shadow: none;
    }


    .my-card #arrow__prev,
    .my-card #arrow__next {
        bottom: 80px;
    }
}

@media (max-width: 830px) {
    .header-top-bar .form-check-label {
        display: none;
    }

    .header-top-bar .container {
        max-width: 730px;
    }
}

@media (max-width: 768px) {

    .header-top-bar input.remember,
    .header-top-bar .form-control.cpf,
    .header-top-bar .label-cpf,
    .header-top-bar .btn-right,
    .header-top-bar .interrogation {
        display: none;
    }

    .header-top-bar .container {
        max-width: 720px;
    }

    .slide-1-ajuste {
        font-size: 16px;
    }

    div#topBar.headertopBar {
        background: #fff;
    }

    div#topBar.headertopBar div.holderMobile>span {
        color: #fff !important;
        font-weight: 600;
    }

    div#topBar.headertopBar div.holderMobile a.baixe {
        background: #cc092f;
        border-color: #cc092f;
        color: #fff;
    }

}

@media (max-height: 700px) {
    .banner .title {
        padding-top: 110px;
    }
}

@media (max-width: 769px) {
    .carousel-cards {
        height: 620px;
    }

    .carousel-cards .item-card-body .title {
        margin: 0px;
    }

    .carousel-cards .item-card-body p {
        margin-bottom: 5px;
    }

    .cards-text {
        padding-right: 0px;
    }

    .cards-text-margin {
        margin-bottom: 0px;
    }

    .carousel-find-card .item-card-content img {
        margin: 0 auto;
        display: block;
    }

    .background-first {
        background-image: url('../images/backgrounds/02.png');
        background-image: -webkit-image-set(url('../images/backgrounds/02.webp') 1x);
        background-position-y: -100px;
    }

    .advantages .title {
        display: none;
    }

    .advantages .title.mobile {
        display: block;
        padding-top: 40px;
        padding-bottom: 40px;
        margin-bottom: 20px;
    }

    .advantages .advantages-cards {
        padding-right: 0px;
    }

    .advantages .advantages-content {
        padding: 20px;
    }

    .advantages .advantages-cards .item {
        padding: 15px 0px;
        height: 120px;
        border-radius: 15px;
    }

    .advantages .advantages-cards h4 {
        margin-top: 5px;
        font-size: 11px;
        word-break: break-word;
    }

    .advantages .advantages-content .item-advantages-selected {
        padding: 30px 20px 20px 20px;
    }

    .banner-promotions .splide__arrow--prev {
        left: 0;
    }

    .banner-promotions .splide__arrow--next {
        right: 0;
    }

    .banner-promotions .splide {
        margin-bottom: 30px;
    }

    .carousel-my-card {
        padding: 0px 30px;
    }

    .my-card .title h1 {
        font-size: 28px;
    }

    .my-card .title {
        padding-left: 15px;
    }

    .debit .background-first {
        background-position-y: 0;
        background-position-x: left;
        background-image: url('../images/backgrounds/02-mobile.png');
        background-image: -webkit-image-set(url('../images/backgrounds/02-mobile.webp') 1x);
    }
}

@media (max-height: 650px) {
    .banner .title {
        font-size: 52px;
        padding-top: 105px;
        line-height: 60px;
        max-width: 500px;
    }

    .banner .splide__pagination {
        bottom: 70px;
    }
}

@media (max-height: 600px) {
    .banner .title {
        font-size: 52px;
        padding-top: 90px;
        line-height: 53px;
    }

    .banner .splide__pagination {
        bottom: 60px;
    }

    .banner-my-card h3 {
        font-size: 50px;
        margin-top: 40px;
        max-width: 550px;
    }
}

@media (max-width: 600px) {
    .background-first {
        background-position-y: 200px;
    }
}

@media (max-width: 578px) {
    .header-top-bar label {
        font-size: 10px;
        margin-left: 0px;
        margin-right: 2px;
    }

    .header-top-bar .form-control {
        margin-right: 5px;
    }

    .header-top-bar .form-control.digit {
        margin-left: 0px;
    }

    .header-top-bar .form-control.account {
        width: 60px;
    }
}

@media (max-width: 576px) {
    body.meu-cartao {
        margin-bottom: 0;
    }

    .breadcrumb-top {
        display: none;
    }

    .banner .new-banner-carousel .img-desk {
        display: none !important;
    }

    .banner .new-banner-carousel .img-mob {
        display: block !important;
    }

    .banner .new-banner-carousel {
        margin-top: 0;
        margin-bottom: 172px;
    }

    .banner .new-banner-carousel .c-dots {
        bottom: 20px;
        right: 15px;
    }

    .banner .title {
        font-size: 30px;
        padding-top: 140px;
        line-height: 40px;
        max-width: 280px;
        margin-bottom: 5px;
        padding-left: 15px;
    }

    .banner .splide__pagination {
        bottom: 225px;
        right: 0;
    }

    .banner .info {
        max-width: 230px;
        font-size: 9px;
        padding-left: 15px;
    }


    .carousel-cards {
        height: 560px;
        padding-top: 20px;
    }

    .carousel-cards .slide-card {
        padding: 0px 40px;
    }

    .cards-text p,
    .cards-text h3 {
        text-align: left;
    }

    .cards-text p {
        margin-bottom: 0px;
        font-size: 18px;
        max-width: 200px;
        line-height: 25px;
    }

    .cards-text h3 {
        font-size: 32px;
        line-height: normal;
    }

    .cards-text .cards-text-buttons .btn-right,
    .cards-text .cards-text-buttons .btn-left {
        width: 100%;
        margin: 0;
        margin-bottom: 15px;
    }

    .cards-text-buttons {
        float: none;
    }

    .carousel-find-card .item-card .info-card {
        display: block !important;
    }

    .carousel-find-card .item-card {
        margin-top: 0px;
    }

    .carousel-find-card .my-slider-progress {
        width: calc(100% - 135px);
    }

    .carousel-find-card .splide__track {
        padding-bottom: 30px;
    }

    .cards-text h3 br {
        display: none;
    }

    .carousel-find-card .item-card-content img {
        padding: 10px 20px;
    }

    .carousel-find-card .item-card-body {
        padding-bottom: 40px;
    }

    .carousel-find-card .item-card-body .title br {
        display: none;
    }

    .carousel-find-card .item-card-body p {
        font-size: 14px;
    }

    .carousel-find-card .item-card-body .btn {
        height: 50px;
    }


    .background-first,
    .background-second {
        background-color: #fff;
    }

    .background-second {
        background-position-y: 300px;
    }

    .background-first {
        padding: 0px 10px;
    }

    .advantages .advantages-content {
        padding: 5px;
    }

    .advantages .advantages-cards .item>div {
        transform: rotate(0deg);
        transform: scale(0.5);
    }

    .advantages .advantages-cards .item .image-livelo {
        margin-top: 10px;
    }

    .advantages .advantages-cards .item .image-cinemark {
        margin-top: 10px;
    }

    .advantages .advantages-cards .item .image-veloe {
        width: 50px;
        height: 20px;
        background-size: contain;
        background-repeat: no-repeat;
        margin-top: 28px;
    }

    .advantages .advantages-cards .item .image-disney {
        width: 50px;
        height: 28px;
        background-size: contain;
        transform: scale(1);
        background-repeat: no-repeat;
        margin-top: 21px;
        margin-bottom: 5px;
    }

    .advantages .advantages-cards .item .image-ofertas-exclusivas {
        width: 56.75px;
        margin: 0 auto;
        display: block;
        background-repeat: no-repeat;
        margin-top: 5px;
    }

    .advantages .advantages-cards .col-3:nth-child(6n)>.item h4 {
        font-size: 8px;
    }

    .advantages .advantages-cards h4 {
        margin-top: 0px;
        font-size: 8px;
        padding: 0px;
    }

    .advantages h1 {
        font-size: 30px;
    }

    .advantages .advantages-cards {
        padding-top: 0px;
    }

    .advantages .advantages-cards .item {
        padding: 5px 0px;
        height: 80px;
        margin-bottom: 5px;
    }

    .advantages .advantages-cards .item .image-pagamento-por-aproximacao {
        margin-bottom: -5px;
    }

    .advantages .advantages-cards .item .image-carteiras-digitais {
        margin-bottom: -5px
    }

    .item-advantages-selected img.center {
        margin-right: 0px;
    }

    .item-advantages-selected p {
        text-align: center;
    }

    .item-advantages-selected a {
        margin-left: auto;
        margin-right: auto;
        display: block;
        width: 100%;
        margin-bottom: 20px;
    }

    .item-advantages-selected a.btn-livelo,
    .item-advantages-selected a.btn-c-digital {
        margin: 5px auto;
    }

    .item-advantages-selected img {
        margin-right: 0px !important;
    }

    .item-advantages-selected .link-download {
        width: 100%;
    }

    .item-advantages-selected h2 {
        max-width: 270px;
    }

    .banner-promotions .splide__slide.is-active>.slide-promotion {
        height: 300px;
    }

    .banner-promotions .splide__slide {
        background-position-x: center;
    }

    .banner-promotions .splide__slide .slide-promotion-1,
    .banner-promotions .splide__slide .slide-promotion-2 {
        background-size: 100% auto;
        background-position: center;
        background-repeat: no-repeat;
    }

    .banner-promotions .splide__arrow {
        height: 40px;
        opacity: 1;
        top: calc(50% - 15px);
        width: 40px;
    }

    .promotions .title h1 {
        font-size: 32px;
        margin-bottom: 20px;
    }

    .promotions .banner-promotions .splide__slide {
        padding: 20px;
    }

    .promotions {
        padding-top: 110px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .promotions .title img {
        display: none;
    }

    .promotions .title h3::after {
        content: "";
        display: inline-block;
        width: 27px;
        height: 3px;
        background-image: url('../images/details/01.png');
        background-image: -webkit-image-set(url('../images/details/01.webp') 1x);
        background-size: contain;
        margin-top: 10px;
        float: right;
        margin-left: 5px;
    }

    .promotions .title h3 {
        margin-left: 0px;
    }

    .banner-promotions .splide__slide .slide-promotion p {
        font-size: 22px;
        line-height: normal;
    }

    .banner-promotions .splide__arrow svg {
        top: 11px;
    }

    .banner-promotions .splide__slide .slide-promotion span {
        display: block;
    }

    .banner-promotions .splide__slide .slide-promotion {
        height: 205px;
        width: 350px;
    }

    .banner-promotions .splide__slide .slide-promotion p {
        font-size: 20px;
    }

    .banner-promotions .splide__slide .slide-promotion span {
        font-size: 15px;
    }

    .banner-promotions .splide__slide .slide-promotion:hover {
        height: 205px;
    }

    .my-card .carousel-my-card .splide__slide button {
        max-width: 100%;
        margin-top: 15px;
        margin-bottom: 0px;
    }

    .my-card .carousel-my-card .splide__slide {
        padding: 20px;
    }

    .my-card .carousel-my-card .splide__arrow {
        border-radius: 10px;
        height: 40px;
        width: 40px;
        opacity: 1;
    }

    .my-card .my-card-content .buttons button {
        width: 100%;
    }

    .my-card .my-card-content .buttons {
        display: none;
    }

    .my-card .title h1 {
        margin-bottom: 35px;
        max-width: 260px;
    }

    .my-card .title h1 br {
        display: none;
    }

    .carousel-my-card {
        padding: 0px 15px;
    }

    .my-card .carousel-my-card .splide__arrow svg {
        top: 11px;
    }

    .my-card .carousel-my-card .splide__slide img {
        width: 60px;
    }

    .grafismo-mulher {
        display: none;
    }

    .services .card-service .text {
        text-align: right;
    }

    .services .card-service:hover>.text {
        text-align: left;
    }

    .services .title h1 br {
        display: none;
    }

    .services .title h1 {
        max-width: 300px;
    }

    .card-service {
        height: 145px;
    }

    .card-service:hover .animation {
        top: 30px;
    }

    .card-service .animation {
        top: 30px;
    }

    .services .card-service .text p {
        font-size: 14px;
        line-height: 18px;
        padding-left: 75px;
        width: 100%;
    }

    .services .btn-more {
        margin-bottom: 20px;
    }

    .debit .background-first {
        background-position-y: 100px;
        background-position-x: left;
        background-size: contain;
    }

    .debit .promotions {
        padding-top: 70px;
    }

    .facilities {
        padding-top: 70px;
    }

    .facilities .advantages h1 {
        max-width: 300px;
    }

    .facilities .advantages-cards {
        padding: 20px 10px 10px 15px;
    }

    .facilities .advantages-cards .item {
        max-width: 75px;
    }

    .facilities .advantages-cards .col-3 {
        padding: 0;
    }

    .facilities #pagamento-por-aproximacao-advantage img {
        margin-bottom: 15px;
        max-width: 80px;
    }

    .facilities #carteiras-digitais-advantage img {
        margin-bottom: 15px;
        max-width: 80px;
    }

    .facilities #internet-advantage img,
    .facilities #aplicativo-advantage img {
        max-width: 60px;
    }

    .section-benefits {
        padding-top: 110px;
    }

    .section-benefits .title h1 {
        font-size: 30px;
        margin-bottom: 40px;
    }

    .section-benefits .title h3,
    .section-benefits .title h1 {
        text-align: left;
    }

    .section-benefits .card-benefits p {
        font-size: 13px;
    }

    .page-my-card {
        background-color: #fff;
    }

    .banner-my-card {
        margin-top: 125px;
        height: 300px;
        background-image: url('../images/carousel/02-mobile.png');
        background-image: -webkit-image-set(url('../images/carousel/02-mobile.webp') 1x);
        background-size: cover;
        border-radius: 0 0 25px 25px;
    }

    .banner-my-card h3 {
        font-size: 33px;
        margin-top: 145px;
        margin-left: 20px;
    }

    .banner-my-card h3 br {
        display: block;
    }

    .select-category-card-content {
        margin-top: 40px;
    }

    .select-category-card .container {
        max-width: 100%;
        padding: 0px;
    }

    .select-flag-card {
        background-color: #f0f1f5;
        background-image: none;
        border-radius: 40px;
        margin-top: 30px;
        padding: 40px;
        margin-bottom: 5px;
    }

    .select-flag-card .options-select-flag-card {
        margin-bottom: 0px;
    }

    .options-select-flag-card .row>div {
        width: 50%;
    }

    .select-flag-card .options-select-flag-card img {
        margin-bottom: 30px;
    }

    .select-card {
        padding-top: 40px;
        background: transparent linear-gradient(74deg, #E1173F 80%, #B81D7C 98%, #bb116f 100%) 0% 0%;
        padding-bottom: 10px;
        margin-bottom: 20px;
    }

    .select-card h3 {
        font-size: 22px;
        padding-right: 50px;
        margin-bottom: 60px;
        padding-top: 20px;
    }

    .select-card .search,
    .select-card .search .field {
        width: 100%;
    }

    .select-card .item-card .image img {
        margin: 0 auto;
        display: block;
    }

    .select-card .item-card {
        min-height: 250px;
    }

    .select-card .item-card .image {
        padding: 0px 5px;
        padding-top: 20px;
    }

    .select-card .select-card-carousel .my-slider-progress {
        width: calc(100% - 120px);
    }

    .select-card-carousel-splide {
        display: none;
    }

    .select-card .select-card-content {
        padding: 15px;
    }

    .select-card h3 {
        margin-left: 40px;
    }

    .select-cards-responsive {
        display: block;
    }

    .select-cards-responsive .row>div {
        padding: 5px;
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: center;
    }

    .select-card .item-card h2 {
        font-size: 12px !important;
        text-align: center;
        font-weight: 700;
        min-height: 0;
    }

    .select-card .item-card {
        min-height: 0;
    }

    .have-card-question h2 {
        font-size: 14px;
        padding-top: 16px;
    }

    .info-more-card {
        margin-top: 0px;
        padding-top: 30px;
    }

    .info-more-card .tab-header ul li.active:after {
        top: 12px;
    }

    .info-more-card .tab-content .search .field {
        margin-bottom: 0px;
    }

    .info-more-card .tab-content {
        padding: 0px 10px;
    }

    .card-service .animation img {
        position: relative;
        left: 40px;
    }
}

@media (max-height: 550px) {
    .banner .title {
        font-size: 45px;
        padding-top: 70px;
        line-height: 45px;
        max-width: 450px;
    }

    .banner-my-card h3 {
        font-size: 45px;
        line-height: 55px;
        max-width: 500px;
    }
}

@media (max-height: 500px) {
    .banner .title {
        font-size: 38px;
        padding-top: 60px;
        line-height: 40px;
        max-width: 380px;
    }

    .banner-my-card h3 {
        font-size: 40px;
        line-height: 55px;
        max-width: 600px;
    }
}

@media (max-width: 767px) {
    .services .title h1 {
        margin-bottom: 50px;
        font-size: 28px;
    }

    .banner-my-card h3 {
        font-size: 40px;
    }

    .select-category-card-content {
        padding: 40px 60px;
    }

    .select-category-card .options-category .row>div {
        width: 100%;
    }

    .select-category-card .options-category {
        padding-top: 20px;
        max-width: 300px;
    }

    .select-category-card .option-credit,
    .select-category-card .option-debit {
        max-width: 100%;
        margin-bottom: 30px;
    }

    .select-category-card h3 {
        font-size: 24px;
    }

    .select-category-card .option-credit .icon,
    .select-category-card .option-debit .icon {
        background: #E4E5E9;
        height: 75px;
        width: 75px;
        margin: 5px;
    }

    .select-category-card .option-credit .icon {
        padding: 15px 18px;
    }

    .select-category-card .option-debit .icon {
        padding: 22px 19px;
    }

    .select-card h3 {
        margin-bottom: 30px;
    }

    .info-more-card .tab-header ul li {
        height: 50px;
    }

    .info-more-card .tab-header ul li.active:after {
        top: 31px;
    }

    .info-more-card .tab-content .search h5 {
        text-align: left;
        margin-bottom: 20px;
    }

    .info-more-card .tab-content .search .field {
        margin-bottom: 20px;
    }

    .info-more-card .mosaic {
        padding-bottom: 60px;
    }
}

@media (max-height: 630px) {
    .banner-my-card h3 {
        margin-top: 60px;
        font-size: 55px;
        max-width: 550px;
    }
}

@media (max-width: 530px) {
    .carousel-cards {
        height: 530px;
    }
}

@media (max-width: 520px) {
    .select-flag-card .options-select-flag-card .flag {
        cursor: pointer;
        position: initial;
    }

    .select-flag-card .flags-content.option-debit-selected .flag.flag-elo {
        margin-left: 135px;
        position: absolute;
        margin-top: -85px;
    }
}

@media (max-width: 500px) {
    .carousel-cards {
        height: 500px;
    }
}

@media (max-width: 470px) {
    .carousel-cards {
        height: 480px;
    }
    .select-flag-card .flags-content.option-debit-selected .flag.flag-elo {
        width: 56px;
        height: 18px;
        margin-left: 95px;
        margin-top: -64px;
    }
    .my-card .meu-cartao-carousel .slick__slider {
        padding: 20px;
        height: 225px;
        min-height: 225px;
    }
    .my-card .meu-cartao-carousel {
        padding: 0px 15px;
    }
    .my-card .meu-cartao-carousel .slick__slider button {
        max-width: 100%;
        margin-top: 15px;
        margin-bottom: 0px;
        margin-left: 0;
        font-weight: 700;
    height: 44px;
    border: none;
    font-size: 14px;
    width: 100%;
    }
}

@media (max-width: 440px) {
    .carousel-cards {
        height: 460px;
    }
}

@media (max-width: 410px) {
     
    .banner-promotions .splide__slide .slide-promotion {
        height: 165px;
        width: 100%;
        margin: 0 auto;
    }

    .banner-promotions .splide__slide .slide-promotion p {
        font-size: 16px;
    }

    .banner-promotions .splide__slide .slide-promotion span {
        font-size: 14px;
    }

    .banner-promotions .splide__slide .slide-promotion:hover {
        height: 165px;
    }
}

@media (max-width: 400px) {
    .carousel-cards {
        height: 440px;
    }
}

@media (max-width: 380px) {
    .carousel-cards {
        height: 420px;
    }
}

@media (max-width: 375px) {
    .select-flag-card .flags-content.option-debit-selected .flag.flag-elo {
        margin-left: 125px;
        position: absolute;
        margin-top: -75px;
        margin-right: 20px;
    }
}

@media (max-width: 321px) {
    .advantages-cards .col-3 {
        width: 24% !important;
    }
}

/* @media (max-width: 320px) {
    .select-flag-card .flags-content.option-debit-selected .flag.flag-elo {
        width: 56px;
        height: 18px;
        margin-left: 95px;
        margin-top: -64px;
    }
    .my-card .meu-cartao-carousel .slick__slider {
        padding: 20px;
        height: 225px;
        min-height: 225px;
    }
    .my-card .meu-cartao-carousel {
        padding: 0px 15px;
    }
    .my-card .meu-cartao-carousel .slick__slider button {
        max-width: 100%;
        margin-top: 15px;
        margin-bottom: 0px;
        margin-left: 0;
        font-weight: 700;
    height: 44px;
    border: none;
    font-size: 14px;
    width: 100%;
    }
} */

@media only screen and (max-width: 1400px){
    div#topBar.headertopBar div.holder div.top-bar-center span.texto{
        display: none!important; 
    }
    div#topBar div.holder div.canal-consorciado, div#topBar div.holder div.nao-correntista {
        right: 55px!important;
    }
    body.page-my-card div#topBar.headertopBar div.holder{
        width: calc(100% - 40px)!important;
    }
    div#topBar.headertopBar div.nao-correntista:after {
        display: none;
    }
}

@media only screen and (max-width: 1180px) {
    div#topBar.headertopBar div.holder form fieldset>ul {
        left:35px!important;
        right: 15px
    }

    div#topBar.headertopBar div.holder form .legenda-acessa-conta {
        display: none!important
    }

    div#topBar.headertopBar div.holder div.holder {
        width: 768px
    }

    div#topBar.headertopBar div.holder div.holder div.como-usar {
        display: none!important
    }

    div#topBar.headertopBar div.holder div.holder form fieldset>ul {
        left: 30px
    }

    div#topBar.headertopBar div.holder div.holder form fieldset>ul li.lembrar:before {
        display: none
    }

    div#topBar.headertopBar div.holder div.holderMobile {
        width: 768px
    }

    div#topBar.headertopBar div.holder div.btn-parceiros {
        display: none!important
    }

    div#topBar.headertopBar div.holder div.canal-consorciado {
        display: none!important
    }

    div#topBar.headertopBar div.holder div.como-usar {
        left: 550px!important;
    }
}

.swiper-container {
    top: -5px;
}