/**************************************
***************************************
***************************************
************************** ADESAO ****/

.base-header-secao.adesao.cartao-consignado {
    background-image: url(img/cartao-consignado/banner.jpg);
}

.adesao__title h4 {
    font-size: 16px;
}
img.confirmacao-modal-logo {
    margin-bottom: 20px;
}

.txt-btn p{
	color: var(--tertiary-color);
	font-size: 9px;
	text-align:justify;
	line-height: 1.4;
}

.txt-btn p span{
	color: var(--primary-color);
	font-size: 9px;
	line-height: 1.5;
	text-align:justify;
	margin: 12px 0;
	letter-spacing: normal;
}

.txt-btn{
	display: flex;
    align-items: center;
    justify-content: center;
}

.box-card {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: 4px;
    border: 3px solid var(--contrast-color);
    background-color: var(--white-color);
    margin: 0 0 24px 0;
    padding: 24px;
    box-shadow: 0 2px 22px rgba(0,0,0,.12);
}

.select-card input[type="radio"] {
	position: absolute;
	opacity: 0;
}
.box-card span.bullet{
	display: block;
	padding: 10px;
	border: 1px solid var(--tertiary-color);
	border-radius: 100%;
	position: relative;
}

.select-card input[type="radio"]:checked + .box-card{
	border:3px solid var(--primary-color);
}

.select-card input[type="radio"]:checked + .box-card span.bullet:before{
	content:"";
	display: block;
	background-color: var(--primary-color);
	padding: 7px;
	border-radius: 100%;
	position: absolute;
	left: 3px;
	top: 3px;
}

.box-card img{
	padding: 0 20px 0 20px;
}

.txt-sobre{
	font-size: 13px;
}

.aviso-verde{
	font-size: 14px;
    color: var(--white-color);
    font-weight: 100;
    display: inline-block;
    margin: 0;
    padding: 6px 8px;
    background-color: var(--success-color);
}

.item {
	font-size: 14px;
}

.valor {
	font-size: 16px;
	color: var(--dark-color);
	font-weight: 700;
}

.box-branco {
    border-radius: 4px;
    border: 1px solid var(--contrast-color);
    background-color: var(--white-color);
    margin: 0 0 24px 0; padding: 24px;
    box-shadow: 0 2px 22px rgba(0,0,0,.12);
}

.compras__title {
    display: flex;
    align-items: center;
    justify-content: space-between;

    margin: 0 0 36px 0; padding: 0;
}

.compras__title h4 {
    font-size: 16px;
    line-height: 24px;

    flex: auto;
    margin: 0 36px 0 0; padding: 0;
}

.compras-parceladas {
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: space-around;
}

.viagem p {
	font-size: 14px;
	color: var(--tertiary-color);
	padding-top: 20px;
}

.saques p {
	font-size: 14px;
	color: var(--tertiary-color);
	padding-top: 20px;
}

.recarga p {
	font-size: 14px;
	color: var(--tertiary-color);
	padding-top: 20px;
}

.pontos p {
	font-size: 14px;
	color: var(--tertiary-color);
	padding-top: 20px;
}

.txt-cartao p{
	color: var(--tertiary-color);
	font-size: 9px;
	line-height: 1.5;
	margin: 30px 0;
	letter-spacing: normal;
	text-align: left;
    flex: auto;
    margin: 30px 36px 0 0; padding: 0;
}

/**************************************
***************************************
***************************************
************************** MOBILE ****/

/***************************** XS ****/
@media (max-width: 767px) {

    .base-header-secao.adesao {
        background-image: none;
        background-color: var(--primary-color);
    }

    .adesao__title {
        display: block;
    }

    .adesao__title h4 {
        font-size: 16px;
        margin: 0 0 24px 0; padding: 0;
    }

    .adesao__title a {
        display: block;
        width: 100%;
    }

    .adesao__content > p {
        font-size: 16px;
    }

}

/***************************** SM ****/
@media (min-width: 768px) and (max-width: 991px) {

    .adesao__title h4 {
        flex: auto;
    }

    .adesao__title a {
        width: 840px;
    }

}
.banner-placement {
    position: absolute;
}

.banner-placement img {
    width: 100%
}

.banner-placement.top-align {
    top: -108px; right: 0;
}

.box-white {
    border-radius: 4px;
    border: 1px solid var(--contrast-color);
    background-color: var(--white-color);
    margin: 0 0 24px 0; padding: 24px;
    box-shadow: 0 2px 22px rgba(0,0,0,.12);
}
.box-white.outline {
    box-shadow: none;
}

.box-white h4 {
    font-size: 16px;
    color: var(--dark-color);
    line-height: 24px;

    margin: 0 0 24px 0; padding: 0;
}

/**************************************
***************************************
***************************************
************************* INTERNA ****/

.base-header-secao.cartao {
    min-height: 300px;
    margin: 0; padding: 60px 0 36px 0;
}

.base-header-secao h2 {
    font-size: 24px;
    margin: 0 0 18px 0; padding: 0;
}

.base-header-secao p {
    font-size: 16px;
    color: var(--dark-color);
    line-height: 24px;
}

.base-miolo.interna .container.content {
    margin-top: -5%;
}

.btn-padrao.auto {
    width: 180px;

    font-size: 14px;
    text-transform: none;

    margin: 0;
}

/**************************************
***************************************
***************************************
************************** CARTAO ****/

.cartao-header {
    margin: 24px 0 0 0;
}

.cartao-header > p {
    font-size: 14px;
    color: var(--tertiary-color);
    margin: 0; padding: 0;
}

.cartao-header__select {
    margin: 6px 0 0 0;
}

.cartao-header__option {
    display: flex;
    align-items: center;
    justify-content: flex-start;

    width: 100%;
    border-radius: 4px;
    background-color: transparent;
    
    cursor: pointer;

    transition: all .12s ease-in-out;
}

.cartao-header__option.open {
    background-color: var(--white-color);
    box-shadow: 0 2px 20px rgba(0,0,0,.12);
}

.cartao-header__option--img {
    width: 48px;
    margin: 0 12px 0 0;
}

.cartao-header__option--img img {
    width: 100%;
}

.cartao-header__option--info {
    flex: auto;
}

.cartao-header__option--info h3,
.cartao-header__option--info p {
    font-size: 14px;
    line-height: 18px;
    margin: 0; padding: 0;
}

.cartao-header__option.ativo p span {
    color: var(--success-color);
}

.cartao-header__option--arrow {
    flex: auto;
    text-align: center;
}

.cartao-header__parceladas {
    padding: 0 0 0 18px;
}

.cartao-header__parceladas a {
    color: var(--primary-color);
}

.cartao-header__limite--progress {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cartao-header__limite--progress .grafico {
    flex: 1;
    position: relative;
    border-radius: 12px;
    width: 100%; height: 6px;
    margin: 0 12px; padding: 0;
    background-color: var(--contrast-color);
    overflow: hidden;
}

.cartao-header__limite--progress .grafico--disponivel {
    position: absolute;
    top: 0; left: 0;
    width: auto; height: 6px;
    background-color: var(--success-color);
}

.cartao-header__detalhes {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 36px 0 0 0;
}

.cartao-header__detalhes div {
    flex: 1 auto;
    font-size: 13px;
    color: var(--tertiary-color);
}

.cartao-header__detalhes div span {
    color: var(--dark-color);
}

.cartao-header__detalhes div span strong {
    color: var(--dark-color);
}

.cartao-header__detalhes div a.link {
    color: var(--primary-color);
}

.cartao-header__detalhes div:last-child {
    margin: 0;
    cursor: pointer;
}

.cartao-header__option + .dropdown-menu {
    width: 100%;
    border: 1px solid var(--contrast-color);
    margin: 12px 0 0 0; padding: 0;
}

.cartao-header__option + .dropdown-menu li {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 12px;
    border-bottom: 1px solid var(--contrast-color);
}

.cartao-header__option + .dropdown-menu li .dropdown-menu__card-img {
    width: 36px;
    margin: 0 12px 0 0; padding: 0;
}
.cartao-header__option + .dropdown-menu li .dropdown-menu__card-img img {
    width: 100%;
}

.cartao-header__option + .dropdown-menu li .dropdown-menu__card-infos {
    flex: 4;
}

.cartao-header__option + .dropdown-menu li .dropdown-menu__card-infos h3 {
    font-size: 13px;
    font-weight: normal;
    margin: 0; padding: 0;
}

.cartao-header__option + .dropdown-menu li .dropdown-menu__card-infos p {
    font-size: 13px;
    color: var(--tertiary-color);
    margin: 0; padding: 0;
}

.cartao-header__option + .dropdown-menu li a {
    font-size: 12px;
    color: var(--primary-color);
    width: auto;
    padding: 2px 6px;
    background-image: none;
    border: 1px solid var(--primary-color);
    background-color: transparent;
    
}
.cartao-header__option + .dropdown-menu li a:hover {
    color: var(--white-color);
}

.cartao-fatura {
    margin: 36px 0 0 0;
}

.cartao-fatura__options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 24px 0;
}

.cartao-fatura__options > div {
    flex: 1 auto;
    color: var(--tertiary-color);
}

.cartao-fatura__options > div p {
    color: var(--dark-color);
}

.cartao-fatura__options--mes {
    margin: 0 48px 0 0;
}

.cartao-fatura__options--pagar,
.cartao-fatura__options--2via {
    width: 84px;
}

.cartao-fatura__options--pagar {
    margin: 0 24px 0 0;
}

.cartao-fatura__options--2via a.btn-padrao.laranja.outline {
    color: var(--primary-color);
    background-image: none;
    border-color: var(--primary-color);
    background-color: transparent;   
}

.cartao-fatura h4 {
    font-size: 18px;
    color: var(--dark-color);
    margin: 0; padding: 0;
}

.cartao-fatura__table {
    border-radius: 4px;
    background-color: var(--white-color);
    box-shadow: 0 2px 20px rgba(0,0,0,.12);
}

.fatura__table--header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--concrete);
    margin: 24px 0 0 0; padding: 18px 24px;
}

.fatura__table--header.total {
    background-color: var(--white-color);
}
.fatura__table--header.total h5 span {
    opacity: 0;
}

.fatura__table--header h5 {
    font-size: 16px;
    color: var(--dark-color);
    margin: 0; padding: 0;
}

.fatura__table--header h5 span {
    display: inline-block;
    margin: 0 0 0 24px;
    transform: rotate(0);
    transition: all .2s ease-in-out;
}

.fatura__table--header.collapsed h5 span {
    transform: rotate(180deg);
}

.fatura__table--base {
    margin: 0; padding: 0 0 0 24px;
}

.fatura__table--base .data-line {
    color: var(--tertiary-color);
    font-size: 14px;
    margin: 24px 0 0 0;
}

.fatura__table--row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 0; padding: 16px 72px 16px 0;
}

.fatura__table--row:last-child {
    border-bottom: 1px solid var(--contrast-color);
}

.fatura__table--row div {
    flex: 1;
}

.fatura__table--row .fatura__table--icon {
    flex: 0;
    font-size: 24px;
    color: var(--primary-color);
    margin: 0 24px 0 0;
}

.fatura__table--row .fatura__table--name {
    flex: 3;
}

.fatura__table--hour,
.fatura__table--value {
    text-align: right;
}

.cartao-header__pagamento {
    margin: 24px 0 0 0;
}

.cartao-header__pagamento .cartao-pagamento ul {
    list-style: none;
    margin: 24px 0; padding: 0;
}

.cartao-header__pagamento .cartao-pagamento ul li:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    background-color: var(--concrete);
    border: 1px solid var(--contrast-color);
}

.cartao-header__pagamento .cartao-pagamento ul li a {
    color: var(--primary-color)
}

.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio {
    position: relative;
}

.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    width: 100%; height: 100%;
}

.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"] + label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    width: 100%; min-height: 64px;
    margin: 0; padding: 14px;
    border: 1px solid var(--contrast-color);
}

.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"]:checked + label {
    border: 1px solid var(--primary-color);
}

.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"] + label div:first-child {
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: normal;
}

.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"] + label .radio__check {
    position: relative;
    border-radius: 50%;
    margin: 0 12px 0 0;
    width: 18px; height: 18px;
    background-color: var(--white-color);
    border: 2px solid var(--contrast-color);
}
.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"] + label .radio__check:after {
    content: "";
    position: absolute;
    top: 2px; left: 2px;
    border-radius: 50%;
    width: 10px; height: 10px;
    background-color: var(--primary-color);
    transform: scale(0);
}
.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"]:checked + label .radio__check:after {
    transform: scale(1);
}

.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"] + label .form-custom.no-label {
    pointer-events: none;
}
.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"]:checked + label .form-custom.no-label {
    pointer-events: all;
}

.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"] + label .form-custom.no-label input[type="text"] {
    margin: 0;
    padding: 6px 18px;
    opacity: 0;
    box-shadow: none;
    border: 1px solid var(--contrast-color);
}
.cartao-header__pagamento .cartao-pagamento ul .cartao-pagamento__radio input[type="radio"]:checked + label .form-custom.no-label input[type="text"] {
    opacity: 1;
}

.cartao-header__pagamento .form-custom.no-label label {
    margin: 0 0 8px 4px;
}
.cartao-header__pagamento .form-custom.no-label label + input {
    margin: 0;
}

.cartao-header__pagamento .form-custom.no-label label + input[disabled] {
    box-shadow: none;
    background-color: var(--concrete);
    border: 1px solid var(--contrast-color);
}

.botoes-box.footer {
    margin: 24px 0 0 0;
}

.cartao-header__pagamento.confirme span {
    color: var(--primary-color);
    font-weight: bold;
}

.cartao-header__pagamento.confirme ul {
    list-style: none;
    margin: 24px 0; padding: 0;
}

.cartao-header__pagamento.confirme ul li {
    color: var(--tertiary-color);
    margin: 0 0 12px 0; padding: 0;
}

.cartao-header__pagamento.confirme ul li strong {
    color: var(--dark-color);
}

/**************************************
***************************************
***************************************
************************** MOBILE ****/

/***************************** XS ****/
@media (max-width: 767px) {

    .base-miolo.interna .container.content {
        margin-top: -12%;
    }

    .cartao-header__parceladas {
        padding: 36px 0 24px 0;
    }

    .cartao-header__detalhes {
        flex-wrap: wrap;
    }

    .cartao-header__detalhes div {
        flex: 50%;
        margin: 0 0 24px 0;
    }
    .cartao-header__detalhes div:last-child {
        margin: 0;
    }

    .cartao-fatura__options {
        flex-wrap: wrap;
    }

    .cartao-fatura__options .cartao-fatura__options--mes {
        flex: 100%;
        margin: 0;
    }
    
    .cartao-fatura__options .cartao-fatura__options--valor,
    .cartao-fatura__options .cartao-fatura__options--minimo {
        flex: 50%;
        margin: 12px 0 24px 0;
    }

    .fatura__table--base {
        margin: 0;
        padding: 0 0 0 12px;
    }

    .fatura__table--row {
        flex-wrap: wrap;
    }

    .fatura__table--icon {
        display: none;
    }
    
    .fatura__table--row .fatura__table--name {
        flex: 100%;
    }

    .fatura__table--hour {
        text-align: left;
    }

}

/***************************** SM ****/
@media (min-width: 768px) and (max-width: 991px) {

    .cartao-header__parceladas {
        padding: 36px 0 24px 0;
    }

    .cartao-header__detalhes {
        flex-wrap: wrap;
    }

    .cartao-header__detalhes div {
        flex: 50%;

        margin: 0 0 24px 0;
    }
    .cartao-header__detalhes div:last-child {
        margin: 0;
    }

    .cartao-fatura__options {
        flex-wrap: wrap;
    }

    .cartao-fatura__options .cartao-fatura__options--mes {
        flex: 100%;
        margin: 0;
    }
    
    .cartao-fatura__options .cartao-fatura__options--valor,
    .cartao-fatura__options .cartao-fatura__options--minimo {
        flex: 50%;
        margin: 12px 0 24px 0;
    }

    .fatura__table--base {
        margin: 0;
        padding: 0 0 0 12px;
    }

    .fatura__table--row {
        flex-wrap: wrap;
    }

    .fatura__table--icon {
        display: none;
    }
    
    .fatura__table--row .fatura__table--name {
        flex: 100%;
    }

    .fatura__table--hour {
        text-align: left;
    }

}
.box-padrao {
    background-color: var(--white-color);
    border-radius: 4px;
    padding: 20px;
    box-shadow: 0 0 60px rgba(0,0,0,0.1);
    margin-top: 20px;
}

    .box-padrao > .titulo {
        font-size: 16px;
        font-weight: bold;
        margin-bottom: 20px;
    }

    .box-padrao p {
        color: var(--tertiary-color);
        font-size: 14px;
        margin-bottom: 20px;
    }

    .box-padrao .lista-simples {
        list-style: none;
        margin-bottom: 10px;
        overflow: hidden;
    }

        .box-padrao .lista-simples li {
            position: relative;
            padding-left: 20px;
            color: var(--tertiary-color);
            margin-bottom: 10px;
        }

            .box-padrao .lista-simples li:before {
                color: var(--primary-color);
                content: "\e930";
                font-family: 'icomoon' !important;
                position: absolute;
                left: 0;
                top: 2px;
            }

.antecipa {
    position: relative
}

    .antecipa .label-antecipa {
        background-color: var(--white-color);
        border-radius: 4px;
        padding: 15px 20px;
        box-shadow: 0 0 60px rgba(0,0,0,0.1);
        margin-bottom: 20px;
        width: 100%;
        height: 100px;
    }

    .antecipa input[type="radio"] {
        position: absolute;
        z-index: 0;
        opacity: 0;
    }

    .antecipa .label-antecipa .left {
        display: flex;
        align-items: center;
        float: left;
        width: 35px;
        height: 100%
    }

        .antecipa .label-antecipa .left span {
            display: block;
            height: 15px;
            width: 15px;
            border: 1px solid var(--tertiary-color);
            border-radius: 100%;
        }

    .antecipa .label-antecipa .right {
        float: left;
        width: calc(100% - 35px);
    }

        .antecipa .label-antecipa .right .titulo {
            font-size: 16px;
            margin-bottom: 10px;
        }

        .antecipa .label-antecipa .right p {
            overflow: hidden;
            margin: 0 0 5px;
            font-size: 12px;
        }

            .antecipa .label-antecipa .right p:last-child {
                margin-bottom: 0;
            }

            .antecipa .label-antecipa .right p .item {
                display: inline-block;
                text-align: left;
                font-weight: lighter;
                width: 50%;
            }

            .antecipa .label-antecipa .right p .valor {
                display: inline-block;
                font-weight: bold;
                text-align: right;
                width: 48%;
            }

    .antecipa input[type="radio"]:checked + .label-antecipa {
        background-color: var(--primary-color);
        color: var(--white-color);
    }

        .antecipa input[type="radio"]:checked + .label-antecipa .left span {
            border: 2px solid var(--white-color);
            box-shadow: 0 0 10px rgba(0,0,0,0.3);
        }

        .antecipa input[type="radio"]:checked + .label-antecipa .right p span {
            color: var(--white-color);
        }

.box-padrao .action {
    margin-top: 50px;
}

    .box-padrao .action a.disabled {
        background-color: var(--contrast-color);
        background-image: none;
        color: var(--white-color);
        pointer-events: none;
    }

.radio input[type="checkbox"] {
    position: absolute;
    opacity: 0;
}

.abraca-foto {
    height: auto;
    width: 600px;
    text-align: center;
}


.abraca-radio {
    padding: 10px 0px;
    border-top: 1px solid var(--concrete);
    border-bottom: 1px solid var(--concrete);
    width: 100%;
    height: 60px;
    margin-top: 20px;
    text-align: center;
}

    .abraca-radio .radio-data {
        float: none;
    }


.abraca-radio-cartao {
    padding: 10px 0px;
    width: 100%;
    height: 60px;
    text-align: left;
}

    .abraca-radio-cartao .radio-data {
        float: none;
        margin-top: 0px;
        margin-bottom: 0px;
    }

.abraca-step {
    width: 100%;
    height: 20px;
    background-color: var(--contrast-color);
    border-radius: 40px;
    margin-top: 20px;
    position: relative;
    padding: 0px 5px;
    overflow: hidden;
}

    /*ETAPAS INVESTIDOR*/
    .abraca-step.step0 .preenche-step {
        width: 0%;
    }

    .abraca-step.step1 .preenche-step {
        width: 12%;
    }

    .abraca-step.step2 .preenche-step {
        width: 32%;
    }

    .abraca-step.step3 .preenche-step {
        width: 51%;
    }

    .abraca-step.step4 .preenche-step {
        width: 71%;
    }

    .abraca-step.step5 .preenche-step {
        width: 90%;
    }

    .abraca-step.step6 .preenche-step {
        width: 100%;
    }

@media (max-width: 767px) {
    .abraca-logo {
        padding-top: 5px;
        height: 40px;
        display: block;
        align-items: center;
        text-align: center;
        padding-top: 10px;
    }

    .abraca-banner-card {
        height: auto;
    }

    .abraca-form {
        padding: 0 40px;
        width: 100%;
    }

        .abraca-form h3 {
            font-size: 20px;
        }

        .abraca-form p {
            font-size: 14px;
            margin-bottom: 25px;
        }

    .abraca-step {
        margin-top: 20px;
        margin-bottom: 70px;
    }
}

.base-box {
    width: 100%;
    height: 336px;
    background: var(--white-color);
    border-radius: 6px;
    margin: 24px 0 0 0;
    padding: 0 0 36px 0;
    text-align: center;
    -webkit-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
    -moz-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
    box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
}


.base-box-investimentos {
    display: flex;
    width: 100%;
    height: 226px;
    border-radius: 6px;
    padding: 20px;
    margin: 24px 0 0 0;
    padding: 0 0 36px 0;
    -webkit-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
    -moz-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
    box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.6);
    background-color: var(--white-color);
}

.base-conteudo-invest {
    padding: 12px;
    margin: 10px 0 0 0;
}


.title-invest {
    padding:0px;
    margin:0px;
    font-size:14px;
    font-weight: bolder;
}

.icon-eye{
    background: 0;
    width: 12px;
    height:12px;
}

.base-box .base-img {
    width: 100%;
    height: 156px;
    background-size: cover;
    background-position: center center;
    border-radius: 6px 6px 0 0;
    padding: 30px 0 0 0;
    color: var(--white-color);
}

        .base-box .base-img .base-icone {
            font-size: 36px;
        }

        .base-box .base-img h4 {
            font-size: 16px;
            font-weight: bold;
            text-transform: uppercase;
            margin: 66px 0 0 0;
            padding: 0;
        }

            .base-box .base-img h4 span {
                font-size: 14px;
            }

    .base-box .base-conteudo {
        margin: 29px 0 0 0;
        padding: 0 14px;
    }

        .base-box .base-conteudo h3 {
            font-size: 16px;
            margin-top: 17px;
            text-align: left;
        }

        .base-box .base-conteudo p {
            font-size: 14px;
            font-weight: 400;
            color: var(--tertiary-color);
            height: 72px;
        }

        .base-box .base-conteudo button {
            width: 84%;
            margin: 23px 0 0 0;
            padding: 8px 4px;
            font-size: 12px;
            text-align: center;
            border-radius: 18px;
            border: 2px solid var(--primary-color);
            outline: none;
            color: var(--primary-color);
            background-color: var(--white-color);
            text-transform: uppercase;
        }

            .base-box .base-conteudo button:hover {
                background-color: var(--primary-color);
                color: var(--white-color);
            }

    /*** BOX QUIZ ***/

    .base-box.quiz .base-img {
        background-image: url(styles/assets/img/img-quiz.jpg);
    }

    .base-box.quiz .base-conteudo {
        display: flex;
        justify-content: space-around;
        padding: 0 30px;
    }

        .base-box.quiz .base-conteudo .nao a,
        .base-box.quiz .base-conteudo .sim a {
            display: inline-block;
            flex: 1 auto;
        }

        .base-box.quiz .base-conteudo .nao a {
            color: var(--tertiary-color);
        }

        .base-box.quiz .base-conteudo .sim a {
            color: var(--primary-color);
        }

        .base-box.quiz .base-conteudo .base-icone {
            background: var(--white-color);
            display: block;
            border-radius: 48px;
            font-size: 36px;
            margin: 10px 0 0 0;
            padding: 14px 24px 10px 24px;
            -webkit-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
            -moz-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
            box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
            transition: all 0.2s ease;
        }

        .base-box.quiz .base-conteudo a:hover .base-icone {
            transform: scale(1.1);
        }

        .base-box.quiz .base-conteudo .base-icone + p {
            font-size: 10px;
            font-weight: bold;
            text-transform: uppercase;
            margin: 8px 0 0 0;
        }

    /*** BOX GERENTE ***/

    .base-box.gerente .avatar {
        position: relative;
        overflow: hidden;
        border-radius: 68px;
        width: 68px;
        height: 68px;
        background-size: cover;
        margin: -36px auto 0 auto;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.36);
    }

    .base-box.gerente h3 {
        font-size: 14px;
        font-weight: bold;
        color: var(--primary-color);
        margin: 6px 0 0 0;
        padding: 0;
    }

    .base-box.gerente a {
        display: block;
        margin: 14px 0 0 0;
        color: var(--primary-color);
    }

    .base-box.gerente h3 + p {
        margin: 4px 0 0 0;
        padding: 0;
        color: var(--dark-color);
    }

        .base-box.gerente h3 + p strong {
            color: var(--dark-color);
        }

    .base-box.gerente p {
        line-height: 12px;
    }

        .base-box.gerente p.contatos {
            line-height: normal;
            color: var(--tertiary-color);
            font-size: 14px;
            margin: 18px 0 0 0;
        }

.base-boxes {
    display: flex;
    flex-wrap: wrap;
    margin: 12px 0 0 0;
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-box {
        height: auto;
        height: 415px !important;
    }

        .base-box .base-img {
            height: 237px;
            padding: 72px 0 0 0;
        }

            .base-box .base-img h4 {
                font-size: 18px;
            }

                .base-box .base-img h4 span {
                    font-size: 16px;
                }

        .base-box .base-conteudo {
            padding: 0 54px;
        }

            .base-box .base-conteudo p {
                font-size: 13px;
                font-weight: normal;
            }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .base-box.gerente, .base-box.quiz {
        min-height: 348px;
    }

    .base-box {
        height: 380px;
    }

        .base-box .base-img {
            padding: 54px 0 0 0;
            height: 192px;
        }

        .base-box.quiz .base-conteudo {
            margin: 36px 0 0 0;
            padding: 0 12px;
        }

            .base-box.quiz .base-conteudo .base-icone {
                background: var(--white-color);
                display: block;
                border-radius: 48px;
                font-size: 24px;
                margin: 10px 0 0 0;
                padding: 18px 24px 13px 24px;
            }
}
.base-dias-range p {
    font-size: 12px;
    text-transform: uppercase;
    margin: 0 0 0 0;
    font-weight: bold;
    color: var(--tertiary-color);
}

    .base-dias-range p span {
        color: var(--primary-color);
    }

.base-dias-range .form-custom {
    color: var(--tertiary-color);
    font-size: 16px;
    margin: -4px 0 0 0;
    padding: 0;
    pointer-events: none;
}

    .base-dias-range .form-custom input {
        -webkit-appearance: none;
        display: inline-block;
        width: 100%;
        height: auto;
        color: var(--primary-color);
        border: none;
        outline: none;
        background: none;
        box-shadow: none;
        text-align: right;
        margin: 0;
        padding: 0;
        font-size: 12px;
        font-weight: bold;
        text-transform: uppercase;
    }

.base-dias-range .slider {
    background: var(--contrast-color);
    margin: 30px 0 0 0;
    border-radius: 30px;
    border: 0;
    height: 6px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

.base-end-tabela {
    width: 100%;
    background: var(--white-color);
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    padding: 24px 18px 24px 48px;
    margin: 0 0 36px 0;
}

    .base-end-tabela h2 {
        text-transform: capitalize;
        font-size: 13px;
        color: var(--dark-color);
        font-weight: 600;
        margin: 3px 0 0 0;
        padding: 0;
    }

        .base-end-tabela h2.valor {
            font-size: 18px;
            letter-spacing: 0px;
            margin: 0;
            padding: 0;
            color: var(--primary-color);
        }

    .base-end-tabela.fatura-creditos {
        margin: 0;
    }

@media (max-width: 767px) {
    .base-end-tabela.fatura-creditos h2.valor {
        margin: 5px 0 0 0;
    }

    .base-end-tabela {
        padding: 24px 18px 24px 24px;
    }

        .base-end-tabela.parceladas {
            text-align: left;
        }

            .base-end-tabela.parceladas h2 {
                font-size: 12px;
                letter-spacing: 0;
            }

                .base-end-tabela.parceladas h2.valor {
                    font-size: 24px;
                    margin: 6px 0 0 0;
                }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-end-tabela.fatura-creditos h2.valor {
        margin: 5px 0 0 0;
    }

    .base-end-tabela {
        padding: 24px 18px 24px 24px;
    }

        .base-end-tabela.parceladas {
            text-align: left;
        }

            .base-end-tabela.parceladas h2 {
                font-size: 12px;
                letter-spacing: 0;
                margin-top: 10px;
            }

                .base-end-tabela.parceladas h2.valor {
                    font-size: 24px;
                    margin: 6px 0 0 0;
                }
}
.base-header-secao.adesao {
    background-size: cover;
    background-position: top center;
    min-height: 300px;
    margin: 0 0 -36px 0;
    padding: 60px 0 0 0;
}

    .base-header-secao.adesao h2 {
        font-size: 24px;
        font-weight: 400;
        color: var(--white-color);
        margin: 0;
        padding: 0;
    }

    .base-header-secao.adesao h3 {
        font-size: 24px;
        color: var(--white-color);
        font-weight: bold;
        margin: 2% 0% 0% 43%;
        padding: 0;
    }

    .base-header-secao.adesao p {
        font-size: 16px;
        color: var(--white-color);
        font-weight: 500;
        display: inline-block;
        margin: 0;
        padding: 0;
    }

.adesao__title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 36px 0;
    padding: 0;
}

    .adesao__title h4 {
        font-size: 14px;
        line-height: 24px;
        flex: auto;
        margin: 0 36px 0 0;
        padding: 0;
    }

    .adesao__title a {
        width: 408px;
        padding: 12px 0;
    }

.adesao__content > p {
    margin: 0 0 24px 0;
}

.adesao-footer {
    margin: 36px 0 0 0;
}

    .adesao-footer h4 {
        font-size: 16px;
        color: var(--dark-color);
        margin: 0;
        padding: 0;
    }

.adesao-footer__faq {
    border-radius: 4px;
    border: 1px solid var(--contrast-color);
    background-color: var(--white-color);
    box-shadow: 0 2px 22px rgba(0,0,0,.12);
    margin: 24px 0 0 0;
    padding: 0;
}

.adesao-footer__faq--item a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    width: 100%;
    height: auto;
    border-bottom: 1px solid var(--contrast-color);
}

.adesao-footer__faq--content {
    font-size: 14px;
    line-height: 24px;
    margin: 0;
    padding: 24px;
    background-color: #f9f9f9;
    border-bottom: 1px solid var(--contrast-color);
}

.adesao-footer__duda {
    margin: 42px 0 0 0;
    padding: 0;
}

    .adesao-footer__duda img {
        width: 100%;
    }

@media (max-width: 767px) {
    .base-header-secao.adesao {
        background-image: none;
        background-color: var(--primary-color);
    }

    .adesao__title {
        display: block;
    }

    .adesao__title {
        align-items: center;
        justify-content: space-between;
        margin: 0 0 36px 0;
        padding: 40px 0;
    }

        .adesao__title h4 {
            font-size: 16px;
            margin: 0 0 24px 0;
            padding: 0;
        }

        .adesao__title a {
            display: block;
            width: 100%;
        }

    .base-header-secao.adesao h3 {
        font-size: 16px;
        color: var(--white-color);
        font-weight: bold;
        margin: 0px 0 0px 29%;
        padding: 0;
    }

    .adesao__content > p {
        font-size: 16px;
    }
}

@media (min-width: 200px) and (max-width: 320px) {
    .base-header-secao.adesao h3 {
        font-size: 21px;
        color: var(--white-color);
        font-weight: bold;
        margin: -7% 0% 0% 3%;
        padding: 0;
    }
}

@media (min-width: 321px) and (max-width: 375px) {
    .base-header-secao.adesao h3 {
        font-size: 24px;
        color: var(--white-color);
        font-weight: bold;
        margin: -7% 0% 0% 10%;
        padding: 0;
    }
}

@media (min-width: 376px) and (max-width: 425px) {
    .base-header-secao.adesao h3 {
        font-size: 24px;
        color: var(--white-color);
        font-weight: bold;
        margin: -3% 0% 0% 17%;
        padding: 0;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .adesao__title h4 {
        flex: auto;
    }

    .adesao__title a {
        width: 840px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {

    .base-header-secao.adesao {
        background-size: cover;
        background-position: top center;
        margin: 0 0 -36px 0;
        padding: 23px 0 0 6px;
    }

        .base-header-secao.adesao h3 {
            font-size: 24px;
            color: var(--white-color);
            font-weight: bold;
            margin: 2% 0 0px 35%;
            padding: 0;
        }
}

@media (min-width: 14410px) and (max-width: 1800px) {

    .base-header-secao.adesao {
        background-size: cover;
        background-position: top center;
        margin: 0 0 -36px 0;
        padding: 23px 0 0 6px;
    }

        .base-header-secao.adesao h3 {
            font-size: 24px;
            color: var(--white-color);
            font-weight: bold;
            margin: 2% 0 0px 50%;
            padding: 0;
        }
}

@media (min-width: 1801px) and (max-width: 2100px) {

    .base-header-secao.adesao {
        background-size: cover;
        background-position: top center;
        margin: 0 0 -36px 0;
        padding: 23px 0 0 6px;
    }

        .base-header-secao.adesao h3 {
            font-size: 24px;
            color: var(--white-color);
            font-weight: bold;
            margin: 2% 0 0px 60%;
            padding: 0;
        }
}

@media (min-width: 2101px) and (max-width: 2900px) {

    .base-header-secao.adesao {
        background-size: cover;
        background-position: top center;
        margin: 0 0 -36px 0;
        padding: 23px 0 0 6px;
    }

        .base-header-secao.adesao h3 {
            font-size: 24px;
            color: var(--white-color);
            font-weight: bold;
            margin: 2% 0 0px 70%;
            padding: 0;
        }
}

.base-header-secao.cadastro {
    margin: 0;
    padding: 60px 0 36px 0;
}

    .base-header-secao.cadastro h2 {
        font-size: 24px;
        margin: 0 0 18px 0 !important;
        padding: 0;
    }

    .base-header-secao.cadastro .base-header-secao__subtitulo p {
        font-size: 16px;
        color: var(--tertiary-color);
        line-height: 24px;
        margin: 0 0 18px 0;
    }

    .base-header-secao.cadastro input[type=checkbox] {
        cursor: pointer;
        -webkit-appearance: none;
        outline: none;
        background: var(--white-color);
        width: 10px;
        height: 10px;
        border: 2px solid var(--white-color);
        box-shadow: 0 0 0 2px var(--tertiary-color);
        margin: 0 12px 0 0;
        padding: 1px;
    }

        .base-header-secao.cadastro input[type=checkbox]:checked {
            background: var(--primary-color);
        }

        .base-header-secao.cadastro input[type=checkbox] + label {
            cursor: pointer;
        }

@media (max-width: 767px) {
    .base-header-secao.cartoes .outros-servicos .btn-pagar-fatura {
        margin-left: 0px !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-header-secao.cartoes .outros-servicos .btn-pagar-fatura {
        margin-left: 0px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .base-header-secao.cartoes .outros-servicos a {
        font-size: 12px;
    }

    .base-header-secao.cartoes .outros-servicos .btn-outros-servicos {
        right: -165px;
    }
}
.base-header-secao.cartao {
    min-height: 300px;
    margin: 0;
    padding: 60px 0 36px 0;
}

/*** CARTOES ***/
.base-header-secao.cartoes a.btn-padrao.laranja,
.base-header-secao.cartoes a.btn-padrao.cinza {
    margin: 7px 0 0 0;
}

.base-header-secao.cartoes.desbloq a.btn-padrao.laranja,
.base-header-secao.cartoes.desbloq a.btn-padrao.cinza {
    margin: 24px 0 0 0;
}

.base-header-secao.cartoes.desbloq input[type="checkbox"] {
    margin: 38px 0 0 0;
}

.base-header-secao.cartoes .outros-servicos a.btn-padrao {
    display: block;
    width: 100%;
    margin: 30px 0 0 0;
    padding: 12px 0;
    position: relative;
}

.base-header-secao.cartoes .outros-servicos {
    position: relative;
}

    .base-header-secao.cartoes .outros-servicos .btn-pagar-fatura {
        margin-left: 0px !important;
    }

    .base-header-secao.cartoes .outros-servicos .btn-outros-servicos {
        position: absolute;
        right: -220px;
        top: -76px;
    }

.passos-numbers ul {
    width: 100%;
    text-align: right;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .passos-numbers ul li {
        background: var(--white-color);
        border-radius: 36px;
        display: inline-block;
        text-align: center;
        width: 26px;
        height: 26px;
        margin: 0 12px 0 0;
        padding: 1px 0;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.2);
        border: 2px solid var(--white-color);
    }

        .passos-numbers ul li:last-child {
            margin: 0;
        }

        .passos-numbers ul li.active {
            border: 1px solid var(--primary-color);
            background: var(--primary-color);
            color: var(--white-color);
        }

.saque {
    margin-top: 0px;
}

@media (max-width: 767px) {
    .base-header-secao.cartoes a.btn-padrao.laranja {
        margin: 24px 0 12px 0;
    }

    .base-header-secao.cartoes .outros-servicos a.btn-padrao {
        margin: 24px 0 12px 0;
    }

    .outros-servicos a.btn-padrao {
        display: block;
        width: 100%;
        margin: 24px 0 0 0;
        padding: 12px 16px;
    }

    .base-header-secao.cartoes a.btn-padrao.saque,
    .base-header-secao.cartoes a.btn-padrao.laranja.saque {
        margin: 0 0 12px 0;
    }

    .base-header-secao.cartoes .form-custom {
        margin: 12px 0 0 0;
    }

        .base-header-secao.cartoes .form-custom input[type="range"] {
            border-radius: 36px;
            margin: 8px 0 18px 0;
        }

    .base-header-secao.cartoes p.disclaimer {
        margin: 12px 0 48px 0;
    }

    .base-header-secao.cartoes .alert {
        text-align: center;
    }

    .base-header-secao.cartoes .outros-servicos .btn-outros-servicos {
        position: absolute;
        right: -300px;
        top: -72px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-header-secao.cartoes a.btn-padrao.laranja {
        margin: 24px 0 12px 0;
    }

    .base-header-secao.cartoes .outros-servicos a.btn-padrao {
        margin: 24px 0 12px 0;
    }

    .outros-servicos a.btn-padrao {
        display: block;
        width: 100%;
        margin: 24px 0 0 0;
        padding: 12px 16px;
    }

    .base-header-secao.cartoes a.btn-padrao.saque,
    .base-header-secao.cartoes a.btn-padrao.laranja.saque {
        margin: 0 0 12px 0;
    }

    .base-header-secao.cartoes .form-custom {
        margin: 12px 0 0 0;
    }

        .base-header-secao.cartoes .form-custom input[type="range"] {
            border-radius: 36px;
            margin: 8px 0 18px 0;
        }

    .base-header-secao.cartoes p.disclaimer {
        margin: 12px 0 48px 0;
    }

    .base-header-secao.cartoes .alert {
        text-align: center;
    }

    .passos-numbers {
        margin-top: 5px;
    }
}

.base-header-secao.conta {
    padding: 45px 0 0px 0;
}

    .base-header-secao.conta p.status-conta {
        margin: 12px 0 0 0;
        font-size: 12px;
        color: var(--tertiary-color);
        text-transform: uppercase;
        font-weight: bold;
        text-align: right;
        font-family: var(--font-secondary);
    }

        .base-header-secao.conta p.status-conta span {
            color: var(--success-color);
            font-weight: bold;
            font-family: var(--font-secondary);
        }

.page-interna.conta .escolhe-mes {
    margin: -15px 0 -30px 0;
    padding: 0;
}

@media (max-width: 767px) {
    .base-header-secao.conta {
        padding: 48px 4% 36px 4%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-header-secao.conta {
        padding: 48px 0 36px 0;
    }
}
.base-header-secao.corrigido {
    width: 100%;
    background: var(--white-color);
    margin: 0;
    padding: 84px 0 36px 0;
    box-shadow: inset 12px 12px 24px rgba(0,0,0,0.05);
}

    .base-header-secao.corrigido h2 {
        margin: 0 0 12px 0;
    }

.titulo-comprovante {
    font-size: 30px;
    color: var(--primary-color);
    margin: 30px 0 30px 0;
    font-weight: 400;
}

.titulo-comprovante-pj {
    font-size: 30px;
    color: #373737;
    margin: 30px 0 30px 0;
    font-weight: 400;
}

.base-header-secao {
    width: 100%;
    padding: 45px 0 60px 0;
    background: var(--white-color);
}

.base-header-secao-pj {
    width: 100%;
    padding: 45px 0 30px 0;
    background: var(--white-color);
}

.base-header-secao h2 {
    font-size: 36px;
    font-weight: 400;
    margin: 0 0 6px 0;
    color: var(--primary-color);
}

.base-header-secao h6 {
    margin: 0 0 6px 0;
}

.base-header-secao-pj h2 {
    font-size: 36px;
    font-weight: 400;
    margin: 0 0 6px 0;
    color: #373737
}

.base-header-secao-pj h6 {
    margin: 0 0 36px 0;
}

.base-header-secao__subtitulo {
    display: grid;
    align-items: center;
    grid-template-columns: 3fr 1fr;
}

@media (max-width: 767px) {
    .base-header-secao {
        width: 100%;
        margin: 0 0 48px 0;
        padding: 48px 4% 72px 4%;
        background: var(--white-color);
        box-shadow: none;
    }

        .base-header-secao h2 {
            font-size: 24px;
            margin: 0 0 0px 0;
        }

    .base-header-secao__subtitulo {
        grid-gap: 18px;
        grid-template-columns: 1fr;
    }

    .base-arrows {
        margin: 4px 0 0 0;
        display: flex;
    }

        .base-arrows a {
            flex: 1;
            text-align: right;
            display: block;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-header-secao {
        width: 100%;
        margin: 0;
        padding: 48px 0;
        background: var(--white-color);
        box-shadow: none;
    }

        .base-header-secao h2 {
            font-size: 24px;
        }

    .base-arrows {
        margin: 4px 0 0 0;
        display: flex;
    }

        .base-arrows a {
            flex: 1;
            text-align: right;
            display: block;
        }
}

.base-header-secao.investimentos {
    padding: 60px 0 60px 0;
}

    .base-header-secao.investimentos h3 {
        font-size: 16px;
        font-weight: 400;
        color: var(--dark-color);
        margin: 0;
        padding: 0;
    }

        .base-header-secao.investimentos h3 span {
            font-size: 30px;
            color: var(--success-color);
        }

@media (max-width: 767px) {
    .base-header-secao.investimentos {
        padding-bottom: 24px;
    }

        .base-header-secao.investimentos h3 {
            font-size: 16px;
            font-weight: 300;
            color: var(--dark-color);
            margin: 0 0 30px 0;
            padding: 0;
        }

            .base-header-secao.investimentos h3 span {
                font-size: 24px;
                color: var(--success-color);
            }
}
.perfil input[type=checkbox] {
    -webkit-appearance: none;
    background: var(--white-color);
    width: 10px;
    height: 10px;
    outline: none;
    border: 2px solid var(--white-color);
    box-shadow: 0 0 0 2px var(--tertiary-color);
    margin: 50% 0 0 0;
    padding: 1px;
}

.section-transferencia-abas {
    padding: 20px 20px;
    border-bottom: 2px solid var(--contrast-color);
}

.perfil input[type=checkbox]:checked {
    background: var(--primary-color);
}

.base-header-secao.perfil {
    padding: 60px 0 36px 0;
}

    .base-header-secao.perfil h2 {
        margin: 0 0 24px 0;
    }

        .base-header-secao.perfil h2.pjCorp {
            margin: 0 0 44px 0;
            color: #000;
        }

    .base-header-secao.perfil h5 {
        text-transform: uppercase;
        font-size: 12px;
        font-weight: bold;
        color: var(--tertiary-color);
    }

    .base-header-secao.perfil h4.dados-basic span {
        text-transform: uppercase;
        padding: 0 18px 0 0;
        color: var(--dark-color);
    }

    .base-header-secao.perfil h4.status.active {
        color: var(--success-color);
    }

    .base-header-secao.perfil .base-perfil-expand-aviso {
        margin: 30px 0 0 0;
        padding: 18px 0 18px 36px;
        border-left: 4px solid var(--primary-color);
    }

    .base-header-secao.perfil .base-perfil-expand {
        margin: 30px 0 0 0;
        padding: 18px 0 18px 36px;
        border-left: 4px solid var(--success-color);
    }

        .base-header-secao.perfil .base-perfil-expand h5,
        .base-header-secao.perfil .base-perfil-expand h4 {
            margin: 0;
            padding: 0;
        }

        .base-header-secao.perfil .base-perfil-expand:hover {
            background-color: var(--concrete);
        }

    .base-header-secao.perfil .well {
        background-color: var(--concrete);
        border-radius: 0px;
        box-shadow: none;
        border: none;
    }

        .base-header-secao.perfil .well .item-perfil:hover {
            background-color: var(--concrete);
        }

        .base-header-secao.perfil .well .item-perfil h5 {
            color: var(--primary-color);
        }

.item-perfil.done {
    border-left: 4px solid var(--success-color);
}

.item-perfil.undone {
    border-left: 4px solid var(--primary-color);
}

.base-header-secao.perfil .well .item-perfil h4 {
    font-weight: lighter;
}

.base-header-secao.perfil .well .item-perfil .alert {
    position: absolute;
    top: 20px;
    right: 36px;
    text-align: right;
    line-height: 14px;
    font-size: 12px;
    padding: 12px;
    font-weight: bold;
}

.base-header-secao.perfil .well .item-perfil .base-botoes a:focus {
    outline: none;
}

.base-header-secao.perfil .well .item-perfil .base-botoes a .base-icone {
    font-size: 24px;
}

.base-header-secao.perfil .well .item-perfil .base-botoes a:hover {
    color: var(--primary-color);
}

.base-header-secao.perfil input[type=date] {
    width: 100%;
    padding: 10px 36px;
    border: 2px solid var(--contrast-color);
    border-radius: 24px;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
}

/* Custmo filtro data tela aprovacao*/
.base-header-secao.perfil .dataMobile {
    width: 100%;
    padding: 10px 36px;
    border: 2px solid var(--contrast-color);
    border-radius: 24px;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
}

    .base-header-secao.perfil .dataMobile:hover {
        background: var(--contrast-color);
    }

.base-header-secao.perfil .base-calendar-picker {
    margin: 0px 0 0 0;
    padding: 0;
}

    .base-header-secao.perfil .base-calendar-picker .form-custom {
        margin: 0;
        padding: 0;
    }

    .base-header-secao.perfil .base-calendar-picker label {
        margin: 8px 0 0 0;
    }

    .base-header-secao.perfil .base-calendar-picker input {
        width: 80%;
    }

        .base-header-secao.perfil .base-calendar-picker input:hover {
            background: var(--contrast-color);
        }

.base-header-secao.perfil .table {
    border-radius: 8px;
    overflow: hidden;
    margin: 36px 0 12px 0;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .base-header-secao.perfil .table > thead > tr.top-table {
        text-transform: uppercase;
        font-size: 11px;
        letter-spacing: 1px;
        color: var(--white-color);
        padding: 18px 24px;
        border: 0;
        background-color: var(--primary-color);
        text-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }

    .base-header-secao.perfil .table > thead > tr.top-table-corp {
        background-color: #373737;
        color: var(--white-color);
    }

    .table > thead > tr > th {
        padding: 16px;
    }

    .base-header-secao.perfil .table > tbody > tr > td {
        padding: 16px 20px 16px 16px;
    }

        .base-header-secao.perfil .table > tbody > tr > td.control-user {
            display: flex;
            align-items: center;
        }

            .base-header-secao.perfil .table > tbody > tr > td.control-user div,
            .base-header-secao.perfil .table > tbody > tr > td.control-user p {
                flex: 1;
            }

            .base-header-secao.perfil .table > tbody > tr > td.control-user p {
                color: var(--tertiary-color);
            }

            .base-header-secao.perfil .table > tbody > tr > td.control-user.ativo p {
                color: var(--primary-color);
                font-weight: bold;
            }

            .base-header-secao.perfil .table > tbody > tr > td.control-user .toggle-switch {
                width: auto;
                display: inline-block;
                text-align: left;
                float: none;
                margin: 0;
                padding: 0;
                transform: translate(0, 3px);
            }

                .base-header-secao.perfil .table > tbody > tr > td.control-user .toggle-switch div {
                    line-height: normal;
                }

                    .base-header-secao.perfil .table > tbody > tr > td.control-user .toggle-switch div label {
                        margin-bottom: 0px;
                    }

.base-header-secao.perfil .form-custom.dep-add > p {
    font-weight: bold;
    font-size: 10px;
    text-transform: uppercase;
    color: var(--tertiary-color);
    margin: 10px 0 0 0;
}

.base-header-secao.perfil .form-custom.dep-add .toggle-switch {
    width: 96px;
    margin: 4px 0 0 0;
}

.base-header-secao.perfil .form-custom.aprov-multi .toggle-switch {
    width: 100%;
    margin: 30px 0 0 0;
}

.base-header-secao.perfil .form-custom.radio {
    margin: 0;
    padding: 0;
}

    .base-header-secao.perfil .form-custom.radio input[type="radio"] {
        -webkit-appearance: none;
    }

    .base-header-secao.perfil .form-custom.radio > input[type="radio"] + label {
        width: 100%;
        border: 3px solid var(--contrast-color);
        border-radius: 36px;
        color: var(--tertiary-color);
        margin: 0;
        padding: 9px 0 10px 54px;
    }

        .base-header-secao.perfil
        .form-custom.radio > input[type="radio"] + label:before {
            content: "";
            position: absolute;
            top: 1.18em;
            left: 22%;
            border-radius: 12px;
            width: 11px;
            height: 11px;
            background-color: var(--white-color);
            border: 2px solid var(--tertiary-color);
        }

        .base-header-secao.perfil .form-custom.radio > input[type="radio"] + label > p {
            font-size: 12px;
            letter-spacing: 1px;
            text-align: center;
            font-weight: bold;
            line-height: 16px;
            text-transform: uppercase;
        }

    .base-header-secao.perfil .form-custom.radio > input[type="radio"]:checked + label {
        background-color: var(--primary-color);
        border: 3px solid var(--primary-color);
        color: var(--white-color);
    }

        .base-header-secao.perfil .form-custom.radio > input[type="radio"]:checked + label:before {
            background-color: var(--primary-color);
            border: 3px solid var(--white-color);
        }

    .base-header-secao.perfil .form-custom.radio input[type="checkbox"] + label {
        text-align: right;
        display: inline-block;
        margin: 10px 0 0 14px;
        font-weight: normal;
    }

.dropdown {
    position: absolute;
    cursor: pointer;
}

.dropdown-menu {
    left: -135px;
    top: 26px;
}

@media (max-width: 767px) {
    /*.base-header-secao.perfil h4 {*/
    /*font-size: 14px;*/
    /*}*/

    .base-header-secao.perfil h5 {
        font-size: 12px;
        margin: 0 0 6px 0;
    }

    .base-header-secao.perfil .base-perfil-expand {
        margin: 30px 0 0 0;
        padding: 4px 0 24px 18px;
        border-left: 4px solid var(--primary-color);
    }

        .base-header-secao.perfil .base-perfil-expand h5 {
            margin: 24px 0 2px 0;
        }

    .base-header-secao.perfil .well .item-perfil {
        position: relative;
        margin: 0 0 0 0;
        padding: 18px 0 24px 18px;
        border-bottom: 1px solid var(--contrast-color);
    }

        .base-header-secao.perfil .well .item-perfil .base-botoes {
            top: 18px;
            right: 12px;
        }

    .base-header-secao.perfil .table > thead > tr > th {
        padding: 18px 12px;
    }

    .base-header-secao.perfil .table > tbody > tr > td {
        padding: 18px 12px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-header-secao.perfil h5 {
        font-size: 12px;
        margin: 0 0 6px 0;
    }

    .base-header-secao.perfil .base-perfil-expand {
        margin: 30px 0 0 0;
        padding: 4px 0 24px 18px;
        border-left: 4px solid var(--primary-color);
    }

        .base-header-secao.perfil .base-perfil-expand h5 {
            margin: 24px 0 2px 0;
        }

    .base-header-secao.perfil .well .item-perfil {
        position: relative;
        margin: 0 0 0 0;
        padding: 18px 0 24px 18px;
        border-bottom: 1px solid var(--contrast-color);
    }

        .base-header-secao.perfil .well .item-perfil .base-botoes {
            top: 18px;
            right: 12px;
        }

    .base-header-secao.perfil .table > thead > tr > th {
        padding: 18px 12px;
    }

    .base-header-secao.perfil .table > tbody > tr > td {
        padding: 18px 12px;
    }
}

.page-interna.registrato h2 {
    font-size: 30px;
    color: var(--primary-color);
    margin: 0px 0 24px 0;
    font-weight: lighter;
}

.base-header-secao.registrato .info h4 {
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--dark-color);
    font-weight: bold;
    margin: 0 0 12px 0;
    padding: 0;
}

.base-header-secao.registrato .info h5 {
    font-size: 16px;
    font-weight: bold;
    color: var(--tertiary-color);
    margin: 12px 0 2px 0;
    padding: 0;
}

    .base-header-secao.registrato .info h5 + p {
        font-size: 14px;
        margin: 0 0 12px 0;
    }

.base-header-secao.registrato .form-registrato {
    margin: 24px 0;
    padding: 36px;
    border-radius: 12px;
    box-shadow: 0 0 60px rgba(0,0,0,0.1);
}

.base-header-secao.registrato a {
    margin: 10px 0 0 0;
}

.base-header-secao.registrato {
    width: 100%;
    padding: 40px 0 50px 0;
    background: var(--white-color);
    box-shadow: inset 12px 12px 24px rgba(0,0,0,.05);
}

.page-interna.transferencias {
    padding: 0 0 0 0;
}

    .base-header-secao.transferencia{
    width: 100%;
    padding: 45px 20px 0px 20px;
    background: var(--white-color);
    }

    .page-interna.transferencias p.select-conta {
    text-transform: uppercase;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 1px;
    margin: 0 0 8px 0;
    }

    .page-interna.transferencias a.box-option {
        display: block;
        background-color: var(--white-color);
        text-align: center;
        margin: 12px 0 0 0;
        padding: 24px 0;
        border-radius: 18px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        transition: all 0.4s ease;
    }

        .page-interna.transferencias a.box-option:hover {
            transform: translate(0, -8px) rotateX(14deg);
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.15);
        }

        .page-interna.transferencias a.box-option .base-icone {
            font-size: 36px;
            color: var(--tertiary-color);
        }

.transferencias a.box-option h3 {
    margin: 6px 0 0 0;
    padding: 0;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 1px;
    color: var(--primary-color);
    font-weight: bold;
}

.badges-tranferencia {
    background: var(--primary-color);
    font-weight: 500;
    margin: -1px 0px 0px 2px;
    position: absolute;
    top: 21px;
    right: 22px;
}

.page-interna.transferencias a.box-option:hover > .badges-tranferencia {
    background: var(--primary-color);
    font-weight: 500;
    margin: -1px 0px 0px 2px;
    position: absolute;
    top: 11px;
    right: 12px;
}

.page-interna.transferencias .base-favorecidos {
    background-color: var(--white-color);
    margin: 30px 0 36px 0;
    padding: 36px 36px 36px 36px;
    border-radius: 18px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .page-interna.transferencias .base-favorecidos input {
        margin: 0 0 0 0;
    }

    .page-interna.transferencias .base-favorecidos h5 {
        font-size: 11px;
        font-weight: bold;
        color: var(--tertiary-color);
        letter-spacing: 1px;
        text-transform: uppercase;
    }

    .page-interna.transferencias .base-favorecidos input {
        padding: 10px 24px;
        border-radius: 30px;
        outline: none;
    }

.page-interna.transferencias .base-favorecidos .lista-favs {
    display: flex;
    flex-wrap: wrap;
}

.page-interna.transferencias .base-favorecidos .lista-favs a {
    flex: auto;
    align-items: center;
    display: block;
    margin: 48px 12px 0px 12px;
    text-align: center;
}

.page-interna.transferencias .base-favorecidos .lista-favs a .base-avatar {
    overflow: hidden;
    width: 84px;
    height: 84px;
    background-size: cover;
    background-color: var(--contrast-color);
    border-radius: 50%;
    margin: 0 auto 8px auto;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease;
}

.page-interna.transferencias .base-favorecidos .lista-favs a:hover .base-avatar {
    transform: scale(1.04) translate(0, -6px);
}

    .page-interna.transferencias .base-favorecidos .lista-favs a h2 {
        font-size: 14px;
        color: var(--primary-color);
        font-weight: bold;
        margin: 0;
    }

.page-interna.transferencias .dados-confirma p {
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
    margin: 0 0 18px 0;
    color: var(--dark-color);
}

    .page-interna.transferencias .dados-confirma p strong {
        font-size: 16px;
        font-weight: normal;
        letter-spacing: 0px;
        text-transform: none;
        color: var(--tertiary-color);
    }

.page-interna.transferencias .dados-confirma h2 {
    margin: -2px 0 0 0;
    padding: 0;
}

.page-interna.transferencias .dados-confirma .form-custom input[type="text"] {
    width: 100%;
    margin: 3px 0 11px 0;
    padding: 15px 12px 15px 180px;
    border: 1px solid var(--contrast-color);
    border-radius: 48px;
    outline: none;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .page-interna.transferencias .dados-confirma .form-custom input[type="text"] + label {
        top: 20px;
    }

    .page-interna.transferencias .dados-confirma .form-custom input[type="text"]:focus + label,
    .page-interna.transferencias .dados-confirma .form-custom input[type="text"]:active + label {
        font-size: 12px;
        top: 20px;
        left: 24px;
    }

.page-interna.transferencias .dados-confirma .form-custom.no-label input {
    border: none;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    margin: 12px 0 0 0;
    padding: 14px 12px 15px 24px;
}

.page-interna.transferencias .base-infoconta-transfer .comprovantes-prints {
    margin: 4px 0 0 0;
    text-align: right;
}

    .page-interna.transferencias .base-infoconta-transfer .comprovantes-prints a {
        display: inline-block;
        background: var(--white-color);
        color: var(--primary-color);
        text-align: center;
        outline: none;
        font-size: 18px;
        width: 36px;
        height: 36px;
        margin: 0;
        padding: 5px 0;
        border-radius: 50%;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

        .page-interna.transferencias .base-infoconta-transfer .comprovantes-prints a + a {
            margin: 0 0 0 6px;
        }

.page-interna.transferencias a.box-option.download {
    border-radius: 8px;
    margin: 30px 0 0 0;
    padding: 24px 12px;
}

    .page-interna.transferencias a.box-option.download h3 {
        color: var(--primary-color);
        margin: 0;
        padding: 0;
        text-transform: none;
        font-size: 14px;
        letter-spacing: 0;
        color: var(--primary-color);
        font-weight: bold;
    }

    .page-interna.transferencias a.box-option.download p {
        font-size: 12px;
        font-weight: bold;
        padding: 4px;
        color: var(--tertiary-color);
        border-radius: 12px;
        margin: 14px 24px 0 24px;
        border: 2px solid var(--contrast-color);
        text-transform: uppercase;
    }

    .page-interna.transferencias a.box-option.download:hover p {
        background-color: var(--primary-color);
        border: 2px solid var(--primary-color);
        color: var(--white-color);
    }

.page-interna.transferencias .dados-confirma p.aviso-importante {
    text-transform: none;
    font-size: 12px;
    font-weight: normal;
    letter-spacing: 0;
    margin: 0 0 18px 0;
    color: var(--dark-color);
}

@media (max-width: 767px) {
    .page-interna.transferencias a.box-option {
        margin: 12px 0 0 0;
        padding: 24px 0;
    }

        .page-interna.transferencias a.box-option h3 {
            font-size: 12px;
            letter-spacing: 0;
            text-transform: none;
            margin: 0;
            padding: 0;
        }

    .page-interna.transferencias .base-favorecidos .lista-favs {
        display: flex;
        flex-wrap: wrap;
    }

    .page-interna.transferencias .base-favorecidos input {
        margin: 24px 0 0 0;
        padding: 18px 0 18px 18px;
    }

    .page-interna.transferencias p.select-conta {
        margin: 12px 0 0 0;
        font-size: 12px;
    }

    .page-interna.transferencias .form-custom select {
        font-size: 12px;
    }

        .page-interna.transferencias .form-custom select + .overlay-mask {
            position: absolute;
            top: 12px;
            right: 0;
            border-radius: 36px;
            width: 96px;
            height: 47px;
            pointer-events: none;
            background-image: linear-gradient(to left, var(--white-color), var(--white-color), rgba(255,255,255,0));
        }

    .page-interna.transferencias .base-infoconta-transfer .comprovantes-prints {
        margin: 24px 0 0 0;
        text-align: center;
    }

        .page-interna.transferencias .base-infoconta-transfer .comprovantes-prints a {
            display: inline-block;
            background: var(--white-color);
            color: var(--primary-color);
            text-align: center;
            outline: none;
            font-size: 18px;
            width: 48%;
            height: 36px;
            margin: 0;
            padding: 5px 0;
            border-radius: 12px;
            box-shadow: 0 0 60px rgba(0,0,0,0.1);
        }

            .page-interna.transferencias .base-infoconta-transfer .comprovantes-prints a + a {
                margin: 0 0 0 6px;
            }
}

@media (min-width: 768px) and (max-width: 991px) {
    .page-interna.transferencias a.box-option {
        margin: 12px 0 0 0;
        padding: 24px 0;
    }

        .page-interna.transferencias a.box-option h3 {
            font-size: 12px;
            letter-spacing: 0;
            text-transform: none;
            margin: 0;
            padding: 0;
        }

    .page-interna.transferencias .base-favorecidos .lista-favs {
        display: flex;
        flex-wrap: wrap;
    }

    .page-interna.transferencias .base-favorecidos input {
        margin: 24px 0 0 0;
        padding: 18px 0 18px 18px;
    }

    .page-interna.transferencias p.select-conta {
        margin: 12px 0 0 0;
        font-size: 12px;
    }

    .page-interna.transferencias .form-custom select {
        font-size: 12px;
    }

        .page-interna.transferencias .form-custom select + .overlay-mask {
            position: absolute;
            top: 12px;
            right: 0;
            border-radius: 36px;
            width: 96px;
            height: 47px;
            pointer-events: none;
            background-image: linear-gradient(to left, var(--white-color), var(--white-color), rgba(255,255,255,0));
        }

    .page-interna.transferencias .base-infoconta-transfer .comprovantes-prints {
        margin: 24px 0 0 0;
        text-align: center;
    }

        .page-interna.transferencias .base-infoconta-transfer .comprovantes-prints a {
            display: inline-block;
            background: var(--secondary-color);
            color: var(--primary-color);
            text-align: center;
            outline: none;
            font-size: 18px;
            width: 48%;
            height: 36px;
            margin: 0;
            padding: 5px 0;
            border-radius: 12px;
            box-shadow: 0 0 60px rgba(0,0,0,0.1);
        }

            .page-interna.transferencias .base-infoconta-transfer .comprovantes-prints a + a {
                margin: 0 0 0 6px;
            }
}

/*    .base-header-secao.transferencia h2 {
        margin: 40px 0 24px 0;
    }*/

    .base-header-secao.transferencia .title-transfer {
        display: flex;
        color: var(--tertiary-color);
        align-items: center;
        margin: 0 0 0 0;
    }

        .base-header-secao.transferencia .title-transfer .base-icone {
            font-size: 36px;
            margin: 0 18px 0 0;
        }

        .base-header-secao.transferencia .title-transfer .base-text h3 {
            font-size: 18px;
            font-weight: 400;
            margin: 0;
            padding: 0;
        }

            .base-header-secao.transferencia .title-transfer .base-text h3 strong {
                color: var(--primary-color);
            }

    .base-header-secao.transferencia.lote {
        padding: 60px 0 60px 0;
    }

        .base-header-secao.transferencia.lote h2 {
            margin: 0 0 24px 0;
        }

        .base-header-secao.transferencia.lote .form-trf-lote {
            margin: 24px 0;
            padding: 36px;
            border-radius: 8px;
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        }

        .base-header-secao.transferencia.lote input {
            width: 100%;
            padding: 10px 36px;
            border: 2px solid var(--contrast-color);
            border-radius: 24px;
            outline: none;
            cursor: pointer;
            -webkit-appearance: none;
        }

            .base-header-secao.transferencia.lote input:hover {
                background: var(--contrast-color);
            }

        .base-header-secao.transferencia.lote a {
            margin: 26px 0 0 0;
        }

        .base-header-secao.transferencia.lote .base-calendar-picker {
            margin: 0px 0 0 0;
            padding: 0;
        }

            .base-header-secao.transferencia.lote .base-calendar-picker .form-custom {
                margin: 0;
                padding: 0;
            }

            .base-header-secao.transferencia.lote .base-calendar-picker label {
                margin: 8px 0 0 0;
            }

            .base-header-secao.transferencia.lote .base-calendar-picker input {
                width: 80%;
            }

                .base-header-secao.transferencia.lote .base-calendar-picker input:hover {
                    background: var(--contrast-color);
                }

@media (max-width: 767px) {
    .base-header-secao.transferencia {
        margin: 0 0 24px 0;
        padding: 48px 4% 36px 4%;
    }

        .base-header-secao.transferencia h2 {
            font-size: 24px;
        }

        .base-header-secao.transferencia.lote .base-calendar-picker {
            text-align: center;
        }

            .base-header-secao.transferencia.lote .base-calendar-picker input {
                width: 100%;
                padding: 10px 0;
                background-color: var(--white-color);
                text-align: center !important;
            }

                .base-header-secao.transferencia.lote .base-calendar-picker input:focus {
                    background-color: var(--white-color);
                }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-header-secao.transferencia {
        margin: 0 0 24px 0;
        padding: 48px 0 36px;
    }

        .base-header-secao.transferencia h2 {
            font-size: 24px;
        }

        .base-header-secao.transferencia.lote .base-calendar-picker {
            text-align: center;
        }

            .base-header-secao.transferencia.lote .base-calendar-picker input {
                width: 80%;
                padding: 10px 0;
                background-color: var(--white-color);
                text-align: center !important;
            }

                .base-header-secao.transferencia.lote .base-calendar-picker input:focus {
                    background-color: var(--white-color);
                }
}

.borda-laranja {
    margin-top: 8px;
    border: 2px solid var(--primary-color) !important;
    color: var(--primary-color);
}

    .borda-laranja:hover {
        border: 2px solid var(--primary-color) !important;
        color: var(--white-color);
        background-color: var(--primary-color);
    }

.tituloLaranja {
     
    font-style: normal;
    font-weight: 500;
    font-size: 30px;
    line-height: 34px;
    color: var(--primary-color);
}

.tituloCard {
     
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 23px;
    color: var(--dark-color);
}

.subtituloCard {
     
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    color: var(--tertiary-color);
}

.nomes-favorecido {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    color: var(--dark-color);
}

.dados-favorecidos {
    color: var(--tertiary-color);
    font-size: 12px;
}

.area-cards-favor {
    padding: 10px 30px;
}

.card-favorecido {
    border: 1px solid var(--contrast-color);
    border-bottom: 0px;
    border-radius: 10px 10px 0px 0px;
    padding: 10px;
}

.card-botoes-favor {
    border: 1px solid var(--contrast-color);
    border-radius: 0px 0px 10px 10px;
    height: 40px;
    display: flex;
    align-items: center;
}

.btn-card-trans {
    border-right: 1px solid var(--contrast-color);
    text-align: center;
    height: 100%;
    float: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-card-editar {
    height: 100%;
    display: flex;
    float: none;
    align-items: center;
    justify-content: center;
}

.circle-iniciais {
    background-color: var(--contrast-color);
    color: var(--tertiary-color);
    font-weight: 900;
    padding: 15px;
    border-radius: 50px;
    position: absolute;
    width: 50px;
    text-align: center;
}

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

.p-0 {
   padding: 0px;
}

.btn-acoes-card {
    color: var(--primary-color);
}

.btn-card-trans:hover a {
    color: var(--white-color);
}

.btn-card-editar:hover a {
    color: var(--white-color);
}

.btn-card-trans:hover {
    border-radius: 0px 0px 0px 10px;
    background-color: var(--primary-color);
    color: var(--white-color) !important;
}

.btn-card-editar:hover {
    border-radius: 0px 0px 10px 0px;
    background-color: var(--primary-color);
    color: var(--white-color) !important;
}

input[type=radio] {
  position: absolute;
  visibility: hidden;
  display: none;
}

.radios {
    color: rgba(0, 0, 0, 0.1);
    display: inline-block;
    cursor: pointer;
    font-weight: bold;
    padding: 5px 20px;
    margin: 0px !important;
}

.base-infoconta-transfer input[type=radio]:checked + label {
    color: var(--white-color) !important;
    background: var(--primary-color);
}

label + input[type=radio] + label {
  border-left: solid 2px var(--primary-color);
}

.radio-group {
    border: solid 2px var(--primary-color);
    display: inline-flex;
    margin: 2px 0px 28px 0px;
    border-radius: 10px;
    overflow: hidden;
}

input[type=radio]:checked:disabled + label {
    color: var(--dark-color) !important;
    background: var(--contrast-color);
}

label + input[type=radio]:disabled + label {
    border-left: solid 2px var(--contrast-color);
}

.radio-group-disabled {
    border: solid 2px var(--contrast-color);
    display: inline-flex;
    margin: 2px 0px 28px 0px;
    border-radius: 10px;
    overflow: hidden;
}

input:-internal-autofill-previewed {
    background-color: var(--white-color);
}

.msgExcluir{
    position: fixed;
    display: block;
    top: 76px;
    right: 55%;
}

.base-calendar-picker.transferencia .form-custom input[type="text"] {
    width: 100%;
    background-color: var(--white-color);
    text-align: end;
    padding: 0px 24px;
    border: 1px solid var(--contrast-color);
    border-radius: 48px;
    outline: none;
    height: 50px !important;
}

    .base-calendar-picker.transferencia .form-custom input[type="text"] + label {
        top: 8px !important;
    }

.base-calendar-picker.transferencia, .base-calendar-picker.transferencia .form-custom {
    margin: 0;
}

.mt-10 {
   margin-top: 10px
}
.base-header-secao.trflote {
    padding: 20px 0 36px 0;
}

    .base-header-secao.trflote h2 {
        margin: 0 0 24px 0;
    }

    .base-header-secao.trflote h5 {
        text-transform: uppercase;
        font-size: 12px;
        font-weight: bold;
        color: var(--tertiary-color);
    }

    .base-header-secao.trflote h4.dados-basic span {
        text-transform: uppercase;
        padding: 0 18px 0 0;
        color: var(--dark-color);
    }

    .base-header-secao.trflote h4.status.active {
        color: var(--success-color);
    }

    .base-header-secao.trflote .well {
        background-color: var(--concrete);
        border-radius: 0px;
        box-shadow: none;
        margin: 0;
        padding: 0;
        border: none;
        border-left: 4px solid var(--primary-color);
    }

    .base-header-secao.trflote .dataMobile {
        width: 100%;
        padding: 10px 36px;
        border: 2px solid var(--contrast-color);
        border-radius: 24px;
        outline: none;
        cursor: pointer;
        -webkit-appearance: none;
    }

        .base-header-secao.trflote .dataMobile:hover {
            background: var(--contrast-color);
        }

    .base-header-secao.trflote .base-calendar-picker {
        margin: 0px 0 0 0;
        padding: 0;
    }

        .base-header-secao.trflote .base-calendar-picker .form-custom {
            margin: 0;
            padding: 0;
        }

        .base-header-secao.trflote .base-calendar-picker label {
            margin: 20px 0 0 0;
        }

        .base-header-secao.trflote .base-calendar-picker input[type="date"] {
            width: 80%;
        }

            .base-header-secao.trflote .base-calendar-picker input[type="date"]:hover {
                background: var(--contrast-color);
            }

    .base-header-secao.trflote .table {
        border-radius: 8px;
        overflow: hidden;
        margin: 36px 0 12px 0;
        box-shadow: 0 0 60px rgba(0,0,0,0.1);
    }

        .base-header-secao.trflote .table > thead > tr > th {
            text-transform: uppercase;
            font-size: 11px;
            letter-spacing: 1px;
            color: var(--white-color);
            padding: 18px 24px;
            border: 0;
            background-color: var(--primary-color);
            text-shadow: 0 2px 4px rgba(0,0,0,0.2);
        }

        .base-header-secao.trflote .table > tbody > tr > td {
            padding: 24px;
        }

            .base-header-secao.trflote .table > tbody > tr > td.control-user {
                display: flex;
                align-items: center;
            }

                .base-header-secao.trflote .table > tbody > tr > td.control-user div,
                .base-header-secao.trflote .table > tbody > tr > td.control-user p {
                    flex: 1;
                }

                .base-header-secao.trflote .table > tbody > tr > td.control-user p {
                    color: var(--tertiary-color);
                }

                .base-header-secao.trflote .table > tbody > tr > td.control-user.ativo p {
                    color: var(--primary-color);
                    font-weight: bold;
                }

    .base-header-secao.trflote .info h4 {
        font-size: 14px;
        letter-spacing: 1px;
        text-transform: uppercase;
        color: var(--dark-color);
        font-weight: bold;
        margin: 0 0 12px 0;
        padding: 0;
    }

    .base-header-secao.trflote .info h5 {
        font-size: 16px;
        font-weight: bold;
        color: var(--tertiary-color);
        margin: 12px 0 2px 0;
        padding: 0;
    }

        .base-header-secao.trflote .info h5 + p {
            font-size: 14px;
            margin: 0 0 12px 0;
        }

.conta-trflote {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 2px 0 2px 0;
    padding: 8px 4px 8px 4px;
    border-bottom: 1px solid var(--contrast-color);
}

    .conta-trflote:last-child {
        border-bottom: 0 solid var(--contrast-color);
        margin: 2px 0 36px 0;
        padding: 12px 4px 0px 4px;
    }

    .conta-trflote .item h4 {
        font-size: 12px;
        letter-spacing: 1px;
        text-transform: uppercase;
        font-weight: bold;
    }

    .conta-trflote .item p {
        font-family: 'Varela Round', sans-serif;
        text-align: center;
        font-size: 18px;
        color: var(--tertiary-color);
    }

        .conta-trflote .item p span {
            font-size: 14px;
        }

/*
    Custom Transferência em Lote
*/

.valor-total-trf-lote {
    width: 100%;
    background: var(--white-color);
    margin: 0 0 -20px 0;
    padding: 30px 0 20px 10px;
    border-top: 1px solid var(--white-color);
    border-bottom: 1px solid var(--white-color);
}

.valor-total-trf-lote .conta-trflote.total {
    margin: 0;
    padding: 0;
    border-bottom: 0;
    align-items: center;
}

    .valor-total-trf-lote .conta-trflote.total .item h4 {
        font-size: 28px;
        color: var(--tertiary-color);
        text-transform: none;
        font-weight: normal;
    }

    .valor-total-trf-lote .conta-trflote.total .item:last-child p {
        font-size: 24px;
        color: var(--primary-color);
    }

        .valor-total-trf-lote .conta-trflote.total .item:last-child p span {
            color: var(--primary-color);
        }

    .valor-total-trf-lote.stick-container.scroll-to-fixed-fixed {
        width: 100%;
        box-shadow: 12px 0 60px rgba(0,0,0,0.4);
        border-radius: 0 0 10px 10px;
    }

.aprv-trf-lote input[type=checkbox] {
    -webkit-appearance: none;
    background: var(--white-color);
    width: 10px;
    height: 10px;
    outline: none;
    border: 2px solid var(--white-color);
    box-shadow: 0 0 0 2px var(--tertiary-color);
    margin: 0 0 0 0;
    padding: 1px;
}

    .aprv-trf-lote input[type=checkbox]:checked {
        background: var(--primary-color);
    }
.base-header-secao.adesao{ 
    background-size: cover;
    background-position: top center;
    
    min-height: 300px;

    margin: 0 0 -36px 0; padding: 60px 0 0 0;
}

/**** CONTA SIMPLES ****/
.base-header-secao.adesao.conta-simples {
    background-image: url(img/cross_selling/banner_conta-simples.png);
}

/**** CARTOES ****/
.base-header-secao.adesao.cartoes {
    background-image: url(img/cross_selling/banner_cartao.jpg);
}

/**** INVESTIMENTOS ****/
.base-header-secao.adesao.investimentos {
    background-image: url(img/cross_selling/banner_invest.jpg);
}

/**** POUPA PRA MIM ****/
.base-header-secao.adesao.poupa {
    background-image: url(img/cross_selling/banner_poupa.png);
}

/**** ANTECIPA PRA MIM ****/
.base-header-secao.adesao.antecipa {
    background-image: url(img/cross_selling/banner_antecipa.png);
}

/**** REFINANCIAMENTO ****/
.base-header-secao.adesao.refin {
    background-image: url(img/cross_selling/banner_refinanciamento.jpg);
}


.radio.favorecido {
    position: relative;
    margin-top: 56px;
    margin-bottom: 10px;
}

.base-infoconta-transfer {
    margin: 36px 0 110px 0;
    padding: 36px;
    border-radius: 18px;
    background-color: var(--white-color);
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .base-infoconta-transfer h4 {
        text-transform: uppercase;
        font-size: 11px;
        font-weight: bold;
        letter-spacing: 1px;
        margin: 0 0 18px 0;
    }

    .base-infoconta-transfer p.tipo-conta {
        font-size: 11px;
        font-weight: bold;
        text-transform: uppercase;
        letter-spacing: 1px;
        text-align: right;
        line-height: 12px;
        color: var(--tertiary-color);
        margin: 9px 0 0 0;
    }

    .base-infoconta-transfer .form-custom.radio {
        display: flex;
        align-items: center;
    }

    .base-infoconta-transfer input[type="radio"] {
        -webkit-appearance: none;
        -moz-appearance: none;
        background: var(--white-color);
        width: 12px;
        height: 12px;
        outline: none;
        border: 2px solid var(--white-color);
        box-shadow: 0 0 0 2px var(--tertiary-color);
        border-radius: 50%;
        margin: 0 0 0 0;
        padding: 1px;
        opacity: 1 !important;
    }

        .base-infoconta-transfer input[type="radio"]:checked {
            background: var(--primary-color);
        }

        .base-infoconta-transfer input[type="radio"]:disabled {
            background: var(--contrast-color);
        }

        .base-infoconta-transfer input[type="radio"] + label {
            color: var(--tertiary-color);
            font-weight: normal;
            margin-left: 20px;
        }

    .base-infoconta-transfer input[type="checkbox"] {
        position: relative;
        -webkit-appearance: none;
        width: 18px;
        height: 18px;
        border-radius: 5px;
        border: 2px solid var(--primary-color) !important;
        background-color: var(--white-color);
        outline: none;
        cursor: pointer;
        margin: 0 0 0 0;
        opacity: 1 !important;
    }

        .base-infoconta-transfer input[type="checkbox"] + label {
            padding-left: 30px;
            text-transform: uppercase;
            font-size: 12px;
            font-weight: 800;
            letter-spacing: 1px;
        }

        .base-infoconta-transfer input[type="checkbox"]:checked {
            background: var(--primary-color);
        }

    .base-infoconta-transfer h3.info {
        font-size: 20px;
        font-weight: normal;
        padding: 10px 0 10px 0;
        background-image: var(--gradient-color);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .base-infoconta-transfer h3.success {
        font-size: 24px;
        font-weight: normal;
        line-height: 24px;
        color: var(--success-color);
    }

        .base-infoconta-transfer h3.success span {
            font-size: 36px;
        }

    .base-infoconta-transfer iframe {
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        border: 4px solid var(--contrast-color);
        padding: 12px;
    }

    .base-infoconta-transfer .form-custom.radio {
        display: flex;
        align-items: center;
    }

    .base-infoconta-transfer input[type=radio] {
        -webkit-appearance: none;
        background: var(--white-color);
        width: 12px;
        height: 12px;
        outline: none;
        border: 2px solid var(--white-color);
        box-shadow: 0 0 0 2px var(--tertiary-color);
        border-radius: 50%;
        margin: 0 0 0 0;
        padding: 1px;
    }

        .base-infoconta-transfer input[type=radio] + label {
            color: var(--dark-color);
            font-weight: normal;
        }

    .base-infoconta-transfer.recarga .form-custom select {
        border-radius: 48px;
        margin: 0;
        padding: 16px 12px 17px 24px;
    }

    .base-infoconta-transfer.recarga .form-custom .seta span {
        top: 22px;
    }

    .base-infoconta-transfer.recarga .form-custom.radio {
        margin: 0 0 0 12px;
        padding: 0;
        width: 100%;
        height: 58px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

        .base-infoconta-transfer.recarga .form-custom.radio input {
            position: relative;
        }

        .base-infoconta-transfer.recarga .form-custom.radio label {
            position: relative;
            line-height: 16px;
            font-weight: bold;
            color: var(--tertiary-color);
            margin: 0 0 0 12px;
            padding: 0;
        }

    .base-infoconta-transfer.recarga .box-favorecido {
        border: none;
        margin: 0;
        padding: 0;
    }

        .base-infoconta-transfer.recarga .box-favorecido .interno-favorecido {
            margin: 0;
            padding: 0;
        }

            .base-infoconta-transfer.recarga .box-favorecido .interno-favorecido .nome {
                font-size: 16px;
                font-weight: bold;
            }

            .base-infoconta-transfer.recarga .box-favorecido .interno-favorecido .dados {
                font-size: 14px;
                color: var(--tertiary-color);
            }

    .base-infoconta-transfer.recarga h3 {
        color: var(--tertiary-color);
        font-size: 16px;
        font-weight: bold;
    }

    .base-infoconta-transfer.recarga .confirma-dados {
        margin: 24px 0 48px 0;
        padding: 0;
    }

        .base-infoconta-transfer.recarga .confirma-dados .confirma-dados__box {
            padding: 0 0 0 12px;
            border-left: 2px solid var(--primary-color);
        }

        .base-infoconta-transfer.recarga .confirma-dados h4 {
            color: var(--tertiary-color);
            font-size: 14px;
            letter-spacing: 0;
            text-transform: none;
            margin: 0 0 4px 0;
            padding: 0;
        }

        .base-infoconta-transfer.recarga .confirma-dados p {
            color: var(--dark-color);
            font-size: 18px;
        }

    .base-infoconta-transfer.recarga .texto-legal {
        font-size: 11px;
        margin: 36px 0 0 0;
        padding: 0;
    }

        .base-infoconta-transfer.recarga .texto-legal a {
            color: var(--primary-color);
        }

.box-favorecido {
    border: 1px solid var(--contrast-color);
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    margin-top: 25px;
}

.interno-favorecido {
    padding: 20px;
}

.controles-favorecido {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 100;
}

.nome-fav {
    margin-top: 18px !important;
}

.base-collapse-item {
    margin: 0 0 18px 0;
}

    .base-collapse-item h3 {
        font-size: 18px;
        font-weight: bold;
        color: var(--primary-color);
    }

    .base-collapse-item .well {
        background: var(--white-color);
        border-radius: 12px;
        margin: 12px 0 0 0;
        padding: 36px 48px;
    }

@media (max-width: 767px) {
    .base-infoconta-transfer {
        margin: 12px 0 0 0;
        padding: 36px 24px;
    }


        .base-infoconta-transfer .form-custom {
            margin: 12px 0 0 0;
        }

        .base-infoconta-transfer p.tipo-conta {
            margin: 30px 0 0 0;
            text-align: left;
        }

        .base-infoconta-transfer .form-custom input[type="radio"] + label {
            font-size: 14px;
            line-height: 14px;
        }

        .base-infoconta-transfer .form-custom input[type="checkbox"] + label p {
            font-size: 14px;
        }

        .base-infoconta-transfer a.btn-padrao {
            margin: 30px 0 0 0;
        }

        .base-infoconta-transfer .form-custom.radio.favorecido {
            margin: 14px 0 12px 0;
        }

            .base-infoconta-transfer .form-custom.radio.favorecido input[type="radio"] + label,
            .base-infoconta-transfer .form-custom.radio.favorecido input[type="checkbox"] + label {
                font-size: 12px !important;
                line-height: 12px;
                margin: 10px 0 0 0;
            }

        .base-infoconta-transfer .form-custom.favorecido {
            margin: 12px 0 0 0;
        }

        .base-infoconta-transfer.recarga hr {
            margin: 0 0 36px 0;
            padding: 0;
        }

        .base-infoconta-transfer.recarga h3 {
            margin: 12px 0 24px 0;
            padding: 0;
        }

        .base-infoconta-transfer.recarga .confirma-dados {
            margin: 0;
            padding: 0;
        }

            .base-infoconta-transfer.recarga .confirma-dados .confirma-dados__box {
                margin: 0 0 36px 0;
            }

            .base-infoconta-transfer.recarga .confirma-dados h4 {
                margin: 0 0 8px 0;
                padding: 0;
            }

            .base-infoconta-transfer.recarga .confirma-dados p {
                margin: 0;
                padding: 0;
            }

        .base-infoconta-transfer.recarga p.texto-legal {
            margin: 36px 0 0 0;
            text-align: center;
        }

        .base-infoconta-transfer.recarga .box-favorecido .interno-favorecido {
            text-align: center;
            margin: 0 0 24px 0;
        }

            .base-infoconta-transfer.recarga .box-favorecido .interno-favorecido .bola-iniciais {
                margin: 0 auto 18px auto;
            }

        .base-infoconta-transfer.recarga .form-custom.radio.favorecido {
            margin: 12px 0 0 0;
            padding: 0;
            width: 100%;
            height: 48px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

            .base-infoconta-transfer.recarga .form-custom.radio.favorecido input[type=checkbox] {
                position: relative;
            }

                .base-infoconta-transfer.recarga .form-custom.radio.favorecido input[type=checkbox] + label {
                    position: relative;
                    font-size: 14px !important;
                    line-height: normal;
                    font-weight: bold;
                    color: var(--tertiary-color);
                    margin: 0 0 0 12px;
                    padding: 0;
                }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-infoconta-transfer {
        margin: 12px 0 0 0;
        padding: 36px 24px;
    }

        .base-infoconta-transfer .form-custom {
            margin: 12px 0 0 0;
        }

        .base-infoconta-transfer p.tipo-conta {
            margin: 36px 0 0 0;
            text-align: left;
        }

        .base-infoconta-transfer .form-custom input[type="radio"] + label {
            font-size: 14px;
            line-height: 14px;
        }

        .base-infoconta-transfer .form-custom input[type="checkbox"] + label p {
            font-size: 14px;
        }

        .base-infoconta-transfer a.btn-padrao {
            margin: 30px 0 0 0;
        }

        .base-infoconta-transfer .form-custom {
            margin: 0px;
        }

            .base-infoconta-transfer .form-custom.radio.favorecido {
                margin: 14px 0 12px 0;
            }

                .base-infoconta-transfer .form-custom.radio.favorecido input[type="radio"] + label,
                .base-infoconta-transfer .form-custom.radio.favorecido input[type="checkbox"] + label {
                    font-size: 12px !important;
                    line-height: 12px;
                    margin: 10px 0 0 0;
                }

            .base-infoconta-transfer .form-custom.favorecido {
                margin: 12px 0 0 0;
            }
}

@media (min-width: 768px) and (max-width: 991px) {
    .col-sm-4 .form-custom.radio.favorecido {
        margin: 26px 0 0px 0;
    }
}
.base-mais-contatos {
    margin-top: 50px !important;
}

    .base-mais-contatos a .link-rodape {
        display: flex;
        color: var(--dark-color);
        margin: 0;
    }

        .base-mais-contatos a .link-rodape .base-icone {
            font-size: 30px;
            color: var(--dark-color);
            font-weight: bold;
            margin: -5px 18px 0 0;
        }

        .base-mais-contatos a .link-rodape h4 {
            color: var(--dark-color);
            font-size: 12px;
            font-weight: bold;
            margin: 0 0 4px 0;
            padding: 0;
            text-transform: uppercase;
        }

        .base-mais-contatos a .link-rodape p,
        .base-mais-contatos a .link-rodape p + p {
            margin: 0;
            padding: 0;
            line-height: 14px;
        }

            .base-mais-contatos a .link-rodape p.telefone {
                font-size: 16px;
                font-weight: bold;
                line-height: 14px;
                margin: 6px 0;
            }

            .base-mais-contatos a .link-rodape p.explica {
                font-size: 10px;
                color: var(--dark-color);
            }

@media (max-width: 767px) {
    .base-mais-contatos a .link-rodape p,
    .base-mais-contatos a .link-rodape p + p {
        margin: 0;
        padding: 0;
        line-height: 14px;
        font-size: 12px;
    }
}
.base-meuscartoes {
    border-radius: 6px;
    background: var(--white-color);
    width: 100%;
    height: 336px;
    margin: 24px 0 0 0;
    padding: 18px;
    -webkit-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.6);
    -moz-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.6);
    box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.6);

}

    .base-meuscartoes .base-controls {
        position: relative;
        width: 100%;
    }

        .base-meuscartoes .base-controls a {
            background: none;
            color: var(--dark-color);
            text-shadow: none;
            margin: 12px 0 0 0;
        }

            .base-meuscartoes .base-controls a span {
                font-size: 14px;
            }

    .base-meuscartoes .fatura-info {
        padding: 24px 0 18px 0;
        margin: 12px 0 15px 0;
        border-bottom: 1px solid var(--contrast-color);
    }

        .base-meuscartoes .fatura-info .base-parcelas {
            position: relative;
             
            border-radius: 36px;
            background: var(--white-color);
            color: var(--tertiary-color);
            text-align: center;
            margin: 0 0 0 0;
            padding: 14px 6px;
            -webkit-box-shadow: 0 0 2px 0 rgba(204, 204, 204, 0.6);
            -moz-box-shadow: 0 0 2px 0 rgba(204, 204, 204, 0.6);
            box-shadow: 0 0 2px 0 rgba(204, 204, 204, 0.6);
        }

            .base-meuscartoes .fatura-info .base-parcelas h4 {
                font-size: 10px;
                font-weight: bold;
                text-transform: none;
                margin: 0;
                padding: 0;
            }

            .base-meuscartoes .fatura-info .base-parcelas .hidden-value {
                position: absolute;
                top: 10px;
                left: 0;
                width: 100%;
                opacity: 0;
            }

                .base-meuscartoes .fatura-info .base-parcelas .hidden-value p {
                    font-size: 14px;
                    margin: 0;
                    padding: 0;
                }

                    .base-meuscartoes .fatura-info .base-parcelas .hidden-value p span {
                        font-size: 10px;
                    }

            .base-meuscartoes .fatura-info .base-parcelas:hover h4 {
                opacity: 0;
            }

            .base-meuscartoes .fatura-info .base-parcelas:hover .hidden-value {
                opacity: 1;
            }

    .base-meuscartoes .base-sobre-fatura {
        margin: 0;
        padding: 0;
    }

    .base-meuscartoes .vencimento p {
        font-size: 12px;
        color: var(--tertiary-color);
        font-weight: bold;
        margin: 0;
        padding: 0;
    }

        .base-meuscartoes .vencimento p strong {
            color: var(--dark-color);
        }

    .base-meuscartoes .btn-padrao {
        padding: 8px 0;
        font-size: 10px;
        letter-spacing: 0;
        font-weight: 400;
    }

    .base-meuscartoes h3 {
        font-size: 16px;
        font-weight: bolder;
    }

    .base-meuscartoes .card-flag {
        text-align: right;
        margin-left: -10px;
    }

#carousel-cartoes .carousel-inner {
    margin: 24px 0 0 0;
}

    #carousel-cartoes .carousel-inner .item {
        padding: 0 4px;
    }

#carousel-cartoes .card-name {
    text-align: left;
}

    #carousel-cartoes .card-name h4 {
        font-size: 14px;
        font-weight: bold;
        color: var(--primary-color);
    }

        #carousel-cartoes .card-name h4 + p {
            font-size: 16px;
             
            color: var(--tertiary-color);
        }

            #carousel-cartoes .card-name h4 + p span {
                color: var(--dark-color);
                font-weight: 900;
            }
#carousel-cartoesbloqueio .carousel-control.right,
#carousel-cartoesbloqueio .carousel-control.left,
#carousel-cartoesdesbloqueio .carousel-control.right,
#carousel-cartoesdesbloqueio .carousel-control.left {
    background-image: none !important;
}

@media (max-width: 767px) {
    .base-meuscartoes {
        height: auto
    }

        .base-meuscartoes .fatura-info .base-parcelas {
            display: flex;
            align-items: center;
            border: 1px solid var(--contrast-color);
            line-height: 30px;
            margin: 6px 0 12px 0;
            padding: 6px 0;
        }

            .base-meuscartoes .fatura-info .base-parcelas h4 {
                flex: 1;
                text-align: right;
                font-size: 12px;
            }

        .base-meuscartoes .base-controls a {
            margin: 12px 10px 0 6px;
        }

        .base-meuscartoes .fatura-info .base-parcelas .hidden-value {
            flex: 1;
            opacity: 1;
            position: relative;
            width: auto;
            top: auto;
            left: auto;
            text-align: center;
            color: var(--primary-color);
        }

            .base-meuscartoes .fatura-info .base-parcelas .hidden-value p {
                font-size: 16px;
            }

                .base-meuscartoes .fatura-info .base-parcelas .hidden-value p span {
                    font-size: 12px;
                    color: var(--primary-color);
                }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-meuscartoes {
        height: auto;
    }

        .base-meuscartoes .fatura-info .base-parcelas {
            display: flex;
            align-items: center;
            border: 1px solid var(--contrast-color);
            line-height: 30px;
            margin: 6px 0 12px 0;
            padding: 6px 0;
        }

            .base-meuscartoes .fatura-info .base-parcelas h4 {
                flex: 1;
                text-align: right;
                font-size: 12px;
            }

        .base-meuscartoes .base-controls a {
            margin: 12px 10px 0 6px;
        }

        .base-meuscartoes .fatura-info .base-parcelas .hidden-value {
            flex: 1;
            opacity: 1;
            position: relative;
            width: auto;
            top: auto;
            left: auto;
            text-align: center;
            color: var(--primary-color);
        }

            .base-meuscartoes .fatura-info .base-parcelas .hidden-value p {
                font-size: 16px;
            }

                .base-meuscartoes .fatura-info .base-parcelas .hidden-value p span {
                    font-size: 12px;
                    color: var(--primary-color);
                }
}


@media (min-width: 992px) and (max-width: 1199px) {
    .base-meuscartoes {
        height: auto;
    }
}

.base-options-mobile ul li.active .base-icone {
    color: var(--primary-color);
}

.base-options-mobile ul li.active p {
    color: var(--primary-color);
}

@media (max-width: 767px) {
    .base-options-mobile {
        display: flex !important;
        align-items: center;
        position: absolute;
        width: 84px;
        height: 100%;
        background: transparent;
        top: 0;
        right: 0;
        z-index: 1500;
        text-align: center;
    }

        .base-options-mobile > input {
            -webkit-appearance: none;
        }

            .base-options-mobile > input + label {
                flex: 1;
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
                position: relative;
                z-index: 1500;
            }

                .base-options-mobile > input + label .icon-animated {
                    position: relative;
                    width: 24px;
                    height: 100%;
                    margin: 26px auto 0 auto;
                }

                    .base-options-mobile > input + label .icon-animated > div {
                        position: absolute;
                        width: 100%;
                        height: 2px;
                        top: 0;
                        left: 0;
                        background: var(--tertiary-color);
                        transition: all .1s ease;
                    }

                        .base-options-mobile > input + label .icon-animated > div:nth-child(2),
                        .base-options-mobile > input + label .icon-animated > div:nth-child(4) {
                            top: 6px;
                        }

                        .base-options-mobile > input + label .icon-animated > div:nth-child(3) {
                            top: 12px;
                        }

            .base-options-mobile > input:checked + label .icon-animated > div:nth-child(1),
            .base-options-mobile > input:checked + label .icon-animated > div:nth-child(3) {
                width: 0;
                opacity: 0;
            }

            .base-options-mobile > input:checked + label .icon-animated > div:nth-child(2) {
                transform: rotate(42deg);
            }

            .base-options-mobile > input:checked + label .icon-animated > div:nth-child(4) {
                transform: rotate(-42deg);
            }

            .base-options-mobile > input + label + ul {
                position: absolute;
                width: 100%;
                background: var(--white-color);
                top: 70px;
                transform: translate(84px,0);
                list-style: none;
                margin: 0;
                padding: 0;
                z-index: 1000;
                box-shadow: 0 0 60px rgba(0,0,0,0.1);
                transition: all .5s ease;
            }

            .base-options-mobile > input:checked + label + ul {
                transform: translate(0,0);
            }

            .base-options-mobile > input + label + ul li {
                font-size: 10px;
                font-weight: bold;
                background: var(--white-color);
                width: 100%;
                margin: 0;
                padding: 2.4em 0;
                text-transform: uppercase;
                border-bottom: 1px solid var(--contrast-color);
            }

                .base-options-mobile > input + label + ul li a .base-icone {
                    font-size: 16px;
                }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-options-mobile {
        display: flex !important;
        align-items: center;
        position: absolute;
        width: 84px;
        height: 100%;
        background: transparent;
        top: 0;
        right: 0;
        z-index: 1500;
        text-align: center;
    }

        .base-options-mobile > input {
            -webkit-appearance: none;
        }

            .base-options-mobile > input + label {
                flex: 1;
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
                position: relative;
                z-index: 1500;
            }

                .base-options-mobile > input + label .icon-animated {
                    position: relative;
                    width: 24px;
                    height: 100%;
                    margin: 26px auto 0 auto;
                }

                    .base-options-mobile > input + label .icon-animated > div {
                        position: absolute;
                        width: 100%;
                        height: 2px;
                        top: 0;
                        left: 0;
                        background: var(--tertiary-color);
                        transition: all .1s ease;
                    }

                        .base-options-mobile > input + label .icon-animated > div:nth-child(2),
                        .base-options-mobile > input + label .icon-animated > div:nth-child(4) {
                            top: 6px;
                        }

                        .base-options-mobile > input + label .icon-animated > div:nth-child(3) {
                            top: 12px;
                        }

            .base-options-mobile > input:checked + label .icon-animated > div:nth-child(1),
            .base-options-mobile > input:checked + label .icon-animated > div:nth-child(3) {
                width: 0;
                opacity: 0;
            }

            .base-options-mobile > input:checked + label .icon-animated > div:nth-child(2) {
                transform: rotate(42deg);
            }

            .base-options-mobile > input:checked + label .icon-animated > div:nth-child(4) {
                transform: rotate(-42deg);
            }

            .base-options-mobile > input + label + ul {
                position: absolute;
                width: 100%;
                background: var(--white-color);
                top: 70px;
                transform: translate(84px,0);
                list-style: none;
                margin: 0;
                padding: 0;
                z-index: 1000;
                box-shadow: 0 0 60px rgba(0,0,0,0.1);
                transition: all .5s ease;
            }

            .base-options-mobile > input:checked + label + ul {
                transform: translate(0,0);
            }

            .base-options-mobile > input + label + ul li {
                font-size: 10px;
                font-weight: bold;
                background: var(--white-color);
                width: 100%;
                margin: 0;
                padding: 2.4em 0;
                text-transform: uppercase;
                border-bottom: 1px solid var(--contrast-color);
            }

                .base-options-mobile > input + label + ul li a .base-icone {
                    font-size: 16px;
                }
}
.base-ordenar {
    text-align: center;
}

    .base-ordenar p {
        font-size: 12px;
        color: var(--tertiary-color);
        text-transform: uppercase;
        font-weight: bold;
    }

        .base-ordenar p span {
            color: var(--success-color);
        }

    .base-ordenar .base-icone {
        background-color: var(--white-color);
        width: 48px;
        height: 48px;
        margin: 10px auto;
        border-radius: 50%;
        text-align: center;
        padding: 12px;
        font-size: 16px;
        color: var(--primary-color);
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

.base-pagination {
    margin: 48px 0 0 0;
    display: flex;
    justify-content: center;
}

    .base-pagination ul {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
    }

        .base-pagination ul li {
            display: block;
            margin: 0 4px;
            padding: 0;
        }

            .base-pagination ul li a {
                display: block;
                font-size: 14px;
                text-align: center;
                text-decoration: none;
                margin: 0;
                padding: 2px 0;
                border-radius: 2px;
                width: 24px;
                height: 24px;
                color: var(--white-color);
                background-color: var(--contrast-color);
            }

            .base-pagination ul li.active a {
                color: var(--white-color);
                background-color: var(--primary-color);
            }

            .base-pagination ul li.nav a {
                color: var(--dark-color);
                font-size: 11px;
                background-color: transparent;
                line-height: 22px;
            }

            .base-pagination ul li.nav.disabled a {
                color: var(--tertiary-color);
            }

ul.pagination li a {
    color: var(--primary-color);
}

ul.pagination li.active a {
    border: 1px solid var(--primary-color);
    background-color: var(--primary-color);
    color: var(--white-color);
}
.base-papel {
    margin: 36px 0 0 0;
}

    .base-papel h4 {
        color: var(--primary-color);
        font-size: 16px;
        font-weight: bold;
    }

        .base-papel h4 + p {
            font-size: 24px;
            letter-spacing: 1px;
            font-weight: 400;
            color: var(--dark-color);
        }

.base-tabela {
    position: relative;
    margin: 0;
    padding: 0;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .base-tabela .t-header {
        color: var(--white-color);
        background-color: var(--primary-color);
        padding: 16px 24px 16px 24px;
    }

        .base-tabela .t-header h2 {
            font-size: 12px;
            color: var(--white-color);
            font-weight: bold;
            letter-spacing: 1px;
            text-transform: uppercase;
            margin: 0;
            padding: 0;
        }

    .base-tabela.parceladas .t-header h2 {
        margin: 8px 0 0 0;
        padding: 0;
    }

    .base-tabela.parceladas .t-header p.data {
        font-size: 14px;
        line-height: 16px;
        margin: 0;
        padding: 0;
    }

    .base-tabela .t-body {
        background: var(--white-color);
        z-index: 1;
    }

        .base-tabela .t-body .class-data-conta:nth-child(odd) {
            background: var(--white-color);
        }

        .base-tabela .t-body .data {
            position: absolute;
            top: 0;
            left: 0;
            width: 78px;
            height: 100%;
            text-align: center;
            background: var(--white-color);
            margin: 0;
            padding: 17px 0 0 0;
            box-shadow: 0 0 60px rgba(0,0,0,.1);
            z-index: 2;
        }

            .base-tabela .t-body .data h2 {
                font-size: 13px;
                font-weight: 600;
                color: var(--tertiary-color);
                line-height: 18px;
            }

        .base-tabela .t-body .line-table {
            position: relative;
            padding: 18px 0 18px 24px;
        }

            .base-tabela .t-body .line-table.laranja {
                background-color: var(--concrete);
            }

                .base-tabela .t-body .line-table.laranja p.valor {
                    color: var(--dark-color);
                }

    .base-tabela.parceladas .t-body .line-table h4 {
        margin: 9px 0 0 0;
    }

    .base-tabela .t-body .line-table:before {
        content: "";
        position: absolute;
        top: 0;
        left: 39px;
        width: 1px;
        height: 100%;
        background: none;
        border-left: 1px solid var(--contrast-color);
        z-index: 1;
    }

    .base-tabela.parceladas .t-body .line-table:before {
        display: none;
    }

    .base-tabela .t-body .line-table .base-icone {
        text-align: center;
        font-size: 30px;
        color: var(--tertiary-color);
    }

    .base-tabela .t-body .line-table p {
        font-size: 11px;
        font-weight: 400;
        color: var(--tertiary-color);
        margin: 3px 0 0 0;
        padding: 0;
        text-transform: uppercase;
    }

        .base-tabela .t-body .line-table p.valor {
            font-size: 15px;
            margin: 5px 0 0 0;
            font-weight: 900;
        }

    .base-tabela .t-body .line-table.payment {
        color: var(--white-color);
        background: var(--tertiary-color);
    }

        .base-tabela .t-body .line-table.payment:before {
            display: none;
        }

        .base-tabela .t-body .line-table.payment h4 {
            margin: 7px 0 0 0;
            font-size: 12px;
            text-transform: uppercase;
            font-weight: bold !important;
        }

        .base-tabela .t-body .line-table.payment .base-icone,
        .base-tabela .t-body .line-table.payment p.valor {
            color: var(--white-color);
        }

    .base-tabela .t-body .line-table button.expand {
        width: 100%;
        background: none;
        border: none;
        outline: none;
        margin: 12px 0 0 0;
    }

        .base-tabela .t-body .line-table button.expand span {
            transform: rotate(-90deg);
        }

    .base-tabela .t-body .table-detail .well {
        background: var(--white-color);
        border: 0px;
        border-top: 1px solid var(--contrast-color);
        border-bottom: 1px solid var(--contrast-color);
        margin: 0;
        padding: 12px 0 12px 4px;
        border-radius: 0px;
        box-shadow: none;
    }

        .base-tabela .t-body .table-detail .well button {
            display: flex;
            border: none;
            background: none;
            margin: 0;
            padding: 6px;
        }

            .base-tabela .t-body .table-detail .well button .base-icone {
                text-align: center;
                font-size: 24px;
                margin: 1px 0 0 8px;
                color: var(--tertiary-color);
            }

            .base-tabela .t-body .table-detail .well button h3 {
                text-align: left;
                font-size: 12px;
                font-weight: normal;
                margin: 5px 0 0 16px;
                padding: 0;
                color: var(--dark-color);
            }

    .base-tabela.conta .t-body .line-table {
        padding: 0;
    }

        .base-tabela.conta .t-body .line-table .padding-ajuste {
            position: relative;
            padding: 20px 0;
        }

            .base-tabela.conta .t-body .line-table .padding-ajuste h3 {
                font-size: 12px;
                letter-spacing: 0;
                font-weight: normal;
                margin: 11px 0 0 18px;
            }

            .base-tabela.conta .t-body .line-table .padding-ajuste h5 {
                font-size: 12px;
                font-weight: bold;
                text-transform: uppercase;
                letter-spacing: 0px;
                margin: 11px 0 0 0;
            }

            .base-tabela.conta .t-body .line-table .padding-ajuste p.valor {
                margin: 6px 0 0 5px;
                padding: 0;
            }

                .base-tabela.conta .t-body .line-table .padding-ajuste p.valor.positivo {
                    color: var(--success-color);
                }

                .base-tabela.conta .t-body .line-table .padding-ajuste p.valor.negativo {
                    color: var(--tertiary-color);
                }

        .base-tabela.conta .t-body .line-table.payment .padding-ajuste {
            padding: 18px 0 18px 24px;
        }

            .base-tabela.conta .t-body .line-table.payment .padding-ajuste h4 {
                margin: 8px 0 0 0;
            }

            .base-tabela.conta .t-body .line-table.payment .padding-ajuste p.valor {
                margin: 0;
            }

    .base-tabela.vpm .t-body .line-table .padding-ajuste {
        position: relative;
    }

        .base-tabela.vpm .t-body .line-table .padding-ajuste h5 {
            letter-spacing: 0px;
            margin: 11px 0 0 0;
        }

        .base-tabela.vpm .t-body .line-table .padding-ajuste p.valorVPM {
            margin: 6px 0 0 5px;
            padding: 0;
        }

    .base-tabela .t-body .line-table .padding-ajuste .base-seta button span {
        transform: rotate(90deg);
    }

    .base-tabela .t-body .line-table .padding-ajuste .base-seta.collapsed button span {
        transform: rotate(-90deg);
    }

    .base-tabela .table-flex .well {
        margin: 0;
        padding: 0;
        background-color: var(--white-color);
        border: none;
        border-radius: 0;
        border-bottom: 1px solid var(--contrast-color);
        box-shadow: none;
    }

    .base-tabela .table-flex:nth-child(odd) .well {
        background-color: var(--concrete);
    }

.base-tabela-pj {
    position: relative;
    margin: 0;
    padding: 0;
    margin-bottom: 100px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .base-tabela-pj .t-header {
        color: var(--white-color);
        background-color: #37404E;
        padding: 16px 24px 16px 24px;
    }

        .base-tabela-pj .t-header h2 {
            font-size: 12px;
            color: var(--white-color);
            font-weight: bold;
            letter-spacing: 1px;
            text-transform: uppercase;
            margin: 0;
            padding: 0;
        }

    .base-tabela-pj.parceladas .t-header h2 {
        margin: 8px 0 0 0;
        padding: 0;
    }

    .base-tabela-pj.parceladas .t-header p.data {
        font-size: 14px;
        line-height: 16px;
        margin: 0;
        padding: 0;
    }

    .base-tabela-pj .t-body {
        background: var(--white-color);
        z-index: 1;
    }

        .base-tabela-pj .t-body .class-data-conta:nth-child(odd) {
            background: var(--white-color);
        }

        .base-tabela-pj .t-body .data {
            position: absolute;
            top: 0;
            left: 0;
            width: 78px;
            height: 100%;
            text-align: center;
            background: var(--white-color);
            margin: 0;
            padding: 17px 0 0 0;
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
            z-index: 2;
        }

            .base-tabela-pj .t-body .data h2 {
                font-size: 13px;
                font-weight: 600;
                color: var(--tertiary-color);
                line-height: 18px;
            }

        .base-tabela-pj .t-body .line-table {
            position: relative;
            padding: 18px 0 18px 24px;
        }

            .base-tabela-pj .t-body .line-table.laranja {
                background-color: var(--concrete);
            }

                .base-tabela-pj .t-body .line-table.laranja p.valor {
                    color: var(--dark-color);
                }

    .base-tabela-pj.parceladas .t-body .line-table h4 {
        margin: 9px 0 0 0;
    }

    .base-tabela-pj .t-body .line-table:before {
        content: "";
        position: absolute;
        top: 0;
        left: 39px;
        width: 1px;
        height: 100%;
        background: none;
        border-left: 1px solid var(--contrast-color);
        z-index: 1;
    }

    .base-tabela-pj.parceladas .t-body .line-table:before {
        display: none;
    }

    .base-tabela-pj .t-body .line-table .base-icone {
        text-align: center;
        font-size: 30px;
        color: var(--tertiary-color);
    }

    .base-tabela-pj .t-body .line-table p {
        font-size: 11px;
        font-weight: 400;
        color: var(--tertiary-color);
        margin: 3px 0 0 0;
        padding: 0;
        text-transform: uppercase;
    }

        .base-tabela-pj .t-body .line-table p.valor {
            font-size: 15px;
            margin: 5px 0 0 0;
            font-weight: 900;
        }

    .base-tabela-pj .t-body .line-table.payment {
        color: var(--white-color);
        background: var(--tertiary-color);
    }

        .base-tabela-pj .t-body .line-table.payment:before {
            display: none;
        }

        .base-tabela-pj .t-body .line-table.payment h4 {
            margin: 7px 0 0 0;
            font-size: 12px;
            text-transform: uppercase;
            font-weight: bold !important;
        }

        .base-tabela-pj .t-body .line-table.payment .base-icone,
        .base-tabela-pj .t-body .line-table.payment p.valor {
            color: var(--white-color);
        }

    .base-tabela-pj .t-body .line-table button.expand {
        width: 100%;
        background: none;
        border: none;
        outline: none;
        margin: 12px 0 0 0;
    }

        .base-tabela-pj .t-body .line-table button.expand span {
            transform: rotate(-90deg);
        }

    .base-tabela-pj .t-body .table-detail .well {
        background: var(--white-color);
        border: 0px;
        border-top: 1px solid var(--contrast-color);
        border-bottom: 1px solid var(--contrast-color);
        margin: 0;
        padding: 12px 0 12px 4px;
        border-radius: 0px;
        box-shadow: none;
    }

        .base-tabela-pj .t-body .table-detail .well button {
            display: flex;
            border: none;
            background: none;
            margin: 0;
            padding: 6px;
        }

            .base-tabela-pj .t-body .table-detail .well button .base-icone {
                text-align: center;
                font-size: 24px;
                margin: 1px 0 0 8px;
                color: var(--tertiary-color);
            }

            .base-tabela-pj .t-body .table-detail .well button h3 {
                text-align: left;
                font-size: 12px;
                font-weight: normal;
                margin: 5px 0 0 16px;
                padding: 0;
                color: var(--dark-color);
            }

    .base-tabela-pj.conta .t-body .line-table {
        padding: 0;
    }

        .base-tabela-pj.conta .t-body .line-table .padding-ajuste {
            position: relative;
            padding: 20px 0;
        }

            .base-tabela-pj.conta .t-body .line-table .padding-ajuste h3 {
                font-size: 12px;
                letter-spacing: 0;
                font-weight: normal;
                margin: 11px 0 0 18px;
            }

            .base-tabela-pj.conta .t-body .line-table .padding-ajuste h5 {
                font-size: 12px;
                font-weight: bold;
                text-transform: uppercase;
                letter-spacing: 0px;
                margin: 11px 0 0 0;
            }

            .base-tabela-pj.conta .t-body .line-table .padding-ajuste p.valor {
                margin: 6px 0 0 5px;
                padding: 0;
            }

                .base-tabela-pj.conta .t-body .line-table .padding-ajuste p.valor.positivo {
                    color: var(--success-color);
                }

                .base-tabela-pj.conta .t-body .line-table .padding-ajuste p.valor.negativo {
                    color: var(--tertiary-color);
                }

        .base-tabela-pj.conta .t-body .line-table.payment .padding-ajuste {
            padding: 18px 0 18px 24px;
        }

            .base-tabela-pj.conta .t-body .line-table.payment .padding-ajuste h4 {
                margin: 8px 0 0 0;
            }

            .base-tabela-pj.conta .t-body .line-table.payment .padding-ajuste p.valor {
                margin: 0;
            }

    .base-tabela-pj.vpm .t-body .line-table .padding-ajuste {
        position: relative;
    }

        .base-tabela-pj.vpm .t-body .line-table .padding-ajuste h5 {
            letter-spacing: 0px;
            margin: 11px 0 0 0;
        }

        .base-tabela-pj.vpm .t-body .line-table .padding-ajuste p.valorVPM {
            margin: 6px 0 0 5px;
            padding: 0;
        }

    .base-tabela-pj .t-body .line-table .padding-ajuste .base-seta button span {
        transform: rotate(90deg);
    }

    .base-tabela-pj
    .t-body
    .line-table
    .padding-ajuste
    .base-seta.collapsed
    button
    span {
        transform: rotate(-90deg);
    }

    .base-tabela-pj .table-flex .well {
        margin: 0;
        padding: 0;
        background-color: var(--white-color);
        border: none;
        border-radius: 0;
        border-bottom: 1px solid var(--contrast-color);
        box-shadow: none;
    }

    .base-tabela-pj .table-flex:nth-child(odd) .well {
        background-color: var(--concrete);
    }


@media (max-width: 767px) {
    .base-tabela .t-body .line-table.payment h4,
    .base-tabela .t-body .line-table.payment p.valor {
        margin: 0;
    }

    .base-tabela .t-body .line-table.payment h4 {
        font-size: 11px;
    }

    .base-tabela .t-body .line-table.payment {
        padding: 18px 0 18px 0px;
    }

    .base-tabela .t-body .data {
        width: 60px;
        height: 60px;
        padding: 14px 0 0 0;
        box-shadow: 0 0 60px rgba(0,0,0,0.2);
    }

        .base-tabela .t-body .data h2 {
            font-size: 16px;
            line-height: 16px;
        }

    .base-tabela .t-body .line-table {
        padding: 18px 0 18px 12px;
    }

        .base-tabela .t-body .line-table:before {
            left: 30px;
        }

    .base-tabela.conta .t-body .line-table .padding-ajuste {
        position: relative;
    }

        .base-tabela.conta .t-body .line-table .padding-ajuste h3 {
            margin: 0;
            pointer-events: none;
        }

        .base-tabela.conta .t-body .line-table .padding-ajuste h5 {
            text-transform: none;
            font-size: 13px;
            margin: 6px 0 0 0;
            pointer-events: none;
        }

        .base-tabela.conta .t-body .line-table .padding-ajuste p.valor {
            font-size: 18px;
            margin: 2px 0 0 0;
            padding: 0;
            pointer-events: none;
        }

    .base-tabela .t-body .line-table .padding-ajuste .base-seta {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 900;
    }

        .base-tabela .t-body .line-table .padding-ajuste .base-seta.cancel {
            top: -24px
        }

        .base-tabela .t-body .line-table .padding-ajuste .base-seta button {
            position: absolute;
            right: 24px;
            bottom: 42px;
            text-align: right;
        }

            .base-tabela .t-body .line-table .padding-ajuste .base-seta button span {
                color: var(--tertiary-color);
            }

    .base-tabela.conta .t-body .line-table.payment .padding-ajuste {
        padding: 0px 0 0px 24px;
    }

    .base-tabela .t-body .table-detail .well {
        padding: 12px 0 12px 22px;
    }

        .base-tabela .t-body .table-detail .well button {
            padding: 18px 6px;
        }

    .base-tabela.parceladas .t-header,
    .base-tabela.parceladas .t-body .line-table {
        text-align: center;
    }

        .base-tabela.parceladas .t-header p.data {
            margin: 4px 0 0 0;
        }

        .base-tabela.parceladas .t-body .line-table h4 {
            font-size: 14px;
            margin: 3px 0 0 0;
        }

        .base-tabela.parceladas .t-body .line-table p.valor {
            font-family: 'Varela Round', sans-serif;
            font-size: 16px;
            margin: 4px 0 0 0;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-tabela .t-body .line-table.payment h4,
    .base-tabela .t-body .line-table.payment p.valor {
        margin: 0;
    }

    .base-tabela .t-body .line-table.payment h4 {
        font-size: 11px;
    }

    .base-tabela .t-body .line-table.payment {
        padding: 18px 0 18px 0px;
    }

    .base-tabela .t-body .data {
        width: 60px;
        height: 60px;
        padding: 14px 0 0 0;
        box-shadow: 0 0 60px rgba(0,0,0,0.2);
    }

        .base-tabela .t-body .data h2 {
            font-size: 16px;
            line-height: 16px;
        }

    .base-tabela .t-body .line-table {
        padding: 18px 0 18px 12px;
    }

        .base-tabela .t-body .line-table:before {
            left: 30px;
        }

    .base-tabela.conta .t-body .line-table .padding-ajuste {
        position: relative;
    }

        .base-tabela.conta .t-body .line-table .padding-ajuste h3 {
            font-size: 14px;
            margin: 0;
            padding: 7px 0 0 18px;
            pointer-events: none;
        }

        .base-tabela.conta .t-body .line-table .padding-ajuste h5 {
            font-size: 12px;
            text-transform: none;
            margin: 0;
            padding: 8px 0 0 0;
            pointer-events: none;
        }

        .base-tabela.conta .t-body .line-table .padding-ajuste p.valor {
            font-size: 14px;
            margin: 0;
            padding: 4px 0 0 0;
            pointer-events: none;
        }

    .base-tabela .t-body .line-table .padding-ajuste .base-seta {
        text-align: center;
        margin: 0;
        padding: 0;
    }

        .base-tabela .t-body .line-table .padding-ajuste .base-seta button {
            margin: 0;
            padding: 0;
        }

            .base-tabela .t-body .line-table .padding-ajuste .base-seta button span {
                color: var(--tertiary-color);
            }

    .base-tabela.conta .t-body .line-table.payment .padding-ajuste {
        padding: 0px 0 0px 24px;
    }

    .base-tabela .t-body .table-detail .well {
        padding: 12px 0 12px 22px;
    }

        .base-tabela .t-body .table-detail .well button {
            padding: 18px 6px;
        }

    .base-tabela.parceladas .t-header,
    .base-tabela.parceladas .t-body .line-table {
        text-align: center;
    }

        .base-tabela.parceladas .t-header p.data {
            margin: 4px 0 0 0;
        }

        .base-tabela.parceladas .t-body .line-table h4 {
            font-size: 14px;
            margin: 3px 0 0 0;
        }

        .base-tabela.parceladas .t-body .line-table p.valor {
            font-family: 'Varela Round', sans-serif;
            font-size: 16px;
            margin: 4px 0 0 0;
        }
}

.base-troca-papel {
    display: flex;
    margin: 60px 0 18px 0;
    align-items: center;
    justify-content: flex-end;
}

    .base-troca-papel .titulo {
        font-size: 12px;
        font-weight: bold;
        color: var(--tertiary-color);
        text-transform: uppercase;
    }

    .base-troca-papel .paginacao {
        display: flex;
        margin: 0 0 0 18px;
    }

        .base-troca-papel .paginacao > a {
            color: var(--tertiary-color);
            font-weight: bold;
            margin: 1px 0 0 0;
        }

            .base-troca-papel .paginacao > a.active {
                color: var(--dark-color);
            }

    .base-troca-papel ul {
        list-style: none;
        padding: 0;
        margin: 0 6px;
    }

        .base-troca-papel ul li {
            display: inline-block;
            margin: 0;
            padding: 0;
        }

            .base-troca-papel ul li a {
                color: var(--primary-color);
                text-decoration: none;
            }

            .base-troca-papel ul li.active a {
                color: var(--tertiary-color);
                pointer-events: none;
            }

@media (max-width: 767px) {
    .base-troca-papel {
        margin: 24px 0 18px 0;
        justify-content: flex-start;
    }
}
.base-utilizacao {
    display: flex;
    flex-wrap: wrap;
    margin: 18px -24px 0 0;
}

    .base-utilizacao .item {
        flex-basis: 192px;
        text-align: center;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        margin: 12px 24px 12px 0;
        padding: 24px;
        border-radius: 12px;
        cursor: pointer;
    }

        .base-utilizacao .item .base-icone {
            color: var(--tertiary-color);
            font-size: 36px;
            margin: 0;
        }

        .base-utilizacao .item h4 {
            font-size: 14px;
            color: var(--primary-color);
             
            margin: 4px 0 0 0;
            padding: 0;
        }

        .base-utilizacao .item .toggle-switch {
            text-align: center;
            width: 100%;
            height: auto;
            margin: 12px 0 0 0;
        }

@media (max-width: 767px) {
    .base-utilizacao .item {
        flex-basis: 100%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-utilizacao .item {
        flex-basis: 30%;
    }
}
.bg-captura {
    width: 100%;
    height: 100%;
    background-color: var(--dark-color);
    position: fixed;
    z-index: 1234;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: scale(0.9);
    transition: 0.3s ease;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

    .bg-captura.abre-selfie {
        transform: scale(1);
        opacity: 1;
        visibility: visible;
        pointer-events: visible;
    }

        .bg-captura.abre-selfie .titulo-captura {
            transform: scale(1);
            opacity: 1;
            margin-bottom: 20px;
        }

        .bg-captura.abre-selfie .foto-selfie {
            transform: scale(1);
            opacity: 1;
        }

        .bg-captura.abre-selfie .tirar-foto {
            transform: scale(1);
            opacity: 1;
        }

        .bg-captura.abre-selfie .tirar-foto.fecha {
            transform: scale(0);
            opacity: 0;
        }

.titulo-captura {
     
    font-size: 28px;
    color: var(--white-color);
    margin-top: 70px;
    transition: .3s ease;
    transition-delay: .4s;
    transform: scale(0.9);
    opacity: 0;
}

.foto-selfie {
    width: 460px;
    height: 451px;
    background-size: cover;
    background-position: center;
    border-radius: 15px;
    margin-top: 10px;
    margin: 0 auto;
    transition: 0.3s ease;
    transform: scale(0.9);
    transition-delay: 0.6s;
    opacity: 0;
}

.tirar-foto {
    width: 83px;
    height: 83px;
    background-color: var(--primary-color);
    box-shadow: 0 2px 34px 0 rgba(0, 0, 0, 0.5);
    border-radius: 100px;
    color: var(--white-color);
    font-size: 40px;
    padding-top: 14px;
    transition: 0.3s ease;
    transform: scale(0.1);
    cursor: pointer;
    opacity: 0;
    position: absolute;
    left: 50%;
    top: 30px;
    margin-left: -41px;
}

.fechar-captura {
    color: var(--white-color);
    font-size: 46px;
    transition: 0.3s ease;
    opacity: 1;
    cursor: pointer;
    text-align: right;
}
.boas-vindas {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

    .boas-vindas h2 {
        color: var(--primary-color);
        font-size: 35px;
    }

    .boas-vindas p {
        margin-top: 0px;
        margin-bottom: 40px;
        font-size: 18px;
        color: var(--dark-color);
    }

@media (max-width: 767px) {
    .boas-vindas {
        width: 100%;
        height: 100%;
        display: block;
    }

        .boas-vindas h2 {
            font-family: 'Varela Round', sans-serif;
            color: var(--primary-color);
            font-size: 18px;
        }

        .boas-vindas p {
            margin-top: 40px;
            margin-bottom: 40px;
            font-family: 'Varela Round', sans-serif;
            font-size: 14px;
            color: var(--dark-color);
        }
}
.borda-agenda {
    border-right: 2px solid var(--contrast-color);
}

    .borda-agenda hr {
        margin-top: 15px;
        margin-bottom: 15px;
    }

@media (max-width: 767px) {
    .borda-agenda {
        border-right: none;
    }
}
.botao-data {
    border-radius: 8px;
    border: 1px solid #b7b7b7;
    position: relative;
    width: 100%;
    display: flex;
    padding: 4px 20px 10px;
    align-items: center;
    height: 50px;
    cursor: pointer;
}

    .botao-data.checked {
        border: 1px solid var(--colorfull);
    }

        .botao-data.checked .data-atual {
            color: var(--colorfull);
        }

    .botao-data .texto-data {
        font-size: 10px;
        display: block;
    }

.box-agendamento {
    padding: 20px;
    background-color: var(--white-color);
    border-radius: 10px;
    position: relative;
    display: block;
    height: 110px;
}

@media (max-width: 767px) {
    .box-agendamento {
        height: auto;
        margin-top: 30px;
    }

        .box-agendamento .valor-saldo {
            text-align: center;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .box-agendamento {
        margin-top: 20px;
    }
}
/***************** CONTRATOS ****/
.box-contrato.acesse {
    border: none;
    margin: 0;
    padding: 36px 24px 30px 24px;
    box-shadow: 0 2px 24px rgba(0,0,0,0.1);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}

    .box-contrato.acesse .acesse__content {
        margin: 0;
        padding: 0;
    }

    .box-contrato.acesse h4 {
        font-size: 18px;
        color: var(--primary-color);
        font-weight: bold;
        width: 100%;
        margin: 0 0 6px 0;
        padding: 0;
    }

    .box-contrato.acesse h5 {
        font-size: 14px;
        font-weight: normal;
        margin: 0;
        padding: 0;
    }

    .box-contrato.acesse p {
        font-size: 14px;
        color: var(--tertiary-color);
        line-height: normal;
        margin: 24px 0 18px 0;
        padding: 0;
    }

    .box-contrato.acesse .icon-text {
        font-size: 30px;
        color: var(--tertiary-color);
        margin: 0 0 18px 0;
        padding: 0;
    }

    .box-contrato.acesse a {
        color: var(--primary-color);
        font-weight: bold;
        text-decoration: underline;
        margin: 24px 0 0 0;
        padding: 0;
    }

@media (max-width: 767px) {
    .box-contrato {
        padding: 20px;
        height: auto;
        font-size: 12px;
        line-height: 18px;
        text-align: center;
        align-items: center;
    }

        .box-contrato.acesse {
            align-items: center;
            margin: 24px 0 0 0;
            padding: 24px;
        }
}
.box-escolha-invest {
    width: 100%;
    background-color: var(--white-color);
    border-radius: 10px;
    padding: 40px 40px 60px 40px;
}

@media (max-width: 767px) {
    .box-escolha-invest .titulo-escolha {
        display: block;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .box-escolha-invest .titulo-escolha {
        display: block;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .box-escolha-invest {
        padding: 30px 30px 20px 30px !important;
        height: 430px;
    }

        .box-escolha-invest .titulo-escolha {
            display: block;
        }
}
.box-invest-bar {
    width: 100%;
    padding: 20px;
    background-color: var(--white-color);
    border-radius: 10px;
    margin-top: 43px;
}

    .box-invest-bar > .slimScrollDiv {
        min-width: 290px;
    }

    .box-invest-bar .progressbar-invest {
        font-size: 11px;
        font-weight: 900;
        margin-bottom: 20px;
    }

        .box-invest-bar .progressbar-invest:last-of-type {
            margin-bottom: 10px;
        }

        .box-invest-bar .progressbar-invest .valor {
            text-align: right;
            margin-bottom: 5px;
        }

        .box-invest-bar .progressbar-invest .prog-invest {
            height: 6px;
            margin-bottom: 5px;
            overflow: hidden;
            background-color: var(--concrete);
            border-radius: 4px;
            -webkit-box-shadow: none !important;
            box-shadow: none !important;
        }

            .box-invest-bar .progressbar-invest .prog-invest .progress-bar {
                -webkit-box-shadow: none !important;
                box-shadow: none !important;
            }

        .box-invest-bar .progressbar-invest .perc-invest {
            text-align: right;
            color: var(--colorfull);
            font-size: 11px;
        }

    .box-invest-bar .saldo-invest p {
        font-size: 16px;
        font-size: 16px !important;
        line-height: 16px;
    }

    .box-invest-bar .valor-saldo {
        color: var(--success-color) !important;
        font-size: 20px !important;
        font-weight: 900;
        margin-top: 5px;
        text-align: right;
    }

        .box-invest-bar .valor-saldo span {
            font-size: 16px !important;
            color: var(--success-color) !important;
        }

    .box-invest-bar .consolidado-invest p {
        font-size: 13px;
        line-height: 13px;
        color: var(--dark-color);
    }

    .box-invest-bar .consolidado-invest .valor-consolidado {
        color: var(--tertiary-color) !important;
        font-size: 16px !important;
        font-weight: 900;
        margin-top: 5px;
        text-align: right;
    }

        .box-invest-bar .consolidado-invest .valor-consolidado span {
            font-size: 11px !important;
            color: var(--tertiary-color) !important;
        }

#chart_div {
    width: 100%;
    height: 193px;
}

    #chart_div svg {
        height: auto;
        -webkit-transform: rotate(0);
        transform: rotate(0);
        width: auto;
    }

@media (max-width: 767px) {
    .box-invest-bar > .slimScrollDiv {
        min-width: 215px;
    }
}

.box-modal {
    width: 600px;
    height: auto;
    border-radius: 20px;
    background-color: var(--white-color);
    position: fixed;
    z-index: 11;
    top: 10%;
    margin-top: 0;
    left: 50%;
    margin-left: -300px;
    padding: 60px;
    text-align: center;
    visibility: none;
    transition: .3s ease;
    transition-delay: 0s;
    pointer-events: none;
    transform: scale(0.8);
    opacity: 0;
}

    .box-modal.abre-modal {
        visibility: visible;
        pointer-events: visible;
        transform: scale(1);
        opacity: 1;
        transition-delay: .3s;
    }

        .box-modal.abre-modal .btn-aviso {
            transform: scale(1);
            opacity: 1;
        }

.bola-aviso {
    width: 170px;
    height: 170px;
    background-color: rgba(208, 2, 27, 0.1);
    margin: 0 auto;
    border-radius: 120px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    transition: .3s ease;
    transition-delay: .5s;
    transform: scale(0.8);
    opacity: 0;
}

.modal-sucesso-selfie .bola-aviso,
.modal-sucesso .bola-aviso,
.modal-enviado .bola-aviso {
    background-color: rgba(242, 133, 2, 0.15);
}

.box-modal.abre-modal .bola-aviso {
    transform: scale(1);
    opacity: 1;
}

.bola-aviso i {
    font-size: 73px;
    color: var(--erro-color);
}

.bola-aviso.token {
    background-color: transparent;
    border: 2px solid var(--colorfull);
    width: 120px;
    height: 120px;
}

    .bola-aviso.token i {
        font-size: 62px;
        color: var(--dark-color);
    }

.modal-sucesso-selfie .bola-aviso i,
.modal-sucesso .bola-aviso i,
.modal-enviado .bola-aviso i {
    font-size: 73px;
    color: var(--primary-color);
}

.box-modal.abre-modal .titulo-aviso {
    transform: scale(1);
    opacity: 1;
}

.titulo-aviso {
     
    font-size: 30px;
    color: var(--dark-color);
    margin-top: 20px;
    transition: .3s ease;
    transition-delay: .4s;
    transform: scale(0.8);
    opacity: 0;
}

.box-modal.abre-modal .texto-aviso {
    transform: scale(1);
    opacity: 1;
}

.texto-aviso {
    font-size: 18px;
    text-align: center;
    color: var(--tertiary-color);
    margin-top: 20px;
    transition: .3s ease;
    transition-delay: .4s;
    transform: scale(0.8);
    opacity: 0;
}

.box-modal.abre-modal .fechar-modal {
    transform: scale(1);
    opacity: 1;
}

.fechar-modal {
    position: absolute;
    right: 20px;
    top: 20px;
    color: var(--dark-color);
    font-size: 46px;
    transition: .3s ease;
    transition-delay: .7s;
    transform: scale(0.8);
    opacity: 0;
    cursor: pointer;
}

@media (max-width: 767px) {
    .box-modal {
        width: 90%;
        border-radius: 20px;
        margin-left: -45%;
        padding: 20px;
    }

        .box-modal.modal-produtos {
            text-align: left;
            position: absolute;
        }

            .box-modal.modal-produtos h2 {
                margin: 60px 0 0 0;
            }
}
.box-padrao-emprestimo {
    background-color: var(--white-color);
    border-radius: 4px;
    padding: 0;
    box-shadow: 0 0 60px rgba(0,0,0,0.1);
    margin-top: 20px;
    height: 200px;
}

    .box-padrao-emprestimo .row {
        height: 100%
    }

    .box-padrao-emprestimo .titulo {
        font-size: 16px;
        font-weight: bold !important;
        margin-bottom: 20px;
    }

    .box-padrao-emprestimo p {
        color: var(--tertiary-color);
        font-size: 14px;
        margin-bottom: 30px;
    }

    .box-padrao-emprestimo .texto {
        padding: 20px !important;
    }

    .box-padrao-emprestimo .btn-saiba-mais {
        display: inline-block;
        border-radius: 30px;
        width: 100%;
        max-width: 130px;
        padding: 12px;
        text-align: center;
        outline: none;
        text-transform: uppercase;
        font-size: 12px;
        letter-spacing: 2px;
        cursor: pointer;
        border: 2px solid var(--primary-color);
        background-color: transparent;
        color: var(--primary-color);
    }

.box-emprestimo {
    background-color: var(--white-color);
    box-shadow: 0 0 60px rgba(0,0,0,0.1);
    margin-top: 20px;
}

    .box-emprestimo .titulo {
        padding: 20px;
        font-size: 16px;
        font-weight: bold !important;
    }

.itemEmprestimo:nth-child(odd) .btn-emprestimo,
.itemEmprestimo:nth-child(odd) .lista-emprestimo-aberta .row {
    background-color: var(--concrete);
}

.pgt-emprestimo {
    float: left;
    width: 16px;
    height: 16px;
    border-radius: 50%;
}

.pgt-dia {
    background-color: var(--success-color);
}

.pgt-atraso {
    background-color: var(--alert-color);
}
    .box-white.outline {
        box-shadow: none;
    }

    .box-white h4 {
        font-size: 16px;
        color: var(--dark-color);
        line-height: 24px;
        margin: 0 0 24px 0;
        padding: 0;
    }

    .box-white .txt-pequeno p {
        color: var(--tertiary-color);
        font-size: 9px;
        text-align: justify;
        line-height: 1.4;
    }

        .box-white .txt-pequeno p span {
            color: var(--primary-color);
            font-size: 9px;
            line-height: 1.5;
            text-align: justify;
            margin: 12px 0;
            letter-spacing: normal;
        }
.boxCard {
    background: var(--white-color);
    border-radius: 10px;
    margin-bottom: 30px;
    min-height: 440px;
    overflow: hidden;
    padding: 30px 0;
    width: 100%;
    height: 100%;
    transition: transform 0.5s;
    transform-style: preserve-3d;
    position: relative;
    transform: rotateY(0deg);
}

    .boxCard.ativo {
        border-top: 5px solid var(--primary-color);
        box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.8);
    }

    .boxCard .passoCard {
        display: flex;
        align-items: center;
        height: 40px;
        margin-bottom: 30px;
    }

        .boxCard .passoCard .numPasso {
            background: var(--contrast-color);
            border-radius: 50%;
            color: var(--tertiary-color);
            display: inline-block;
            float: left;
            height: 26px;
            line-height: 26px;
            margin-right: 10px;
            text-align: center;
            width: 26px;
        }

    .boxCard.ativo .passoCard .numPasso {
        background: var(--contra-bg-color);
        color: var(--primary-color);
    }

    .boxCard .passoCard h3 {
        display: inline-block;
        font-size: 16px;
        font-weight: bold;
        vertical-align: middle;
        width: calc(100% - 36px);
    }

    .boxCard .iptLaranja {
        border: 1px solid var(--primary-color);
        border-radius: 25px;
        font-size: 15px;
        height: 50px;
        padding: 0 15px;
        width: 100%;
    }

        .boxCard .iptLaranja:focus {
            outline: none;
        }

    .boxCard .ou {
        background: var(--concrete);
        border-radius: 50%;
        color: var(--tertiary-color);
        display: block;
        font-size: 16px;
        height: 45px;
        line-height: 45px;
        margin: 45px auto;
        position: relative;
        text-align: center;
        width: 45px;
    }

        .boxCard .ou:after {
            width: 150%;
            height: 1px;
            content: "";
            background-color: var(--contrast-color);
            position: absolute;
            right: calc(100% + 10px);
            top: 24px;
        }

        .boxCard .ou:before {
            width: 150%;
            height: 1px;
            content: "";
            background-color: var(--contrast-color);
            position: absolute;
            left: calc(100% + 10px);
            top: 24px;
        }

    .boxCard .valorRedondo span {
        color: var(--primary-color);
        font-size: 12px;
        font-weight: bold;
        float: right;
    }

        .boxCard .valorRedondo span span {
            font-size: 16px;
            margin-top: -2px;
        }

    .boxCard .valorAno span {
        color: var(--primary-color);
        font-size: 16px;
        font-weight: bold;
        float: right;
    }

        .boxCard .valorAno span span {
            float: left;
        }

    .boxCard .colIptPeriodo {
        position: relative;
    }

        .boxCard .colIptPeriodo .ui-datepicker-trigger {
            border: none;
            background-color: transparent;
            color: var(--primary-color);
            font-size: 18px;
            position: absolute;
            right: 33px;
            top: 38px;
        }

    .boxCard .tipoTaxa .colRadio .labelRadio {
        float: left;
        font-size: 18px;
        padding-top: 4px;
    }

    .boxCard .tipoTaxa .colRadio:first-child::after {
        clear: both;
        width: 100%;
        height: 1px;
        content: "";
        background-color: var(--contrast-color);
        display: block;
        margin: 48px 0 15px;
    }

    .boxCard .btn-taxas {
        background: var(--contrast-color);
        border: none;
        border-radius: 18px;
        color: var(--white-color);
        cursor: pointer;
        display: block;
        height: 36px;
        line-height: 36px;
        margin: 0 auto;
        text-align: center;
        width: 130px;
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

        .boxCard .btn-taxas.ativo {
            background: var(--primary-color);
        }

.card2 .passoCard {
    margin-bottom: 35px;
}

.card2 .ou {
    margin-top: 60px;
}

.card3 .passoCard {
    margin-bottom: 20px;
}

.card3 p {
    margin-bottom: 30px;
}

.card3 .btn-taxas {
    margin-top: 52px;
}

.card4 .boxCard {
    background: none;
    opacity: 1;
    transition: all 0.4s ease;
}

.card4.hide .boxCard {
    opacity: 0;
}

.card4 h4 {
    color: var(--tertiary-color);
    font-size: 18px;
    height: 60px;
}

.card4 .itensInvest {
    border-bottom: 2px solid var(--contrast-color);
    padding: 15px 0;
}

    .card4 .itensInvest .investItem {
        color: var(--tertiary-color);
    }

        .card4 .itensInvest .investItem.linhaDupla {
            display: block;
            margin-top: -20px;
        }

    .card4 .itensInvest .investValor {
        color: var(--dark-color);
        font-size: 16px;
        font-weight: bold;
        float: right;
    }

.card4 .verDetalhes {
    color: var(--primary-color);
    font-size: 12px;
    float: right;
    margin: 5px 0 20px;
}

.flip {
    transform: rotateY(90deg);
}

@media (max-width: 767px) {
    .boxCard {
        transform: rotateX(0deg);
        height: 100%;
    }

    .flip {
        transform: rotateX(90deg);
        height: 0;
        min-height: 0;
    }
}
.breadcrumbs {
    margin: 10px 0px 20px 0px;
    padding: 0;
}

    .breadcrumbs li {
        list-style: none;
        display: inline-block;
        font-size: 11px;
        color: var(--primary-color);
        margin-right: 10px;
        position: relative;
        font-weight: 900;
    }

        .breadcrumbs li a {
            text-decoration: none;
            color: var(--tertiary-color);
            font-weight: 400;
        }

        .breadcrumbs li:after {
            content: ">";
            position: absolute;
            right: -10px;
            color: var(--tertiary-color);
        }

        .breadcrumbs li:last-child:after {
            content: "";
            position: absolute;
        }

        .breadcrumbs li a:hover {
            text-decoration: underline;
        }

.card-name.comprovantes {
    display: flex;
    margin: 0px 0 0 0;
    padding: 0;
}

    .card-name.comprovantes h4 {
        margin: 6px 18px 0 12px;
    }

        .card-name.comprovantes h4 + p {
            margin: 4px 0 0 0;
            color: var(--tertiary-color);
        }

    .card-name.comprovantes .base-arrows {
        margin: 4px 0 0 18px;
    }

@media (max-width: 767px) {
    .card-name.comprovantes {
        display: flex;
        margin: 0 0 24px 0;
        padding: 0;
    }

        .card-name.comprovantes h4 {
            font-size: 18px;
            margin: 6px 12px 0 0;
        }

            .card-name.comprovantes h4 + p {
                margin: 4px 0 0 0;
                color: var(--tertiary-color);
            }

        .card-name.comprovantes .base-arrows {
            margin: 4px 0 0 12px;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .card-name.comprovantes {
        display: flex;
        margin: 0 0 24px 0;
        padding: 0;
    }

        .card-name.comprovantes h4 {
            font-size: 18px;
            margin: 6px 12px 0 0;
        }

            .card-name.comprovantes h4 + p {
                margin: 4px 0 0 0;
                color: var(--tertiary-color);
            }

        .card-name.comprovantes .base-arrows {
            margin: 4px 0 0 12px;
        }
}
/*CADAS ACOMPANHAMENTO PROPSOTA*/
.icone-upload {
    width: 88px;
    height: 88px;
    background-color: rgba(242, 133, 2, 0.1);
    border-radius: 100px;
    display: inline-block;
    font-size: 47px;
    padding: 18px;
    color: var(--primary-color);
}

.card-upload {
    width: 100%;
    height: 337px;
    border-radius: 10px;
    border: solid 2px rgba(205, 205, 205, 0.5);
    text-align: center;
    padding: 50px 120px;
    position: relative;
    outline: 0;
    transition: 0.3s ease;
    background-color: transparent;
    box-shadow: 1px 18px 50px -50px var(--contrast-color);
    overflow: hidden;
}

    .card-upload:hover,
    .card-upload.ativo {
        border-top: 4px solid var(--primary-color);
        background-color: var(--white-color);
    }

    .card-upload.done,
    .card-upload:focus {
        border: solid 2px rgba(255, 255, 255, 1);
        box-shadow: 1px 18px 50px -10px var(--contrast-color);
        background-color: var(--white-color);
    }

    .card-upload:focus {
        border-top: 4px solid var(--primary-color);
    }

    .card-upload:focus .check-upload,
    .card-celular.done .check-upload,
    .card-desktop.done .check-upload {
        border: solid 2px var(--success-color);
        background-color: var(--success-color);
        transform: scale(1.3);
        transition-delay: 0.3s;
        padding: 5px;
        text-align: center;
    }

        .card-upload:focus .check-upload i,
        .card-celular.done .check-upload i,
        .card-desktop.done .check-upload i {
            transform: scale(1);
            transition-delay: 0.5s;
        }

    .card-upload .check-upload i {
        display: block;
        transition: 0.3s cubic-bezier(0.46, -0.08, 0.42, 1.17);
        transform: scale(0);
        transition-delay: 0s;
        font-size: 23px;
        color: var(--white-color);
    }

    .card-upload h3 {
         
        font-size: 28px;
        font-weight: 400;
        line-height: 1.11;
        color: var(--dark-color);
        margin-top: 20px;
    }

    .card-upload p {
         
        font-size: 18px;
        font-weight: 400;
        line-height: 1.39;
        color: var(--tertiary-color);
    }

    .card-upload.desk-3 .file-drop-button {
        width: 48%;
        cursor: pointer;
    }

    .card-upload.desk-3 .btn-card {
        width: 48%;
        float: right;
    }

.card-desktop .check-upload {
    transform: scale(0);
    transition: 0.3s cubic-bezier(0.46, -0.08, 0.42, 1.17);
}

    .card-desktop .check-upload.abre,
    .card-desktop.done .check-upload {
        transform: scale(1);
    }

.card-desktop {
    padding: 20px 30px;
    height: 415px;
}

    .card-desktop .check-upload {
        transform: scale(0);
        transition: 0.3s cubic-bezier(0.46, -0.08, 0.42, 1.17);
    }

    .card-desktop:focus .check-upload {
        transform: scale(0);
        transition: .3s cubic-bezier(.46,-0.08,.42,1.17);
    }

    .card-desktop .icone-upload {
        padding: 15px;
        transition: 0.3s cubic-bezier(0.46, -0.08, 0.42, 1.17);
        margin-top: 0px;
        display: block;
        margin: 0 auto;
        margin-top: 0px;
    }

    .card-desktop h3 {
        font-size: 18px;
    }


    .card-desktop p {
        font-size: 14px;
    }

@media (max-width: 767px) {
    .card-upload {
        padding: 20px 30px;
        margin-bottom: 30px;
        height: auto;
    }

        .card-upload p {
            font-family: 'Varela Round', sans-serif;
            font-size: 15px;
        }

        .card-upload h3 {
            font-family: 'Varela Round', sans-serif;
            font-size: 24px;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .card-upload {
        margin-bottom: 30px
    }
}
.cartao-credito {
    width: calc(100% - 130px);
    height: 250px;
    background-color: var(--contrast-color);
    box-shadow: 0px 0px 50px -19px var(--tertiary-color);
    border-radius: 20px;
    margin: 0px auto;
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: center;
}

.cartao-bloqueado {
    background: var(--erro-color) !important;
}

.cartao-desbloqueio {
    position: absolute;
    width: 140px;
    height: 140px;
    z-index: 100;
}

    .cartao-desbloqueio i {
        font-size: 140px;
        color: var(--erro-color);
    }

.bandeira-cartao {
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: 60px;
}

    .bandeira-cartao img {
        width: 100%;
    }

.numero-cartao {
    font-size: 30px;
    display: block;
    text-align: left;
}

    .numero-cartao span {
        display: block;
        font-size: 14px;
    }

.titulo-cartao {
    font-size: 18px;
    font-weight: 900;
    color: var(--dark-color);
    margin-top: 30px;
}

.classe-titulo-cartao {
    font-size: 18px;
    text-transform: lowercase;
}

    .classe-titulo-cartao::first-letter {
        text-transform: uppercase;
    }

@media (max-width: 767px) {
    .cartao-credito {
        width: 80%;
        height: 170px;
    }

    .bandeira-cartao {
        width: 40px;
    }

    .numero-cartao {
        font-size: 20px;
        display: block;
        text-align: left;
    }
}
/* Estilos Saque Complementar */
/*.valor-saque span {
    font-family: 'Varela Round', sans-serif;
    color: #87c265;
    font-size: 20px;
}

.cartao-select-saque .favorecido h4 {
    margin: 10px;
}

.cartao-select-saque h4 {
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #323232;
    font-weight: bold;
    margin: 36px 0 12px 0;
    padding: 0;
}

.cartao-select-saque h5 {
    font-size: 16px;
    font-weight: bold;
    color: var(--tertiary-color);
    margin: 12px 0 2px 0;
    padding: 0;
}

    .cartao-select-saque h5 + p {
        font-size: 14px;
        margin: 0 0 12px 0;
    }

.cartao-select-saque .card-flag {
    margin: 0 24px 0 0;
}

.cartao-select-saque .card-flag img {
    width: 100%;
}

.cartao-select-saque .card-name {
    display: flex;
}

.cartao-select-saque .card-name h4 {
    font-weight: 900;
    font-size: 20px;
    color: var(--primary-color);
    margin: 4px 0px 0 0;
    padding: 0;
}

.cartao-select-saque .card-name p {
    font-family: 'Varela Round', sans-serif;
    font-size: 18px;
    color: #cccccc;
    margin: 4px 0 0 8px;
    padding: 0;
}

    .cartao-select-saque .card-name p span {
        color: #323232;
    }

.cartao-select-saque p + p.active {
    color: #87c265;
    margin: 4px 0 0 4px;
}

.cartao-select-saque p + p.blocked {
    color: #e30716;
    margin: 4px 0 0 4px;
}

.cartao-select-saque p.tipo-conta {
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: right;
    line-height: 12px;
    color: var(--tertiary-color);
    margin: 9px 0 0 0;
}

.cartao-select-saque .form-custom.radio {
    display: flex;
    align-items: center;
}

.cartao-select-saque input[type=radio] {
    -webkit-appearance: none;
    background: #ffffff;
    width: 12px;
    height: 12px;
    outline: none;
    border: 2px solid #ffffff;
    box-shadow: 0 0 0 2px var(--tertiary-color);
    border-radius: 50%;
    margin: 0 0 0 0;
    padding: 1px;
}

.cartao-select-saque input[type=radio]:checked {
    background: #e06a13;
}

.cartao-select-saque input[type=radio] + label {
    color: var(--tertiary-color);
    font-weight: normal;
}

.cartao-select-saque button.expand {
    background: none;
    outline: none;
    border: none;
    width: auto;
    height: auto;
    text-transform: uppercase;
    margin: -4px 0 0 9px;
    padding: 0 12px;
    font-size: 11px;
    font-weight: bold;
    color: var(--tertiary-color);
}

.cartao-select-saque button.expand span {
    top: 0;
    transform: rotate(-90deg);
}

.cartao-select-saque button.expand:hover {
    color: var(--primary-color);
}

.cartao-select-saque .cartao-detail {
    margin: 24px 0 0 0;
    opacity: 0;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}

.cartao-select-saque .cartao-detail.in {
    opacity: 1;
}

.cartao-select-saque .cartao-detail .well {
    background: #ffffff;
    opacity: 0;
    border: none;
    margin: 0 0 6px 0;
    padding: 18px;
    box-shadow: 0 0 60px rgba(0,0,0,0.1);
    -webkit-transition: all .4s ease;
    transition: all .2s ease;
}

.cartao-select-saque .cartao-detail.in .well {
    opacity: 1;
}

.cartao-select-saque .cartao-detail .well h3 {
    font-size: 10px;
    font-weight: 900;
    color: var(--primary-color);
    text-transform: uppercase;
    letter-spacing: 0;
    margin: 0;
    padding: 0;
}

.cartao-select-saque .cartao-detail .well h3 + p {
    font-size: 14px;
    font-weight: normal;
    color: #323232;
    margin: 6px 0 0 0;
    padding: 0;
}

.cartao-select-saque hr {
    margin: 24px 0 0 0;
    border: none;
    border-bottom: 1px solid #efefef;
}

.cartao-select-saque .base-icone {
margin-top: 20%;
}

.base-icone a {
    font-size: 18px;
    background: #ffffff;
    color: var(--primary-color);
    --margin: 0 0 0 12px;
    padding: 8px 12px;
    border-radius: 30px;
    box-shadow: 0 0 60px rgba(0,0,0,0.3);
}


*/

.cartao-select h4 {
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--dark-color);
    font-weight: bold;
    margin: 36px 0 12px 0;
    padding: 0;
}

.pointer {
    cursor: pointer;
}

.mb-15 {
    margin-bottom: 15px !important;
}

.cartao-select h5 {
    font-size: 16px;
    font-weight: bold;
    color: var(--tertiary-color);
    margin: 12px 0 2px 0;
    padding: 0;
}

    .cartao-select h5 + p {
        font-size: 14px;
        margin: 0 0 12px 0;
    }

.cartao-select .form-custom.radio input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.cartao-select .form-custom.radio > input[type="radio"] + label {
    width: 100%;
    border: 3px solid var(--contrast-color);
    border-radius: 36px;
    color: var(--tertiary-color);
    margin: 0 0 12px 0;
    padding: 12px 24px 12px 48px;
}

    .cartao-select .form-custom.radio > input[type="radio"] + label:before {
        content: "";
        position: absolute;
        top: 1.18em;
        left: 22%;
        border-radius: 12px;
        width: 11px;
        height: 11px;
        background-color: var(--white-color);
        border: 2px solid var(--tertiary-color);
    }

    .cartao-select .form-custom.radio > input[type="radio"] + label > p {
        font-size: 12px;
        letter-spacing: 1px;
        text-align: center;
        font-weight: bold;
        line-height: 16px;
        text-transform: uppercase;
    }

.cartao-select .form-custom.radio > input[type="radio"]:checked + label {
    background-color: var(--primary-color);
    border: 3px solid var(--primary-color);
    color: var(--white-color);
}

    .cartao-select .form-custom.radio > input[type="radio"]:checked + label:before {
        background-color: var(--primary-color);
        border: 3px solid var(--white-color);
    }

.cartao-select .form-custom input[type="checkbox"] + label {
    text-align: right;
    display: inline-block;
    margin: 10px 0 0 14px;
    font-weight: normal;
}

    .cartao-select .form-custom input[type="checkbox"] + label a {
        color: var(--primary-color);
        text-decoration: underline;
    }

.cartao-select .form-custom .btn-padrao {
    margin: 24px 0 0 0;
}

.cartao-select .card-flag {
    margin: 0 24px 0 0;
}

/*TODO*/

.cartao-select .card-name {
    display: flex;
}

    .cartao-select .card-name h4 {
        font-weight: bold;
        font-size: 20px;
        color: var(--primary-color);
        margin: 4px 0px 0 0;
        padding: 0;
    }

    .cartao-select .card-name p {
        font-size: 10px;
        color: var(--dark-color);
        margin: 4px 0 0 8px;
        padding: 0;
    }

        .cartao-select .card-name p span {
            color: var(--dark-color);
            font-size: 20px;
            font-weight: bold;
        }

.cartao-select p + p.active {
    color: var(--success-color);
    margin: 4px 26px 0 4px;
}

.cartao-select p + p.blocked {
    color: var(--erro-color);
    margin: 8px 0 0 4px;
    font-size: 12px;
}

.cartao-select button.expand {
    background: none;
    outline: none;
    border: none;
    width: auto;
    height: auto;
    text-transform: uppercase;
    margin: -4px 0 0 9px;
    padding: 0 12px;
    font-size: 11px;
    font-weight: bold;
    color: var(--tertiary-color);
}

    .cartao-select button.expand span {
        top: 0;
        transform: rotate(-90deg);
    }

    .cartao-select button.expand:hover {
        color: var(--primary-color);
    }

.cartao-select .cartao-change {
    display: flex;
    justify-content: flex-end;
    margin: 10px 0px 0px 20px;
    padding: 0 0 0 0;
}

    .cartao-select .cartao-change p {
        font-size: 11px;
        font-weight: bold;
        color: var(--tertiary-color);
        text-transform: uppercase;
        margin: -2px 6px 0 0;
        padding: 0;
    }

.fundo-cinza {
    background-color: var(--concrete);
    margin: 30px 0px;
    padding: 0px 0px 30px 0px;
}

.cartao-select .cartao-change .base-arrows a {
    color: var(--contrast-color);
}

    .cartao-select .cartao-change .base-arrows a.active {
        color: var(--dark-color);
    }

.cartao-select .cartao-detail {
    margin: 30px 0 0 0;
    opacity: 0;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

    .cartao-select .cartao-detail.in {
        opacity: 1;
    }

    .cartao-select .cartao-detail .well {
        background: var(--white-color);
        opacity: 0;
        border: none;
        margin: 0 0 6px 0;
        padding: 18px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        -webkit-transition: all 0.4s ease;
        transition: all 0.2s ease;
    }

    .cartao-select .cartao-detail.in .well {
        opacity: 1;
    }

    .cartao-select .cartao-detail .well h3 {
        font-size: 10px;
        font-weight: 900;
        color: var(--primary-color);
        text-transform: uppercase;
        letter-spacing: 0;
        margin: 0;
        padding: 0;
    }

        .cartao-select .cartao-detail .well h3 + p {
            font-size: 14px;
            font-weight: normal;
            color: var(--dark-color);
            margin: 6px 0 0 0;
            padding: 0;
        }

.cartao-select hr {
    margin: 24px 0 0 0;
    border: none;
    border-bottom: 1px solid var(--contrast-color);
}

.cartao-select .limite {
    margin: 24px 0 0 0;
}

    .cartao-select .limite p {
        font-size: 12px;
    }

        .cartao-select .limite p + p {
            font-size: 24px;
        }

            .cartao-select .limite p + p span {
                font-size: 18px;
            }

    .cartao-select .limite .saque a.btn-padrao {
        display: block;
        width: 100%;
        margin: 1px 0 0 0;
        padding: 12px 0;
    }

        .cartao-select .limite .saque a.btn-padrao:hover {
            color: var(--white-color);
            background: var(--primary-color);
        }

    .cartao-select .limite .saque p {
        font-size: 10px;
        text-transform: uppercase;
        text-align: left;
        color: var(--tertiary-color);
        line-height: 18px;
        margin: 4px 0 0 0;
        padding: 0;
         
    }

        .cartao-select .limite .saque p + p {
            font-size: 24px;
            color: var(--primary-color);
            margin: 0;
            padding: 0;
        }

            .cartao-select .limite .saque p + p span {
                color: var(--primary-color);
            }

.cartao-select h3.success {
    margin-top: 20%;
    font-size: 24px;
    font-weight: normal;
    line-height: 24px;
    background-image: linear-gradient(to right, #82c469, #05eabf);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

    .cartao-select h3.success span {
        font-size: 36px;
    }

.cartao-select .base-icone {
    margin-top: 20%;
}

.base-icone a {
    background: var(--white-color);
    color: var(--primary-color);
    padding: 8px 12px;
    border-radius: 30px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
}

.base-valores-saque {
    margin: 36px 0 18px 0;
}

    .base-valores-saque h3 {
        font-size: 14px;
        font-weight: 400;
        color: var(--tertiary-color);
        text-transform: uppercase;
    }

        .base-valores-saque h3 span {
            font-weight: bold;
            color: var(--primary-color);
        }

.escolhe-valor {
    margin: 36px 0 0 0;
}

    .escolhe-valor p {
        font-size: 14px;
        font-weight: bold;
        margin: 0 0 13px 0;
        padding: 0;
    }

        .escolhe-valor p.valor-max {
            text-align: right;
        }

        .escolhe-valor p.disclaimer {
            font-size: 11px;
            text-align: right;
            color: var(--tertiary-color);
            font-weight: normal;
            margin: 4px 0 36px 0;
            padding: 0;
        }

        .escolhe-valor p.disclaimer-orange {
            font-size: 12px;
            text-align: right;
            color: var(--primary-color);
            font-weight: normal;
            margin: 4px 0 0 0;
            padding: 0;
        }

.valor-saque-resumo h3 {
    font-size: 36px;
    color: var(--primary-color);
    font-weight: 400;
    margin: 0;
    padding: 0;
}

.valor-saque-resumo h5 {
    color: var(--dark-color);
    margin: 0;
    padding: 0;
}

@media (max-width: 767px) {
    .cartao-select .card-name {
        flex-wrap: wrap;
        align-items: center;
    }

        .cartao-select .card-name div,
        .cartao-select .card-name p {
            flex: 1;
        }

        .cartao-select .card-name p {
            font-size: 16px;
        }

        .cartao-select .card-name h4 {
            width: 100%;
        }

            .cartao-select .card-name h4 + p {
                flex: none;
                width: 50%;
                margin: 4px 0 0 0;
            }

    .cartao-select p + p.active {
        margin: 4px 0 0 0;
    }

    .cartao-select .card-name button {
        text-align: right;
        margin: 3px 0 0 0;
        padding: 0 0 0 0;
        flex: 2;
    }

    .cartao-select .limite p {
        font-size: 11px;
    }

        .cartao-select .limite p + p {
            font-size: 18px;
        }

    .cartao-select .limite .saque p {
        font-size: 10px;
        text-align: left;
        line-height: 20px;
        margin: 30px 0 0 0;
    }

    .cartao-select .limite .saque a.btn-padrao {
        margin: 30px 0 18px 0;
    }

    .cartao-select .cartao-detail .well {
        padding: 24px 48px 12px 48px;
        text-align: left;
    }

        .cartao-select .cartao-detail .well h3 {
            font-size: 11px;
            margin: 8px 0 0 0;
        }

            .cartao-select .cartao-detail .well h3 + p {
                margin: 1px 0 18px 0;
            }

    .cartao-select .form-custom input[type=checkbox] {
        margin: 34px 0 0 0;
        float: left;
    }

        .cartao-select .form-custom input[type=checkbox] + label {
            float: right;
            text-align: left;
            display: block;
            margin: 30px 0 0 0;
            font-weight: normal;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .cartao-select .card-name {
        flex-wrap: wrap;
        align-items: center;
    }

        .cartao-select .card-name div,
        .cartao-select .card-name p {
            flex: 0;
        }

        .cartao-select .card-name p {
            font-size: 16px;
        }

    .cartao-select .cartao-change p {
        margin: 5px 12px 0 0;
    }

    .cartao-select .card-name h4 + p {
        flex: 2;
        margin: 4px 0 0 5px;
        text-align: center;
    }

    .cartao-select p + p.active {
        margin: 4px 0 0 0;
    }

    .cartao-select .card-name button {
        text-align: right;
        margin: 3px 0 0 0;
        padding: 0 0 0 0;
        flex: 1;
    }

    .cartao-select .limite p {
        font-size: 11px;
    }

        .cartao-select .limite p + p {
            font-size: 18px;
        }

    .cartao-select .limite .saque p {
        font-size: 10px;
        text-align: left;
        line-height: 20px;
        margin: 30px 0 0 0;
    }

    .cartao-select .limite .saque a.btn-padrao {
        margin: 30px 0 18px 0;
    }

    .cartao-select .cartao-detail .well {
        padding: 24px 48px 12px 48px;
        text-align: left;
    }

        .cartao-select .cartao-detail .well h3 {
            font-size: 11px;
            margin: 8px 0 0 0;
        }

            .cartao-select .cartao-detail .well h3 + p {
                margin: 1px 0 18px 0;
            }

    .cartao-select .form-custom input[type=checkbox] {
        margin: 34px 0 0 0;
        float: left;
    }

        .cartao-select .form-custom input[type=checkbox] + label {
            float: right;
            text-align: left;
            display: block;
            margin: 30px 0 0 0;
            font-weight: normal;
        }
}


.chat-rodape {
    display: none;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 3000;
}

    .chat-rodape .wrapper-chat {
        width: 300px;
        position: relative;
        bottom: 0;
        right: 48px;
        background: var(--white-color);
        border-radius: 12px 12px 0 0;
        -webkit-box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.3);
        -moz-box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.3);
        box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.3);
    }

        .chat-rodape .wrapper-chat .control-msgbox {
            position: absolute;
            bottom: -348px;
            left: 0;
            width: 100%;
            height: 418px;
            background: url(styles/assets/img/loading.gif) no-repeat center var(--white-color);
            color: var(--dark-color);
            border-radius: 8px 8px 0 0;
        }

    .chat-rodape ul {
        position: relative;
        list-style: none;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        -webkit-transition: all 0.3s ease;
        transition: all 0.3s ease;
        transition-delay: 0.9s;
        opacity: 0;
    }

    .chat-rodape input[type="checkbox"]:checked ~ .control-msgbox ul {
        opacity: 1;
        transition-delay: 1.8s;
    }

    .chat-rodape ul li {
        position: absolute;
        width: 100%;
        height: auto;
        background: var(--white-color);
        bottom: 0;
        -webkit-transition: all 0.3s cubic-bezier(1, 0.01, 0, 1);
        transition: all 0.3s cubic-bezier(1, 0.01, 0, 1);
    }

        .chat-rodape ul li .base-scroll {
            overflow-x: hidden;
            overflow-y: scroll;
            width: 100%;
            max-height: 270px;
            background-color: var(--white-color);
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
            transition-delay: 1.8s;
            opacity: 0;
        }
    .chat-rodape input[type="checkbox"]:checked ~ .control-msgbox ul li .base-scroll {
        opacity: 1;
        transition-delay: 2.2s;
    }

    .chat-rodape ul li img {
        width: 100%;
    }

    .chat-rodape ul li .msg {
        display: flex;
        align-items: center;
        padding: 0px 12px 12px 12px;
    }

        .chat-rodape ul li .msg:first-child {
            padding: 12px;
        }

        .chat-rodape ul li .msg p {
            font-size: 14px;
            line-height: 12px;
            background-color: var(--contra-bg-color);
            padding: 12px 30px 12px 12px;
            border-radius: 0 12px 12px 12px;
        }

            .chat-rodape ul li .msg p:before {
                content: " ";
                position: absolute;
                width: 0;
                height: 0;
                top: 0;
                left: 3px;
                border-top: 0px solid transparent;
                border-right: 12px solid var(--contra-bg-color);
                border-bottom: 12px solid transparent;
            }

    .chat-rodape ul li .enviar-msg {
        bottom: 0;
        width: 100%;
        display: flex;
        padding: 18px 12px 12px 12px;
        border-top: 1px solid var(--contrast-color);
    }

        .chat-rodape ul li .enviar-msg .caixa-texto {
            flex-grow: 2;
            margin: 0 12px 0 0;
        }

        .chat-rodape ul li .enviar-msg textarea {
            resize: none;
            width: 100%;
            height: 42px;
            border-radius: 8px;
            border: 1px solid var(--contrast-color);
            padding: 8px 8px 0 8px;
        }

        .chat-rodape ul li .enviar-msg .envia-btn {
            flex-grow: 2;
        }

            .chat-rodape ul li .enviar-msg .envia-btn button {
                 
                border-radius: 8px;
                width: 100%;
                padding: 12px;
                text-align: center;
                outline: none;
                text-transform: uppercase;
                font-size: 10px;
                letter-spacing: 1px;
                background: none;
                cursor: pointer;
                border: 2px solid var(--primary-color);
                color: var(--primary-color);
            }

    .chat-rodape input[type="checkbox"] {
        display: none;
    }

        .chat-rodape input[type="checkbox"] + label {
            position: relative;
            display: flex;
            margin: -17px 0 0 0;
            padding: 24px 48px;
            line-height: 12px;
            font-size: 12px;
            color: var(--white-color);
            border-radius: 6px 6px 0 0;
            background-image: var(--gradient-color);
            -webkit-transition: all 0.3s cubic-bezier(1, 0.01, 0, 1);
            transition: all 0.3s cubic-bezier(1, 0.01, 0, 1);
            transition-delay: 0s;
            cursor: pointer;
            z-index: 2;
        }

        .chat-rodape input[type="checkbox"]:checked + label {
            margin: -420px 0 0 0;
            padding: 24px 48px;
            transition-delay: 0.1s;
        }

        .chat-rodape input[type="checkbox"] + label:hover {
            transform: translate(0, -12px);
        }

    .chat-rodape label .base-icone {
        margin: 3px 12px 0 0;
        font-size: 24px;
    }

    .chat-rodape label h4 {
        font-size: 10px;
        text-transform: uppercase;
        letter-spacing: 2px;
        line-height: 14px;
    }

@media (min-width: 992px) and (max-width: 1199px) {
    .chat-rodape .wrapper-chat {
        bottom: 0;
        right: 0;
    }
}
.collapse-row {
    cursor: pointer;
    padding: 24px 60px 24px 24px;
    border-radius: 12px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .collapse-row.collapsed {
        border-radius: 12px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

    .collapse-row:hover {
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

    .collapse-row .base-seta {
        text-align: right;
    }

        .collapse-row .base-seta button {
            border: none;
            background: none;
            outline: none;
            transform: rotate(-90deg);
        }

    .collapse-row.no-click {
        cursor: default;
    }

@media (max-width: 767px) {
    .collapse-row.no-click {
        padding: 24px 48px 24px 36px;
    }

        .collapse-row.no-click .row {
            display: flex;
            align-items: center;
        }

            .collapse-row.no-click .row > div {
                flex: auto;
            }
}

@media (min-width: 768px) and (max-width: 991px) {
    .collapse-row.no-click {
        padding: 24px 48px 24px 36px;
    }

        .collapse-row.no-click .row {
            display: flex;
            align-items: center;
        }

            .collapse-row.no-click .row > div {
                flex: auto;
            }
}
.coluna {
    width: 100%;
    background-color: var(--white-color);
    padding: 30px 0px;
    text-align: center;
    font-size: 12px;
    color: var(--tertiary-color);
    text-transform: uppercase;
    margin-top: 7px;
    position: relative;
    border-radius: 5px 0px 0px 5px;
    border-left-style: solid;
    border-left-width: 5px;
    border-color: transparent;
}

    .coluna:after {
        width: 2px;
        height: calc(100% - 33px);
        content: "";
        background-color: var(--contrast-color);
        position: absolute;
        right: 0px;
        top: 20px;
    }

    .coluna.sem-traco:after {
        width: 0px;
        height: 10px;
        content: "";
        background-color: var(--dark-color);
        position: absolute;
        right: 0px;
    }

.collapse .coluna,
.collapsing .coluna {
    margin-top: 0px;
}

.demais-aplicacoes .coluna span {
    margin-top: 12px;
}

.coluna-agendamento .coluna span {
    margin-top: 10px;
}

.linha-meusinvest .coluna span {
    margin-top: 16px;
    line-height: 11px;
}

@media (max-width: 767px) {
    .coluna {
        text-align: left;
        font-size: 12px;
        margin-top: 0px;
        padding: 8px 30px !important;
        height: auto !important;
        border-radius: 0px;
    }

        .coluna.roxo {
            border-radius: 5px 5px 0px 0px;
            border-top: 5px solid #c265fe;
            border-left: none;
        }

        .coluna.azul {
            border-radius: 5px 5px 0px 0px;
            border-top: 5px solid #51ccf7;
            border-left: none;
        }

        .coluna.verde {
            border-radius: 5px 5px 0px 0px;
            border-top: 5px solid #74ce1f;
            border-left: none;
        }

        .coluna.vermelho {
            border-radius: 5px 5px 0px 0px;
            border-top: 5px solid #fe5242;
            border-left: none;
        }

    .coluna span:nth-child(2) {
        color: var(--dark-color) !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .coluna {
        font-size: 9px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .coluna {
        font-size: 11px;
    }
}
.comprov-opt {
    background: var(--white-color);
    border-radius: 8px;
    margin: 0 0 30px 0;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .comprov-opt h4 {
        text-align: center;
        font-size: 11px;
        color: var(--white-color);
        text-transform: uppercase;
        font-weight: bold;
        padding: 6px;
        background-color: var(--contrast-color);
        border-radius: 8px 8px 0 0;
    }

    .comprov-opt .icone-title {
        display: flex;
        flex-wrap: wrap;
        margin: 0px;
        padding: 30px;
    }

        .comprov-opt .icone-title .base-icone {
            font-size: 36px;
            color: var(--primary-color);
            margin: 0px 24px 0 0;
        }

        .comprov-opt .icone-title .texto {
            color: var(--tertiary-color);
            margin: 4px 0 0 0;
        }

            .comprov-opt .icone-title .texto h3 {
                font-size: 18px;
                line-height: 18px;
                font-size: 900;
            }

                .comprov-opt .icone-title .texto h3 span {
                    font-size: 14px;
                    font-weight: 400;
                }

        .comprov-opt .icone-title .btn-padrao {
            width: 100%;
            margin: 18px 0 0 0;
        }

@media (min-width: 992px) and (max-width: 1199px) {
    .comprov-opt .icone-title {
        padding: 24px;
    }

        .comprov-opt .icone-title .texto h3 {
            font-size: 14px
        }
}
.conta-saldos {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 2px 0 2px 0;
    padding: 8px 4px 8px 4px;
    border-bottom: 1px solid var(--contrast-color);
}

    .conta-saldos:last-child {
        border-bottom: 0 solid var(--contrast-color);
        padding: 12px 4px 0px 4px;
    }

    .conta-saldos .item h4 {
        font-size: 12px;
        letter-spacing: 1px;
        text-transform: uppercase;
        font-weight: bold;
    }

    .conta-saldos .item p {
        text-align: center;
        color: var(--tertiary-color);
    }

@media (max-width: 767px) {
    .conta-saldos {
        flex-wrap: wrap;
    }

        .conta-saldos:nth-child(4) {
            border-bottom: 0 solid var(--contrast-color);
            margin: 2px 0 36px 0;
            padding: 12px 4px 0px 4px;
        }

        .conta-saldos.total {
            display: flex !important;
            color: var(--white-color);
            background: var(--primary-color);
            padding: 12px 24px;
            border-radius: 24px;
        }

        .conta-saldos .item {
            width: 100%;
        }

            .conta-saldos .item h4 {
                font-size: 10px;
            }

            .conta-saldos .item p {
                text-align: left;
                margin: 4px 0 0 0;
            }

          .item p,
          .item p span,
          .item p + .item p {
            color: var(--white-color);
        }

         .inss .item h4 {
            text-align: center;
        }

         .inss .item p {
            text-align: center;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .conta-saldos {
        flex-wrap: wrap;
    }

        .conta-saldos:nth-child(4) {
            border-bottom: 0 solid var(--contrast-color);
            margin: 2px 0 36px 0;
            padding: 12px 4px 0px 4px;
        }

        .conta-saldos.total {
            display: flex !important;
            color: var(--white-color);
            background: var(--primary-color);
            padding: 12px 24px;
            border-radius: 24px;
        }

        .conta-saldos .item h4 {
            font-size: 10px;
        }

        .conta-saldos .item p {
            text-align: left;
            margin: 4px 0 0 0;
        }

          .item p,
          .item p span,
          .item p + .item p {
            color: var(--white-color);
        }

         .inss .item h4 {
            text-align: center;
        }

         .inss .item p {
            text-align: center;
        }
}
.content__back {
    color: var(--primary-color);
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    border-radius: 48px;
    display: inline-block;
    border: 1px solid var(--primary-color);
    margin: 24px 0;
    padding: 8px 36px;
}

    .content__back:hover {
        color: var(--primary-color);
        text-decoration: none;
    }

@media (max-width: 767px) {
    .content__back {
        width: 100%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {

}
.content__option {
    margin: 0;
    padding: 24px 18px;
    box-shadow: 0 0 60px rgba(0,0,0,0.1);
}

    .content__option h3 {
        color: var(--dark-color);
        font-size: 24px;
        font-weight: bold;
        margin: 0;
        padding: 0 0 24px 0;
        border-bottom: 1px solid var(--contrast-color);
    }

    .content__option h4 {
        color: var(--tertiary-color);
        font-size: 16px;
        font-weight: normal;
        text-transform: none;
        letter-spacing: 0px;
        margin: 12px 0 0 0;
        padding: 0;
    }

.content__option--sub-title {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
}

    .content__option--sub-title p {
        margin: 0 6% 0 0;
        padding: 0;
    }

    .content__option--sub-title a {
        color: var(--primary-color);
        text-decoration: underline;
    }

.content__option .btn-padrao {
    flex: 1;
    margin: 0;
    text-decoration: none;
}

@media (max-width: 767px) {
    .content__option.cartao{
        text-align: center;
    }

    .content__option--sub-title {
        flex-wrap: wrap;
    }

        .content__option--sub-title p {
            width: 100%;
            margin: 24px 0;
        }
}

@media (min-width: 768px) and (max-width: 991px) {

}
.conteudo-perguntas .fade {
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    display: none;
}

.perguntas {
    position: relative;
    top: 30%;
    left: 0px;
    margin-top: -10px;
}

    .perguntas h2 {
        font-size: 25px;
        color: var(--dark-color);
        margin: 3px 0px 0px 0px;
        font-weight: 900;
    }

    .perguntas .radio input[type="radio"] {
        opacity: 0 !important;
    }

        .perguntas .radio input[type="radio"] + .radio-label:before {
            top: -2px;
            left: -11px;
        }

    .perguntas .radio + .radio,
    .perguntas .checkbox + .checkbox {
        margin-top: 15px;
    }

@media (max-width: 767px) {
    .perguntas {
        position: relative;
        top: 0;
        left: 0;
        margin-top: -50px;
        margin-left: 0px;
    }

    .perguntas h2 {
        font-size: 35px;
        font-family: 'Varela Round', sans-serif;
        color: var(--dark-color);
        margin-top: 23px;
        font-size: 20px !important;
    }
}
.d-flex {
    display: flex;
    align-items: center;
}

    .d-flex div:first-child {
        /*flex-basis: ;*/
        margin: 0 24px 0 0;
    }

.dados-investimento {
    font-size: 14px;
    border-bottom: 1px solid var(--contrast-color);
    padding-bottom: 12px;
    padding-top: 0px;
    margin: 12px 9px;
}

    .dados-investimento strong {
        text-align: right;
        display: block;
    }

@media (min-width: 992px) and (max-width: 1199px) {
    .dados-investimento {
        margin-top: 0px;
    }
}
.data-ativacao {
    margin-top: 10px;
}

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

.data-proxima {
    font-size: 16px;
    margin-top: 9px;
    font-weight: 900;
}

    .data-proxima span {
        display: block;
        font-size: 12px;
        font-weight: 400;
    }

.data-ativacao p {
    font-size: 16px;
    margin-top: 9px;
    font-weight: 900;
}

.data-ativacao p {
    font-size: 16px;
    margin-top: 5px;
    font-weight: 900;
}

/* DATEPICKER RANGE */
.datePickerRangeLaranja.date-picker-wrapper {
    width: 280px;
    background-color: var(--primary-color);
    border-radius: 20px;
    border: 0px solid var(--primary-color);
    margin-top: 0px;
}

    .datePickerRangeLaranja.date-picker-wrapper .caption .select-wrapper {
        padding-right: 14px;
        cursor: pointer;
        margin-right: 5px;
    }

        .datePickerRangeLaranja.date-picker-wrapper .caption .select-wrapper::after {
            content: "";
            position: absolute;
            right: 0;
            top: 3px;
            width: 0;
            height: 0;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-top: 6px solid var(--primary-color);
            clear: both;
        }

        .datePickerRangeLaranja.date-picker-wrapper .caption .select-wrapper:hover {
            text-decoration: none;
            color: var(--primary-color);
        }

    .datePickerRangeLaranja.date-picker-wrapper .drp_top-bar,
    .datePickerRangeLaranja.date-picker-wrapper .drp_top-bar.normal .normal-top,
    .datePickerRangeLaranja.date-picker-wrapper b {
        color: var(--white-color);
    }

    .datePickerRangeLaranja.date-picker-wrapper .date-range-length-tip {
        display: none !important;
    }

    .datePickerRangeLaranja.date-picker-wrapper .month-wrapper {
        border-radius: 0px;
        width: 100% !important;
    }

        .datePickerRangeLaranja.date-picker-wrapper .month-wrapper table {
            width: 220px;
        }

    .datePickerRangeLaranja.date-picker-wrapper .apply-btn {
        border: none !important;
        background: var(--white-color) !important;
        color: var(--primary-color) !important;
        font-weight: bold;
    }
/* FIM DATEPICKER RANGE*/

.debito-automatico p {
    text-align: left;
}

.debito-automatico h3 {
    text-align: left;
    margin: 0px 0 0 0px !important;
    font-weight: 900 !important;
    color: var(--dark-color) !important;
}

.botoes-debito {
    display: flex;
    align-items: center;
}

.btn-debito {
     
    border-radius: 30px;
    width: auto;
    padding: 12px 24px;
    text-align: center;
    outline: none;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 2px;
    background: none;
    cursor: pointer;
    margin-right: 15px;
}

    .btn-debito.cinza {
        border: 2px solid var(--tertiary-color);
        color: var(--tertiary-color);
    }

    .btn-debito.verde {
        border: 2px solid var(--success-color);
        background-color: var(--success-color);
        color: var(--white-color);
    }

.titulo-debito {
    font-size: 19px !important;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 20px;
}

.radio-debito label {
    padding-left: 40px;
    font-size: 14px;
    padding-top: 5px;
}

.radio-debito {
    margin-top: 10px;
    margin-bottom: 10px;
}

    .radio-debito input[type="radio"] {
        opacity: 0 !important;
    }
.detalhes-cartao .well {
    padding: 0;
    overflow: hidden;
}

.detalhes-cartao .form-custom {
    position: relative;
    display: flex;
    background: var(--white-color);
    width: 100%;
    cursor: pointer;
}

    .detalhes-cartao .form-custom:nth-child(even) {
        background: var(--concrete);
    }

    .detalhes-cartao .form-custom:hover {
        background: var(--contrast-color);
    }

    .detalhes-cartao .form-custom input {
        margin: 36px 0 0 48px;
    }

        .detalhes-cartao .form-custom input + label {
            width: 100%;
            cursor: pointer;
            margin: 0 0 0 24px;
            padding: 30px 0 18px 0;
        }

            .detalhes-cartao .form-custom input + label h5 {
                font-size: 14px;
                font-weight: bold;
                text-transform: uppercase;
                letter-spacing: 0;
                margin: 3px 0 0 0;
                padding: 0;
            }

            .detalhes-cartao .form-custom input + label p.valor {
                 
                color: var(--tertiary-color);
                font-size: 24px;
                margin: -5px 0 0 0;
                padding: 0;
            }

                .detalhes-cartao .form-custom input + label p.valor span {
                    font-size: 12px;
                }

@media (max-width: 767px) {
    .detalhes-cartao .form-custom input {
        margin: 42px 0 0 36px;
    }

        .detalhes-cartao .form-custom input + label h5 {
            margin: 0 0 8px 0;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .detalhes-cartao .form-custom input {
        margin: 33px 0 0 36px;
    }

        .detalhes-cartao .form-custom input + label h5 {
            margin: 0 0 8px 0;
        }
}
.detalhes-consolidado .well {
    margin: 12px 0;
    padding: 18px 24px;
}

.detalhes-consolidado .t-header {
    background: var(--white-color);
    margin: 0;
    padding: 12px;
}

    .detalhes-consolidado .t-header h2 {
        font-size: 14px;
        text-transform: uppercase;
        font-weight: bold;
        margin: 0;
        padding: 0;
    }

.detalhes-consolidado .line-table {
    margin: 18px 0 0 0;
    padding: 6px 36px 18px 36px;
    border-bottom: 1px solid var(--contrast-color);
}

    .detalhes-consolidado .line-table:last-child {
        border-bottom: 1px solid var(--white-color);
    }

    .detalhes-consolidado .line-table h3,
    .detalhes-consolidado .line-table h4,
    .detalhes-consolidado .line-table h5 {
        margin: 0;
        padding: 0;
    }

    .detalhes-consolidado .line-table h4 {
        margin: 3px 0 0 0;
    }

    .detalhes-consolidado .line-table h5 {
        font-size: 16px;
        font-weight: bold;
        color: var(--tertiary-color);
        text-align: right;
    }

        .detalhes-consolidado .line-table h5.valor {
            font-size: 18px;
            color: var(--dark-color);
             
        }

@media (max-width: 767px) {
    .detalhes-consolidado .well {
        margin: 12px 0;
        padding: 18px 0;
    }

    .detalhes-consolidado .line-table h5 {
        text-align: left;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .detalhes-consolidado .well {
        margin: 12px 0;
        padding: 18px 0;
    }

    .detalhes-consolidado .line-table h5 {
        text-align: left;
    }
}

.area-error {
    position: absolute;
    bottom: -17px;
    left: 20px;
    font-size: 12px;
    font-weight: 500;
}

/* COLOR MENSAGEM ERRO FOMULARIOS */
.error {
    color: var(--primary-color);
    margin: 2px 0 0 5px;
}

.error-autocadastro {
    font-weight: normal !important;
    font-size: 12px;
    color: var(--primary-color);
}

.error-fixed {
    position: fixed;
}

.alert-custom-ib {
    color: var(--white-color);
    background-color: #00aeac;
    border-color: #00aeac;
}

#alert-data-menor {
    display: none;
    margin: 0 18px;
    padding: 8px 12px;
}

    #alert-data-menor p {
        font-size: 12px !important;
        line-height: 12px;
        margin: 0;
    }

#alert-resgate {
    margin-top: 15px;
}

.aviso-open {
    width: 100%;
    margin: 24px 0 12px 0;
    padding: 36px 48px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    overflow: hidden;
}

    .aviso-open p {
        font-size: 16px;
        line-height: 30px;
    }
.escolhe-mes {
    margin: -33px 0 20px -15px;
    height: 50px;
}

    .escolhe-mes ul {
        display: flex;
        width: 96%;
        list-style: none;
        margin: -12px 0 0 0;
        padding: 12px 0;
    }

    .escolhe-mes a {
        background: var(--contrast-color);
        color: var(--white-color);
        display: inline-block;
        padding: 4px 18px !important;
        margin: 0 12px 0 0 !important;
        border-radius: 24px;
        box-shadow: 0 0 14px rgba(0,0,0,.1);
        font-size: 12px !important;
        min-width: 100px;
        width: auto;
        text-align: center;
        font-weight: 500;
    }


    .escolhe-mes li.active a {
        background: var(--dark-color);
        color: var(--white-color);
        margin: -6px 12px 0 0px !important;
        padding: 8px 31px !important;
        min-width: 135px;
        font-family: var(--font-secondary);
        font-weight: bold;
    }

    .escolhe-mes li.active + li button {
        color: var(--white-color);
    }

    .escolhe-mes .form-custom {
        position: relative;
    }

        .escolhe-mes .form-custom select {
            width: 100%;
            outline: none;
            margin: -6px 0 0 0;
            padding: 8px 12px 8px 24px;
            border-radius: 18px;
            border: 1px solid var(--contrast-color);
            -webkit-appearance: none;
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.2);
        }

        .escolhe-mes .form-custom span {
            background: none;
            font-size: 10px;
            position: absolute;
            top: 7px;
            right: 18px;
            transform: rotate(-90deg);
        }

    .escolhe-mes .segunda-via {
        margin: -7px 0 0 0;
    }

        .escolhe-mes .segunda-via h5 {
            font-size: 11px;
            color: var(--tertiary-color);
            font-weight: bold;
            text-transform: uppercase;
        }

        .escolhe-mes .segunda-via a {
            min-width: 140px;
            display: inline-block;
            background: var(--white-color) !important;
            color: var(--primary-color) !important;
            text-align: center;
            outline: none;
            height: 35px;
            margin: 0 !important;
            padding: 8px 11px !important;
            border: 2px solid var(--primary-color);
        }

            .escolhe-mes .segunda-via button + button {
                margin: 0 0 0 6px;
            }

.offCursorPointer {
    cursor: default;
}

.stick-container.scroll-to-fixed-fixed .escolhe-mes {
    background: var(--white-color);
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.2);
    margin: -4px 0 0 -15px;
}

    .stick-container.scroll-to-fixed-fixed .escolhe-mes ul {
        margin: 0;
        padding: 18px 0 15px;
    }

    .stick-container.scroll-to-fixed-fixed .escolhe-mes .form-custom select {
        margin: 17px 0;
        box-shadow: 0 0 12px rgba(0, 0, 0, 0.1);
    }

    .stick-container.scroll-to-fixed-fixed .escolhe-mes .form-custom span {
        top: 30px;
    }

    .stick-container.scroll-to-fixed-fixed .escolhe-mes .segunda-via h5 {
        display: none;
    }

    .stick-container.scroll-to-fixed-fixed .escolhe-mes .segunda-via {
        margin: 14px 0 0 0;
        z-index: 10000;
    }

.mes-escolhido h4 {
    background: var(--white-color);
    color: var(--tertiary-color);
    border-radius: 36px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    text-align: center;
    margin: 1px 0 0 0;
    padding: 18px;
    font-size: 18px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Novo layout */
.escolhe-mes-box {
    margin: -33px 0 20px -15px;
}

    .escolhe-mes-box .container.miolo {
        width: 1204px;
        padding: 0;
    }

.escolhe-mes-box ul {
    width: calc(100% - 175px);
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

    .escolhe-mes-box .selecione {
        width: 175px;
        float: left;
        font-size:14px;
        font-weight: bold;
        padding: 3px 24px;
        font-family: var(--font-secondary);
    }

    .escolhe-mes-box a {
        border: 1px solid var(--dark-color);
        color: var(--dark-color);
        display: inline-block;
        padding: 4px 20px;
        margin: 0 12px 0 0;
        border-radius: 24px;
        font-size: 12px;
        width: auto;
        text-align: center;
        font-weight: 500;
        font-family: var(--font-secondary);
        cursor: pointer;
    }

.escolhe-mes-box li.active a, .escolhe-mes-box li a:hover {
    background: var(--dark-color);
    color: var(--white-color);
}

    .escolhe-mes-box li a.offCursorPointer {
        cursor: default;
        border: none;
        background-color: var(--contrast-color);
        color: var(--white-color);
    }

    .escolhe-mes-box .segunda-via {
        display: inline-block;
    }

    .escolhe-mes-box .segunda-via a {
        color: var(--dark-color);
        text-align: center;
        border: none;
        font-size: 12px;
        font-weight: bold;
        text-transform: uppercase;
        text-decoration: underline;
        padding: 5px 0px;
        white-space: nowrap;
        float: left;
    }
.etapas {
    display: flex;
    justify-content: space-between;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    height: 100px;
    margin-top: 260px;
}

    .etapas li {
        text-align: center;
        position: relative;
        width: 190px;
        color: var(--tertiary-color);
        font-size: 13px;
        font-weight: 900;
        text-transform: uppercase;
    }

        .etapas li > i {
            font-style: normal;
            border: 1px solid var(--contrast-color);
            border-radius: 20px;
            font-size: 16px;
            line-height: 32px;
            position: absolute;
            width: 34px;
            height: 34px;
            left: 50%;
            margin-left: -17px;
            top: -50px;
        }

        .etapas li.active {
            color: var(--primary-color);
        }

        .etapas li.error {
            color: var(--erro-color);
        }

        .etapas li.active > i {
            background: var(--contra-bg-color);
            border: none;
        }

        .etapas li.error > i {
            background: var(--contra-bg-color);
            border: none;
        }

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

        .etapas .done > i {
            background-image: url(img/check.svg) !important;
            border: none !important;
            text-indent: -1000px;
            overflow: hidden;
        }

        .etapas .done:after:first-child {
            content: "";
            position: absolute;
        }

        .etapas .done:after {
            content: "";
            width: 165px;
            height: 2px;
            border: solid 3px var(--success-color);
            position: absolute;
            top: -36px;
            border-radius: 30px;
            left: 120px;
        }

    .etapas .disable i {
        background-image: url(styles/assets/img/disable.svg);
    }

    .etapas .disable:after {
        content: "";
        width: 165px;
        height: 2px;
        border: solid 3px var(--contrast-color);
        position: absolute;
        top: -36px;
        border-radius: 30px;
        left: 120px;
    }

    .etapas .disable.last:after {
        display: none;
    }

    .etapas .active:before {
        content: url(styles/assets/img/active.svg);
        position: absolute;
        width: 34px;
        left: 50%;
        margin-left: -17px;
        top: -50px;
    }

    .etapas .active:after,
    .etapas .error:after {
        content: "";
        width: 165px;
        height: 2px;
        border: solid 3px var(--contrast-color);
        position: absolute;
        top: -36px;
        border-radius: 30px;
        left: 120px;
    }

.linha-etapa {
    width: 3px;
    height: 100%;
    background-color: var(--primary-color);
    position: absolute;
    z-index: -1;
    left: 0;
}

    .linha-etapa:before {
        content: "";
        position: absolute;
        width: 3px;
        height: 30%;
        top: 0px;
        background-color: var(--primary-color);
    }

    .linha-etapa:after {
        content: "";
        position: absolute;
        width: 3px;
        height: 70%;
        background-color: var(--contrast-color);
        top: 30%;
        transition: 0.3s ease;
    }

    .linha-etapa.proxima:after {
        height: 0%;
    }

    .linha-etapa.proxima .bola-etapa {
        top: 0%;
    }

.bola-etapa {
    width: 60px;
    height: 60px;
    background-color: var(--contra-bg-color);
    color: var(--primary-color);
    font-size: 30px;
    border-radius: 80px;
    top: 30%;
    position: absolute;
    left: -30px;
    z-index: 1;
    transition: 0.3s ease;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 6px;
}

@media (max-width: 767px) {
    .etapas {
        display: flex;
        height: auto;
        margin-top: 270px;
    }

        .etapas li {
            display: block;
            font-size: 8px;
            height: 100px;
            width: 100%;
        }

        .etapas .active:after,
        .etapas .error:after,
        .etapas .done:after,
        .etapas .disable:after {
            display: none;
        }

        .etapas div.active {
            color: var(--primary-color);
        }

        .etapas li.done span,
        .etapas li.disable span {
            display: none;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .etapas .active:after,
    .etapas .error:after,
    .etapas .done:after,
    .etapas .disable:after {
        width: 82px;
        left: 102px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .etapas .active:after,
    .etapas .error:after,
    .etapas .done:after,
    .etapas .disable:after {
        width: 125px;
        left: 112px;
    }
}
.exemplo-ppm__fluxo {
    display: grid;
    grid-column-gap: 24px;
    grid-template-columns: repeat(2,1fr);
}

    .exemplo-ppm__fluxo > div {
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

        .exemplo-ppm__fluxo > div span {
            font-size: 26px;
            color: var(--tertiary-color);
            margin: 0 12px 0 0;
        }

        .exemplo-ppm__fluxo > div p {
            font-size: 13px;
            color: var(--tertiary-color);
            line-height: 18px;
            margin: 0;
            padding: 0;
        }

            .exemplo-ppm__fluxo > div p strong {
                font-size: 15px;
                color: var(--dark-color);
                font-weight: bold;
            }

        .exemplo-ppm__fluxo > div.recebido p strong {
            color: var(--primary-color);
        }

        .exemplo-ppm__fluxo > div.poupado p,
        .exemplo-ppm__fluxo > div.poupado p strong {
            color: var(--success-color);
        }

.exemplo-ppm__extrato {
    margin: 12px 0 0 0;
    box-shadow: 0 3px 1px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}

.exemplo-ppm__extrato--item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 58px;
    border: 1px solid var(--contrast-color);
    margin: 0;
    padding: 12px 15px;
}

    .exemplo-ppm__extrato--item:last-child {
        border-top: 0px;
        border-bottom: 0px;
        position: relative;
    }

    .exemplo-ppm__extrato--item p {
        color: var(--dark-color);
        line-height: 14px;
        margin: 0;
        padding: 0;
    }

        .exemplo-ppm__extrato--item p small {
            color: var(--tertiary-color);
        }

    .exemplo-ppm__extrato--item span {
        font-size: 24px;
        color: var(--tertiary-color);
        margin: 0 24px 0 0;
    }

        .exemplo-ppm__extrato--item span + p {
            font-size: 14px;
            flex: auto;
        }

    .exemplo-ppm__extrato--item p + p {
        font-size: 16px;
    }

.fatura-info {
    text-align: center;
}

    .fatura-info h4 {
        font-size: 9px;
        color: var(--tertiary-color);
        font-weight: bold;
        margin: 12px 0 0 0;
        text-transform: uppercase;
    }

    .fatura-info .base-valor {
         
        text-align: center;
        font-size: 14px;
        color: var(--tertiary-color);
        background-color: var(--white-color);
        border-radius: 36px;
        margin: 8px 0 0 0;
        padding: 12px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        transition: all 0.2s ease;
    }

        .fatura-info .base-valor.minimo {
            background-image: linear-gradient(to right, #00b48d, #49b869);
            color: var(--white-color);
        }

        .fatura-info .base-valor:hover {
            transform: translate(0, -3px);
            box-shadow: 0 8px 36px rgba(0, 0, 0, 0.2);
        }

        .fatura-info .base-valor.minimo p,
        .fatura-info .base-valor.minimo p span {
            color: var(--white-color);
        }

@media (max-width: 767px) {
    .fatura-info h4 {
        font-size: 10px;
    }

    .fatura-info .base-valor.minimo {
        margin: 8px 0 36px 0;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .fatura-info h4 {
        font-size: 10px;
    }

    .fatura-info .base-valor.minimo {
        margin: 8px 0 36px 0;
    }
}
.file-drop-button {
    width: 100%;
    height: 60px;
    border-radius: 30px;
    background-image: var(--gradient-color);
    margin-top: 56px;
    position: absolute;
    display: block;
    color: var(--white-color);
    font-size: 16px;
    padding-top: 20px;
    text-transform: uppercase;
     
}

.file-drop-area {
    border: 2px dashed var(--contrast-color);
    position: relative;
    text-align: center;
    width: 100%;
    padding: 27px 0px;
    transition: 0.2s;
    border-radius: 70px;
    margin-top: 30px;
}

@media (min-width: 992px) and (max-width: 1199px) {
    .file-drop-button {
        font-size: 12px;
        padding-top: 23px;
    }
}
.file-input {
    position: absolute;
    left: 0;
    top: 0;
    height: 265% !important;
    cursor: pointer;
    opacity: 0;
    outline: none;
    z-index: 1;
}

.file-input-selfie {
    position: absolute;
    left: 0;
    top: 0;
    height: 110%;
    cursor: pointer;
    opacity: 0;
    outline: none;
    z-index: 1;
}

@media (max-width: 767px) {
    .file-input {
        width: 100%;
    }
}
.topo-scroll.scroll-to-fixed-fixed {
    top: 58px !important;
    box-shadow: 0px 10px 39px -19px #000;
}

.filtro-todos .submenu-coluna {
    position: absolute;
    z-index: 1;
    background-color: var(--white-color);
    padding: 0px 30px 0px 30px;
    top: 40px;
    box-shadow: 0px 20px 60px -20px var(--tertiary-color);
    border-top: 2px solid var(--contrast-color);
    opacity: 0;
    visibility: hidden;
    transition: 0s ease;
}

.filtro-todos:hover .submenu-coluna {
    top: 76px;
    opacity: 1;
    visibility: visible;
    transition: 0.3s ease;
}

.filtro-todos .filtro-invest {
    margin: 0;
    padding: 0;
}

    .filtro-todos .filtro-invest li {
        list-style: none;
        padding: 10px 0px 10px 0px;
        text-align: left;
        font-size: 12px;
        white-space: nowrap;
    }

        .filtro-todos .filtro-invest li.active {
            padding: 10px 0px 10px 0px;
            text-align: left;
        }

        .filtro-todos .filtro-invest li .radio {
            margin: 0;
        }

        .filtro-todos .filtro-invest li.active .radio input[type="checkbox"]:checked + .radio-label:before {
            background-color: var(--primary-color);
            box-shadow: inset 0 0 0 4px var(--concrete);
            border-color: var(--primary-color);
        }

@media (max-width: 767px) {
    #header-filtro {
        margin-bottom: 10px;
    }

        #header-filtro .col-sm-3 .coluna,
        #header-filtro .col-sm-9 .coluna {
            padding: 20px 30px !important;
        }

            #header-filtro .col-sm-3 .coluna .icone-table,
            #header-filtro .col-sm-9 .coluna .icone-table {
                position: absolute;
                right: 28px;
            }

            #header-filtro .col-sm-3 .coluna:after,
            #header-filtro .col-sm-9 .coluna:after {
                background-color: transparent;
            }

        #header-filtro .col-sm-3 .coluna {
            border-radius: 5px 5px 0 0;
        }

        #header-filtro .col-sm-9 .col-md-12 .row .col-sm-2:nth-last-child(2) .coluna {
            border-radius: 0 0 5px 5px;
        }

    .filtro-todos:hover .submenu-coluna {
        top: 57px;
        left: 0;
    }
}

.filtros-avancados {
    position: relative;
    padding: 18px 0;
    margin: 48px 0 -130px 0;
    z-index: 10;
}

    .filtros-avancados.export {
        margin: 0px 0 24px 0;
    }

    .filtros-avancados.comprov {
        position: relative;
        padding: 18px 0;
        margin: 12px 0 24px 0;
        z-index: 10;
    }

        .filtros-avancados.comprov .control-show-filter {
            position: absolute;
            top: 20px;
            left: 0;
        }

    .filtros-avancados .control-show-filter {
        position: absolute;
        top: 20px;
        right: 0;
    }

        .filtros-avancados .control-show-filter .toggle-switch {
            width: 100%;
        }

            .filtros-avancados .control-show-filter .toggle-switch .text {
                text-transform: uppercase;
                font-weight: bold;
                margin: 0 8px 0 0;
            }

            .filtros-avancados .control-show-filter .toggle-switch input[type="checkbox"].toggleCustom.filtroOpen ~ label {
                background-color: var(--contrast-color);
            }

                .filtros-avancados .control-show-filter .toggle-switch input[type="checkbox"].toggleCustom.filtroOpen ~ label::before {
                    background-color: var(--tertiary-color);
                }

            .filtros-avancados .control-show-filter .toggle-switch input[type="checkbox"].toggleCustom.filtroOpen:checked ~ label {
                background: var(--success-color);
            }

                .filtros-avancados .control-show-filter .toggle-switch input[type="checkbox"].toggleCustom.filtroOpen:checked ~ label::before {
                    background-color: #b1efa5;
                }

    .filtros-avancados .filtros-show {
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 0;
        margin: 0 0 72px 0;
        padding: 0 0 0 0;
        opacity: 0;
        transform: translate(0, 72px);
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

        .filtros-avancados .filtros-show.open {
            height: 100%;
            opacity: 1;
            margin: 0 0 180px 0;
        }

@media (min-width: 768px) and (max-width: 991px) {
    .filtros-avancados.comprov {
        margin: 12px 0 72px 0;
    }
}
.grupo-form {
    position: relative;
}

form.ajust-height {
    height: 100%;
}

select::-ms-expand {
    display: none;
}

.form-custom {
    position: relative;
}

.margin-ajuste .form-custom {
    margin-top: 4px;
}

    .form-custom input[type="text"],
    .form-custom input[type="tel"],
    .form-custom input[type="email"],
    .form-custom input[type="password"] {
        width: 100%;
        padding: 24px 12px 12px 24px;
        border: 1px solid var(--contrast-color);
        border-radius: 48px;
        box-shadow: 0 0 0 2px var(--primary-color);
        outline: none;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

        .form-custom input[type="text"]:focus,
        .form-custom input[type="tel"]:focus,
        .form-custom input[type="email"]:focus,
        .form-custom input[type="password"]:focus {
            box-shadow: 0 0 0 2px var(--primary-color);
        }

        .form-custom input[type="text"]:disabled + label,
        .form-custom input[type="tel"]:disabled + label,
        .form-custom input[type="email"]:disabled + label,
        .form-custom input[type="password"]:disabled + label {
            font-size: 10px;
            color: var(--tertiary-color);
            top: 8px;
            left: 24px;
        }

        .form-custom input[type="text"] + label,
        .form-custom input[type="tel"] + label,
        .form-custom input[type="email"] + label,
        .form-custom input[type="password"] + label {
            position: absolute;
            font-size: 12px;
            top: 17px;
            left: 30px;
            pointer-events: none;
            transition: all 0.3s ease;
        }

        .form-custom input[type="text"]:active + label,
        .form-custom input[type="text"]:focus + label,
        .form-custom input[type="text"]:valid + label,
        .form-custom input[type="tel"]:active + label,
        .form-custom input[type="tel"]:focus + label,
        .form-custom input[type="tel"]:valid + label,
        .form-custom input[type="email"]:active + label,
        .form-custom input[type="email"]:focus + label,
        .form-custom input[type="email"]:valid + label,
        .form-custom input[type="password"]:active + label,
        .form-custom input[type="password"]:focus + label,
        .form-custom input[type="password"]:valid + label {
            font-size: 10px;
            color: var(--tertiary-color);
            top: 8px;
            left: 24px;
        }

    .form-custom.no-label input {
        width: 100%;
        margin: 12px 0 0 0;
        padding: 14px 18px 16px 24px;
        border: none;
        outline: none;
    }

    .form-custom input[type="range"] {
        -webkit-appearance: none;
        background-color: var(--colorfull);
        border-radius: 18px;
        width: 100%;
        height: 4px;
        margin: 8px 0 0 0;
        padding: 0px 0 0 0;
        outline: none;
    }

    .form-custom select {
        width: 100%;
        outline: none;
        margin: 12px 0;
        padding: 14px 12px 14px 24px;
        border-radius: 24px;
        background: var(--white-color);
        border: 1px solid var(--white-color);
        -webkit-appearance: none;
        -moz-appearance: none;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

        .form-custom select.aprovacao {
            margin: -10px;
        }

    .form-custom .seta span {
        background: none;
        font-size: 10px;
        position: absolute;
        right: 30px;
        transform: rotate(-90deg);
    }

    .ajuste-seta-debito-automatico {
        transform: translate(0em,3em) rotate(-90deg) !important;
    }

.top-0 {
    top: 0 !important;
}

.top-30 {
    top: 30px !important;
}

    .form-custom .seta.aprovacao span {
        top: 10px;
    }

    .form-custom .btn-confirm {
        cursor: pointer;
        position: absolute;
        top: 19px;
        right: 18px;
        font-size: 12px;
        color: var(--primary-color);
        font-weight: bold;
        text-transform: uppercase;
        z-index: 2;
    }

        .form-custom .btn-confirm:after {
            content: "Confirmar"
        }

@media (max-width: 767px) {
    .grupo-form {
        margin-bottom: 15px;
    }
}
.gallery .control-operator:target ~ .controls .control-button {
  color: var(--contrast-color);
  color: rgba(255, 255, 255, 0.4);
}

.gallery .control-button:first-of-type,
.gallery .control-operator:nth-of-type(1):target ~ .controls .control-button:nth-of-type(1),
.gallery .control-operator:nth-of-type(2):target ~ .controls .control-button:nth-of-type(2),
.gallery .control-operator:nth-of-type(3):target ~ .controls .control-button:nth-of-type(3),
.gallery .control-operator:nth-of-type(4):target ~ .controls .control-button:nth-of-type(4),
.gallery .control-operator:nth-of-type(5):target ~ .controls .control-button:nth-of-type(5) {
  color: var(--white-color);
  color: rgba(255, 255, 255, 0.8);
}

.gallery .item:first-of-type {
  position: static;
  pointer-events: auto;
  opacity: 1;
}

.gallery .item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0;
  -webkit-transition: opacity .5s;
  -o-transition: opacity .5s;
  transition: opacity .5s;
}

.gallery .control-operator {
  display: none;
}

.gallery .control-operator:target ~ .item {
  pointer-events: none;
  opacity: 0;
  -webkit-animation: none;
  -o-animation: none;
  animation: none;
}

.gallery .control-operator:target ~ .controls .control-button {
  -webkit-animation: none;
  -o-animation: none;
  animation: none;
}

@-webkit-keyframes controlAnimation-2 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  14.3%, 50% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  64.3%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@-o-keyframes controlAnimation-2 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  14.3%, 50% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  64.3%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@keyframes controlAnimation-2 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  14.3%, 50% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  64.3%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@-webkit-keyframes galleryAnimation-2 {
  0% {
    opacity: 0;
  }

  14.3%, 50% {
    opacity: 1;
  }

  64.3%, 100% {
    opacity: 0;
  }
}

@-o-keyframes galleryAnimation-2 {
  0% {
    opacity: 0;
  }

  14.3%, 50% {
    opacity: 1;
  }

  64.3%, 100% {
    opacity: 0;
  }
}

@keyframes galleryAnimation-2 {
  0% {
    opacity: 0;
  }

  14.3%, 50% {
    opacity: 1;
  }

  64.3%, 100% {
    opacity: 0;
  }
}

.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2) {
  pointer-events: auto;
  opacity: 1;
}

.items-2.autoplay .control-button {
  -webkit-animation: controlAnimation-2 14s infinite;
  -o-animation: controlAnimation-2 14s infinite;
  animation: controlAnimation-2 14s infinite;
}

.items-2.autoplay .item {
  -webkit-animation: galleryAnimation-2 14s infinite;
  -o-animation: galleryAnimation-2 14s infinite;
  animation: galleryAnimation-2 14s infinite;
}

.items-2 .control-button:nth-of-type(1),
.items-2 .item:nth-of-type(1) {
  -webkit-animation-delay: -2s;
  -o-animation-delay: -2s;
  animation-delay: -2s;
}

.items-2 .control-button:nth-of-type(2),
.items-2 .item:nth-of-type(2) {
  -webkit-animation-delay: 5s;
  -o-animation-delay: 5s;
  animation-delay: 5s;
}

@-webkit-keyframes controlAnimation-3 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  9.5%, 33.3% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  42.9%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@-o-keyframes controlAnimation-3 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  9.5%, 33.3% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  42.9%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@keyframes controlAnimation-3 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  9.5%, 33.3% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  42.9%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@-webkit-keyframes galleryAnimation-3 {
  0% {
    opacity: 0;
  }

  9.5%, 33.3% {
    opacity: 1;
  }

  42.9%, 100% {
    opacity: 0;
  }
}

@-o-keyframes galleryAnimation-3 {
  0% {
    opacity: 0;
  }

  9.5%, 33.3% {
    opacity: 1;
  }

  42.9%, 100% {
    opacity: 0;
  }
}

@keyframes galleryAnimation-3 {
  0% {
    opacity: 0;
  }

  9.5%, 33.3% {
    opacity: 1;
  }

  42.9%, 100% {
    opacity: 0;
  }
}

.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(3):target ~ .item:nth-of-type(3) {
  pointer-events: auto;
  opacity: 1;
}

.items-3.autoplay .control-button {
  -webkit-animation: controlAnimation-3 21s infinite;
  -o-animation: controlAnimation-3 21s infinite;
  animation: controlAnimation-3 21s infinite;
}

.items-3.autoplay .item {
  -webkit-animation: galleryAnimation-3 21s infinite;
  -o-animation: galleryAnimation-3 21s infinite;
  animation: galleryAnimation-3 21s infinite;
}

.items-3 .control-button:nth-of-type(1),
.items-3 .item:nth-of-type(1) {
  -webkit-animation-delay: -2s;
  -o-animation-delay: -2s;
  animation-delay: -2s;
}

.items-3 .control-button:nth-of-type(2),
.items-3 .item:nth-of-type(2) {
  -webkit-animation-delay: 5s;
  -o-animation-delay: 5s;
  animation-delay: 5s;
}

.items-3 .control-button:nth-of-type(3),
.items-3 .item:nth-of-type(3) {
  -webkit-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
}

@-webkit-keyframes controlAnimation-4 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  7.1%, 25% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  32.1%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@-o-keyframes controlAnimation-4 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  7.1%, 25% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  32.1%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@keyframes controlAnimation-4 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  7.1%, 25% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  32.1%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@-webkit-keyframes galleryAnimation-4 {
  0% {
    opacity: 0;
  }

  7.1%, 25% {
    opacity: 1;
  }

  32.1%, 100% {
    opacity: 0;
  }
}

@-o-keyframes galleryAnimation-4 {
  0% {
    opacity: 0;
  }

  7.1%, 25% {
    opacity: 1;
  }

  32.1%, 100% {
    opacity: 0;
  }
}

@keyframes galleryAnimation-4 {
  0% {
    opacity: 0;
  }

  7.1%, 25% {
    opacity: 1;
  }

  32.1%, 100% {
    opacity: 0;
  }
}

.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(3):target ~ .item:nth-of-type(3) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(4):target ~ .item:nth-of-type(4) {
  pointer-events: auto;
  opacity: 1;
}

.items-4.autoplay .control-button {
  -webkit-animation: controlAnimation-4 28s infinite;
  -o-animation: controlAnimation-4 28s infinite;
  animation: controlAnimation-4 28s infinite;
}

.items-4.autoplay .item {
  -webkit-animation: galleryAnimation-4 28s infinite;
  -o-animation: galleryAnimation-4 28s infinite;
  animation: galleryAnimation-4 28s infinite;
}

.items-4 .control-button:nth-of-type(1),
.items-4 .item:nth-of-type(1) {
  -webkit-animation-delay: -2s;
  -o-animation-delay: -2s;
  animation-delay: -2s;
}

.items-4 .control-button:nth-of-type(2),
.items-4 .item:nth-of-type(2) {
  -webkit-animation-delay: 5s;
  -o-animation-delay: 5s;
  animation-delay: 5s;
}

.items-4 .control-button:nth-of-type(3),
.items-4 .item:nth-of-type(3) {
  -webkit-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
}

.items-4 .control-button:nth-of-type(4),
.items-4 .item:nth-of-type(4) {
  -webkit-animation-delay: 19s;
  -o-animation-delay: 19s;
  animation-delay: 19s;
}

@-webkit-keyframes controlAnimation-5 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  5.7%, 20% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  25.7%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@-o-keyframes controlAnimation-5 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  5.7%, 20% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  25.7%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@keyframes controlAnimation-5 {
  0% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }

  5.7%, 20% {
    color: var(--white-color);
    color: rgba(255, 255, 255, 0.8);
  }

  25.7%, 100% {
    color: var(--contrast-color);
    color: rgba(255, 255, 255, 0.4);
  }
}

@-webkit-keyframes galleryAnimation-5 {
  0% {
    opacity: 0;
  }

  5.7%, 20% {
    opacity: 1;
  }

  25.7%, 100% {
    opacity: 0;
  }
}

@-o-keyframes galleryAnimation-5 {
  0% {
    opacity: 0;
  }

  5.7%, 20% {
    opacity: 1;
  }

  25.7%, 100% {
    opacity: 0;
  }
}

@keyframes galleryAnimation-5 {
  0% {
    opacity: 0;
  }

  5.7%, 20% {
    opacity: 1;
  }

  25.7%, 100% {
    opacity: 0;
  }
}

.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(3):target ~ .item:nth-of-type(3) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(4):target ~ .item:nth-of-type(4) {
  pointer-events: auto;
  opacity: 1;
}

.gallery .control-operator:nth-of-type(5):target ~ .item:nth-of-type(5) {
  pointer-events: auto;
  opacity: 1;
}

.items-5.autoplay .control-button {
  -webkit-animation: controlAnimation-5 35s infinite;
  -o-animation: controlAnimation-5 35s infinite;
  animation: controlAnimation-5 35s infinite;
}

.items-5.autoplay .item {
  -webkit-animation: galleryAnimation-5 35s infinite;
  -o-animation: galleryAnimation-5 35s infinite;
  animation: galleryAnimation-5 35s infinite;
}

.items-5 .control-button:nth-of-type(1),
.items-5 .item:nth-of-type(1) {
  -webkit-animation-delay: -2s;
  -o-animation-delay: -2s;
  animation-delay: -2s;
}

.items-5 .control-button:nth-of-type(2),
.items-5 .item:nth-of-type(2) {
  -webkit-animation-delay: 5s;
  -o-animation-delay: 5s;
  animation-delay: 5s;
}

.items-5 .control-button:nth-of-type(3),
.items-5 .item:nth-of-type(3) {
  -webkit-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
}

.items-5 .control-button:nth-of-type(4),
.items-5 .item:nth-of-type(4) {
  -webkit-animation-delay: 19s;
  -o-animation-delay: 19s;
  animation-delay: 19s;
}

.items-5 .control-button:nth-of-type(5),
.items-5 .item:nth-of-type(5) {
  -webkit-animation-delay: 26s;
  -o-animation-delay: 26s;
  animation-delay: 26s;
}

.gallery .control-button {
  color: var(--contrast-color);
  color: rgba(255, 255, 255, 0.4);
}

.gallery .control-button:hover {
  color: var(--contrast-color);
  color: rgba(255, 255, 255, 0.8);
}

/*
  Theme controls how everything looks in Gallery CSS.
*/

.gallery {
  position: relative;
}

.gallery .item {
  height: auto;
  overflow: hidden;
}

.gallery .controls {
  position: absolute;
  bottom: 6px;
  left: 18px;
  width: auto;
  text-align: center;
}

.gallery .control-button {
  display: inline-block;
  margin: 0;
  font-size: 1.4em;
  text-align: left;
  text-decoration: none;
  -webkit-transition: color .1s;
  -o-transition: color .1s;
  transition: color .1s;
}

/**** THEME ****/
.gallery.cartoes .controls {
  position: absolute;
  height: 48px;
  top: -54px; right: 0;
  text-align: right;
}

.gallery.cartoes .control-button {
  color: var(--contrast-color);
  color: rgba(0, 0, 0, 0.4);
}

.gallery.cartoes .control-button:hover {
  color: var(--contrast-color);
  color: rgba(0, 0, 0, 0.8);
}


.gallery.cartoes .control-operator:target ~ .controls .control-button {
  color: var(--contrast-color);
  color: rgba(0, 0, 0, 0.4);
}

.gallery.cartoes .control-button:first-of-type,
.gallery.cartoes .control-operator:nth-of-type(1):target ~ .controls .control-button:nth-of-type(1),
.gallery.cartoes .control-operator:nth-of-type(2):target ~ .controls .control-button:nth-of-type(2),
.gallery.cartoes .control-operator:nth-of-type(3):target ~ .controls .control-button:nth-of-type(3),
.gallery.cartoes .control-operator:nth-of-type(4):target ~ .controls .control-button:nth-of-type(4),
.gallery.cartoes .control-operator:nth-of-type(5):target ~ .controls .control-button:nth-of-type(5) {
  color: var(--primary-color);
  color: rgba(221, 107, 0, 0.8);
}

.gallery.cartoes .control-button {
    display: inline-block;
    margin: 0 .01em;
    font-size: 2em;
    text-align: auto;
    text-decoration: none;
    -webkit-transition: color .1s;
    -o-transition: color .1s;
    transition: color .1s;
}
.base-box .base-conteudo.grafico-home {
    margin: 24px 0 0;
}

.grafico-home > div:nth-child(2) {
    height: 136px;
    overflow: hidden;
}

.grafico-home .aplicacaoHome > div {
    height: 27px;
}

.grafico-home > button {
    width: 68% !important;
    position: absolute;
    bottom: 19px;
    left: 47px;
}

.grafico-home .margin-ajuste > .col-md-12 > .row > .col-xs-7,
.grafico-home .margin-ajuste > .col-md-12 > .row > .col-lg-7 {
    padding: 0 0 0 5px;
}

    .grafico-home .margin-ajuste > .col-md-12 > .row > .col-xs-7 p,
    .grafico-home .margin-ajuste > .col-md-12 > .row > .col-lg-7 p,
    .grafico-home .margin-ajuste > .col-md-12 > .row > .col-xs-5 p,
    .grafico-home .margin-ajuste > .col-md-12 > .row > .col-lg-5 p {
        font-size: 10px !important;
    }

        .grafico-home .margin-ajuste > .col-md-12 > .row > .col-xs-7 p span {
            width: 13px;
            margin-right: 4px;
        }

.grafico-home .margin-ajuste > .col-md-12 > .row > .col-xs-5,
.grafico-home .margin-ajuste > .col-md-12 > .row > .col-lg-5 {
    padding: 0 10px 0 0;
}

/* MEUS INVESTIMENTOS */
.chart {
    position: absolute;
    width: 100px;
    height: 100px;
    margin: 20px 0px;
}

.doughnutTip {
    position: absolute;
    min-width: 30px;
    max-width: 300px;
    padding: 5px 15px;
    border-radius: 0px;
    background: rgba(0, 0, 0, 0.8);
    color: var(--contrast-color);
    font-size: 17px;
    text-shadow: 0 1px 0 var(--dark-color);
    text-transform: uppercase;
    text-align: center;
    line-height: 1.3;
    letter-spacing: 0.06em;
    pointer-events: none;
}

    .doughnutTip::after {
        position: absolute;
        left: 50%;
        bottom: -6px;
        content: "";
        height: 0;
        margin: 0 0 0 -6px;
        line-height: 0;
    }

.doughnutSummary {
    display: none;
    cursor: default;
}

.doughnutSummaryTitle {
    position: absolute;
    top: 50%;
    width: 100%;
    margin-top: -27%;
    font-size: 22px;
    letter-spacing: 0.06em;
}

.doughnutSummaryNumber {
    position: absolute;
    top: 50%;
    width: 100%;
    margin-top: -15%;
    font-size: 55px;
}

.chart path:hover {
    opacity: 1;
}

.saldo-investimento p {
    text-transform: uppercase;
    color: var(--primary-color) !important;
    font-size: 10px !important;
    text-align: left;
    height: auto !important;
    font-weight: 900 !important;
    margin-top: 19px;
}

    .saldo-investimento p + p {
        color: var(--dark-color) !important;
        font-size: 14px !important;
        margin-top: 0px;
    }

        .saldo-investimento p + p + p {
            color: var(--dark-color) !important;
            font-size: 11px !important;
            margin-top: 5px;
            line-height: 11px;
        }

            .saldo-investimento p + p + p + p {
                color: var(--dark-color) !important;
                font-size: 14px !important;
                margin-top: 7px;
            }

p.invests {
    font-size: 10px !important;
    height: 30px !important;
    text-align: left;
    margin-left: 10px;
}

    p.invests span {
        display: inline-block;
        width: 26px;
        height: 8px;
        background-color: var(--dark-color);
        margin-right: 6px;
        border-radius: 15px;
    }

.valor-invest {
    font-size: 10px !important;
    color: var(--dark-color) !important;
    font-weight: 300 !important;
    height: 22px !important;
}

    .valor-invest span {
        font-weight: 900 !important;
        color: var(--primary-color) !important;
    }

@media (max-width: 767px) {
    p.valor-invest {
        text-align: left;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    p.valor-invest {
        white-space: nowrap;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .grafico-home .aplicacaoHome:first-of-type {
        margin-top: 10px;
    }

    .grafico-home .aplicacaoHome > div {
        height: 18px;
    }

    /* MEUS INVESTIMENTOS */
    .saldo-investimento p {
        font-size: 8px !important;
    }

        .saldo-investimento p + p {
            padding-left: 0;
        }

            .saldo-investimento p + p + p {
                font-size: 9px !important;
            }

    p.invests {
        height: 15px !important;
    }

    p.valor-invest {
        text-align: left;
        padding-left: 34px;
    }
}


.limite {
    margin: 24px 0 0 0;
}


.limite .disponivel p {
    text-transform: uppercase;
    font-size: 10px;
    font-weight: bold;
    color: var(--tertiary-color);
    margin: 0;
    padding: 0;
}

    .limite .disponivel p + p {
        font-size: 16px;
        color: var(--success-color);
        margin: 0;
        padding: 0;
    }

        .limite .disponivel p + p span {
            color: var(--success-color);
        }


.limite .total p {
    text-align: left;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: bold;
    color: var(--tertiary-color);
    margin: 0;
    padding: 0;
}


    .limite .total p + p {
        font-size: 16px;
        color: var(--dark-color);
        margin: 0;
        padding: 0;
    }


        .limite .total p + p span {
            color: var(--dark-color);
        }


.limite .progress {
    height: 6px;
    margin: 6px 0 0 0;
    overflow: hidden;
    background-color: var(--contrast-color);
    border-radius: 12px;
    box-shadow: none;
}


.limite .progress-bar {
    background-color: var(--success-color);
    background-image: linear-gradient(to right, #00b48d, #49b869);
}


.limite .excedido p {
    text-transform: uppercase;
    font-size: 10px;
    font-weight: bold;
    color: var(--erro-color);
    margin: 0;
    padding: 0;
}


    .limite .excedido p + p {
        font-family: 'Varela Round', sans-serif;
        font-size: 16px;
        color: var(--erro-color);
        margin: 0;
        padding: 0;
    }


        .limite .excedido p + p span {
            color: var(--erro-color);
        }


@media (min-width: 992px) and (max-width: 1199px) {
    .limite .disponivel p + p {
        font-size: 12px;
    }


    .limite .total p + p {
        font-size: 12px;
    }
}


.card {
    background: var(--white-color);
    box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.06);
    border-radius: 4px;
    padding: 24px;
}


.titulo-card {
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    line-height: 21px;
}


.mt-20 {
    margin-top: 20px;
}

.parcelas {
    color: var(--primary-color);
    text-decoration: underline;
}

.parcelas:hover {
    color: var(--primary-color) !important;
    text-decoration: underline !important;
}

.parcelas:focus {
    color: var(--primary-color) !important;
    text-decoration: underline !important;
}

.parcelas:active {
    color: var(--primary-color) !important;
    text-decoration: underline !important;
}
.linha-acompanhamento {
    border-radius: 20px 20px 20px 20px;
    width: 100%;
    padding: 30px 10px;
    background-color: var(--white-color);
    border: 0;
    outline: none;
    transition: 0.3s ease;
    margin-top: 20px;
}

    .linha-acompanhamento .titulo-acompanhamento {
        color: var(--primary-color);
        font-size: 16px;
    }

    .linha-acompanhamento .btn-ver-detalhes-acompanhamento {
        background-color: var(--colorfull);
        color: var(--white-color);
        text-transform: uppercase;
        font-weight: bold;
        padding: 10px 20px;
        border-radius: 20px;
        cursor: pointer;
        white-space: nowrap;
    }

.linha-investimento .coluna {
    height: 80px;
    padding: 19px 0px;
}

    .linha-investimento .coluna span {
        margin-top: 0px;
        display: block;
    }

.linha-investimento > .col-sm-9 .col-md-12 > .row > div > .coluna {
    display: flex;
    align-items: center;
    justify-content: center;
}

.linha-investimento .icone-fechar-abre {
    margin-top: 0;
}

.linha-investimento:not(.linha-aplicar) .sub-icones .tooltip {
    min-width: 10px !important;
    padding: 3px 5px;
}

.linha-investimento .coluna .titulo-m-coluna {
    display: none;
}

.linha-investimento .nome-produto {
    font-size: 18px;
    text-align: left;
    padding-left: 20px;
    position: relative;
    color: var(--dark-color);
}

    .linha-investimento .nome-produto i {
        vertical-align: baseline;
        font-size: 16px;
        color: var(--primary-color);
        margin-left: 0px;
        position: absolute;
        right: 10px;
        top: 4px;
    }

@media (max-width: 767px) {
    .linha-investimento {
        margin-bottom: 40px;
    }
        .linha-investimento .coluna span {
            margin-top: 0px;
            display: inline-block !important;
            font-weight: 900;
        }

        .linha-investimento .coluna .titulo-m-coluna {
            display: inline-block;
            font-weight: 900;
            margin-right: 10px;
        }

        .linha-investimento .nome-produto {
            padding-left: 0px;
        }

            .linha-investimento .nome-produto i {
                right: -15px;
                top: -12px;
                font-size: 22px;
            }
}

@media (min-width: 768px) and (max-width: 991px) {
    .linha-investimento .nome-produto {
        font-size: 10px;
        padding-left: 10px;
        font-weight: 900;
    }

        .linha-investimento .nome-produto i {
            vertical-align: baseline;
            font-size: 16px;
            color: var(--primary-color);
            margin-left: 0px;
            position: absolute;
            right: 17px;
            top: -1px;
        }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .linha-investimento .nome-produto {
        font-size: 11px;
    }

        .linha-investimento .nome-produto i {
            top: 1px;
        }
}
.lista-simples {
    list-style: none;
    margin-bottom: 10px;
    overflow: hidden;
}

    .lista-simples li {
        position: relative;
        padding-left: 20px;
        color: var(--tertiary-color);
        margin-bottom: 10px;
    }

        .lista-simples li:before {
            color: var(--primary-color);
            content: "\e930";
            font-family: 'icomoon' !important;
            position: absolute;
            left: 0;
            top: 2px;
        }

/* LOADING PÁGINA - INÍCIO */
.loading-page {
    position: fixed;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.8);
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    pointer-events: visible;
}

    .loading-page img {
        height: 160px;
        position: absolute;
        top: 50%;
        margin-top: -80px;
        left: 50%;
        margin-left: -80px;
    }
/* LOADING PÁGINA - FIM */

.margin-ajuste {
    margin-top: 43px;
}

.margin-ajuste2 {
    margin-top: 10px;
}

.margin-ajuste-fale {
    margin-top: 15px;
}

@media (min-width: 992px) and (max-width: 1199px) {
    .margin-ajuste {
        margin-top: 27px;
    }
}
.opcoes-recarga {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 36px 0;
}

    .opcoes-recarga .form-custom {
        position: relative;
    }

        .opcoes-recarga .form-custom input[type=radio] {
            position: absolute;
            width: 100%;
            height: 100%;
            border: none;
            box-shadow: none;
            background-color: transparent;
            cursor: pointer;
        }

            .opcoes-recarga .form-custom input[type=radio] + label {
                color: var(--primary-color);
                font-size: 18px;
                font-weight: bold;
                text-align: center;
                border-radius: 36px;
                border: 2px solid var(--primary-color);
                width: 100%;
                height: auto;
                margin: 0;
                padding: 8px 30px;
            }

            .opcoes-recarga .form-custom input[type=radio]:checked + label {
                color: var(--white-color);
                background-color: var(--primary-color);
            }

@media (max-width: 767px) {
    .opcoes-recarga {
        flex-wrap: wrap;
    }

        .opcoes-recarga .form-custom {
            flex: auto;
            min-width: 44%;
            margin: 8px 6px;
        }

            .opcoes-recarga .form-custom input[type=radio] + label {
                padding: 18px 30px;
            }
}
.passos-recarga {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

    .passos-recarga li a {
        display: block;
        color: var(--white-color);
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        border-radius: 12px;
        width: 24px;
        height: 24px;
        margin: 0 4px;
        padding: 2px 0;
        background-color: var(--contrast-color);
    }

    .passos-recarga li.active a {
        background-color: var(--primary-color);
    }

    .passos-recarga li.done a {
        background-color: var(--success-color);
    }

.progress-bar__background {
    fill: none;
    stroke: var(--contrast-color);
    stroke-width: 1.8;
}

.progress-bar__progress {
    fill: none;
    stroke: var(--contrast-color);
    stroke: var(--success-color);
    stroke-dasharray: 100 100;
    stroke-dashoffset: 100;
    stroke-linecap: round;
    stroke-width: 1.8;
    transition: stroke-dashoffset 2s ease-in-out;
}

.radio-aplicar {
    width: 100%;
    height: 100%;
    position: absolute !important;
    top: -35px;
    left: 0;
}

    .radio-aplicar input {
        width: 100%;
        height: 100%;
        position: absolute !important;
        top: 10px;
        margin-top: -10px;
        margin-left: 0px !important;
    }

    .radio-aplicar label {
        position: absolute;
        right: 10px;
        top: 50%;
        margin-top: -10px;
    }

    .radio-aplicar input[type="radio"] {
        opacity: 0 !important;
    }
/*** CHECKBOX LARANJA ***/
.checkbox,
.radio {
    position: relative;
    display: block;
    margin-top: 30px;
    margin-bottom: 30px;
}

.radio input[type="checkbox"] {
    position: absolute;
    opacity: 0;
}

    .radio input[type="checkbox"] + .radio-label:before {
        content: "";
        background: var(--concrete);
        border-radius: 0;
        border: 1px solid var(--tertiary-color);
        display: inline-block;
        width: 16px;
        height: 16px;
        position: relative;
        top: 0;
        margin-right: 0.6em;
        vertical-align: top;
        cursor: pointer;
        text-align: center;
        transition: all 250ms ease;
    }

    .radio input[type="checkbox"]:checked + .radio-label:before {
        background-color: var(--primary-color);
        box-shadow: inset 0 0 0 4px var(--concrete);
        border-color: var(--primary-color);
    }

    .radio input[type="checkbox"]:focus + .radio-label:before {
        outline: none;
    }

    .radio input[type="checkbox"]:disabled + .radio-label:before {
        box-shadow: inset 0 0 0 4px var(--concrete);
        border-color: var(--primary-color);
        background: var(--primary-color);
    }

    .radio input[type="checkbox"] + .radio-label:empty:before {
        margin-right: 0;
    }

    .radio input[type="radio"] {
        position: absolute;
        opacity: 0;
    }

        .radio input[type="radio"] + .radio-label:before {
            content: "";
            background: var(--concrete);
            border-radius: 100%;
            border: 1px solid var(--tertiary-color);
            display: inline-block;
            width: 23px;
            height: 23px;
            position: absolute;
            top: -3px;
            left: 2px;
            margin-right: 1em;
            vertical-align: top;
            cursor: pointer;
            text-align: center;
            transition: all 250ms ease;
        }

        .radio input[type="radio"]:checked + .radio-label:before {
            background-color: var(--primary-color);
            box-shadow: inset 0 0 0 4px var(--concrete);
        }

        .radio input[type="radio"]:focus + .radio-label:before {
            outline: none;
            border-color: var(--primary-color);
        }

        .radio input[type="radio"]:disabled + .radio-label:before {
            box-shadow: inset 0 0 0 4px var(--concrete);
            border-color: var(--primary-color);
            background: var(--primary-color);
        }

        .radio input[type="radio"] + .radio-label:empty:before {
            margin-right: 0;
        }

.checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0;
}

    .checkbox input[type="checkbox"] + .radio-label:before {
        content: "";
        background: var(--concrete);
        border: 1px solid var(--tertiary-color);
        display: inline-block;
        width: 23px;
        height: 23px;
        position: relative;
        top: -0.2em;
        margin-right: 1em;
        vertical-align: top;
        cursor: pointer;
        text-align: center;
        transition: all 250ms ease;
    }

    .checkbox input[type="checkbox"]:checked + .radio-label:before {
        background-color: var(--primary-color);
        box-shadow: inset 0 0 0 4px var(--concrete);
    }

    .checkbox input[type="checkbox"]:focus + .radio-label:before {
        outline: none;
        border-color: var(--primary-color);
    }

    .checkbox input[type="checkbox"]:disabled + .radio-label:before {
        box-shadow: inset 0 0 0 4px var(--concrete);
        border-color: var(--primary-color);
        background: var(--primary-color);
    }

    .checkbox input[type="checkbox"] + .radio-label:empty:before {
        margin-right: 0;
    }

.checkbox label,
.radio label {
    padding-left: 40px;
    font-size: 16px;
}

.radio-seguro {
    display: flex;
    align-items: center;
}

    .radio-seguro .form-custom {
        margin: 0 0px 0 0;
    }

        .radio-seguro .form-custom input {
            -webkit-appearance: none;
            border-radius: 50%;
            width: 12px;
            height: 12px;
            border: 2px solid var(--white-color);
            box-shadow: 0 0 0 1px var(--tertiary-color);
            outline: none;
        }

            .radio-seguro .form-custom input:checked {
                background-color: var(--colorfull);
            }

        .radio-seguro .form-custom label {
            margin: 0 0 0 1px;
            cursor: pointer;
        }

.checkbox-seguro {
    display: flex;
    align-items: center;
}

    .checkbox-seguro .form-custom {
        margin: 0 0px 0 0;
    }

        .checkbox-seguro .form-custom input {
            -webkit-appearance: none;
            background: var(--white-color);
            width: 10px;
            height: 10px;
            outline: none;
            border: 2px solid var(--white-color);
            box-shadow: 0 0 0 2px var(--tertiary-color);
            margin: 0 0 0 0;
            padding: 1px;
        }

            .checkbox-seguro .form-custom input:checked {
                background-color: var(--colorfull);
            }

        .checkbox-seguro .form-custom label {
            margin: 0 0 0 1px;
            cursor: pointer;
        }

.radio-data input[type="checkbox"] + .radio-label:before {
    width: 20px;
    height: 20px;
}

.radio-data .radio-label {
    line-height: 20px;
}

.radio-data input[type="radio"] {
    opacity: 0 !important;
}

.radio-left {
    display: inline;
    margin-right: 20px;
}

.radio-left input[type="radio"] {
    opacity: 0 !important;
}

.radio-concordo .radio-label.top-align {
    position: relative;
    top: 7px;
}

@media (max-width: 767px) {

    .checkbox label, .radio label {
        padding-left: 40px;
        font-size: 12px;
    }

    .checkbox, .radio {
        position: relative;
        display: block;
        margin-top: 15px;
        margin-bottom: 15px;
    }
}
.scrollable-listgroup {
    height: auto;
    max-height: 200px;
    max-width: 280px;
    width: 100%;
    overflow-x: visible;
    overflow-y: auto;
    margin-top: 2px;
    position: absolute;
    z-index: 1;
}

    .scrollable-listgroup > .list-group-item:hover, .list-group-item:focus {
        background-color: var(--primary-color);
        color: var(--white-color);
    }

    .scrollable-listgroup > .list-group-item:focus {
        background-color: var(--primary-color);
        color: var(--white-color);
    }

/*STEPS*/
/*common css used*/
.steps {
    padding: 20px 2px;
    position: relative;
    height: auto;
    z-index: 0;
    padding-bottom: 0;
    width: 100%;
}

    .steps .steps-counter span {
        display: inline-block;
        vertical-align: top;
        width: 40px;
        height: 40px;
        background-color: var(--concrete);
        border-radius: 50%;
        text-align: center;
        color: var(--dark-color);
        line-height: 45px;
        position: relative;
        top: -1px;
        font-size: 20px;
    }

    .steps .completed {
        background: var(--success-color) !important;
        color: var(--white-color) !important;
        border: 5px solid var(--contrast-color);
        line-height: 30px !important;
    }

    .steps .active {
        background: var(--contra-bg-color) !important;
        color: var(--primary-color) !important;
        z-index: 30 !important;
        position: relative;
    }

        .steps .active:after {
            content: "";
            width: 3px;
            height: 90px;
            background-color: var(--dark-color);
        }

    .steps .steps-counter .form-step {
        display: inline-block;
        width: calc(100% - 50px);
        padding: 10px;
        margin-left: 50px;
        margin-top: -36px;
    }

        .steps .steps-counter .form-step .step-input {
            padding-left: 10px;
            height: 30px;
            float: left;
            width: 48%;
            margin: 7.5px 1%;
        }

        .steps .steps-counter .form-step .btn-box {
            margin: 1%;
        }

        .steps .steps-counter .form-step .btn {
            display: inline-block;
            height: 30px;
            background-color: var(--success-color);
            width: 100px;
        }

/*//common css used*/

/*LEFT SIDE STEPS START*/
.left-steps .bar-completed {
    border-left: 0px solid var(--primary-color) !important;
}

.left-steps .steps-counter {
    border-left: 0px solid var(--contrast-color);
    transition: 0.3s ease;
    padding-top: 0px;
    width: 100%;
    margin-top: 0px;
    padding-bottom: 100px;
}

/*//LEFT SIDE STEPS END*/

#perg-7 .form-step.bar-completed {
    border-left: 0px solid var(--white-color) !important;
}

#perg-8.steps-counter {
    border-left: 0px solid var(--contrast-color);
}

#perg-0.steps-counter {
    border-left: 0px solid var(--contrast-color);
}

#perg-6.bar-completed,
#perg-7.bar-completed {
    border-left: 0px solid var(--primary-color) !important;
}

#perg-7.steps-counter {
    border-left: 0px solid var(--contrast-color);
}

#perg-7 .steps .active {
    background: var(--colorfull) !important;
}

#perg-0 .form-step,
#perg-7 .form-step {
    margin-left: 0;
}

.preenche-step {
    width: 0;
    height: 20px;
    background-color: var(--primary-color);
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 0 20px 20px 0px;
    transition: 0.3s ease;
}

.porcentagem-completa {
    font-size: 16px;
    color: var(--tertiary-color);
    margin-top: 20px;
    display: block;
}

    .porcentagem-completa span {
        font-size: 16px;
        color: var(--primary-color);
    }

.steps-topo li {
    font-size: 10px;
}

    .steps-topo li span {
        display: none;
    }

.bolas-step {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .bolas-step li {
        position: relative;
        width: 10px;
    }

        .bolas-step li:before {
            content: "";
            width: 10px;
            height: 10px;
            background-color: rgba(0, 0, 0, 0.4);
            position: absolute;
            border-radius: 100%;
            top: 50%;
            margin-top: 5px;
            left: 50%;
            margin-left: -5px;
        }

@media (max-width: 767px) {
    .steps {
        padding: 0px;
        position: relative;
    }

        .steps .active {
            top: -58px !important;
            font-weight: 900;
        }

        .steps .steps-counter span {
            top: 0;
            left: 0px;
        }

        .steps .steps-counter .form-step {
            width: 100%;
            padding: 0px;
            margin-top: 20px;
        }

    .left-steps .bar-completed {
        border-left: 0px solid var(--primary-color) !important;
    }

    .left-steps .steps-counter .form-step {
        margin-left: 0px !important;
        margin-top: 0px !important;
    }

    .left-steps .steps-counter {
        border-left: 0px solid var(--contrast-color);
        top: 40px;
        /* height: 100%; */
        padding: 0px 0px 60px;
    }

    .porcentagem-completa {
        font-family: 'Varela Round', sans-serif;
        font-size: 14px;
        color: var(--tertiary-color);
        margin-top: 8px;
        display: none;
    }

    .steps-topo {
        height: 90px;
        width: 160px;
    }

        .steps-topo li {
            font-size: 10px;
        }

            .steps-topo li span {
                display: none;
            }
}
.sucesso-title {
    display: flex;
    margin: 0 0 24px 0;
}

    .sucesso-title h3.info {
        font-size: 20px;
        margin: 6px 0 0 0;
        color: var(--primary-color);
        background-image: var(--gradient-color);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .sucesso-title .base-icone {
        font-size: 48px;
        margin: 0 24px 0 0;
        color: var(--success-color);
        background-image: var(--gradient-color);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .sucesso-title h3.sucesso {
        font-size: 24px;
        margin: 6px 0 0 0;
        color: var(--success-color);
        background-image: var(--gradient-color);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

/*invest tabs*/

.tab-invest .nav-tabs {
    border-bottom: 0px solid var(--contrast-color);
    margin-top: 40px;
}

    .tab-invest .nav-tabs > li > a {
        margin-right: 2px;
        line-height: 40px;
        border: 0px solid transparent;
        border-radius: 4px 4px 0 0;
        background-color: var(--white-color);
        opacity: 0.5;
        text-transform: uppercase;
        padding: 10px 30px;
    }

    .tab-invest .nav-tabs > li > a.item1 {
        border-top: 4px solid #c265fe !important;
    }

    .tab-invest .nav-tabs > li > a.item2 {
        border-top: 4px solid #51ccf7 !important;
    }

    .tab-invest .nav-tabs > li > a.item3 {
        border-top: 4px solid #74ce1f !important;
    }

    .tab-invest .nav-tabs > li > a.item4 {
        border-top: 4px solid #fe5242 !important;
    }

    .tab-invest .nav-tabs > li.active > a,
    .tab-invest .nav-tabs > li.active > a:hover,
    .tab-invest .nav-tabs > li.active > a:focus {
        color: var(--dark-color);
        cursor: default;
        background-color: var(--white-color);
        border: 0 solid var(--contrast-color);
        border-bottom-color: transparent;
        opacity: 1;
    }

.tab-invest .titulo-opcoes {
    font-size: 20px;
    color: var(--primary-color);
    font-weight: 900;
}

.tab-invest .invest-content {
    background-color: var(--white-color);
    padding: 25px 50px;
    border-radius: 10px;
    margin-top: 15px;
}

    .tab-invest .invest-content .titulos-tabs div {
        font-size: 12px;
        color: var(--tertiary-color);
        text-transform: uppercase;
        margin-bottom: 30px;
        padding: 0;
    }

.tab-invest .ver-aplicacao {
    color: var(--primary-color);
    font-size: 13px;
    text-transform: none;
    margin-top: 5px;
    display: block;
    float: left;
    margin-bottom: 20px;
    text-decoration: underline;
}

@media (max-width: 767px) {
    .tab-invest .titulo-opcoes {
        font-size: 15px;
    }

    .tab-invest .invest-content {
        background-color: var(--white-color);
        padding: 30px;
        border-radius: 10px 10px 10px 10px;
    }

    .tab-invest .ver-aplicacao {
        margin-top: 15px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .tab-invest .ver-aplicacao {
        margin-top: 15px;
    }
}

.tabela-avisos {
    width: 100%;
    margin: 24px 0 12px 0;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    overflow: hidden;
}

    .tabela-avisos .t-head {
        padding: 18px 24px;
        background-color: var(--white-color);
        border-bottom: 3px solid var(--contrast-color);
    }

    .tabela-avisos .t-row {
        padding: 24px 24px;
        background-color: var(--white-color);
        border-bottom: 1px solid var(--contrast-color);
    }

        .tabela-avisos .t-row a {
            font-size: 16px;
            color: var(--primary-color);
            margin: 0;
            padding: 0;
        }


.table-flex:nth-child(odd) {
    background: var(--concrete)
}

.table-flex__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 24px;
    border-bottom: 1px solid var(--contrast-color);
}

.table-flex__item {
    text-align: left;
    flex: 228px;
}

    .table-flex__item:last-child {
        flex: 48px;
        text-align: right;
    }

    .table-flex__item.btns {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .table-flex__item .btn-padrao {
        width: 24px;
        height: 24px;
        margin: 0 12px 0 0;
        padding: 0;
        font-size: 12px;
        line-height: 20px;
    }

    .table-flex__item h4 {
        font-size: 12px;
        margin: 0;
        padding: 0;
    }

    .table-flex__item p {
        font-size: 15px;
        font-weight: bold;
        margin: 0;
        padding: 0;
    }

    .table-flex__item.situacao p {
        font-size: 14px;
    }

        .table-flex__item.situacao p.erro {
            color: var(--erro-color);
        }

        .table-flex__item.situacao p.ok {
            color: var(--success-color);
        }

        .table-flex__item.situacao p.cancelado {
            color: var(--alert-color);
        }

    .table-flex__item.cancelamento p.ativo {
        color: var(--success-color);
    }

    .table-flex__item.cancelamento p.inativo {
        color: var(--erro-color);
    }

    .table-flex__item .base-seta a.collapsed span {
        transform: rotate(-90deg);
    }

    .table-flex__item .base-seta span {
        transform: rotate(90deg);
    }

    .table-flex__item .base-seta .bt-cancela-produto {
        color: var(--dark-color);
        font-size: 25px;
    }

    .table-flex__item .base-seta .bt-info-produto {
        color: var(--primary-color);
        font-size: 25px;
    }

@media (max-width: 767px) {
    .table-flex__item {
        margin: 12px 0;
    }

        .table-flex__item:last-child {
            flex: auto;
        }

        .table-flex__item.btns {
            width: 100%;
            align-items: center;
            justify-content: space-between;
        }

            .table-flex__item.btns a {
                margin: 0;
            }
}
table.table-title {
    border: none;
}

    table.table-title thead th {
        vertical-align: middle;
        background-color: var(--white-color);
        margin: 0;
        padding: 12px;
        border: none;
        border-bottom: 2px solid var(--contrast-color);
    }

        table.table-title thead th h1 {
            font-size: 24px;
            color: var(--tertiary-color);
            text-transform: uppercase;
            margin: 0;
            padding: 0;
        }

        table.table-title thead th.logo {
            text-align: right;
        }

        table.table-title thead th p {
            font-size: 11px;
            text-align: right;
            margin: 0;
            padding: 0;
        }

table.user-info thead th {
    vertical-align: middle;
    margin: 24px 0;
    padding: 18px;
    background-color: var(--white-color);
}

    table.user-info thead th h3 {
        margin: 0;
        padding: 0;
    }

    table.user-info thead th h4 {
        font-size: 14px;
        color: var(--tertiary-color);
        margin: 0;
        padding: 0;
    }

        table.user-info thead th h4 strong {
            float: right;
            color: var(--dark-color);
        }

    table.user-info thead th p {
        margin: 0;
        padding: 0;
    }

table.custom thead tr {
    font-size: 15px;
    white-space: nowrap;
}

table.custom tbody td {
    font-size: 12px;
}

table.custom thead tr:nth-child(2) {
    font-size: 12px;
    color: var(--tertiary-color);
    text-transform: uppercase;
    background-color: var(--white-color);
}

table.custom tbody td.case {
    text-transform: uppercase;
}

table.custom tbody td.active {
    background-color: var(--white-color);
    font-weight: normal;
    color: blue;
}

table.custom tbody td.total {
    font-weight: bold;
    color: var(--erro-color);
}

#tb-procuracao td {
    padding: 5px;
    border: 1px solid var(--dark-color);
    border-collapse: collapse;
}

#tb-procuracao th {
    padding: 5px;
    border: 1px solid var(--dark-color);
    border-collapse: collapse;
}
.teclado-virtual-alpha {
    width: 440px;
    height: 250px;
    background-color: var(--primary-color);
    position: absolute;
    z-index: 10;
    left: 50%;
    top: 50%;
    margin-top: -245px;
    margin-left: -220px;
    padding: 40px 30px 30px 30px;
    box-shadow: 0 0 50px -6px rgba(0, 0, 0, 0.6);
}

    .teclado-virtual-alpha .numeros span {
        width: 30px;
        height: 30px;
        background-color: rgba(255, 255, 255, 0.22);
        display: block;
        float: left;
        padding: 6px;
        text-align: center;
        color: var(--white-color);
        font-weight: 700;
        border: 1px solid rgba(255, 255, 255, 0.18);
        cursor: pointer;
    }

.teclado-virtual-alpha .numeros span:hover {
    background-color: var(--white-color);
    color: var(--dark-color);
}

.teclado-virtual-alpha .letras span {
    width: 30px;
    height: 30px;
    background-color: rgba(255, 255, 255, 0.1);
    display: block;
    float: left;
    padding:6px;
    text-align: center;
    color: var(--white-color);
    font-weight: 700;
    border: 1px solid rgba(255, 255, 255, 0.18);
    cursor: pointer;
    position: relative;
}

.teclado-virtual-alpha .letras span:hover {
    background-color: var(--white-color);
    color: var(--dark-color);
}

.teclado-virtual-alpha .letras span.caps,
.teclado-virtual-alpha .letras span.caracteres {
    width: 76px;
    position: relative;
}

.teclado-virtual-alpha .limpar span {
    width: 152px;
    height: 38px;
    background-color: rgba(255, 255, 255, 0.22);
    display: block;
    float: none;
    padding: 9px;
    text-align: center;
    color: var(--white-color);
    font-weight: 700;
    border: 1px solid rgba(255, 255, 255, 0.18);
    cursor: pointer;
    margin: 10px auto;
    position: relative;
}

.teclado-virtual-num {
    width: 180px;
    height: 240px;
    background: var(--gradient-color);
    position: absolute;
    z-index: 10;
    right: 10%;
    padding: 19px 20px 20px 20px;
    box-shadow: 0 0 50px -6px rgba(0, 0, 0, 0.6);
    border-radius: 5px;
}

    .teclado-virtual-num .numeros span {
        width: 40px;
        height: 40px;
        background-color: rgba(255,255,255,.22);
        display: block;
        float: left;
        padding: 9px;
        text-align: center;
        color: var(--white-color);
        font-weight: 700;
        border: 1px solid rgba(255,255,255,.18);
        cursor: pointer;
        border-radius: 50px;
        margin: 3px;
        transition-duration: 0.3s;
        cursor: pointer;
    }

.teclado-virtual-num .numeros span:hover {
    background-color: var(--white-color);
    color: var(--dark-color);
    transition-duration: 0.3s;
    cursor: pointer;
   
}

.teclado-virtual-num .letras span {
    width: 38px;
    height: 38px;
    background-color: rgba(255, 255, 255, 0.1);
    display: block;
    float: left;
    padding: 9px;
    text-align: center;
    color: var(--white-color);
    font-weight: 700;
    border: 1px solid rgba(255, 255, 255, 0.18);
    cursor: pointer;
    position: relative;
}

.teclado-virtual-num .letras span:hover {
    background-color: var(--white-color);
    color: var(--dark-color);
}

.teclado-virtual-num .letras span.caps,
.teclado-virtual-num .letras span.caracteres {
    width: 76px;
    position: relative;
}

    .teclado-virtual-num .limpar span {
        font-family: "Ubuntu-Bold", sans-serif;
        cursor: pointer;
        margin: -30px 0 0 94px;
        position: absolute;
        border-radius: 20px;
        color: var(--white-color);
        font-size: 12px;
    }

.teclado-virtual-alpha-auto-cad {
    width: 100%;
    height: 100%;
    background-color: var(--primary-color);
    position: relative;
    z-index: 10;
    left: 0;
    top: 0;
    margin-top: 0;
    margin-left: 0;
    padding: 15px 15px 15px 15px;
    box-shadow: 0 0 50px -6px rgba(0,0,0,.6);
    border-radius: 10px;
}

.teclado-virtual-zero {
    margin: 2px 0 0 49px !important;
    position: relative ;
}

.texto {
    text-align: center;
    font-size: 14px;
    color: var(--white-color);
    margin-bottom: 5px;
}

.teclado-position {
    box-shadow: 0 0 18px 5px rgba(0, 0, 0, 0.3) !important;
    left: 22px !important;
}
.toggle-switch {
    width: 108px;
    text-align: right;
    display: flex;
    margin: 18px 0;
}

    .toggle-switch div {
        font-size: 12px;
        line-height: 18px;
        color: var(--tertiary-color);
        font-weight: bold;
    }

        .toggle-switch div.form-custom {
            flex: 1;
        }

        .toggle-switch div.text {
            flex: 4;
            margin-right: 8px;
        }


input[type="checkbox"].toggleCustom {
    display: none;
    margin: 0px;
    /* Estado ON */
}

    input[type="checkbox"].toggleCustom ~ label {
        flex: auto;
        position: relative;
        cursor: pointer;
        width: 36px;
        height: 18px;
        background-color: var(--contrast-color);
        border-radius: 50px;
        padding: 3px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-transition: all 0.4s cubic-bezier(1, 0.01, 0, 1);
        transition: all 0.4s cubic-bezier(1, 0.01, 0, 1);
        /* Estado OFF */
    }

        input[type="checkbox"].toggleCustom ~ label::before {
            content: "";
            display: block;
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background-color: var(--tertiary-color);
            -webkit-transition: all 0.4s cubic-bezier(1, 0.01, 0, 1);
            transition: all 0.4s cubic-bezier(1, 0.01, 0, 1);
        }

    input[type="checkbox"].toggleCustom:checked ~ label {
        background: var(--primary-color);
    }

        input[type="checkbox"].toggleCustom:checked ~ label::before {
            margin-left: calc(100% - 12px);
            background-color: var(--white-color);
        }

/* AJUSTE FILTRO TOGGLE COMPROVANTES */
.toggle-switch div.form-custom.tip {
    flex: none;
}

.toggle-switch div.text.tip {
    flex: none;
}

@media (max-width: 767px) {
    .toggle-switch {
        margin: 3px 0px;
    }
}
.tooltip-aviso {
    position: absolute;
    opacity: 1;
    visibility: visible;
    transition: 0.3s ease;
    width: 260px;
    background-color: var(--contra-bg-color);
    border: 1px solid var(--colorfull);
    bottom: 160px;
    border-radius: 7px;
    font-size: 11px;
    padding: 10px;
    left: 50%;
    margin-left: -130px;
    z-index: 2;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    text-align: center;
}

.error .tooltip-aviso {
    background-color: var(--concrete);
    border: 1px solid var(--erro-color);
}

.tooltip-aviso .icone {
    font-size: 48px;
}

.tooltip-aviso p {
    color: var(--dark-color);
    font-size: 13px;
    text-transform: none;
}

.error .tooltip-aviso p {
    margin-bottom: 15px;
}

.tooltip-aviso .valor {
    color: var(--success-color);
    display: block;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.tooltip-aviso .bt {
    background: var(--colorfull);
    border-radius: 15px;
    color: var(--white-color);
    display: inline-block;
    padding: 10px 20px;
    text-transform: uppercase;
}

.tooltip-aviso:after {
    content: "";
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 10px solid var(--primary-color);
    position: absolute;
    bottom: -10px;
    left: 50%;
    margin-left: -5px;
}

.error .tooltip-aviso:after {
    border-top: 10px solid var(--erro-color);
}

@media (max-width: 767px) {
    .tooltip-aviso.error {
        background-color: var(--concrete);
        border: 1px solid var(--erro-color);
    }

    .tooltip-aviso p {
        color: var(--dark-color);
        font-size: 13px;
        text-transform: none;
        margin-bottom: 10px;
    }

    .tooltip-aviso:after {
        display: none;
    }
}
.tooltip {
    min-width: 200px !important;
}

.hover-tooltip {
    opacity: 1;
    visibility: visible;
}
ul.ops-impressao {
    text-align: right;
    list-style: none;
    /*margin: -14px 0 0 0;*/
    margin: 10px 0 0 0;
    padding: 0;
}

    ul.ops-impressao li {
        display: inline-block;
    }

        ul.ops-impressao li a {
            display: block;
            font-size: 18px;
            background: var(--white-color);
            color: var(--primary-color);
            margin: 0 0 0 12px;
            padding: 8px 12px;
            border-radius: 30px;
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
        }

@media (max-width: 767px) {
    ul.ops-impressao {
        text-align: left;
        margin: 12px 0 36px 0;
    }

        ul.ops-impressao li a {
            display: block;
            font-size: 18px;
            background: var(--white-color);
            margin: 0 0 0 24px;
            padding: 12px 18px;
            border-radius: 30px;
            box-shadow: 0 0 60px rgba(0,0,0,0.3);
        }

        ul.ops-impressao li:first-child a {
            margin: 0 0 0 0;
        } 
}

@media (min-width: 768px) and (max-width: 991px) {

    ul.ops-impressao li a {
        display: block;
        font-size: 18px;
        background: var(--white-color);
        margin: 0 0 0 24px;
        padding: 12px 18px;
        border-radius: 30px;
        box-shadow: 0 0 60px rgba(0,0,0,0.3);
    }

    ul.ops-impressao li:first-child a {
        margin: 0 0 0 0;
    }
}
.valor-conta-total {
    width: 100%;
    background: var(--white-color);
    margin: 0 0 0 0;
    padding: 15px 0 70px 0;
    border-top: 1px solid var(--white-color);
    border-bottom: 1px solid var(--white-color);
}

    .valor-conta-total.stick-container.scroll-to-fixed-fixed {
        padding-bottom: 10px;
        width: 100%;
        box-shadow: 12px 0 60px rgba(0, 0, 0, 0.4);
    }

    .valor-conta-total   {
        margin: 0;
        padding: 0;
        border-bottom: 0;
        align-items: center;
    }

        .valor-conta-total   .item h4 {
            font-size: 18px;
            color: var(--tertiary-color);
            text-transform: none;
            font-weight: normal;
        }

        .valor-conta-total   .item:last-child p {
            font-size: 24px;
            color: var(--success-color);
            font-weight: 500;
        }

            .valor-conta-total   .item:last-child p span {
                color: var(--success-color);
            }

@media (max-width: 767px) {
    .valor-conta-total {
        width: 100%;
        background: var(--white-color);
        margin: 0 0 0 0;
        padding: 24px 0 0 0;
        border-top: 1px solid var(--white-color);
        border-bottom: 1px solid var(--white-color);
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .valor-conta-total {
        width: 100%;
        background: var(--white-color);
        margin: 0 0 0 0;
        padding: 24px 0 0 0;
        border-top: 1px solid var(--white-color);
        border-bottom: 1px solid var(--white-color);
    }
}
.confirme-base {
    padding: 24px 36px;
    background: var(--white-color);
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .confirme-base ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

        .confirme-base ul li {
            margin: 12px 0;
        }

            .confirme-base ul li h5 {
                font-size: 12px;
                text-align: right;
                text-transform: uppercase;
                font-weight: 700;
                margin: 3px 0 0 0;
                padding: 0;
                color: var(--primary-color);
            }

            .confirme-base ul li p {
                margin: 0;
                padding: 0;
            }

@media (max-width: 767px) {
    .confirme-base ul li {
        margin: 24px 0;
    }

        .confirme-base ul li h5 {
            font-size: 12px;
            text-align: left;
            text-transform: uppercase;
            font-weight: 700;
            margin: 3px 0 0 0;
            padding: 0;
            color: var(--primary-color);
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .confirme-base ul li {
        margin: 24px 0;
    }

        .confirme-base ul li h5 {
            font-size: 12px;
            text-align: left;
            text-transform: uppercase;
            font-weight: 700;
            margin: 3px 0 0 0;
            padding: 0;
            color: var(--primary-color);
        }
}
.proximo-lancamento {
    display: grid;
    align-items: center;
    justify-items: stretch;
    grid-gap: 0;
    grid-template-columns: 108px 5fr 2fr;
    border-radius: 4px;
    background-color: var(--concrete);
    margin: 12px 0 0 0;
    padding: 0;
    overflow: hidden;
}

    .proximo-lancamento.header {
        border: none;
        box-shadow: none;
        background-color: transparent;
        margin: 12px 0 8px 0;
        padding: 0;
        grid-template-columns: 6fr 1fr 1fr;
    }

.proximo-lancamento__data {
    font-size: 20px;
    font-weight: bold;
    line-height: 18px;
    text-align: center;
}

    .proximo-lancamento__data span {
        font-size: 16px;
        color: var(--tertiary-color);
    }

.proximo-lancamento__nome {
    font-size: 14px;
    color: var(--dark-color);
    margin: 0;
    padding: 30px 0;
}

    .proximo-lancamento__nome p {
        display: flex;
        align-items: center;
        height: 24px;
    }

        .proximo-lancamento__nome p a {
            color: #57b4da;
            font-size: 16px;
            line-height: 12px;
            margin: 0 0 0 6px;
            padding: 0;
        }

        .proximo-lancamento__nome p + p {
            font-size: 14px;
            color: var(--tertiary-color);
        }

.proximo-lancamento__excluir {
    color: #F77A7B;
    text-align: center;
}

    .proximo-lancamento__excluir a {
        display: flex;
        align-items: center;
        color: #F77A7B;
        font-size: 18px;
    }

        .proximo-lancamento__excluir a span {
            font-size: 14px;
            margin: 0 8px 0 0;
        }


@media (max-width: 767px) {
    .proximo-lancamento {
        display: block;
        text-align: left;
        margin: 24px 0 0 0;
        padding: 24px 0 0 0;
    }

    .proximo-lancamento__nome {
        border-top: 1px solid var(--contrast-color);
        margin: 24px 0 0 0;
        padding: 8px 24px;
    }

        .proximo-lancamento__nome p {
            height: 60px;
            justify-content: flex-start;
        }

            .proximo-lancamento__nome p a {
                font-size: 24px;
                margin: 0 0 0 18px;
            }

    .proximo-lancamento__excluir a {
        display: flex;
        justify-content: center;
        text-align: center;
        background-color: var(--concrete);
        margin: 0;
        padding: 18px 12px;
        border-top: 1px solid #f9dadb;
    }
}
.classe-cartao .t-body .line-table:nth-child(odd) {
    background: var(--concrete);
}

.classe-cartao .t-body .line-table:nth-child(odd) {
    background: var(--concrete);
}

.datepicker-historico-cotacao {
    margin-left: 125px;
    font-size: 18px;
}

.valores-extrato {
    margin-top: 12px;
}

span.parcelas {
    text-decoration: none;
}

span.parcelas:hover {
    text-decoration: none !important;
}

@media only screen and (max-width: 600px) {
    .datepicker-historico-cotacao {
        margin-left: 38px;
    }
}

.lista-outros-servicos {
    columns: 3;
    -webkit-columns: 3;
    -moz-columns: 3;
    margin-top: 40px;
}

.partial {
    margin-top: 30px;
    background-color: var(--concrete);
    border: 1px solid var(--primary-color);
}

.lista-outros-servicos li {
    list-style: none;
}

    .lista-outros-servicos li a {
        color: var(--primary-color);
        text-decoration: underline;
    }

@media (max-width: 767px) {
    .lista-outros-servicos {
        columns: 2;
        -webkit-columns: 2;
        -moz-columns: 2;
        margin-top: 40px;
        display: inline-block;
        width: 100%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .lista-outros-servicos {
        columns: 3;
        -webkit-columns: 3;
        -moz-columns: 3;
        margin-top: 40px;
        display: inline-block;
        width: 100%;
    }
}

/**
 * AUX CLASSES
 */
.extratoVPM .m-0 {
    margin: 0 !important;
}

.extratoVPM .m-auto {
    margin: auto !important;
}

.extratoVPM .m-t-20 {
    margin-top: 20px;
}

.extratoVPM .m-b-50 {
    margin-bottom: 50px;
}

.extratoVPM .p-r-0 {
    padding-right: 0;
}
/* AUX CLASSES: FIM */

.extratoVPM .titulo-tabs {
    font-weight: 500;
    text-align: center;
}

.extratoVPM .linhas-extrato-vpm {
    margin: 5px 0 5px 0;
}

.extratoVPM .base-tabela .t-body .line-table {
    padding: 5px 0 5px 24px ;
}

.extratoVPM .base-tabela .t-body .data h2 {
    font-size: 16px;
    text-transform: uppercase;
}

.extratoVPM .vpm .t-body .line-table:nth-child(odd) {
    background: var(--concrete);
}

.extratoVPM .texto-origem-extrato-vpm {
    font-size: 15px;
    text-transform: uppercase;
}

.extratoVPM .texto-extrato-vpm {
    font-size: 15px;
    text-transform: lowercase;
}

    .extratoVPM .texto-extrato-vpm::first-letter {
        text-transform: uppercase;
    }

.extratoVPM .table-detail .well p {
    text-transform: none;
}

.extratoVPM .desc-linha-extrato-vpm {
    background: inherit !important;
    border: none !important;
}

.extratoVPM .desc-mobile p {
    margin: 8px 0 0 9px !important;
}

.extratoVPM .base-tabela.vpm .t-body .line-table .padding-ajuste h5 {
    margin: 15px 0 0 0;
    color: var(--dark-color);
}

.extratoVPM .base-tabela .t-body .table-detail .well {
    padding: 0 0 12px 4px;
}

.extratoVPM .base-tabela .t-body .line-table p {
    font-size: 16px;
    color: var(--dark-color);
}

@media (min-width: 991px) {
    .extratoVPM .padding-extrato-vpm {
        padding-left: 30px;
    }
}

@media (max-width: 991px) {
    .extratoVPM .statusVPM {
        text-transform: none !important;
        font-weight: bold !important;
        letter-spacing: 0 !important;
        pointer-events: none !important;
    }

    .extratoVPM .valorVPM {
        font-family: var(--font-primary) !important;
        color: var(--tertiary-color) !important;
        font-size: 18px !important;
        font-weight: 900 !important;
        pointer-events: none !important;
        text-transform: uppercase !important;
    }

    .extratoVPM .desc-mobile p {
        margin: 0 !important;
    }
}

@media (max-width: 500px) {
    .extratoVPM .desc-mobile {
        margin-left: 53px !important;
    }
}
.container-ajuste {
    margin-left: auto !important;
    margin-right: auto !important;
}

.base-miolo {
    padding: 108px 0 144px 36px;
    -webkit-transition: all 0.4s cubic-bezier(1, 0.01, 0, 1);
    transition: all 0.4s cubic-bezier(1, 0.01, 0, 1);
}

    .base-miolo.interna {
        padding: 72px 0 192px 66px;
    }

        .base-miolo.interna .container.miolo {
            margin: 0;
            padding: 0 14px 0 0;
        }

.container {
    /*margin-left: 4.4%;*/
    margin-right: auto;
}

    .container.miolo {
        padding: 0 15px 0 0;
    }

        .container.miolo.interna h3 {
            color: var(--dark-color);
            margin: 0 0 36px 0;
            padding: 0;
            font-weight: 800;
            font-size: 18px;
        }

            .container.miolo.interna h3 span {
                color: var(--dark-color);
            }

@media (max-width: 767px) {
    .base-miolo {
        padding: 96px 0 108px 0;
        -webkit-transition: all .4s cubic-bezier(1, 0.01, 0, 1);
        transition: all .4s cubic-bezier(1, 0.01, 0, 1);
    }

        .base-miolo.interna {
            padding: 68px 0 108px 0;
        }

            .base-miolo.interna .container.miolo {
                margin: 0 auto;
                padding: 0 15px 0 15px;
            }

    .container {
        margin-left: auto;
        margin-right: auto;
    }

        .container.miolo {
            padding: 0 15px 0 15px;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-miolo {
        padding: 96px 0 108px 0;
        -webkit-transition: all .4s cubic-bezier(1, 0.01, 0, 1);
        transition: all .4s cubic-bezier(1, 0.01, 0, 1);
    }

        .base-miolo.interna {
            padding: 68px 0 108px 0;
        }

    .container {
        margin-left: auto;
        margin-right: auto;
    }

        .container.miolo {
            padding: 0 15px 0 15px;
            margin: 0 auto 0 auto;
        }

    .base-miolo.interna .container.miolo {
        padding: 0 15px 0 15px;
        margin: 0 auto 0 auto;
    }
}

.d-corinthians {
    display: none !important;
}

.d-galo {
    display: none !important;
}

.d-vasco {
    display: none !important;
}


::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: var(--concrete);
}

::-webkit-scrollbar {
    width: 10px;
    background-color: var(--concrete);
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: var(--dark-color);
}

* {
    padding: 0;
    margin: 0;
}

.comprovantes {
    width: 500px;
    margin: 0 auto;
    width: 75%;
}

    .comprovantes .comprovantes-recorte {
        color: var(--white-color) !important;
        background-image: url('/assets/img/triangle.svg') !important;
        background-repeat: repeat-x !important;
        height: 20px;
    }

.linha-tracejada {
    border-top: dashed 1px;
    color: var(--tertiary-color)
}

html {
    height: 100%;
    overflow-x: hidden;
}

body {
    height: 100%;
    background-color: var(--concrete);
     
    color: var(--dark-color);
    -webkit-print-color-adjust: exact;
    font-weight: 400;
}

a,
a:hover,
a:focus {
    color: var(--dark-color);
    text-decoration: none;
}

    a.btn-padrao {
        display: block;
        width: 100%;
        border: 2px solid var(--tertiary-color);
    }


    a.link-pill {
        display: block;
        cursor: pointer;
        margin: 6px 0 12px 0;
        padding: 24px 60px 24px 24px;
        border-radius: 12px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

        a.link-pill h3 {
             
            font-size: 18px;
            color: var(--primary-color);
            margin: 0;
            padding: 0;
        }


.link-pill-cpv {
    display: block;
    cursor: pointer;
    margin: 6px 0 12px 0;
    padding: 24px 60px 24px 24px;
    border-radius: 12px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

    .link-pill-cpv h3 {
         
        font-size: 18px;
        color: var(--primary-color);
        margin: 0;
        padding: 0;
    }



.row.flex-align {
    display: flex;
    align-items: flex-end;
}

.display-flex {
    display: flex;
    align-items: center;
}

.ajuste-padding {
    padding: 40px 20px;
}

.sessao-cinza {
    background: var(--concrete) !important;
}

.border {
    border-radius: 0px 0px 10px 10px;
}

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

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

.margin-top-voltar {
    margin-top: 30px !important;
}
/*Desabilita campo de senha manten cursor*/
.desabilitado {
    cursor: not-allowed;
}

/* scroll to top */
.stick-container {
    width: 100%;
    transition: all 0.6s ease;
}

.espacamento-5 {
    margin-left: 5.33333333%;
    padding-left: 0;
}

    .espacamento-5.alert {
        padding-left: 15px;
    }

.banner {
    cursor: pointer;
}

.banner-100 {
    width: 100%;
}

/* Estilos de Impressão*/
.print {
    display: none;
}

.no-print {
    display: block;
}

@media (max-width: 767px) {
    .row.flex-align {
        display: block;
    }

    .display-flex {
        display: block;
    }

    .text-center-xs {
        text-align: center;
        margin-top: 30px;
    }

    .h-70 {
        height: 20px;
    }
}

@media (min-width: 992px) {
    .left-side {
        float: left;
    }

    .right-side {
        float: right;
    }
}

/*** IMAGENS NOVAS ***/

.carousel.mobile {
    height: auto;
}

    .carousel.mobile > .carousel-indicators {
        position: absolute;
    }

.carousel .item > img {
    width: 100%;
}

.img-dinheiro-extra {
    background-image: url(img/banners/home_dinheiroextra.jpg);
}

.img-cartao-css {
    width: 42px;
    height: 33px;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url(img/mastercard.jpg);
}

.img-cartao-header {
    width: 48px;
    height: 30px;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url(img/card-thumb.png);
}

.img-sonho-grande {
    width: 108px;
    height: 98px;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url(img/poupa-pra-mim/icone_sonho-grande.png);
    margin: 0 auto 24px auto;
}

    .img-sonho-grande + p {
        margin: 0 0 24px 0;
    }

.banner-cashback img {
    width: 100%
}

.vencimento-conteudo {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
}

    .vencimento-conteudo > a.vencimento-link {
        display: block;
        font-size: 14px;
        color: var(--primary-color);
        text-decoration: underline;
        margin: 0 0 0 12px;
    }

.badges-atualizacao {
    background: var(--primary-color);
    font-weight: 500;
    margin: -1px 0px 0px 2px;
}

.truecolors {
    position: absolute;
    width: 6px;
    height: 6px;
    right: 12px;
    top: 69px;
    background: var(--primary-color);
    border-radius: 13.6585px;
}

.base-sidemenu:hover .truecolors {
    display:none;
}

/****** MEDIA QUERIES ***/
@media only screen and (max-width : 320px) {
    .page-interna {
        background-size: 216px !important;
        background-position: center bottom !important;
    }

    .vencimento-conteudo {
        margin: 0 0 24px 0;
    }
}

@media only screen and (max-width : 480px) {
    .page-interna {
        background-size: 216px !important;
        background-position: center bottom !important;
    }

    .vencimento-conteudo {
        margin: 0 0 24px 0;
    }
}

@media only screen and (max-width : 768px) {
}

@media only screen and (max-width : 992px) {
}

.pesquisa-satisfacao-star-selected {
    content: url(img/pesquisa-satisfacao/star-orange-selected.png);
}

.pesquisa-satisfacao-star-unselected {
    content: url(img/pesquisa-satisfacao/star-orange-unselected.png);
}

.btn-padrao {
    display: block;
    border-radius: 30px;
    width: 100%;
    margin: 0;
    padding: 10px;
    outline: none;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    font-family: var(--font-secondary);
    background: none;
    cursor: pointer;
}

    .btn-padrao.auto {
        width: 180px;
        font-size: 14px;
        text-transform: none;
        margin: 0;
    }

    .btn-padrao.cinza {
        border: 2px solid var(--tertiary-color);
        color: var(--tertiary-color);
    }

    .btn-padrao.laranjas {
        border: 2px solid var(--primary-color) !important;
        color: var(--primary-color) !important;
        margin-top: 6px !important;
        background: var(--white-color) !important;
    }

.p-0 {
    padding: 0px !important;
}

    .btn-padrao.laranjas:hover {
        background-color: var(--primary-color);
        color: var(--white-color);
        margin-top: -6px;
    }

        .btn-padrao.cinza:hover {
            background: var(--tertiary-color);
            color: var(--white-color);
        }

    .btn-padrao.verde {
        border: 2px solid var(--success-color) !important;
        background-color: var(--success-color) !important;
    }

.p-0 {
    padding: 0px !important;
}

.btn-padrao.laranjas:hover {
    background-color: var(--primary-color);
    color: var(--white-color);
    margin-top: -6px;
}

.btn-padrao.cinza:hover {
    background: var(--tertiary-color);
    color: var(--white-color);
}

.btn-padrao.verde {
    border: 2px solid var(--success-color) !important;
    background-color: var(--success-color) !important;
}

.btn-padrao.laranja {
    color: var(--white-color);
    width: 100%;
    border: 2px solid transparent;
    background-image: var(--gradient-color);
}

    .btn-padrao.laranja:hover {
        background: var(--primary-color);
    }

.btn-padrao.corporate {
    color: var(--white-color);
    width: 100%;
    border: 2px solid transparent;
    background-color: #373737;
}

    .btn-padrao.corporate:hover {
        background: var(--primary-color);
    }


.btn-padrao.icon {
    display: flex;
    align-items: center;
    justify-content: space-around;
    color: var(--tertiary-color);
    padding: 6px 24px;
    background: var(--white-color);
    border: none;
    box-shadow: 0 0 60px rgba(0,0,0,0.1);
}

    .btn-padrao.icon .base-icone {
        font-size: 24px;
        text-align: center;
        margin: 2px 0 0 0;
    }

    .btn-padrao.icon p {
         
        font-size: 11px;
        font-weight: bolder !important;
        letter-spacing: 1px;
        margin: -4px 0 0 0;
        padding: 0;
    }

.btn-round {
    display: inline-block;
    background: var(--white-color);
    color: var(--primary-color);
    text-align: center;
    outline: none;
    width: 36px;
    height: 36px;
    margin: 0 !important;
    padding: 10px 0;
    border-radius: 24px;
    box-shadow: 0 0 14px rgba(0,0,0,0.1);
}

.btn-investir {
    display: block;
     
    border-radius: 30px;
    width: 80%;
    padding: 12px 4px;
    text-align: center;
    outline: none;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 2px;
    cursor: pointer;
    margin: 0 auto;
    border: 2px solid var(--primary-color);
    background-color: var(--primary-color);
    color: var(--white-color);
}

    .btn-investir.disable,
    .btn-investir.disable:hover {
        background-color: var(--dark-color);
        border: 2px solid var(--dark-color);
        opacity: 0.2;
        cursor: not-allowed;
        color: var(--white-color);
    }

    .btn-investir:hover {
        border: 2px solid var(--primary-color);
        background-color: transparent;
        color: var(--primary-color);
    }

.btn-card {
    width: 100%;
    height: 50px;
    border-radius: 30px;
    background-image: var(--gradient-color);
    margin-top: 28px !important;
    position: relative;
    display: block;
    color: var(--white-color);
    font-size: 14px;
    padding-top: 15px;
    text-transform: uppercase;
    outline: none;
    cursor: pointer;
}

.btn-card-disabled {
    background-image: linear-gradient(102deg, var(--tertiary-color), var(--contrast-color));
    cursor: default;
}

.btn-line-branco {
    color: var(--white-color) !important;
    border: 2px solid var(--white-color) !important;
    width: auto;
    display: inline-block;
    padding: 17px 55px 14px;
    border: 0;
    outline: 0;
    color: var(--white-color);
    font-size: 20px;
    border-radius: 38px;
    background-color: transparent;
     
    margin-right: 20px;
    text-decoration: none !important;
    text-transform: uppercase;
}

.btn-gradiente {
    width: auto;
    display: inline-block;
    padding: 17px 55px 14px;
    border: 0;
    outline: 0;
    color: var(--white-color);
    font-size: 20px;
    border-radius: 38px;
    background-image: var(--gradient-color);
    text-transform: uppercase;
     
    margin-top: 20px;
}

.btn-emprestimo {
    width: 100%;
    padding: 30px 10px;
    background-color: var(--white-color);
    border: 0;
    outline: none;
    border-radius: 20px 20px 0px 0px;
    transition: 0.3s ease;
    margin-top: 20px;
}

    .btn-emprestimo.collapsed {
        border-radius: 20px 20px 20px 20px;
    }

.btn-imprimir i {
    font-size: 20px;
    color: var(--primary-color);
    display: block;
    margin-top: 16px;
}

input[type="file"] {
    cursor: pointer;
    width: 100%;
    height: 55px;
    overflow: hidden;
    outline: none;
}

.btn-input-file:before {
    width: 100%;
    height: 53px;
    font-size: 14px;
    line-height: 32px;
    content: " ";
    display: inline-block;
    background: var(--white-color);
    border: 0px solid var(--dark-color);
    padding: 13px 0px;
    text-align: left;
    color: var(--dark-color);
    border-radius: 90px;
    outline: none;
}

.btn-input::-webkit-file-upload-button {
    visibility: hidden;
    outline: none;
}

.btn-aviso {
    width: auto;
    display: inline-block;
    border-radius: 38px;
    background-image: var(--gradient-color);
    margin-top: 20px;
    font-size: 20px;
    text-align: center;
    color: var(--white-color);
     
    text-transform: uppercase;
    border: 0;
    outline: none;
    padding: 15px 60px 11px 60px;
    transition: .3s ease;
    transition-delay: .6s;
    transform: scale(0.8);
    opacity: 0;
}

.btn-envio {
    position: absolute;
    right: 0;
    background-color: var(--primary-color);
    top: 0;
    height: 100%;
    border-radius: 60px;
    padding: 0px 30px;
    display: flex;
    align-items: center;
    color: var(--white-color);
    margin: 5px 5px;
    height: 43px;
    z-index: 0;
    pointer-events: none;
}

.btn-gradiente,
.btn-gradiente:hover {
    width: auto;
    display: inline-block;
    padding: 17px 55px 14px;
    border: 0;
    outline: 0;
    color: var(--white-color);
    font-size: 20px;
    border-radius: 38px;
    background-image: var(--gradient-color);
    background-color: var(--colorfull);
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
}

    .btn-gradiente i {
        pointer-events: none;
    }

.btn-line {
    color: var(--primary-color) !important;
    border: 2px solid var(--primary-color) !important;
    width: auto;
    display: inline-block;
    padding: 17px 55px 14px;
    border: 0;
    outline: 0;
    color: var(--white-color);
    font-size: 20px;
    border-radius: 38px;
    background-color: transparent;
    margin-right: 20px;
    text-decoration: none !important;
    text-transform: uppercase;
    text-decoration: none;
    margin-left: 20px;
    cursor: pointer;
}

.btn-gradiente i {
    font-size: 22px;
    margin-top: -2px;
    display: block;
}

.btn-perfil {
    display: inline-block;
    border-radius: 30px;
    width: auto;
    padding: 12px 24px;
    text-align: center;
    outline: none;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 2px;
    cursor: pointer;
    margin: 0 auto;
    border: 2px solid var(--primary-color);
    background-color: var(--primary-color);
    color: var(--white-color);
}

    .btn-perfil.disabled {
        color: var(--dark-color);
        cursor: default;
        background-color: var(--tertiary-color);
        border-color: var(--tertiary-color);
    }

.btn-perfil-voltar {
    display: inline-block;
    border-radius: 30px;
    width: auto;
    padding: 12px 24px;
    text-align: center;
    outline: none;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 2px;
    cursor: pointer;
    margin: 0 auto;
    border: 2px solid var(--primary-color);
    background-color: transparent;
    color: var(--primary-color);
    margin-left: 20px;
}

.btn-transp {
    background: transparent !important;
    color: var(--dark-color) !important;
    margin: 4px 0 0 0;
}

.btn-foto {
    display: block;
     
    border-radius: 30px;
    width: 80%;
    padding: 12px 4px;
    text-align: center;
    outline: none;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 2px;
    cursor: pointer;
    margin: 0 auto;
    border: 2px solid var(--primary-color);
    background-color: var(--primary-color);
    color: var(--white-color);
}

/*BTN EXEMPLO*/
.btn-modal {
    width: 50px;
    height: 50px;
    background-color: var(--erro-color);
    border-radius: 100px;
    position: fixed;
    top: 50px;
    right: 50px;
    color: var(--white-color);
    padding: 9px;
    text-align: center;
    padding-top: 14px;
}

    .btn-modal i {
        font-size: 20px;
    }

    .btn-modal.btn-sucesso {
        background-color: rgba(242, 133, 2, 0.15);
        top: 120px;
    }

        .btn-modal.btn-sucesso i {
            color: var(--primary-color);
        }


    .btn-modal.btn-enviando {
        background-color: rgba(80, 224, 4, 0.15);
        top: 190px;
    }

        .btn-modal.btn-enviando i {
            color: var(--success-color);
        }

.botoes-acao {
    padding: 15px 0px;
    border-top: 1px solid var(--contrast-color);
    display: flex;
    align-items: center;
    justify-content: space-around;
    position: relative;
}

    .botoes-acao a {
        color: var(--primary-color);
        text-align: center;
        width: 50%;
        text-transform: uppercase;
        font-size: 12px;
    }

        .botoes-acao a i {
            margin-right: 5px;
        }

        .botoes-acao a.cinza {
            color: var(--tertiary-color);
        }

    .botoes-acao:before {
        content: '';
        position: absolute;
        left: 50%;
        top: 0;
        height: 100%;
        width: 1px;
        background-color: var(--contrast-color);
    }

.button-box a {
    display: block;
    text-align: center;
    margin: 36px 0;
    padding: 36px;
    border-radius: 24px;
    width: 100%;
    background-color: var(--white-color);
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    transition: all 0.4s ease;
}

    .button-box a:hover {
        transform: translate(0, -8px) rotateX(14deg);
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.15);
    }

    .button-box a .base-icone {
        color: var(--tertiary-color);
        font-size: 48px;
        margin: 0 0 4px 0;
    }

    .button-box a h4 {
        text-transform: uppercase;
        letter-spacing: 1px;
        font-size: 10px;
        color: var(--primary-color);
        font-weight: bold;
    }

.ver-acao {
    color: var(--primary-color);
    font-size: 13px;
    text-transform: none;
    margin-top: 11px;
    display: block;
    text-decoration: underline;
}

.selfie__btns {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin: 36px 0 0 0;
}

    .selfie__btns > * {
        flex: 1 auto;
        margin: 0;
    }

    .selfie__btns a {
        display: block;
        margin: 0;
        padding: 0;
        color: var(--primary-color);
        text-decoration: none;
    }

    .selfie__btns .btn-line.btn-cancelar {
        color: var(--white-color) !important;
        background-color: var(--primary-color);
        transition: all .3s ease-in-out;
    }

        .selfie__btns .btn-line.btn-cancelar.off {
            color: var(--white-color) !important;
            border: 2px solid transparent !important;
            background-color: var(--contrast-color);
            transition: all .3s ease-in-out;
        }

.botao-upload-card {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    cursor: pointer;
    opacity: 0;
    outline: none;
}

.botoes-selfie {
    position: relative;
    width: 600px;
    height: 100px;
}

.botoes-ok {
    transform: scale(0);
    opacity: 0;
    transition: 0.3s ease;
    margin-top: 20px;
    position: absolute;
    width: 100%;
    height: 50px;
}

.botoes-footer {
    margin: 36px 0 0 0;
}

@media (max-width: 767px) {
    .btn-padrao.cinza, .btn-padrao.laranja {
        margin: 0px 0 16px;
    }

    .btn-perfil {
        display: block;
        width: 100%;
        margin-bottom: 20px;
    }

    .btn-perfil-voltar {
        display: block;
        width: 100%;
        margin-left: 0;
    }

    .btn-aviso {
        padding: 15px 30px 11px 30px;
    }

    .btn-gradiente, .btn-gradiente:hover {
        width: 100%;
        margin: 20px 0px;
        text-align: center;
        display: block;
        padding: 17px 15px 14px;
    }

    .btn-abre-conta {
        height: 62px;
    }

    .btn-line {
        color: var(--primary-color) !important;
        border: 2px solid var(--primary-color) !important;
        width: 100%;
        display: block;
        padding: 13px 35px 10px;
        border: 0;
        outline: 0;
        color: var(--white-color);
        font-size: 18px;
        border-radius: 38px;
        background-color: transparent;
         
        margin-right: 0px;
        text-transform: uppercase;
        text-align: center;
        margin-left: 0;
    }

    .btn-modal {
        right: 10px;
    }

    .btn-investir {
        width: 100%;
    }

    .ver-acao {
        margin-bottom: 20px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
}

@media (min-width: 992px) and (max-width: 1199px) {
    .btn-card {
        font-size: 12px;
        padding-top: 23px;
    }
}

#calculator {
    float: right;
    right: 400px;
    top: 100px;
}

.calculator {
    font-family: "HelveticaNeue-UltraLight", "Helvetica Ultra Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 100;
}

.drag-drop-calc {
    position: absolute;
    top: 5px;
    left: 5px;
    cursor: grab;
}

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

sup {
    top: -0.5em;
}

sub {
    bottom: -0em;
}

*:focus {
    outline: 0;
}

.calculator {
    position: absolute;
    margin: 10% auto;
    width: 231px;
    height: 340px;
    background: rgba(75, 75, 75, 0.9);
    border-right: 1px solid var(--tertiary-color);
    border-bottom: 1px solid var(--dark-color);
    border-left: 1px solid var(--tertiary-color);
    border-top: 1px solid var(--contrast-color);
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    -moz-box-shadow: 0 0 20px 0 rgba(50, 50, 50, 0.75);
    -webkit-box-shadow: 0 0 20px 0 rgba(50, 50, 50, 0.75);
    box-shadow: 0 0 20px 0 rgba(50, 50, 50, 0.75);
    cursor: arrow;
}

.readout {
    font-size: 35px;
    color: var(--white-color);
    background: transparent;
    box-sizing: border-box;
    display: block;
    width: inherit;
    border: 0;
    margin: 0px;
    text-align: right;
    padding: 0 10px;
    font-family: "HelveticaNeue-UltraLight", "Helvetica Ultra Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 100;
}

.memory {
    font-size: 16px;
    color: var(--white-color);
    background: transparent;
    box-sizing: border-box;
    display: block;
    width: inherit;
    border: 0;
    margin: 2px 0 0 0;
    text-align: right;
    padding: 0 10px;
    font-family: "HelveticaNeue-UltraLight", "Helvetica Ultra Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.keys {
    position: absolute;
    bottom: 0;
}

.calculator .row {
    padding-top: 1px;
    clear: both;
    margin-left: 0px !important;
}

.calculadora .row .key:first-child {
    margin-left: 0px;
}

.key {
    width: 56px;
    height: 47px;
    font-size: 22px;
    border: 0;
    float: left;
    margin-left: 1px;
    font-family: "HelveticaNeue-UltraLight", "Helvetica Ultra Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

    .key.double {
        width: 113px;
        text-align: left;
        padding-left: 25px;
        -moz-border-radius-bottomleft: 6px;
        -webkit-border-bottom-left-radius: 6px;
        border-bottom-left-radius: 6px;
    }

    .key.last {
        -moz-border-radius-bottomright: 6px;
        -webkit-border-bottom-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }

.misc {
    background: var(--contrast-color);
    font-size: 20px;
}

    .misc:active {
        background-color: var(--tertiary-color);
    }

.function {
    background: var(--primary-color);
    color: var(--white-color);
    font-size: 25px;
}

    .function:active {
        background-color: var(--contra-color);
    }

.numeric {
    background: var(--contrast-color);
    font-family: var(--font-secondary);
}

    .numeric:active {
        background-color: var(--tertiary-color);
    }

.calculator .close {
    margin: 4px 6px 0px 0px;
    color: var(--white-color);
    font-size: 20px !important;
    text-align: end;
}

p.invests .rosa {
    background-color: #da847b !important;
}

p.invests .vermelho {
    background-color: #fe5242 !important;
}

p.invests .verde {
    background-color: #74ce1f !important;
}

p.invests .azul {
    background-color: #51ccf7 !important;
}

p.invests .roxo {
    background-color: #c265fe !important;
}

p.invests .laranja {
    background-color: #fda629 !important;
}

p.invests .marrom {
    background-color: #965f0f !important;
}

p.invests .cinza {
    background-color: #afa0a0 !important;
}

p.invests .preto {
    background-color: #000 !important;
}

p.invests .azul-bebe {
    background-color: #95d3e4 !important;
}

p.invests .azul-medio {
    background-color: #748cbf !important;
}

p.invests .azul-marinho {
    background-color: #2e4e92 !important;
}

p.invests .verde-agua {
    background-color: #3de0de !important;
}

p.invests .verde-limao {
    background-color: #22ec84 !important;
}

p.invests .pink {
    background-color: #ec22b9 !important;
}

p.invests .amarelo {
    background-color: #ecda22 !important;
}

p.invests .bege {
    background-color: #e4e495 !important;
}

p.invests .verde-escuro {
    background-color: #6f9216 !important;
}

p.invests .vinho {
    background-color: #921617 !important;
}

p.invests .vermelho-rosado {
    background-color: #e49595 !important;
}

p.invests .black {
    background-color: #000000 !important;
}

p.invests .mediumBlue {
    background-color: #0000cd !important;
}

p.invests .darkGreen {
    background-color: #006400 !important;
}

p.invests .goldenrod {
    background-color: #daa520 !important;
}

p.invests .firebrick {
    background-color: #b22222 !important;
}

p.invests .orangeRed {
    background-color: #ff4500 !important;
}

p.invests .navajoWhite4 {
    background-color: #8b795e !important;
}

p.invests .deepPink3 {
    background-color: #cd1076 !important;
}

p.invests .darkGray {
    background-color: #a9a9a9 !important;
}

p.invests .turquoise2 {
    background-color: #00e5ee !important;
}

p.invests .navyBlue {
    background-color: #000080 !important;
}

p.invests .black {
    background-color: #000000 !important;
}

p.invests .mediumBlue {
    background-color: #0000cd !important;
}

p.invests .darkGreen {
    background-color: #006400 !important;
}

p.invests .goldenrod {
    background-color: #daa520 !important;
}

p.invests .firebrick {
    background-color: #b22222 !important;
}

p.invests .orangeRed {
    background-color: #ff4500 !important;
}

p.invests .navajoWhite4 {
    background-color: #8b795e !important;
}

p.invests .deepPink3 {
    background-color: #cd1076 !important;
}

p.invests .darkGray {
    background-color: #a9a9a9 !important;
}

p.invests .turquoise2 {
    background-color: #00e5ee !important;
}

p.invests .navyBlue {
    background-color: #000080 !important;
}

.prog-invest .rosa {
    background-color: #da847b !important;
}

.prog-invest .roxo {
    background-color: #c265fe !important;
}

.prog-invest .azul {
    background-color: #51ccf7 !important;
}

.prog-invest .verde {
    background-color: #74ce1f !important;
}

.prog-invest .vermelho {
    background-color: #fe5242 !important;
}

.prog-invest .laranja {
    background-color: #fda629 !important;
}

.prog-invest .marrom {
    background-color: #965f0f !important;
}

.prog-invest .cinza {
    background-color: #afa0a0 !important;
}

.prog-invest .preto {
    background-color: #000 !important;
}

.prog-invest .azul-bebe {
    background-color: #95d3e4 !important;
}

.prog-invest .azul-medio {
    background-color: #748cbf !important;
}

.prog-invest .azul-marinho {
    background-color: #2e4e92 !important;
}

.prog-invest .verde-agua {
    background-color: #3de0de !important;
}

.prog-invest .verde-limao {
    background-color: #22ec84 !important;
}

.prog-invest .pink {
    background-color: #ec22b9 !important;
}

.prog-invest .amarelo {
    background-color: #ecda22 !important;
}

.prog-invest .bege {
    background-color: #e4e495 !important;
}

.prog-invest .verde-escuro {
    background-color: #6f9216 !important;
}

.prog-invest .vinho {
    background-color: #921617 !important;
}

.prog-invest .vermelho-rosado {
    background-color: #e49595 !important;
}

.coluna.rosa {
    border-left-color: #da847b;
}

.coluna.roxo {
    border-left-color: #c265fe;
}

.coluna.azul {
    border-left-color: #51ccf7;
}

.coluna.verde {
    border-left-color: #74ce1f;
}

.coluna.vermelho {
    border-left-color: #fe5242;
}

.coluna.laranja {
    border-left-color: #fda629;
}

.coluna.marrom {
    border-left-color: #965f0f;
}

.coluna.cinza {
    border-left-color: #afa0a0;
}

.coluna.preto {
    border-left-color: #000;
}

.coluna.azul-bebe {
    border-left-color: #95d3e4;
}

.coluna.azul-medio {
    border-left-color: #748cbf;
}

.coluna.azul-marinho {
    border-left-color: #2e4e92;
}

.coluna.verde-agua {
    border-left-color: #3de0de;
}

.coluna.verde-limao {
    border-left-color: #22ec84;
}

.coluna.pink {
    border-left-color: #ec22b9;
}

.coluna.amarelo {
    border-left-color: #ecda22;
}

.coluna.bege {
    border-left-color: #e4e495;
}

.coluna.verde-escuro {
    border-left-color: #6f9216;
}

.coluna.vinho {
    border-left-color: #921617;
}

.coluna.vermelho-rosado {
    border-left-color: #e49595;
}
.base-calendar-picker {
    position: relative;
    margin: 0 0 36px 0;
    z-index: 12;
}

    .base-calendar-picker p {
        font-size: 12px;
        text-transform: uppercase;
        margin: 4px 0 0 0;
        font-weight: bold;
        color: var(--tertiary-color);
    }

    .base-calendar-picker .form-custom {
        margin: 16px 0 0 0;
    }

        .base-calendar-picker .form-custom input[type="text"] {
            width: 100%;
            background-color: var(--contrast-color);
            border: none;
            outline: none;
            text-align: center;
            border-radius: 36px;
            padding: 10px 0;
            margin: 0;
        }

            .base-calendar-picker .form-custom input[type="text"] + label {
                font-size: 12px;
                color: var(--tertiary-color);
                font-weight: 400;
                top: 4px;
                left: 20px;
            }

                .base-calendar-picker .form-custom input[type="text"] + label.align-up {
                    top: -3px;
                }

                .base-calendar-picker .form-custom input[type="text"] + label.align-up-more {
                    top: -14px;
                }

.ui-datepicker {
    padding: 0;
    border: none;
    border-radius: 18px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
}

.ui-datepicker-multi .ui-datepicker-group table {
    width: 100%;
    margin: 0px 0 24px 0;
    padding: 4px;
}

.ui-datepicker td span,
.ui-datepicker td a {
    display: block;
    padding: 8px 4px;
    text-align: center;
    text-decoration: none;
    border-radius: 50%;
    color: var(--tertiary-color);
}

    .ui-datepicker td span:hover,
    .ui-datepicker td a:hover {
        color: var(--white-color);
        background-color: var(--primary-color);
    }

.ui-datepicker td.ui-datepicker-today span,
.ui-datepicker td.ui-datepicker-today a {
    background-color: var(--contrast-color);
    box-shadow: rgba(0, 0, 0, 0.1);
}

    .ui-datepicker td.ui-datepicker-today span:hover,
    .ui-datepicker td.ui-datepicker-today a:hover {
        color: var(--dark-color);
    }

.ui-datepicker-multi .ui-datepicker-group table thead {
    background: var(--contrast-color);
}

.ui-datepicker .ui-widget-header {
     
    border: none;
    background-image: none;
    background-color: var(--primary-color);
    color: var(--white-color);
    padding: 8px 0;
    border-radius: 18px 18px 0 0;
    text-transform: uppercase;
    font-weight: bold;
}

.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header {
    border-radius: 0 18px 0 0;
    background-color: var(--primary-color);
    border-left-width: 0;
}

.ui-datepicker select.ui-datepicker-month {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: none;
    border: none;
    height: auto;
     
    margin: 0;
    text-align: center;
    width: auto;
    text-transform: uppercase;
}

.ui-datepicker .ui-widget-header .ui-icon {
    background-image: none;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    cursor: pointer;
}

    .ui-datepicker .ui-datepicker-prev:before {
        font-family: "icomoon";
        content: "\e912";
        position: absolute;
        text-align: center;
        font-size: 18px;
        top: 6px;
        left: 12px;
        color: var(--white-color);
        transform: rotate(180deg);
    }

    .ui-datepicker .ui-datepicker-next:before {
        font-family: "icomoon";
        content: "\e912";
        position: absolute;
        text-align: center;
        font-size: 18px;
        color: var(--white-color);
        top: 6px;
        right: 12px;
    }

.ui-datepicker .ui-state-hover {
    background: none;
    border: 1px solid transparent;
    color: var(--white-color);
}

.ui-datepicker .ui-state-default,
.ui-datepicker .ui-widget-content .ui-state-default,
.ui-datepicker .ui-widget-header .ui-state-default {
     
    border: 0 solid var(--contrast-color);
    background: none;
    box-shadow: none;
    font-weight: bold;
    color: var(--dark-color);
}

.ui-datepicker td a.ui-state-default.ui-state-active,
.ui-datepicker td.ui-datepicker-current-day a {
    color: var(--white-color);
    background-color: var(--primary-color);
}

.ui-datepicker-trigger {
    display: none;
}

.calendarioForm.hasDatepicker.ng-valid + label {
    font-size: 10px !important;
    color: var(--tertiary-color) !important;
    top: 8px !important;
    left: 24px !important;
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-calendar-picker {
        margin-top: 20px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .base-calendar-picker .form-custom .ui-datepicker-trigger {
        right: -20px
    }
}

@media (min-width: 1200px) {
    .base-calendar-picker .form-custom .ui-datepicker-trigger {
        right: -20px
    }
}

.linha-parcelas {
    border-bottom: 1px solid var(--contrast-color);
    padding: 10px 0px 10px 0px;
}

    .linha-parcelas strong {
        text-align: right;
        display: block;
    }

.atraso {
    color: var(--erro-color);
    font-size: 11px;
}

.pago {
    color: var(--success-color);
    font-size: 11px;
}

.aberto {
    color: var(--alert-color);
    font-size: 11px;
}

.base-miolo.interna.faq h4.perfis {
    margin: 12px 0 0 0;
}

.base-miolo.faq .form-custom.no-label input {
    margin: 0 0 24px 0;
    padding: 12px 36px;
}

.base-miolo.faq a.faq-opt {
    display: block;
    outline: none;
    border: none;
    text-align: center;
    background: var(--white-color);
    border-radius: 12px;
    margin: 12px 0 12px 0;
    padding: 36px 12px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

    .base-miolo.faq a.faq-opt:hover {
        outline: none;
        border: none;
        transform: translate(0, -8px) rotateX(18deg);
        box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);
    }

    .base-miolo.faq a.faq-opt:focus {
        outline: none;
        border: none;
    }

    .base-miolo.faq a.faq-opt .base-icone {
        font-size: 36px;
        margin: 0 0 4px 0;
        color: var(--tertiary-color);
        transition: all 0.4s ease;
    }

    .base-miolo.faq a.faq-opt:hover .base-icone {
        transform: translate(0, -4px);
    }

    .base-miolo.faq a.faq-opt h3 {
        font-size: 11px;
        font-weight: bold;
        color: var(--primary-color);
        text-transform: uppercase;
        margin: 0;
        padding: 0;
        transition: all 0.6s ease;
    }

    .base-miolo.faq a.faq-opt:hover h3 {
        transform: translate(0, -4px);
    }

.panel.panel-default {
    border: none;
    outline: none;
    box-shadow: none;
    border-radius: 0px;
    background-color: transparent;
    border-bottom: 1px solid var(--contrast-color);
}

    .panel.panel-default .panel-heading {
        color: var(--primary-color);
        border: none;
        outline: none;
        box-shadow: none;
        border-radius: 0px;
        background-color: transparent;
        padding: 18px 0;
        cursor: pointer;
    }

        .panel.panel-default .panel-heading h4 {
             
            font-size: 14px;
            color: var(--primary-color);
            font-weight: 400;
        }

        .panel.panel-default .panel-heading.collapsed h4 {
            color: var(--dark-color);
        }

.panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-top: 0px;
    color: var(--dark-color);
    line-height: 30px;
    padding: 0 0 36px 0;
}

.panel-body > .linkTo {
    color: blue;
}

.title-faq{
    margin: 3% 0;
}

@media (max-width: 767px) {
    .base-miolo.faq a.faq-opt {
        height: 144px;
        margin: 12px 0 12px 0;
        padding: 30px 12px 30px 12px;
    }

        .base-miolo.faq a.faq-opt h3 {
            font-size: 12px;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-miolo.faq a.faq-opt {
        height: 144px;
        margin: 12px 0 12px 0;
        padding: 30px 12px 30px 12px;
    }

        .base-miolo.faq a.faq-opt h3 {
            font-size: 12px;
        }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .base-miolo.faq a.faq-opt h3 {
        min-height: 24px;
    }
}

.grafico-simulacao {
    width: 100%;
    height: 113px;
    border-bottom: 1px solid var(--contrast-color);
    position: relative;
}

.grafico-interno {
    width: 80%;
    position: absolute;
    bottom: 0;
    left: 50%;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f0791b+0,f49119+100 */
    background: var(--primary-color); /* Old browsers */
    background: -moz-linear-gradient( -45deg, rgba(240, 121, 27, 1) 0%, rgba(244, 145, 25, 1) 100% ); /* FF3.6-15 */
    background: -webkit-linear-gradient( -45deg, rgba(240, 121, 27, 1) 0%, rgba(244, 145, 25, 1) 100% ); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient( 135deg, rgba(240, 121, 27, 1) 0%, rgba(244, 145, 25, 1) 100% ); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0791b', endColorstr='#f49119',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    margin-left: -40%;
    border-radius: 5px 5px 0px 0px;
}

.grafico-cinza {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7f7f7f+0,b7b7b7+100 */
    background: rgb(127, 127, 127); /* Old browsers */
    background: -moz-linear-gradient( -45deg, rgba(127, 127, 127, 1) 0%, rgba(183, 183, 183, 1) 100% ); /* FF3.6-15 */
    background: -webkit-linear-gradient( -45deg, rgba(127, 127, 127, 1) 0%, rgba(183, 183, 183, 1) 100% ); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient( 135deg, rgba(127, 127, 127, 1) 0%, rgba(183, 183, 183, 1) 100% ); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7f7f7f', endColorstr='#b7b7b7',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.grafico-simulacao + p {
    margin-left: 13px;
    margin-top: 10px;
}

    .grafico-simulacao + p + p {
        margin-left: 13px;
    }

.icon-printer {
    cursor: pointer;
}

.icones-produtos {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
}

.icone-table {
    vertical-align: sub;
    color: var(--primary-color);
    font-size: 18px;
    margin-left: 10px;
}

.icone-fechar-abre {
    transform: rotateZ(180deg);
    transition: 0.3s ease;
    margin-top: 12px;
    display: block;
}

.icone-fechar-abre.collapsed {
    transform: rotateZ(0deg);
    transition: 0.3s ease;
}

.icon-laranja {
    font-size: 20px;
    color: #f1831b;
}

.icone-desce {
    color: #f68419;
    font-size: 16px;
}

.icon-anim-props {
    height: 48px;
}

.sub-icones {
    font-size: 12px;
    text-transform: none;
}

    .sub-icones i {
        vertical-align: middle;
        font-size: 16px;
        color: #f1831b;
        margin-left: 5px;
    }

.icone {
    background-repeat: no-repeat;
    padding: 0px 16px;
    background-size: 20px;
}

.cartao-virtual-icone {
    background-image: url('icons/ico-cartao-virtual.svg');
}

.bloqueio-temp-icone {
    background-image: url('icons/ico-bloq-temp.svg');
    background-size: 18px;
    padding: 2px 16px;
}

.debito-automatico-icone {
    background-image: url('icons/ico-debito-automatico.svg');
    background-size: 17px;
}

.desbloqueio-cartao-icone {
    background-image: url('icons/ico-desbloq-cartao.svg');
    background-size: 24px;
}

.perda-roubo-icone {
    background-image: url('icons/ico-perda-roubo.svg');
}

.segunda-via-card-icone {
    background-image: url('icons/ico-segunda-via.svg');
}

.ajuste-limite-icone {
    background-image: url('icons/icon-ajuste-limite-bmg.svg');
}

.cashback-icone {
    background-image: url('icons/ico-cashback.svg');
}

.msg-icone {
    background-image:url('icons/icon-msg.svg');
}


@media (max-width: 767px) {
    .icone-desce {
        margin-top: 10px;
        display: block;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .icone-table {
        font-size: 11px;
    }

    .icones-produtos {
        text-align: left;
        padding-left: 10px;
        padding-right: 10px;
    }
}


.link-laranja {
    color: var(--primary-color);
    text-decoration: underline;
}

.info-saque-link {
    border-radius: 50%;
    text-align: center;
    width: 24px;
    height: 24px;
    background-color: #dd5e14;
    margin: 0 0 0 18px;
    padding: 1px 2px;
    font-size: 18px;
    color: #ffffff;
    font-weight: bold;
}

    .info-saque-link a {
        color: #ffffff;
        font-weight: bold;
    }

.logo-main {
    height: 38px;
}

.logo-branco {
    height: 47px;
}

.logo-main-branco {
    height: 60px;
}

.logo-main-inside {
    height: 30px;
    margin-top: -4px;
}

.logo-submenu {
    margin: 56px auto;
    width: 140px;
}

.logo-rodape {
    width: 120px;
}

@media (max-width: 767px){
    .logo-main-inside {
        height: 15vh;
        width: 24.3vw;
        margin-top: -10px;
    }
}

/* CSS MENU - INICIO */
button[disabled] {
    cursor: default;
    background-image: none !important;
    background-color: var(--tertiary-color) !important;
    /*margin: 4px 0 0 0;*/
}

.base-sidemenu {
    position: fixed;
    top: 74px;
    left: 0;
    bottom: 58px;
    width: 66px;
    animation: menu-appear 1s 1;
    transition: all .3s ease-in-out;
    transition-delay: .1s;
    z-index: 1001;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-base-color: var(--tertiary-color);
    scrollbar-base-color: var(--tertiary-color);
    scrollbar-3dlight-color: var(--tertiary-color);
    scrollbar-highlight-color: var(--tertiary-color);
    scrollbar-track-color: var(--contrast-color);
    scrollbar-arrow-color: var(--dark-color);
    scrollbar-shadow-color: var(--tertiary-color);
    scrollbar-dark-shadow-color: var(--tertiary-color);
}

.close-modal {
    position: absolute;
    right: 20px;
    font-size: 30px;
    cursor: pointer;
    color: var(--primary-color);
}

.badges-novo {
    position: absolute;
    top: 26px;
    right: 28px;
    background-color: var(--primary-color);
}

.base-miolo.faq a.faq-opt:hover span.badge.badges-novo {
    position: absolute;
    top: 16px;
    right: 14px;
    background-color: var(--primary-color);
}

.base-sidemenu::-webkit-scrollbar-track {
    background-color: var(--concrete);
}

.base-sidemenu::-webkit-scrollbar {
    width: 4px;
    background: var(--concrete);
}

.base-sidemenu::-webkit-scrollbar-thumb {
    background: var(--contrast-color);
}

.base-sidemenu > span.bg-menu {
    width: 66px;
    background-color: var(--white-color);
    position: fixed;
    top: 75px;
    bottom: 57px;
    left: 0;
    z-index: 0;
    transition: all .3s ease-in-out;
    transition-delay: .1s;
}

.base-sidemenu:hover {
    width: 290px;
    transition-delay: .1s;
}

    .base-sidemenu:hover > span.bg-menu {
        width: 290px;
        transition-delay: .1s;
    }

@-webkit-keyframes menu-appear {
    0% {
        width: 180px;
    }

    50% {
        width: 180px;
    }

    60% {
        width: 66px;
    }
}

.base-sidemenu ul {
    list-style: none;
    padding: 0;
}

.base-sidemenu > ul {
    z-index: 1;
    position: relative;
    padding-bottom: 10px;
}

.base-sidemenu ul li {
    max-width: 290px;
}

.base-sidemenu > ul > li {
    background: var(--white-color);
}

.base-sidemenu ul li a {
    display: block;
    width: 100%;
    padding: 9px 24px;
    border-bottom: 1px solid var(--contrast-color);
}

    .base-sidemenu ul li a:hover {
        background: var(--concrete);
    }

    .base-sidemenu ul li a.active {
        background: var(--concrete);
    }

.base-sidemenu a > .tooltip-custom {
    position: absolute;
    left: 145px;
    width: 220px;
    height: auto;
    margin: -5px 14px;
    padding: 10px 8px;
    text-align: center;
    color: #323232;
    font-size: 11px;
    line-height: 10px;
    font-weight: 500;
    border-radius: 9px;
    color: var(--white-color);
    background-color: var(--tertiary-color);
    transition: all .3s ease;
    pointer-events: none;
    box-shadow: 0 0 60px rgba(0,0,0,.1);
    z-index: 2;
    opacity: 0;
}

    .base-sidemenu a > .tooltip-custom:before {
        width: 0;
        height: 0;
        position: absolute;
        top: 6px;
        left: -7px;
        content: "";
        border-top: 14px solid transparent;
        border-right: 15px solid var(--tertiary-color);
        border-bottom: 14px solid transparent;
    }

.base-sidemenu a:hover > .tooltip-custom {
    opacity: 1;
    transform: translate(38px,0);
}

.base-sidemenu ul li a .item {
    display: flex;
    align-items: center;
}


    .base-sidemenu ul li a .item .base-icone {
        color: var(--primary-color);
        font-size: 18px;
        text-align: center;
        margin: 4px 0 0 0;
    }

    .base-sidemenu ul li a .item .base-icone-pj {
        color: #373737;
        font-size: 18px;
        text-align: center;
        margin: 4px 0 0 0;
    }


        .base-sidemenu ul li a .item .base-icone.disabled,
        .base-sidemenu ul li a .item .desc.disabled {
            color: var(--contrast-color);
        }

        .base-sidemenu ul li a .item .base-icone .icon-investimentos {
            font-size: 15px;
        }

        .base-sidemenu ul li a .item .base-icone .icon-pagamentos {
            font-size: 20px;
        }

        .base-sidemenu ul li a .item .base-icone .icon-comprovantes {
            font-size: 19px;
            margin-left: 2px;
        }

        .base-sidemenu ul li a .item .base-icone .icon-carteira {
            font-size: 13px;
        }

    .base-sidemenu ul li a .item .desc {
        white-space: nowrap;
        opacity: 0;
        color: var(--tertiary-color);
        margin: 0 0 0 12px;
        animation: li-appear 3s 1;
        transition: all 0.1s ease;
        transition-delay: 0.1s;
    }

.base-sidemenu:hover ul li a .item .desc {
    display: block;
    opacity: 1;
    transition-delay: .2s;
}

@-webkit-keyframes li-appear {
    0% {
        white-space: nowrap;
        opacity: 1;
    }

    50% {
        white-space: nowrap;
        opacity: 1;
    }

    70% {
        white-space: nowrap;
        opacity: 0;
    }
}

body.page-interna .base-sidemenu {
    box-shadow: 2px 0 12px rgba(0,0,0,0.05);
    animation: none;
}

    body.page-interna .base-sidemenu ul li a .item .desc {
        animation: none;
    }

.submenu-item {
    width: 185px;
    height: 100%;
    position: fixed;
    top: 75px;
    left: 290px;
    text-align: center;
    transition: 0.3s ease;
    visibility: hidden;
    opacity: 0;
    background-color: var(--concrete);
    background: -moz-linear-gradient( left, var(--contrast-color) 0%, var(--concrete) 17% ); /* FF3.6-15 */
    background: -webkit-linear-gradient( left, var(--contrast-color) 0%, var(--concrete) 17% ); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient( to right, var(--contrast-color) 0%, var(--concrete) 17% ); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='var(--concrete)', endColorstr='var(--contrast-color)',GradientType=1 ); /* IE6-9 */
    box-shadow: 10px 10px 40px -20px var(--dark-color);
}

    .submenu-item.hovered {
        left: 290px;
        visibility: visible;
        transition: 0.4s ease-in-out;
        transition-delay: .2s;
        opacity: 1;
    }

.submenu-itens {
    margin: 0;
    padding: 0;
    height: 100%;
}

    .submenu-itens li {
        list-style: none;
        background-color: transparent;
    }

        .submenu-itens li a {
            display: block;
            color: var(--dark-color);
        }

.submenu-item ul li a {
    display: block;
    width: 100%;
    padding: 12px 24px;
    border-bottom: 0px solid var(--contrast-color);
    text-align: left;
    font-size: 14px;
    letter-spacing: 0.5px;
    font-family: var(--font-primary);
}

    .submenu-item ul li a:hover {
        background-image: var(--gradient-color);
        color: var(--white-color);
    }

.menu-superior {
    height: auto;
}

.menu-hamburguer {
    position: absolute;
    top: 18px;
    right: 15px;
    z-index: 1234;
    font-size: 30px;
}

.mobile-menu {
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    background: var(--white-color);
    box-shadow: 0 0 24px rgba(0, 0, 0, 0.2);
    border-top: 1px solid var(--contrast-color);
    z-index: 1004;
}

    .mobile-menu ul {
        padding: 0;
        margin: 0;
        list-style: none;
        text-align: center;
        display: flex;
        align-items: center;
    }

        .mobile-menu ul li {
            flex: 1;
            border-left: 1px solid var(--contrast-color);
            padding: 8px;
        }

            .mobile-menu ul li .base-icone {
                color: var(--tertiary-color);
                font-size: 18px;
            }

.base-icone.icon-registrato {
    font-size: 26px !important;
    margin: -2px 0px -2px -12px !important;
}

.desc.icon-registrato {
    margin-left: 8px !important;
}

.mobile-menu ul li .desc p {
    margin: -2px 0 0 0;
    padding: 0;
    font-size: 9px;
    color: var(--tertiary-color);
    font-weight: 900;
}

.mobile-menu ul li.active {
    background: var(--concrete);
}

    .mobile-menu ul li.active .base-icone {
        color: var(--primary-color);
    }

    .mobile-menu ul li.active .desc p {
        color: var(--primary-color);
    }

@media (max-width: 767px) {
    .menu-superior {
        height: 50px;
    }

        .menu-superior .container {
            width: 100%;
        }
}
/* CSS MENU - FIM */

/*Erro animation*/
.erro-checkmark {
    width: 80px;
    height: 115px;
    margin: 0 auto;
}

    .erro-checkmark .check-icon {
        width: 80px;
        height: 80px;
        position: relative;
        border-radius: 50%;
        box-sizing: content-box;
        border: 4px solid var(--icon-erro);
    }

        .erro-checkmark .check-icon::before {
            top: 3px;
            left: -2px;
            width: 30px;
            transform-origin: 100% 50%;
            border-radius: 100px 0 0 100px;
        }

        .erro-checkmark .check-icon::after {
            top: 0;
            left: 30px;
            width: 60px;
            transform-origin: 0 50%;
            border-radius: 0 100px 100px 0;
            animation: rotate-circle 4.25s ease-in;
        }

        .erro-checkmark .check-icon::before, .erro-checkmark .check-icon::after {
            content: '';
            height: 100px;
            position: absolute;
            background: var(--white-color);
            transform: rotate(-45deg);
        }

        .erro-checkmark .check-icon .icon-line {
            height: 5px;
            background-color: var(--erro-color);
            display: block;
            border-radius: 2px;
            position: absolute;
            z-index: 10;
        }

            .erro-checkmark .check-icon .icon-line.line-tip {
                top: 46px;
                left: 14px;
                width: 25px;
                transform: rotate(45deg);
                animation: icon-line-tip 0.75s;
            }

            .erro-checkmark .check-icon .icon-line.line-long {
                top: 38px;
                right: 15px;
                width: 47px;
                transform: rotate(-45deg);
                animation: icon-line-long 0.75s;
            }

        .erro-checkmark .check-icon .icon-circles {
            top: -4px;
            left: -4px;
            z-index: 10;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            position: absolute;
            box-sizing: content-box;
            border: 4px solid var(--icon-erro-circle);
        }

        .erro-checkmark .check-icon .icon-fix {
            top: 8px;
            width: 5px;
            left: 26px;
            z-index: 1;
            height: 85px;
            position: absolute;
            transform: rotate(-45deg);
            background-color: var(--white-color);
        }

.transform {
    transform: rotate(45deg) !important;
}

@keyframes rotate-circle {
    0% {
        transform: rotate(-45deg);
    }

    5% {
        transform: rotate(-45deg);
    }

    12% {
        transform: rotate(-405deg);
    }

    100% {
        transform: rotate(-405deg);
    }
}

@keyframes icon-line-tip {
    0% {
        width: 0;
        left: 1px;
        top: 19px;
    }

    54% {
        width: 0;
        left: 1px;
        top: 19px;
    }

    70% {
        width: 50px;
        left: -8px;
        top: 37px;
    }

    84% {
        width: 17px;
        left: 21px;
        top: 48px;
    }

    100% {
        width: 25px;
        left: 14px;
        top: 45px;
    }
}

@keyframes icon-line-long {
    0% {
        width: 0;
        right: 46px;
        top: 54px;
    }

    65% {
        width: 0;
        right: 46px;
        top: 54px;
    }

    84% {
        width: 55px;
        right: 0px;
        top: 35px;
    }

    100% {
        width: 47px;
        right: 8px;
        top: 38px;
    }
}


/*Check animation*/
.success-checkmark {
    width: 80px;
    height: 115px;
    margin: 0 auto;
}



    .success-checkmark .check-icon {
        width: 80px;
        height: 80px;
        position: relative;
        border-radius: 50%;
        box-sizing: content-box;
        border: 4px solid var(--success-color);
    }



        .success-checkmark .check-icon::before {
            top: 3px;
            left: -2px;
            width: 30px;
            transform-origin: 100% 50%;
            border-radius: 100px 0 0 100px;
        }



        .success-checkmark .check-icon::after {
            top: 0;
            left: 30px;
            width: 60px;
            transform-origin: 0 50%;
            border-radius: 0 100px 100px 0;
            animation: rotate-circle 4.25s ease-in;
        }



        .success-checkmark .check-icon::before, .success-checkmark .check-icon::after {
            content: '';
            height: 100px;
            position: absolute;
            background: var(--white-color);
            transform: rotate(-45deg);
        }



        .success-checkmark .check-icon .icon-line {
            height: 5px;
            background-color: var(--success-color);
            display: block;
            border-radius: 2px;
            position: absolute;
            z-index: 10;
        }



            .success-checkmark .check-icon .icon-line.line-tip {
                top: 46px;
                left: 14px;
                width: 25px;
                transform: rotate(45deg);
                animation: icon-line-tip 0.75s;
            }



            .success-checkmark .check-icon .icon-line.line-long {
                top: 38px;
                right: 8px;
                width: 47px;
                transform: rotate(-45deg);
                animation: icon-line-long 0.75s;
            }



        .success-checkmark .check-icon .icon-circles {
            top: -4px;
            left: -4px;
            z-index: 10;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            position: absolute;
            box-sizing: content-box;
            border: 4px solid var(--icon-success-circle);
        }



        .success-checkmark .check-icon .icon-fix {
            top: 8px;
            width: 5px;
            left: 26px;
            z-index: 1;
            height: 85px;
            position: absolute;
            transform: rotate(-45deg);
            background-color: var(--white-color);
        }



@keyframes rotate-circle {
    0% {
        transform: rotate(-45deg);
    }

    5% {
        transform: rotate(-45deg);
    }

    12% {
        transform: rotate(-405deg);
    }

    100% {
        transform: rotate(-405deg);
    }
}



@keyframes icon-line-tip {
    0% {
        width: 0;
        left: 1px;
        top: 19px;
    }

    54% {
        width: 0;
        left: 1px;
        top: 19px;
    }

    70% {
        width: 50px;
        left: -8px;
        top: 37px;
    }

    84% {
        width: 17px;
        left: 21px;
        top: 48px;
    }

    100% {
        width: 25px;
        left: 14px;
        top: 45px;
    }
}



@keyframes icon-line-long {
    0% {
        width: 0;
        right: 46px;
        top: 54px;
    }

    65% {
        width: 0;
        right: 46px;
        top: 54px;
    }

    84% {
        width: 55px;
        right: 0px;
        top: 35px;
    }

    100% {
        width: 47px;
        right: 8px;
        top: 38px;
    }
}

.button-disabled {
    cursor: default;
    background-image: none !important;
    background-color: var(--tertiary-color) !important;
    margin: 4px 0 0 0;
}

.display-grid {
    display: grid;
}

a.submenu-disabled {
    color: var(--contrast-color) !important;
    pointer-events: none;
}

.modal {
    overflow-y: scroll;
}

    .modal .modal-body a.btn-padrao, .modal .modal-footer a.btn-padrao {
        background: var(--primary-color);
        color: var(--white-color);
        margin: 4px 0 0 0;
    }

        .modal .modal-body a.btn-padrao.cinza,
        .modal .modal-footer a.btn-padrao.ciza {
            background: transparent;
            color: var(--tertiary-color);
        }

    /*** MODAL TOKEN ****/

    .modal.token .modal-header {
        padding: 36px 72px 12px 72px;
        text-align: center;
        border: none;
    }

        .modal.token .modal-header button {
            opacity: 1;
            outline: none;
            font-size: 30px;
            position: absolute;
            right: 36px;
            top: 24px;
        }

        .modal.token .modal-header .base-icone {
            font-size: 48px;
            color: var(--primary-color);
        }

        .modal.token .modal-header h4 {
            text-transform: uppercase;
            font-size: 18px;
            letter-spacing: 1px;
            font-weight: 600;
            margin: 0;
            padding: 0;
        }

    .modal.token.ok .modal-header h4 {
        color: var(--primary-color);
    }

    .modal.token .modal-body {
        text-align: center;
        color: var(--dark-color);
        padding: 12px 72px 48px 72px;
    }

        .modal.token .modal-body h4 {
            font-weight: bold;
            font-size: 24px;
            margin: 0 0 12px 0;
            padding: 0;
        }

        .modal.token .modal-body .form-custom input {
            text-align: center;
            padding: 18px 0;
            border-radius: 36px;
            margin-bottom: 30px;
        }

            .modal.token .modal-body .form-custom input:focus {
                border-radius: 36px;
            }

    /*** MODAL IMPRIMIR ****/

    .modal.imprimir .modal-header {
        padding: 26px 24px 12px 24px;
        text-align: center;
        border: none;
    }

        .modal.imprimir .modal-header button {
            opacity: 1;
            outline: none;
            font-size: 30px;
        }

        .modal.imprimir .modal-header .base-title {
            display: flex;
            align-items: center;
        }

            .modal.imprimir .modal-header .base-title .base-icone {
                font-size: 24px;
                margin: 2px 24px 0 0;
                color: var(--primary-color);
            }

            .modal.imprimir .modal-header .base-title h4 {
                text-transform: uppercase;
                font-size: 18px;
                letter-spacing: 1px;
                font-weight: lighter;
                margin: 0;
                padding: 0;
            }

    .modal.imprimir .modal-body {
        padding: 36px 24px 36px 24px;
    }

        .modal.imprimir .modal-body .abraca-iframe {
            width: 100%;
            overflow: scroll;
        }

    .modal.imprimir .modal-footer {
        padding: 24px 24px 24px 24px;
        border-top: 1px solid var(--contrast-color);
    }

    /*** MODAL ADD TELEFONE ****/

    .modal.add-perfil .modal-header {
        padding: 36px 72px 12px 72px;
        text-align: center;
        border: none;
    }

        .modal.add-perfil .modal-header button {
            opacity: 1;
            outline: none;
            font-size: 26px;
            margin-top: -2px;
        }

        .modal.add-perfil .modal-header .base-icone {
            font-size: 48px;
            color: var(--primary-color);
        }

        .modal.add-perfil .modal-header h4 {
            text-transform: uppercase;
            font-size: 18px;
            letter-spacing: 1px;
            font-weight: lighter;
            margin: 0;
            padding: 0;
        }

    .modal.add-perfil .modal-body {
        padding: 12px 36px 24px 36px;
    }

        .modal.add-perfil .modal-body h5 {
            font-size: 12px;
            font-weight: bold;
            color: var(--tertiary-color);
            text-transform: uppercase;
            margin: 12px 0 0px 6px;
            padding: 0;
        }

        .modal.add-perfil .modal-body .form-custom input[type="text"] {
            margin: 6px 0;
        }

            .modal.add-perfil .modal-body .form-custom input[type="text"] + label {
                transform: translate(0,6px);
            }

        .modal.add-perfil .modal-body .form-custom.txt-center input {
            padding: 14px 0 16px 0;
            text-align: center;
        }

        .modal.add-perfil .modal-body .form-custom.checkbox {
            display: flex;
            margin: 48px 0 0 24px;
        }

            .modal.add-perfil .modal-body .form-custom.checkbox input + label {
                font-size: 14px;
                color: var(--tertiary-color);
                font-weight: bold;
                margin: 0;
                padding: 0;
            }

        .modal.add-perfil .modal-body .form-custom input[type="tel"] {
            margin: 6px 0;
        }

        .modal.add-perfil .modal-body .form-custom input[type="email"] {
            margin: 6px 0;
        }

/* MODAL VALIDAÇÃO SEGURANÇA - INICIO */

#modalSeguranca .modal-dialog {
    max-width: 405px;
}

.container-senha-eletronica {
    padding-bottom: 0 !important;
}

    .container-senha-eletronica > .text-header {
        padding-top: 25px;
        padding-bottom: 10px;
    }

        .container-senha-eletronica > .text-header h3 {
            font-size: 17px;
        }

    .container-senha-eletronica > .area-teclado-virtual-num {
        margin-top: 15px;
    }

        .container-senha-eletronica > .area-teclado-virtual-num .teclado-virtual-num {
            margin: 0 auto;
            position: relative;
            right: auto;
            box-shadow: 0 0 50px -6px rgba(0,0,0,.3);
        }

        .container-senha-eletronica > .area-senha-eletronica .margem-senha-eletronica {
            margin: 0 auto 15px;
            width: 210px;
        }

        /* PASSO 1 */
        .container-senha-eletronica > .area-senha-eletronica .form-custom.margem-senha-eletronica input:disabled {
            padding: 12px 0 !important;
            margin: 20px 0 !important;
            background-color: var(--white-color);
        }

        /* PASSO 2 */
        .container-senha-eletronica > .area-senha-eletronica .area-error {
            position: absolute;
            font-size: 13px;
            left: 0;
            width: 100%;
        }

        .container-senha-eletronica > .area-senha-eletronica .form-custom.margem-senha-eletronica .area-error {
            bottom: -3px;
        }

        .container-senha-eletronica > .area-senha-eletronica .form-custom:not(.margem-senha-eletronica) .area-error {
            bottom: 5px;
        }

/* MODAL VALIDAÇÃO SEGURANÇA - FIM */

/*=============== Modal Cancelamentos ================*/

/*-- Cancelamento Inativo ------------------*/

.cancelamentoInativo {
    text-align: center;
}

    .cancelamentoInativo .modal-header, .cancelamentoInativo .modal-footer,
    .cancelamento1 .modal-header, .cancelamento1 .modal-footer,
    .cancelamento2 .modal-header, .cancelamento2 .modal-footer,
    .cancelamentoSucesso .modal-header, .cancelamentoSucesso .modal-footer {
        border: none;
    }

    .cancelamentoInativo .imgError {
        border-radius: 100%;
        color: var(--erro-color);
        background-color: var(--concrete);
        display: block;
        height: 100px;
        width: 100px;
        font-size: 50px;
        line-height: 100px;
        margin: 0 auto;
    }

    .cancelamentoInativo h4 {
        color: var(--tertiary-color) !important;
    }

    .cancelamentoInativo .texto-condicoes {
        border-top: 1px solid var(--tertiary-color)
    }

/*-- Cancelamento 1 ------------------*/

.cancelamento1 .modal-footer {
    padding-bottom: 30px;
}

.cancelamento1 h4 {
    text-align: center;
}

.cancelamento1 .motivo {
    border: 1px solid var(--tertiary-color);
    border-radius: 10px;
    cursor: pointer;
    margin-bottom: 15px;
    padding: 10px 15px;
    transition: all .4s ease;
    transition-property: all;
    transition-duration: 0.4s;
    transition-timing-function: ease;
    transition-delay: 0s;
}

    .cancelamento1 .motivo:hover, .cancelamento1 .motivo.selected {
        color: var(--white-color);
        background-color: var(--primary-color);
        border-color: var(--primary-color)
    }

.cancelamento1 #btnSolicitaCancelamento.disabled {
    pointer-events: none;
    opacity: .7;
}

/*-- Cancelamento 2 ------------------*/

.cancelamento2 .modal-footer {
    padding-bottom: 30px;
}

.cancelamento2 h4 {
    text-align: center;
}

.cancelamento2 .ciente {
    border-bottom: 1px solid var(--tertiary-color);
    padding: 15px 0;
}

    .cancelamento2 .ciente .radio label {
        padding-left: 35px;
    }

    .cancelamento2 .ciente .radio input[type="radio"] + .radio-label:before {
        top: -1px;
    }

.cancelamento2 .radio-concordo {
    text-align: center;
    padding-top: 10px;
}

    .cancelamento2 .radio-concordo a {
        color: var(--primary-color);
        text-decoration: underline;
    }

    .cancelamento2 .radio-concordo .radio input[type="radio"] + .radio-label:before {
        position: relative;
        margin-right: 10px;
        margin-left: -20px;
        margin-top: -5px;
    }

.cancelamento2 #btnConfirmaCancelamento.disabled {
    pointer-events: none;
    opacity: .7;
}

/*==============================
	Modal Simulação
==============================*/

.modalSimulacao .inputValorInvestimento {
    display: block;
    width: 100%;
    max-width: 300px;
    margin: 20px auto 30px;
    border: none;
    border-bottom: 1px solid var(--dark-color);
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}

    .modalSimulacao .inputValorInvestimento:focus {
        outline: none;
    }

.modalSimulacao .dados {
    font-size: 12px;
    margin-top: 27px;
}

    .modalSimulacao .dados .row {
        padding-bottom: 5px;
    }

.modalSimulacao small {
    display: block;
    margin-top: 30px
}

    .modalSimulacao small:last-of-type {
        margin-top: 5px;
    }

/*==============================
	Modal Cartao
==============================*/

.modalCartao .texto, .modalCartao .check {
    padding-bottom: 30px;
}

.modalCartao img {
    margin-bottom: 30px
}

.modalCartao .box-verde {
    background-color: var(--success-color);
    border-radius: 10px;
    padding: 20px;
    color: var(--white-color);
    display: flex;
    align-items: center;
    text-align: center;
    height: 150px;
    margin-bottom: 30px;
}

    .modalCartao .box-verde p {
        display: block;
        width: 100%;
    }

        .modalCartao .box-verde p strong {
            font-size: 20px;
        }

.modalCartao .check {
    font-weight: bold;
}

    .modalCartao .check label {
        padding-left: 0;
    }

.modalCartao .tituloCartao {
    font-size: 18px;
    margin-bottom: 30px;
}

.modalCartao .inputValorInvestimento:focus {
    outline: none;
}

.modalCartao .dados {
    font-size: 12px;
    margin-top: 27px;
}

    .modalCartao .dados .row {
        padding-bottom: 5px;
    }

.modalCartao small {
    display: block;
    margin-top: 30px
}

    .modalCartao small:last-of-type {
        margin-top: 5px;
    }

/*-- Cancelamento Inativo ------------------*/

.modal.imprimir .modal-body {
    padding-top: 10px;
}

.modal.imprimir .modal-header .base-title .base-icone.circle {
    margin: 0 auto 20px;
    font-size: 60px;
    border: 2px solid var(--primary-color);
    border-radius: 62%;
    width: 90px;
    height: 90px;
    line-height: 90px;
}

/*.modal .modal-header .base-title h4 {
   
  text-align: center;
  width: 100%;
  margin-top: 25px !important;
  font-size: 26px !important;
  font-weight: bold !important;
}*/

.modal .form-inputs-token {
    text-align: center;
}

.modal .inputs-token {
    display: inline-block;
    margin-bottom: 30px;
    position: relative;
}

.modal .input-token {
    width: 50px;
    height: 70px;
    border-radius: 9px;
    border: 2px solid var(--contrast-color);
    margin: 15px 10px 0;
    font-size: 40px;
    font-weight: 900;
     
    text-align: center;
    padding-top: 7px;
    outline: none;
    color: var(--dark-color);
    display: inline-block;
}

.modal .buttons-validar-token .reenviar-codigo {
    font-weight: bold;
}

.modal button[name="verificarCodSeguranca"] {
    margin-bottom: 15px;
}

.modal .buttons-validar-token .btn-gradiente {
    padding: 10px 30px;
    margin-top: 0;
    font-size: 16px;
}

.modal > .btn-padrao,
.modal .buttons-validar-token .btn-gradiente {
    letter-spacing: 2px;
    font-size: 10px;
}

.modal .btn-padrao.cinza.disabled:hover {
    color: var(--white-color);
    background: var(--primary-color);
    border-color: transparent;
}

.modal .btn-padrao.disabled,
.modal .btn-padrao.disabled:hover,
.modal .buttons-validar-token .btn-gradiente.disabled,
.modal .buttons-validar-token .btn-gradiente.disabled:hover {
    background: var(--contrast-color);
    border-color: var(--contrast-color);
    color: var(--white-color);
}

.modal .modal-footer a.btn-padrao.cinza {
    border: 2px solid var(--tertiary-color);
    color: var(--tertiary-color) !important;
    background-color: transparent !important;
}


/* MODAL VALIDAÇÃO SEGURANÇA - FIM */

#modalAgendamento3 .modal-body {
    padding: 30px 15px;
}

#modalAgendamento3 .imgLock {
    border: 2px solid var(--primary-color);
    border-radius: 100%;
    color: var(--dark-color);
    display: block;
    font-size: 50px;
    height: 76px;
    line-height: 70px;
    margin: 0 auto 30px;
    text-align: center;
    width: 76px;
}

#modalAgendamento3 p {
    margin: 0 auto 30px;
    text-align: center;
    width: 80%;
}

#modalAgendamento3 #tiles {
    color: var(--primary-color);
     
    font-size: 40px;
    text-align: center;
}

#modalAgendamento3 form {
    text-align: center;
}

#modalAgendamento3 .inputs-token {
    display: inline-block;
    margin-bottom: 30px;
    position: relative;
}

#modalAgendamento3.token-resgate-aplicar .inputs-token {
    margin: 0 auto 30px;
    display: block;
}

    #modalAgendamento3.token-resgate-aplicar .inputs-token .message-token-invalido {
        color: var(--erro-color);
        margin-bottom: 0;
        position: absolute;
        bottom: -29px;
        font-size: 11px;
        line-height: 13px;
        width: 290px;
        left: 50%;
        font-weight: 900;
        margin-left: -145px;
    }

#modalAgendamento3 .input-token {
    width: 12%;
    height: 70px;
    border-radius: 9px;
    border: 2px solid var(--contrast-color);
    margin: 0px 10px;
    font-size: 40px;
    font-weight: 900;
     
    text-align: center;
    padding-top: 7px;
    outline: none;
    color: var(--dark-color);
    display: inline-block;
}

    #modalAgendamento3 .input-token.error-token-invalido {
        border-color: var(--erro-color);
        color: var(--dark-color);
        background: var(--concrete);
        font-weight: normal;
    }

    #modalAgendamento3 .input-token.invalid {
        background: var(--concrete);
        border: 2px solid var(--erro-color);
    }

#modalAgendamento3 #valido {
    border-radius: 100%;
    background: var(--success-color);
    color: var(--white-color);
    font-size: 10px;
    height: 20px;
    line-height: 20px;
    width: 20px;
    position: absolute;
    top: calc(50% - 10px);
    right: -20px;
}

    #modalAgendamento3 #valido .icon-check {
        margin-left: 5px;
    }

#modalAgendamento3 .reenviar-codigo {
    background-color: transparent;
    border: 0;
    outline: none;
    color: var(--primary-color);
    margin-top: 12px;
}

    #modalAgendamento3 .reenviar-codigo i {
        font-size: 20px;
        vertical-align: middle;
        margin-right: 6px;
    }

#modalAgendamento3 .btn-padrao.disabled,
#modalAgendamento3 .btn-padrao.disabled:hover {
    background: var(--contrast-color);
    border-color: var(--contrast-color);
    color: var(--white-color);
}

#modalAgendamento3 .link-cadastro,
#modalAgendamento3 .link-cadastro:hover {
    color: var(--primary-color);
    display: block;
    margin-top: 20px;
    text-decoration: underline;
}

#modalAgendamento4.modal-retorno-thumbs .modal-body {
    padding-top: 40px;
}

#modalAgendamento4,
.modalDescricaoAplicacao {
    text-align: center;
}

    #modalAgendamento4 .imgOk {
        border: 7px solid var(--primary-color);
        border-radius: 100%;
        color: var(--primary-color);
        display: block;
        font-size: 50px;
        height: 120px;
        line-height: 111px;
        margin: 0 auto 30px;
        text-align: center;
        width: 120px;
    }

    #modalAgendamento4 h4 {
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 15px;
    }

    #modalAgendamento4 p {
        margin: 0 auto;
        max-width: 250px;
    }

    .modalDescricaoAplicacao h4 {
        font-size: 20px;
        text-transform: uppercase;
        margin-bottom: 40px;
    }

    .modalDescricaoAplicacao .rosa {
        color: #da847b;
    }

    .modalDescricaoAplicacao .roxo {
        color: #c265fe;
    }

    .modalDescricaoAplicacao .azul {
        color: #51ccf7;
    }

    .modalDescricaoAplicacao .verde {
        color: #74ce1f;
    }

    .modalDescricaoAplicacao .vermelho {
        color: #fe5242;
    }

    .modalDescricaoAplicacao .laranja {
        color: #fda629;
    }

    .modalDescricaoAplicacao .marrom {
        color: #965f0f;
    }

    .modalDescricaoAplicacao .cinza {
        color: #afa0a0;
    }

    .modalDescricaoAplicacao .preto {
        color: #000;
    }

    .modalDescricaoAplicacao .azul-bebe {
        color: #95d3e4;
    }

    .modalDescricaoAplicacao .azul-medio {
        color: #748cbf;
    }

    .modalDescricaoAplicacao .azul-marinho {
        color: #2e4e92;
    }

    .modalDescricaoAplicacao .verde-agua {
        color: #3de0de;
    }

    .modalDescricaoAplicacao .verde-limao {
        color: #22ec84;
    }

    .modalDescricaoAplicacao .pink {
        color: #ec22b9;
    }

    .modalDescricaoAplicacao .amarelo {
        color: #ecda22;
    }

    .modalDescricaoAplicacao .bege {
        color: #e4e495;
    }

    .modalDescricaoAplicacao .verde-escuro {
        color: #6f9216;
    }

    .modalDescricaoAplicacao .vinho {
        color: #921617;
    }

    .modalDescricaoAplicacao .vermelho-rosado {
        color: #e49595;
    }


#modalTermoContrato h4 {
    position: absolute;
}


.modal#modalBloquearCartao .modal-body {
    padding: 0px 24px 36px 24px;
}

/* ITEMS CANCELAMENTO PRODUTO - INÍCIO */

            #modalCancelamento1 .motivos .motivo label {
                font-weight: normal;
                display: block;
                cursor: pointer;
            }

            #modalCancelamento1 .motivos .motivo input {
                background-color: transparent;
                border: 1px solid var(--success-color);
                padding: 2px 4px;
                width: 100%;
            }

    #modalCancelamento2 h4 {
        margin: 0 0 10px;
    }

        #modalCancelamento2 .lista-ciente .ciente {
            padding: 0;
        }

            #modalCancelamento2 .lista-ciente .ciente:last-of-type {
                border-bottom: none;
            }

            #modalCancelamento2 .lista-ciente .ciente .radio {
                margin: 20px 0;
            }

        #modalCancelamento2 .radio-concordo .radio {
            margin: 15px 0;
        }

    #modalCancelamento2 .modal-footer {
        padding-top: 0;
    }

/* ITEMS CANCELAMENTO PRODUTO - FIM */

/* DEBITO - SEGURANÇA - INÍCIO */
.modal.token .modal-body.debito-auto {
    padding: 0px 36px 36px 36px;
    max-height: 410px;
    overflow: initial;
}

.modal-body.debito-auto h5 {
    color: var(--tertiary-color);
    font-size: 14px;
    font-weight: normal;
    margin: 24px 0 0 0;
    padding: 0;
}

    .modal-body.debito-auto h5 + p {
        font-size: 16px;
        margin: 0;
        padding: 0;
    }
/* DEBITO - SEGURANÇA - FIM */

.modal-body p.danger {
    color: var(--erro-color);
}

.modal .modal-footer p.texto-legal {
    margin: 24px 12% 12px 12%;
    font-size: 11px;
    color: var(--tertiary-color);
    text-align: center;
}

.modal .table {
    text-align: left;
    margin: 24px 0;
}

    .modal .table th:last-child,
    .modal .table td:last-child {
        background-color: var(--contrast-color);
    }

.modalSessao {
    top: 200px;
}

#modalSessao {
    margin-top: 10%;
}

.contrato-modal {
    padding: 0 24px 0 0;
    max-height: 480px;
    overflow-y: scroll;
}

    .contrato-modal p {
        color: var(--tertiary-color);
        line-height: 22px;
        margin: 0 0 16px 0;
        text-align: justify;
    }

.modal.success,
.modal.error {
    text-align: center;
}

    .modal.success .modal-footer,
    .modal.error .modal-footer {
        border-top: none;
        margin: 0;
    }

    .modal.success .modal-body,
    .modal.error .modal-body {
        padding: 36px 12% 24px 12%;
    }

.modal .icone {
    border-radius: 100%;
    width: 120px;
    height: 120px;
    display: block;
    font-size: 60px;
    color: var(--dark-color);
    margin: 0 auto;
    text-align: center;
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;
}

    .modal .icone i {
        opacity: .84;
        transform: translate(0,-2px);
    }

.modal.success .icone {
    background-color: rgba(100, 210, 176, .36);
}

.modal.error .icone {
    color: var(--erro-color);
    background-color: var(--concrete);
}

.modal h4 {
    color: var(--primary-color);
    font-size: 18px;
    font-weight: bold;
    margin: 24px 0;
     
}

.modal h5 {
    font-size: 14px;
    color: var(--dark-color);
    font-weight: bold;
    margin: 0 0 12px 0;
    padding: 0;
}

.modal p.serial {
    border-radius: 36px;
    display: inline-block;
    background-color: var(--concrete);
    margin: 0;
    padding: 12px 30px;
}

.modal .dados-excluir {
    margin: 0;
    padding: 0;
}

    .modal .dados-excluir .dados-excluir__box {
        width: 216px;
        border-radius: 12px;
        margin: 12px auto;
        padding: 6px 12px;
        border-bottom: 1px solid var(--contrast-color);
    }

        .modal .dados-excluir .dados-excluir__box + .dados-excluir__box {
            border-bottom: none;
        }

        .modal .dados-excluir .dados-excluir__box h5 {
            font-size: 14px;
            color: var(--tertiary-color);
            font-weight: bold;
            margin: 0;
            padding: 0;
        }

        .modal .dados-excluir .dados-excluir__box p {
            font-size: 16px;
            font-weight: bold;
            margin: 4px 0 0 0;
            padding: 0;
        }

.modal .modal-footer a.btn-vermelho {
    color: var(--white-color);
    border-color: var(--erro-color);
    background-color: var(--erro-color);
}

/*============================================
Antecipa pra mim
==================================================*/

.modalAntecipa .modal-header, .modalEmprestimos .modal-footer {
    border: none
}

.modalAntecipa .modal-header {
    padding: 15px 15px 0;
}

    .modalAntecipa .modal-header .btn-fechar {
        float: right;
        font-size: 20px;
    }

.modalAntecipa h4 {
    color: var(--tertiary-color);
    margin: 0 0 15px;
}

.modalAntecipa p {
    margin-bottom: 15px;
}

.modalAntecipa .box-texto {
    border: 2px solid var(--contrast-color);
    padding: 20px 20px 5px;
}

    .modalAntecipa .box-texto .header {
        overflow: hidden;
    }

    .modalAntecipa .box-texto .item {
        padding: 15px 0;
        border-bottom: 1px solid var(--contrast-color);
        margin: 0
    }

        .modalAntecipa .box-texto .item .nome-item,
        .modalAntecipa .beneficio {
            color: var(--tertiary-color);
        }

        .modalAntecipa .box-texto .item .verde {
            color: var(--success-color);
        }

.modalAntecipa .beneficio {
    font-size: 13px;
    margin: 30px 0;
}

    .modalAntecipa .beneficio strong {
        font-size: 16px;
        color: var(--dark-color);
        font-weight: normal;
    }

.modalAntecipa .box-texto .item:last-child {
    border-bottom: none;
}

.modalAntecipa .linha-final {
    padding: 30px 0;
}

    .modalAntecipa .linha-final .verde {
        color: var(--success-color);
    }

.modalAntecipa .box-texto.scroll {
    height: 300px;
    overflow-y: scroll;
}

.modalAntecipa .radio {
    text-align: left;
    font-size: 12px;
}

.modalAntecipa .imgOk {
    border: 3px solid var(--success-color);
    border-radius: 100%;
    color: var(--white-color);
    padding: 20px;
    display: inline-block;
    margin: 0 0 20px;
}

    .modalAntecipa .imgOk span {
        background-color: var(--success-color);
        border-radius: 30px;
        display: block;
        height: 45px;
        text-align: center;
        font-size: 20px;
        line-height: 45px;
        width: 45px;
    }

.modalAntecipa .bg-warning {
    background-color: var(--contra-bg-color);
    color: var(--alert-color);
    padding: 20px;
}

    .modalAntecipa .bg-warning h4 {
        color: var(--alert-color);
        font-size: 16px;
    }

    .modalAntecipa .bg-warning .btn {
        display: inline-block;
        border-radius: 30px;
        width: auto;
        padding: 8px 16px;
        text-align: center;
        outline: none;
        text-transform: uppercase;
        font-size: 12px;
        letter-spacing: 2px;
        cursor: pointer;
        border: 2px solid var(--alert-color);
        background-color: transparent;
        color: var(--alert-color);
    }

.modalAntecipa .lista-servicos p {
    position: relative;
    padding-left: 25px;
    color: var(--tertiary-color);
    margin-bottom: 10px;
}

    .modalAntecipa .lista-servicos p:before {
        color: var(--primary-color);
        content: "\e930";
        font-family: 'icomoon' !important;
        position: absolute;
        left: 0;
        top: 2px;
    }

.modalAntecipa .lista-servicos h4 {
    font-size: 14px;
    margin: 20px 0 10px;
}

.modalAntecipa .infos {
    padding: 20px;
}

    .modalAntecipa .infos h4 {
        font-size: 14px;
    }

    .modalAntecipa .infos p {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .modalAntecipa .infos small {
        font-size: 10px;
        line-height: 13px;
        display: block;
    }

.modalAntecipa .btn-borda {
    border-color: var(--primary-color);
    background: var(--white-color) !important;
    color: var(--primary-color) !important;
}

.modalAntecipa .alteraSimulacao .campo {
    position: relative;
    margin-bottom: 20px;
}

    .modalAntecipa .alteraSimulacao .campo label {
        position: absolute;
        top: 10px;
        left: 15px;
        font-size: 12px;
        color: var(--tertiary-color);
        font-weight: normal;
        z-index: 2;
    }

    .modalAntecipa .alteraSimulacao .campo .ipt {
        background-color: var(--white-color);
        outline: none;
        height: 60px;
        border: none;
        box-shadow: 0 0 60px rgba(0,0,0,0.1);
        display: block;
        padding: 15px 15px 0;
        font-size: 16px;
        width: 100%;
    }

    .modalAntecipa .alteraSimulacao .campo .form-custom select {
        width: 100%;
        outline: none;
        height: 60px;
        padding: 15px 15px 0;
        background: var(--white-color);
        border: none;
        border-radius: 0;
        -webkit-appearance: none;
        box-shadow: 0 0 60px rgba(0,0,0,0.1);
        margin: 0;
    }

    .modalAntecipa .alteraSimulacao .campo .form-custom .seta span {
        top: 25px;
        right: 20px;
    }

.modalAntecipa .alteraSimulacao .valorLiquido {
    font-size: 14px;
}

    .modalAntecipa .alteraSimulacao .valorLiquido strong {
        font-size: 18px;
    }

#modalCustoEfetivo .box-texto {
    border: none;
}

    #modalCustoEfetivo .box-texto .item {
        padding: 7px 0;
        border-bottom: none;
        margin: 0;
    }

.modalAntecipa .downloadContrato {
    border: 1px solid rgba(0,0,0,0.3);
    display: block;
    padding: 15px;
    height: 130px;
    margin-bottom: 30px;
}

    .modalAntecipa .downloadContrato span.icon {
        display: block;
        margin: 0 auto 10px;
        color: var(--primary-color);
        font-size: 30px;
    }

    .modalAntecipa .downloadContrato span.titulo {
        display: block;
        text-align: center;
        color: var(--dark-color);
        font-size: 14px;
    }

    .modalAntecipa .downloadContrato span.baixar {
        display: block;
        text-align: center;
        color: var(--primary-color);
        font-size: 14px;
    }

    .modalAntecipa .downloadContrato:hover {
        border-color: var(--primary-color);
    }

.modalAntecipa .motivo p {
    margin: 0
} 

@media (min-height: 600px) and (max-height: 670px) {
    #modalPrintRecibo > .modal-lg {
        margin: 10px auto;
    }

        #modalPrintRecibo > .modal-lg > .modal-content {
            max-height: 630px;
        }

            #modalPrintRecibo > .modal-lg > .modal-content .modal-header {
                padding: 20px 24px 0px 24px;
            }

            #modalPrintRecibo > .modal-lg > .modal-content .modal-body {
                padding: 20px 24px 0px 24px;
            }
}

@media (max-width: 767px) {

    .modal.token .modal-body {
        padding: 12px 24px 48px 24px;
    }

    .modal.add-perfil .modal-body .form-custom.checkbox {
        display: flex;
        margin: 12px 0 12px 24px;
    }
}

@media (min-width: 768px) {
    .modal-sm {
        width: 400px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    #modalAgendamento3 .reenviar-codigo {
        margin: 0 auto 20px;
        display: block;
        font-size: 18px;
    }

    .modal.token .modal-header {
        padding: 36px 4% 12px 4%;
    }

        .modal.token .modal-header h4 {
            font-size: 14px;
        }

    .modal.token .modal-body {
        padding: 12px 4% 48px 4%;
    }
}

/*Modal Pix*/
.modal-size.pix {
    width: 870px;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    margin: 0px;
    transform: translate(-50%, -50%) !important;
}

    .modal-size.pix > .modal-content {
        border-radius: 16px;
        padding: 5px;
    }

.subtitle-pix.modal-title {
    padding: 0px 30px;
}

.title-pix {
    font-weight: 600;
    font-size: 21px;
    line-height: 27px;
    color: var(--primary-color);
}

.subtitle-pix {
    line-height: 150%;
    font-weight: normal;
    font-size: 16px;
    color: var(--dark-color);
}

.close.pix {
    position: absolute;
    left: -15px;
    top: 4px;
    cursor: pointer;
}

    .close.pix > span {
        font-size: 30px;
        color: var(--dark-color);
    }

@media (max-width: 767px) {
    .modal-size.pix {
        width: fit-content;
        overflow: auto;
        height: auto;
        align-items: center;
        justify-content: center;
        position: absolute;
        height: 100%;
        left: 50%;
        margin-right: -50%;
        margin: 0px;
        transform: translate(-50%, -50%) !important;
    }

    .close.pix {
        position: initial;
    }

    .modal-size.pix > .modal-content {
        border-radius: 0px !important;
        padding: 0px;
    }

    #modalPix {
        overflow-y: auto !important;
    }
}

@media (min-width: 768px) {
    .hidden-md {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .modal-size.pix {
        width: 680px;
    }
}
/*Fim Modal Pix*/

/*New Modal Error*/

.new-modal-content {
    background-color: var(--color-branding2) !important;
    border-radius: 30px;
}

.new-title-modal {
    color: #FFFFFF !important;
    text-align: center;
    margin: 20px 0 !important;
    font-weight: bold;
    font-size: 24px !important;
}

.new-modal-header {
    border: none;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.titleAlerta {
    font-size: 18px !important;
}

.new-modal-body {
    border-radius: 30px;
    background-color: white;
    padding: 35px 25px 70px 25px
}

.new-modal h4 {
    color: white
}

.new-btn-modal-erro {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.new-btn-padrao {
    background-color: var(--primary-color);
    color: white;
    border: none;
    border-radius: 25px;
    text-transform: capitalize !important;
    font-size: 14px;
    padding: 10px 30px;
    margin-top: 16px;
    width: 90%;
}

#modalLabelSucesso {
margin: 0px !important;
}

.incidente {
    padding: 10px 18px;
    background-color: #e1dde8;
    border-radius: 10px;
    margin: 25px 0 25px 0;
}

.title-incidente {
    font-weight: bold;
    margin: 0 0 12px 0;
    font-size: 16px;
    color: var(--color-branding2) !important;
}

.id-incidente {
    color: var(--color-branding2);
    font-size: 14px;
    padding: 0;
    text-align: right;
    text-transform: uppercase;
}

.date {
    font-size: 12px;
    color: var(--color-branding2);
}

.base-icone {
    margin: 10px;
    font-size: 50px;
    color: var(--primary-color);
}

/*End New Modal Error*/
@media screen {
    #printSection {
        display: none;
    }
}

@media print {

    body * {
        display:none;
    }

    #printSection, #printSection * {
        display: inline;
    }

    #printSection {
        position:absolute;
        left:0;
        top:0;
    }

    #printSection .no-print{
         display:none; 
    }

    body {
        margin:0; 
        padding:0;
        line-height: 1.4em;
        font: 12pt Georgia, "Times New Roman", Times, serif;
        color: var(--dark-color);
    }

    @page {
        margin: 1.5cm;
    }

    .wrap { 
        width: 100%; 
        margin: 0; 
        float: none !important; 
    }

    .no-print, nav, footer, video, audio, object, embed { 
        display:none; 
    }

    .print {
        display: block;
    }

    img {
        max-width: 100%;
    }

    aside {
        display:block;
        page-break-before: always;
    }

    h1 {
        font-size: 24pt;
    }

    h2 {
        font-size: 18pt;
    }

    h3 {
        font-size: 14pt;
    }
    
    p {
        font-size: 12pt;
        widows: 3;
        orphans: 3;
    }

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

    a:link:after, a:visited:after { 
        content: " (" attr(href) ") ";
    }

    p a {
        word-wrap: break-word;
    }

    q:after {
        content: " (" attr(cite) ")"
    }

    a:after, a[href^="javascript:"]:after, a[href^="#"]:after { 
        content: ""; 
    }  

    .page-break { 
        page-break-before: always; 
    }
    
    /*Estilos da Demo*/
    .header.print h1 {
        width: 100%;
        margin-bottom: 0.5cm;
        font-size: 18pt;
    }

    .header.print:after {
        content: "Este artigo foi escrito pela designer Dani Guerrato e retirado do site Tableless.";
    }

    .artigo {
        margin-top: 0;
        border-top: 1px solid var(--dark-color);
        padding-top: 1cm;
    }

    h1 a:link:after, h1 a:visited:after { 
        content: ""; 
    }

    .text-justify-print {
       text-align: justify;
    }
}
.bubble {
    margin-top: 0px;
    margin-bottom: 20px;
    display: block;
}

@media (max-width: 767px) {
    .bubble {
        height: 40px;
        margin: 0 auto;
    }
}

.removeScroll {
    overflow: visible !important;
}

.base-opcoes {
    margin: 24px 0 0 0;
}

    .base-opcoes h3 {
        font-size: 18px;
        font-weight: bold;
        color: var(--tertiary-color);
    }

    .base-opcoes ul {
        list-style: none;
        margin: 36px 0 0 0;
        padding: 0;
    }

        .base-opcoes ul li {
            font-size: 18px;
            margin: 0 0 12px 0;
            padding: 4px 0;
            border-bottom: 2px dotted var(--tertiary-color);
        }

.base-bannermkt {
    margin: 24px 0 0 0;
}

.cena {
    height: 100%;
    width: 100%;
    perspective: 600px;
}

.nome-favorecido .nome {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    color: var(--dark-color);
}

.nome-favorecido .dados {
    color: var(--tertiary-color);
    font-size: 12px;
}

.opcao-valores {
    display: flex;
    align-items: center;
}

    .opcao-valores h5 + p {
        font-weight: bold;
        font-size: 16px;
        color: var(--tertiary-color);
    }

    .opcao-valores .valor-seguro {
        margin: 0 18px 0 0;
    }
.border-top {
    border-top: 2px solid var(--contrast-color);
}

.link-ver-invest,
.link-ver-invest:hover {
    color: var(--primary-color);
    text-decoration: none;
    text-align: right;
    display: block;
    text-decoration: underline;
}

/* PAGAMENTO */
#vencimentoData.ng-not-empty + label {
    font-size: 10px;
    color: var(--tertiary-color);
    top: 8px;
    left: 24px;
}

.drag-drop {
    position: absolute;
    top: 10px;
    right: 10px;
}

.bolinha-caps .off {
    width: 5px;
    height: 5px;
    background-color: var(--tertiary-color);
    border-radius: 10px;
    position: absolute;
    top: 5px;
    right: 5px;
}

.bolinha-caps .on {
    width: 5px;
    height: 5px;
    background-color: var(--success-color);
    border-radius: 10px;
    position: absolute;
    top: 5px;
    right: 5px;
}

.curva1 {
    border-radius: 10px 0px 0px 0px;
}

.curva2 {
    border-radius: 0px 10px 0px 0px;
}


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

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

.txt-agendamento {
    width: 100%;
}

.valor-agendamento {
    margin-top: 20px;
}

.progress-agendamento {
    width: 70px;
    height: 70px;
    position: relative;
    float: left;
}

.infos-agendamento {
    text-align: right;
}

    .infos-agendamento .tit {
        font-size: 12px;
        color: var(--tertiary-color);
    }

.porcentagem-agendamento {
    font-size: 12px;
    font-weight: 900;
    width: 70px;
    height: 70px;
    text-align: center;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--success-color);
}

.infos-agendamento .valor {
    font-size: 11px;
    color: var(--dark-color);
}

/*svg {
    height: 70px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    width: 70px;
}
*/
.bola-numero {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--concrete);
    color: var(--primary-color);
    border-radius: 40px;
    float: left;
    margin-right: 10px;
}

.opcoesInvestimentoDashboard:last-of-type > hr {
    display: none;
}

.imprimir-pagina {
    display: block;
    margin-top: 18px;
    font-size: 30px;
    color: var(--primary-color);
}

.linha-aplicar .sub-icones {
    line-height: 15px;
}

.header-resgate {
    padding: 17px 24px 17px 24px !important;
}

.body-resgate {
    padding: 0px 24px 0px 24px !important;
}

.footer-agendamento {
    padding: 10px 24px 10px 24px !important;
}

.data-agendamento-container {
    display: none;
}

    .data-agendamento-container input,
    .valor-agendamento-container input {
        padding: 10px 18px 10px 24px !important;
    }

.file-msg {
    font-size: small;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    max-width: 100%;
    vertical-align: middle;
}

.aviso-selfie {
    transform: scale(0);
    opacity: 0;
    transition: 0.3s ease;
    display: none;
    margin-top: 20px;
    position: absolute;
}

    .aviso-selfie.abre {
        transform: scale(1);
        opacity: 1;
        display: block;
    }

.botoes-ok.abre {
    transform: scale(1);
    opacity: 1;
}

.aviso-selfie p {
    color: var(--white-color);
    font-size: 20px;
}

.check-upload {
    border-radius: 60px;
    width: 36px;
    height: 36px;
    border: solid 2px var(--contrast-color);
    position: absolute;
    right: 20px;
    top: 20px;
    transition: 0.3s cubic-bezier(0.46, -0.08, 0.42, 1.17);
    transition-delay: 0s;
    transform: scale(1);
}

.messagem-conclusao {
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

    .messagem-conclusao .base-icone {
        background-color: var(--contra-bg-color);
        border-radius: 50%;
        width: 85px;
        height: 85px;
        display: block;
        margin: 0 auto;
        padding-top: 25px;
    }

        .messagem-conclusao .base-icone i {
            color: var(--primary-color);
            font-size: 40px;
            font-weight: bold;
        }

    .messagem-conclusao p {
        font-size: 18px;
        line-height: 20px;
        margin-top: 25px;
    }

.lista-emprestimo-aberta .row {
    background-color: var(--white-color);
    margin-top: 5px;
    padding: 20px 10px;
}

.lista-emprestimo-aberta .dados1 {
    color: var(--dark-color);
}

.lista-emprestimo-aberta .dados2 {
    color: var(--tertiary-color);
    text-align: right;
}

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

.body-parcelas {
    height: 350px;
    overflow: scroll;
}

.aceite-termos {
    text-align: center;
}

.valorRedondo,
.valorAno {
    margin-bottom: 20px;
}

.bola-aceite {
    width: 80px;
    height: 80px;
    border: 2px solid var(--primary-color);
    border-radius: 100px;
    margin: -30px auto 20px;
    padding: 20px;
    text-align: center;
}

    .bola-aceite i {
        font-size: 33px;
        color: #5a5a5a;
    }

.ver-tarde {
    font-size: 10px;
    text-decoration: underline;
    color: var(--tertiary-color);
}

/* ESTILO DA PAGINA DE FALE CONOSCO **/
#wait {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background-color: var(--white-color);
    opacity: 0.9;
}

.ajax-loader {
    position: absolute;
    left: 40%;
    top: 50%;
    display: block;
    width: 20%;
    background: var(--primary-color);
    border-radius: 70px;
}

.escalonado-box {
    height: 400px;
    overflow: scroll;
    width: 100%;
}

.txt-momento {
    margin-top: 9px !important;
}

.ajuste-margin-rodape {
    margin-left: 50px;
}

.placeholder-photo {
    background-color: var(--contrast-color);
    width: 160px;
    height: 160px;
    border-radius: 200px;
    margin: 50px auto;
    overflow: hidden;
    background-image: url(assets/img/user-placeholder.png);
    background-size: cover;
}

.completa-perfil {
    width: 100%;
}

.line-table.cancelado:before {
    border-left: 3px solid var(--erro-color) !important;
}

.bola-iniciais {
    background-color: var(--contrast-color);
    width: 50px;
    height: 50px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    color: var(--tertiary-color);
}

.parceria-disclaimer {
    text-align: center;
    margin: 36px 0 0 0;
}

    .parceria-disclaimer p a {
        color: var(--primary-color);
        text-decoration: underline;
    }

@media (max-width: 767px) {
    .border-top {
        border-top: 0px solid var(--contrast-color);
    }

    .link-ver-invest,
    .link-ver-invest:hover {
        text-align: left;
        display: block;
    }

    .no-border-mobile {
        border-top: 0px solid var(--contrast-color) !important;
        padding: 0px 0px 20px !important;
    }

    .mobile-gap {
        border-top: 1px solid var(--contrast-color);
        background-color: var(--white-color);
        padding: 30px 0px;
    }

    .mobile-ajuste {
        margin-top: 50px;
    }

    .carousel-indicators {
        position: relative;
    }

    .dependentes input[type='text'],
    .dependentes input[type='password'] {
        margin-bottom: 20px;
    }  
}

@media (min-width: 768px) and (max-width: 991px) {
    .mobile-ajuste {
        margin-top: 30px;
    }
}
.base-rodapefixed {
    position: fixed;
    bottom: -492px;
    left: 0;
    background: var(--tertiary-color);
    width: 100%;
    height: 550px;
    display: flex;
    padding: 0 0px 0 0;
    z-index: 1002;
    transition: all 0.3s ease;
    display: flex;
    justify-content: space-between;
}

    .base-rodapefixed.open-telefone {
        bottom: 0;
    }

    .base-rodapefixed > div {
        margin: 0 48px 0 0;
    }

    .base-rodapefixed a:nth-child(4) {
        flex-grow: 1;
    }

    .base-rodapefixed .acesso-rapido {
        position: relative;
        width: 204px;
        display: flex;
        text-align: center;
    }

        .base-rodapefixed .acesso-rapido .title {
            position: absolute;
            text-transform: uppercase;
            font-size: 10px;
            font-weight: bold;
            color: var(--white-color);
            letter-spacing: 1px;
            width: 144px;
            padding: 3px;
            height: 20px;
            top: -20px;
            left: 12%;
            border-radius: 8px 8px 0 0;
            background-image: var(--gradient-color);
        }

        .base-rodapefixed .acesso-rapido a {
            flex: auto;
            max-width: 68px;
            width: 68px;
            text-align: center;
            display: block;
            color: var(--white-color);
            font-size: 24px;
            padding: 14px 0 10px 0;
        }

        .base-rodapefixed .acesso-rapido a {
            background: #6a6a6a;
        }

            .base-rodapefixed .acesso-rapido a:nth-child(even) {
                background: #424242;
            }

    .base-rodapefixed.open-telefone a:nth-child(4) {
        background-color: var(--dark-color);
    }

    .base-rodapefixed .acesso-rapido a:hover {
        background: var(--dark-color);
    }

    .base-rodapefixed .acesso-rapido a {
        position: relative;
    }

        .base-rodapefixed .acesso-rapido a > .tooltip-custom {
            position: absolute;
            top: 14px;
            right: -200%;
            width: 180px;
            height: auto;
            margin: 0;
            padding: 10px 0;
            text-align: center;
            color: var(--dark-color);
            font-size: 11px;
            line-height: 10px;
            font-weight: 700;
            border-radius: 6px 12px 12px 6px;
            color: var(--white-color);
            background-color: var(--primary-color);
            transition: all 0.3s ease;
            pointer-events: none;
            box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
            z-index: 2;
            opacity: 0;
        }

            .base-rodapefixed .acesso-rapido a > .tooltip-custom:before {
                width: 0;
                height: 0;
                position: absolute;
                top: 1px;
                left: -7px;
                content: "";
                border-top: 14px solid transparent;
                border-right: 11px solid var(--primary-color);
                border-bottom: 12px solid transparent;
            }

        .base-rodapefixed .acesso-rapido a:hover > .tooltip-custom {
            opacity: 1;
            transform: translate(58px, 0);
        }

        .base-rodapefixed .acesso-rapido a#trigger-telefones:hover > .tooltip-custom,
        .base-rodapefixed .acesso-rapido a#janela-fale:hover > .tooltip-custom {
            opacity: 1;
            transform: translate(78px, 0);
        }

        .base-rodapefixed .acesso-rapido a > .tooltip-custom.one {
            width: 96px;
            right: -58px;
        }

        .base-rodapefixed .acesso-rapido a:hover > .tooltip-custom.one {
            transform: translate(38px, 0);
        }

        .base-rodapefixed .acesso-rapido a > .tooltip-custom.two {
            width: 110px;
            right: -32px;
        }

        .base-rodapefixed .acesso-rapido a .item i{
            font-size: 25px;
        }

        .base-mais-telefones {
            position: absolute;
            left: 0;
            top: 58px;
            z-index: 1000;
            padding: 24px 0 0 0;
            width: 100%;
            height: 100%;
            background-color: var(--dark-color);
        }

    .base-mais-telefones .link-rodape {
        display: flex;
        color: var(--white-color);
        margin: 0;
    }

        .base-mais-telefones .link-rodape .base-icone {
            font-size: 30px;
            color: var(--white-color);
            font-weight: bold;
            margin: -5px 18px 0 0;
        }

        .base-mais-telefones .link-rodape h4 {
            color: var(--contrast-color);
            font-size: 12px;
            font-weight: bold;
            margin: 0 0 4px 0;
            padding: 0;
            text-transform: uppercase;
        }

        .base-mais-telefones .link-rodape p,
        .base-mais-telefones .link-rodape p + p {
            margin: 0;
            padding: 0;
            line-height: 14px;
        }

            .base-mais-telefones .link-rodape p.telefone {
                font-size: 16px;
                font-weight: bold;
                line-height: 14px;
                margin: 6px 0;
            }

            .base-mais-telefones .link-rodape p.explica {
                font-size: 10px;
                color: var(--contrast-color);
            }

#trigger-telefones {
    background: var(--dark-color);
    width: 68px;
    text-align: right;
    display: inline-block;
    color: var(--white-color);
    font-size: 24px;
    padding: 14px 20px 10px 0;
    margin-top: -7px;
    margin-left: 30px;
    transition: .3s ease;
}

    #trigger-telefones:hover {
        width: 228px;
    }

    #trigger-telefones .item .hidden-text {
        position: absolute;
        font-size: 14px;
        height: 28px;
        white-space: nowrap;
        margin-top: 6px;
        opacity: 0;
        transition: .3s ease;
    }

    #trigger-telefones:hover .item .hidden-text {
        opacity: 1;
    }

        #trigger-telefones:hover .item .hidden-text i {
            font-size: 20px;
            vertical-align: middle;
            margin-left: 20px;
            margin-right: 5px;
        }

    #trigger-telefones .item .icon-chevron-up {
        transform: rotateX(0deg);
        display: inline-block;
        transition: .3s ease;
        font-size: 25px;
        margin-top: 3px;
    }

.open-telefone #trigger-telefones .item .icon-chevron-up {
    transform: rotateX(180deg);
}

    .base-rodapefixed .link-rodape {
        margin: 8px 84px 0 0;
        font-size: 12px;
        color: var(--white-color);
        display: flex;
    }

.base-rodapefixed .telefone-destaque {
    margin: 7px 0 0;
    padding: 0;
    font-size: 12px;
    color: var(--white-color);
    display: flex;
}

    .base-rodapefixed .link-rodape .base-icone {
        margin: 10px 24px 0 0;
        font-size: 24px;
    }

.base-rodapefixed .link-rodape h4 {
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0;
    text-transform: uppercase;
    margin: 6px 0 3px 0;
    padding: 0;
}

.base-rodapefixed .link-rodape small {
    font-size: 85%;
    color: var(--white-color);
    display: inline;
    margin: 0;
    padding: 0;
}

.base-rodapefixed .link-rodape p {
    font-size: 10px;
    line-height: 14px;
    margin: 0;
    padding: 0;
}

.base-rodapefixed .link-rodape a,
.base-rodapefixed .link-rodape p a {
    text-decoration: underline;
    color: var(--white-color);
}

    .base-rodapefixed .link-rodape a:hover,
    .base-rodapefixed .link-rodape p a:hover {
        text-decoration: none;
    }

    .base-rodapefixed .link-rodape p span {
        color: var(--white-color);
        font-size: 12px;
    }

.telefone-rodape {
    font-weight: 900;
}

@media (max-width: 767px) {
    .base-rodapefixed {
        padding: 0;
    }

        .base-rodapefixed > div {
            margin: 0;
        }

        .base-rodapefixed .acesso-rapido {
            position: relative;
            width: 100%;
            display: flex;
            text-align: center;
        }

            .base-rodapefixed .acesso-rapido a {
                padding: 4px 0;
            }

            .base-rodapefixed .acesso-rapido .title {
                width: 100%;
                padding: 5px;
                top: -24px;
                left: 0;
                border-radius: 0;
            }

    .link-rodape {
        margin-bottom: 90px !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-rodapefixed {
        padding: 0;
    }

        .base-rodapefixed > div {
            margin: 0;
        }

        .base-rodapefixed .acesso-rapido {
            position: relative;
            width: 100%;
            display: flex;
            text-align: center;
        }

            .base-rodapefixed .acesso-rapido a {
                padding: 4px 0;
            }

            .base-rodapefixed .acesso-rapido .title {
                width: 100%;
                padding: 5px;
                top: -24px;
                left: 0;
                border-radius: 0;
            }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .base-rodapefixed a:nth-child(2), .base-rodapefixed div:nth-child(5) {
        flex-grow: 1;
    }

    .base-rodapefixed a:nth-child(3), .base-rodapefixed a:nth-child(4) {
        display: block;
    }

    .base-rodapefixed {
        bottom: -462px;
        height: 520px;
    }

    #trigger-telefones:hover{
        width: 275px;
    }
}
/* SLIDER INPUT RANGE*/
input[type="range"] {
    -webkit-appearance: none;
    width: 100%;
}

    input[type="range"]:focus {
        outline: none;
    }

    /* linha range */
    input[type="range"]::-webkit-slider-runnable-track {
        width: 100%;
        background: var(--contrast-color);
        margin: 7px 0 0 0;
        border-radius: 30px;
        border: 0;
        height: 6px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        cursor: pointer;
    }
    /* button range */
    input[type="range"]::-webkit-slider-thumb {
        margin-top: -21px;
        z-index: 2;
        width: 48px;
        height: 48px;
        cursor: default;
        border-radius: 50%;
        outline: none;
        -ms-touch-action: none;
        touch-action: none;
        background-color: var(--primary-color) !important;
        cursor: pointer;
        -webkit-appearance: none;
        border: 10px solid var(--white-color);
    }

    input[type="range"]:focus::-webkit-slider-runnable-track {
        background: var(--contrast-color);
    }
    /* linha range */
    input[type="range"]::-moz-range-track {
        width: 100%;
        background: var(--contrast-color);
        margin: 7px 0 0 0;
        border-radius: 30px;
        border: 0;
        height: 6px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        cursor: pointer;
    }
    /* button range */
    input[type="range"]::-moz-range-thumb {
        margin-top: -0.46em;
        z-index: 2;
        width: 18px;
        height: 18px;
        cursor: default;
        border-radius: 50%;
        outline: none;
        -ms-touch-action: none;
        touch-action: none;
        background-color: var(--primary-color) !important;
    }
    /* linha range */
    input[type="range"]::-ms-track {
        width: 100%;
        background: var(--contrast-color);
        margin: 7px 0 0 0;
        border-radius: 30px;
        border: 0;
        height: 6px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
        cursor: pointer;
    }

    input[type="range"]::-ms-fill-lower {
        background: var(--contrast-color);
        border: 0;
        border-radius: 30px;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

    input[type="range"]::-ms-fill-upper {
        background: var(--contrast-color);
        border-radius: 30px;
        border: 0;
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }
    /* button range */
    input[type="range"]::-ms-thumb {
        margin-top: -0.16em;
        z-index: 2;
        width: 18px;
        height: 18px;
        cursor: default;
        border-radius: 50%;
        outline: none;
        -ms-touch-action: none;
        touch-action: none;
        background-color: var(--primary-color) !important;
    }

    input[type="range"]:focus::-ms-fill-lower {
        background: var(--contrast-color);
    }

    input[type="range"]:focus::-ms-fill-upper {
        background: var(--contrast-color);
    }

#slider-valor .ui-slider-handle,
#slider-tempo .ui-slider-handle {
    background-color: var(--primary-color) !important;
}

.slider .ui-widget-header {
    border: 0 solid var(--contrast-color);
    background: var(--gradient-color);
    color: var(--dark-color);
    font-weight: bold;
}

.ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    font-size: 0.7em;
    display: block;
    border: 0;
    background-position: 0 0;
}

.ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 18px;
    height: 18px;
    cursor: default;
    border-radius: 50%;
    outline: none;
    -ms-touch-action: none;
    touch-action: none;
}

.ui-slider-horizontal .ui-slider-handle {
    top: -0.36em;
}

.ui-slider .ui-state-default,
.ui-slider .ui-widget-content .ui-state-default,
.ui-slider .ui-widget-header .ui-state-default,
.ui-slider .ui-button,
.ui-slider html .ui-button.ui-state-disabled:hover,
.ui-slider html .ui-button.ui-state-disabled:active {
    border: 0px solid var(--contrast-color);
    background: var(--white-color);
    font-weight: normal;
    color: var(--dark-color);
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
}
.green {
    color: var(--success-color);
}

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

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

.text-orange-link {
    color: var(--primary-color);
    text-decoration: underline;
}


.vermelho {
    color: var(--erro-color) !important;
}

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

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

.nao-processada {
    color: var(--contrast-color) !important;
}

.modal-redirect-app{
    color: var(--modal-redirect-app) !important;
}
p, h1, h2, h3, h4, h5, h6{
    padding: 0;
    margin: 0;
}

    p span {
        color: var(--tertiary-color);
    }

h1, h2, h3, h4, h5 {
    
    font-weight: 400;
}

    h1.title {
        font-size: 30px;
        color: var(--dark-color);
        margin: 18px 0 12px 0;
        padding: 0;
    }

    h2.client-name {
        color: var(--dark-color) !important;
        font-size: 18px !important;
        margin-bottom: 12px !important;
    }

    h2.client-code {
        font-size: 18px !important;
    }

    h3.custom {
        font-size: 14px;
        color: var(--dark-color);
        font-weight: bold;
        text-transform: uppercase;
        margin: 24px 0 8px 0;
        padding: 0;
    }

    h4.custom {
        color: var(--primary-color);
        font-size: 12px;
        letter-spacing: 0px;
        text-transform: uppercase;
        margin: 0;
        padding: 0;
    }

    h5.custom {
        color: var(--dark-color);
        font-size: 12px;
        letter-spacing: 0px;
        text-transform: uppercase;
        margin: 12px 0 0 0;
        padding: 0;
    }

        h5.custom + p {
            font-size: 16px;
            font-weight: 400;
            margin: 0 0 18px 0;
            padding: 0;
            text-transform: uppercase;
        }

    h5.orange {
        color: var(--primary-color);
        font-size: 11px;
        letter-spacing: 1px;
        text-transform: uppercase;
        margin: 18px 0 0 0;
        padding: 0;
    }

    h5.transacao-nome {
        font-size: 12px;
        text-align: right;
        color: var(--tertiary-color);
        text-transform: uppercase;
        font-weight: bold;
        margin: 16px 0 0 0;
    }

.bold {
    font-weight: 900 !important;
}

.txt-12 {
    font-size: 12px;
}

.titulo-escolha {
    display: flex;
    align-items: center;
    position: relative;
}

.titulo-emprestimo {
    color: var(--primary-color);
    font-size: 16px;
}

.subtitulo {
    font-size: 20px;
    color: var(--tertiary-color);
    font-weight: 400;
    /*margin-top: -34px;*/
}

.texto-agenda {
    text-align: right;
    font-weight: 900;
}

.titulo-porcentagem {
    font-size: 17px;
    vertical-align: baseline;
    margin-top: 20px;
    color: var(--tertiary-color);
}

.valor-porcentagem {
    font-size: 30px;
    color: var(--primary-color);
    vertical-align: baseline;
    font-weight: 900;
}

.titulo-poupanca {
    font-size: 17px;
    color: var(--tertiary-color);
}

.valor-poupanca {
    font-size: 40px;
    color: var(--success-color);
    vertical-align: baseline;
    font-weight: 900;
}

.titulo-meus {
    font-size: 16px;
    color: var(--tertiary-color);
}

    .titulo-meus span {
        color: var(--success-color);
    }

    .titulo-meus.verde {
        color: var(--success-color);
    }

.valor-meus {
    font-size: 24px;
}

.titulo-meus-invest {
    font-size: 10px;
    margin-left: 15px;
    display: block !important;
    margin-top: 0px !important;
}

.valor-meus-invest {
    font-size: 12px;
    margin-left: 15px;
    color: var(--dark-color);
    font-weight: 900;
    margin-top: 0px !important;
}

.txt-resgate {
    text-transform: none !important;
    font-size: 10px;
}

.texto-legal {
    margin-top: 30px;
    font-size: 14px;
}

.texto-taxa-simulacao {
    margin-top: 30px;
    font-size: 14px;
    font-weight: 700;
    padding: 0 30px;
}

.text-file {
    position: absolute;
    top: 18px;
    left: 30px;
    font-size: 12px;
    color: #000;
    pointer-events: none;
    font-weight: 900;
    outline: none;
}

.titulo-aceite {
    font-size: 18px;
    font-weight: 900;
    color: var(--dark-color);
}

.texto-aceite {
    font-size: 14px;
    color: var(--tertiary-color);
}

.texto-aceite-modal {
    font-size: 14px;
    color: var(--tertiary-color);
    text-align: left;
}

.resultado-titulo {
    font-size: 20px !important;
    font-weight: 900 !important;
    color: var(--dark-color) !important;
}

.vermelho-perfil {
    color: var(--erro-color) !important;
    font-size: 18px;
}

.laranja-perfil {
    color: var(--primary-color) !important;
    display: inline !important;
    margin: 0 !important;
    height: auto !important;
    line-height: 25px !important;
}

.textos-tabs div {
    font-size: 12px;
    padding: 5px 0px;
}

.textos-tabs span {
    display: none;
}

.tit-saldo {
    font-size: 19px;
    color: var(--tertiary-color);
    text-align: right;
    line-height: 15px;
}

.resultado-simulacao h2 {
    font-size: 20px;
    font-weight: 900;
    color: var(--dark-color);
}

.resultado-simulacao-titulo {
    margin-bottom: 0 !important;
}

.grafico-simulacao-titulo {
    padding-bottom: 10px;
}

.valor-total {
    font-size: 12px;
    margin-top: -27px;
    text-align: right;
    width: 100%;
    padding-bottom: 13px;
}

    .valor-total span {
        font-size: 16px;
        text-transform: lowercase;
    }

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

@media (max-width: 767px) {
    h5.transacao-nome {
        font-size: 12px;
        text-align: left;
    }

    .titulo-finalizar {
        font-size: 23px;
    }

    .subtitulo-finalizar {
        font-size: 17px;
        line-height: 19px;
    }

    .texto-finalizar {
        font-size: 16px;
        line-height: 1.68;
    }

    .titulo-aviso {
        font-size: 20px;
        margin-top: 10px;
        line-height: 21px;
    }

    .texto-aviso {
        font-size: 14px;
    }

    .txt-legal-conta {
        font-size: 12px !important;
        margin-bottom: 20px !important;
    }

    .sub-titulo {
        font-size: 14px;
        line-height: 23px;
    }

    .subtitulo {
        font-size: 15px;
        margin-top: 10px;
    }

    .txt-grey {
        color: var(--dark-color);
        margin: 30px 0px;
    }

    .titulo-meus-invest {
        text-align: left;
        font-size: 12px;
        margin-left: 0px;
    }

    .resultado-titulo {
        margin-top: 30px !important;
    }

    .vermelho-perfil {
        text-align: center;
        margin-top: 10px !important;
        margin-bottom: 10px !important;
        text-align: left;
    }

    .valor-total {
        font-size: 12px;
        position: relative;
        margin-left: 40px;
        width: 100%;
        margin-top: 0;
        text-align: left;
    }

    .valor-saldo,
    .valor-consolidado,
    .valor-porcentagem,
    .valor-poupanca {
        text-align: left;
    }

    .textos-tabs span {
        display: inline-block;
        font-weight: 900;
    }

    .tit-saldo {
        margin-top: 30px;
        text-align: center;
    }

    .resultado-simulacao {
        margin-top: 50px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    h5.transacao-nome {
        font-size: 12px;
        text-align: left;
    }

        h5.transacao-nome.nome-sm {
            margin-top: 36px;
        }

    .titulo-meus-invest {
        font-size: 9px;
    }

    .valor-meus {
        font-size: 18px;
    }

    .valor-total {
        font-size: 12px;
        position: relative;
        margin-left: 25px;
        width: 100%;
        margin-top: 0;
        text-align: left;
    }

    .sub-icones i {
        font-size: 11px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .titulo-escolha {
        display: block;
    }

    .valor-meus {
        font-size: 18px;
    }

    .sub-icones {
        font-size: 9px;
    }

    .valor-total {
        font-size: 12px;
        position: relative;
        margin-left: 25px;
        width: 100%;
        margin-top: 0;
        text-align: left;
    }
}
.circle-notify {
    position: absolute;
    width: 6px;
    height: 6px;
    left: 64px;
    top: 24px;
    background: var(--primary-color);
    border-radius: 13.6585px;
}

/* CSS TOPO - INICIO */
.base-topmenu {
    box-shadow: 0 0 20px rgba(0,0,0,.2);
    position: fixed;
    top: 0;
    left: 0;
    background: var(--white-color);
    border-bottom: 1px solid var(--contrast-color);
    padding: 10px 0;
    z-index: 1001;
    height: 75px;
    width: 100%;
}

.base-topmenu-pj {
    box-shadow: 0 0 20px rgba(0,0,0,.2);
    position: fixed;
    top: 0;
    left: 0;
    background: #373737;
    border-bottom: 1px solid var(--contrast-color);
    padding: 10px 0;
    z-index: 1001;
    height: 75px;
    width: 100%;
}

.base-topmenu .base-logotipo {
    position: absolute;
    top: 24px;
    left: 18px;
    z-index: 2;
}

.base-topmenu-pj .base-logotipo {
    position: absolute;
    top: 24px;
    left: 18px;
    z-index: 2;
}


.base-topmenu .opts-topo .base-icone i {
    position: relative;
}

.base-topmenu-pj .opts-topo .base-icone i {
    position: relative;
}

.base-topmenu .opts-topo .base-icone i > span {
    position: absolute !important;
    top: -5px;
    left: -15px;
}

.base-topmenu-pj .opts-topo .base-icone i > span {
    position: absolute !important;
    top: -5px;
    left: -15px;
}

.base-topmenu .opts-topo .base-icone i > span.badge-orange {
    background-color: var(--primary-color);
}

.base-topmenu-pj .opts-topo .base-icone i > span.badge-orange {
    background-color: var(--primary-color);
}

.base-topmenu .opts-topo .base-icone i > span.badge-orange:hover {
    background-color: var(--primary-color);
}

.base-topmenu-pj .opts-topo .base-icone i > span.badge-orange:hover {
    background-color: var(--primary-color);
}

.base-topmenu .opts-topo .base-icone i > span.badge-icone {
    float: left;
    position: relative;
    margin-right: -5px;
}

.base-topmenu-pj .opts-topo .base-icone i > span.badge-icone {
    float: left;
    position: relative;
    margin-right: -5px;
}

.base-topmenu .item {
    display: flex;
    margin: 0 24px 0 0;
}

.base-topmenu-pj .item {
    display: flex;
    margin: 0 24px 0 0;
}

.base-topmenu .item .base-icone,
.base-topmenu .item .desc {
    flex: auto;
}

.base-topmenu-pj .item .base-icone,
.base-topmenu-pj .item .desc {
    flex: auto;
}

.base-topmenu .item .base-icone {
    font-size: 24px;
    margin: 10px 0 0 0;
    position: relative;
}

.base-topmenu-pj .item .base-icone {
    font-size: 24px;
    margin: 10px 0 0 0;
    position: relative;
}

.base-topmenu .item .base-icone.off {
    color: var(--contrast-color);
}

.base-topmenu-pj .item .base-icone.off {
    color: var(--contrast-color);
}

.base-topmenu .item .desc {
    color: var(--tertiary-color);
    margin: 15px 0 0 6px;
    font-size: 14px;
    line-height: 14px;
}

.base-topmenu-pj .item .desc {
    color: var(--white-color);
    margin: 15px 0 0 6px;
    font-size: 14px;
    line-height: 14px;
}

.base-topmenu .wrapper-userinfo {
    position: relative;
    padding-top: 5px;
}

.base-topmenu-pj .wrapper-userinfo {
    position: relative;
    padding-top: 5px;
}

.base-topmenu input.dropdown[type="checkbox"] {
    display: none;
}

.base-topmenu-pj input.dropdown[type="checkbox"] {
    display: none;
}

.base-topmenu label {
    width: 100%;
    display: flex;
    cursor: pointer;
    position: relative;
    z-index: 2;
    -webkit-transition: border-radius 0.1s linear, background 0.1s linear, z-index 0s linear;
    -webkit-transition-delay: 0.8s;
}

.base-topmenu-pj label {
    width: 100%;
    display: flex;
    cursor: pointer;
    position: relative;
    z-index: 2;
    -webkit-transition: border-radius 0.1s linear, background 0.1s linear, z-index 0s linear;
    -webkit-transition-delay: 0.8s;
}

.base-topmenu label .avatar,
.base-topmenu label .user {
    flex: auto;
}

.base-topmenu-pj label .avatar,
.base-topmenu-pj label .user {
    flex: auto;
}

.base-topmenu label .avatar {
    margin: 0 0 0 18px;
}

.base-topmenu-pj label .avatar {
    margin: 0 0 0 18px;
}

.base-topmenu label .user {
    margin: 0px 2px 0 0;
    padding-top: 3px;
    padding-bottom: 5px;
}

.base-topmenu-pj label .user {
    margin: 0px 2px 0 0;
    padding-top: 3px;
    padding-bottom: 5px;
}

.base-topmenu label h4 {
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    /*margin: 8px 0 0 0;*/
}

.base-topmenu-pj label h4 {
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    /*margin: 8px 0 0 0;*/
}

.base-topmenu label p {
    font-size: 14px;
    margin: 0 0 0 0;
}

.base-topmenu-pj label p {
    font-size: 14px;
    margin: 0 0 0 0;
}

.base-topmenu label p span {
    margin: 0 0 0 0px;
}

.base-topmenu-pj label p span {
    margin: 0 0 0 0px;
}

.base-topmenu label p span a {
    color: var(--primary-color);
    pointer-events: none;
}

.base-topmenu-pj label p span a {
    color: var(--primary-color);
    pointer-events: none;
}

.base-topmenu label .caret {
    margin: 20px 15px 0 0;
    border-top: 5px solid\9;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}

.base-topmenu-pj label .caret {
    margin: 20px 15px 0 0;
    border-top: 5px solid\9;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}

.base-topmenu .wrapper-userinfo .user {
    overflow: hidden;
}

.base-topmenu-pj .wrapper-userinfo .user {
    overflow: hidden;
    color: var(--white-color);
}

.base-topmenu .wrapper-userinfo .user h4 {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin: 3px 0 0;
}

.base-topmenu-pj .wrapper-userinfo .user h4 {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin: 3px 0 0;
    color: var(--white-color);
}

.base-topmenu .wrapper-userinfo .user p.conta-usuario {
    font-size: 10px;
    margin-bottom: -2px;
}

.base-topmenu-pj .wrapper-userinfo .user p.conta-usuario {
    font-size: 10px;
    margin-bottom: -2px;
}

.base-topmenu .wrapper-userinfo .user p.nome-usuario {
    font-size: 0.7em;
    margin-bottom: -6px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.base-topmenu-pj .wrapper-userinfo .user p.nome-usuario {
    font-size: 0.7em;
    margin-bottom: -6px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.base-topmenu .wrapper-userinfo > ul {
    list-style: none;
    background: var(--white-color);
    position: absolute;
    width: 100%;
    top: -600px;
    z-index: 1;
    padding: 84px 0 0 0;
    -webkit-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.36);
    -moz-box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.36);
    box-shadow: 0 0 60px 0 rgba(204, 204, 204, 0.36);
    transition: all 0.6s ease;
    transition-delay: 0.6s;
}

.base-topmenu-pj .wrapper-userinfo > ul {
    list-style: none;
    position: absolute;
    width: 100%;
    top: -600px;
    z-index: 1;
    padding: 84px 0 0 0;
    transition: all 0.6s ease;
    transition-delay: 0.6s;
}

    .base-topmenu-pj .wrapper-userinfo > ul :first-child {
        background: var(--white-color);
    }

.base-topmenu .wrapper-userinfo ul ul {
    padding: 0;
    /*opacity: 0;*/
    display: block;
    list-style: none;
    overflow-y: auto;
    /*background-color: var(--contrast-color);*/
    width: 100%;
    max-height: 201px;
    transition: all 0.4s ease;
    transition-delay: 0.1s;
}

.base-topmenu-pj .wrapper-userinfo ul ul {
    padding: 0;
    /*opacity: 0;*/
    display: block;
    list-style: none;
    overflow-y: auto;
    /*background-color: var(--contrast-color);*/
    width: 100%;
    max-height: 201px;
    transition: all 0.4s ease;
    transition-delay: 0.1s;
}

.base-topmenu .wrapper-userinfo ul ul::-webkit-scrollbar {
    width: 6px;
    opacity: 0;
    background-color: var(--contrast-color);
}

.base-topmenu-pj .wrapper-userinfo ul ul::-webkit-scrollbar {
    width: 6px;
    opacity: 0;
    background-color: var(--contrast-color);
}

.base-topmenu .wrapper-userinfo ul ul::-webkit-scrollbar-thumb {
    opacity: 0;
    background-color: var(--contrast-color);
}

.base-topmenu-pj .wrapper-userinfo ul ul::-webkit-scrollbar-thumb {
    opacity: 0;
    background-color: var(--contrast-color);
}

.base-topmenu .wrapper-userinfo input[type="checkbox"]:checked ~ ul {
    display: block;
    top: -21px;
    transition-delay: 0.2s;
}

.base-topmenu-pj .wrapper-userinfo input[type="checkbox"]:checked ~ ul {
    display: block;
    top: -21px;
    transition-delay: 0.2s;
}

.base-topmenu .wrapper-userinfo input[type="checkbox"] + label .caret {
    display: block;
    transition: all 0.2s ease;
    transform: rotate(0);
}

.base-topmenu-pj .wrapper-userinfo input[type="checkbox"] + label .caret {
    display: block;
    transition: all 0.2s ease;
    transform: rotate(0);
}

.base-topmenu .wrapper-userinfo input[type="checkbox"]:checked + label .caret {
    transition: all 0.2s ease;
    transform: rotate(180deg);
}

.base-topmenu-pj .wrapper-userinfo input[type="checkbox"]:checked + label .caret {
    transition: all 0.2s ease;
    transform: rotate(180deg);
}

.base-topmenu .wrapper-userinfo ul li {
    opacity: 0;
    transition: all 0.6s ease;
    transition-delay: 0.1s;
}

.base-topmenu-pj .wrapper-userinfo ul li {
    opacity: 0;
    transition: all 0.6s ease;
    transition-delay: 0.1s;
}

.base-topmenu .wrapper-userinfo input[type="checkbox"]:checked ~ ul ul,
.base-topmenu
.wrapper-userinfo
input[type="checkbox"]:checked ~ ul
ul::-webkit-scrollbar,
.base-topmenu
.wrapper-userinfo
input[type="checkbox"]:checked ~ ul
ul::-webkit-scrollbar-thumb {
    opacity: 1;
    transition-delay: 0.6s;
}

.base-topmenu-pj .wrapper-userinfo input[type="checkbox"]:checked ~ ul ul,
.base-topmenu-pj
.wrapper-userinfo
input[type="checkbox"]:checked ~ ul
ul::-webkit-scrollbar,
.base-topmenu-pj
.wrapper-userinfo
input[type="checkbox"]:checked ~ ul
ul::-webkit-scrollbar-thumb {
    opacity: 1;
    transition-delay: 0.6s;
}

.base-topmenu .wrapper-userinfo input[type="checkbox"]:checked ~ ul li {
    opacity: 1;
    transition-delay: 0.6s;
}

.base-topmenu-pj .wrapper-userinfo input[type="checkbox"]:checked ~ ul li {
    opacity: 1;
    transition-delay: 0.6s;
}

.base-topmenu .wrapper-userinfo ul li input.selectAcc[type="radio"] {
    display: none;
}

.base-topmenu-pj .wrapper-userinfo ul li input.selectAcc[type="radio"] {
    display: none;
}

.base-topmenu .wrapper-userinfo ul li input.selectAcc[type="radio"] + label {
    position: relative;
    margin: 0;
    width: 100%;
    display: block;
    padding: 18px 24px 18px 60px;
    border-bottom: 1px solid var(--contrast-color);
    transition: all 0.4s ease;
}

.base-topmenu-pj .wrapper-userinfo ul li input.selectAcc[type="radio"] + label {
    position: relative;
    margin: 0;
    width: 100%;
    display: block;
    padding: 18px 24px 18px 60px;
    border-bottom: 1px solid var(--contrast-color);
    transition: all 0.4s ease;
}

.base-topmenu
.wrapper-userinfo
ul
li
input.selectAcc[type="radio"] + label
.mark {
    position: absolute;
    top: 27px;
    left: 24px;
    background: var(--contrast-color);
    border: 2px solid var(--contrast-color);
    border-radius: 60px;
    width: 12px;
    height: 12px;
}

.base-topmenu-pj
.wrapper-userinfo
ul
li
input.selectAcc[type="radio"] + label
.mark {
    position: absolute;
    top: 27px;
    left: 24px;
    background: var(--contrast-color);
    border: 2px solid var(--contrast-color);
    border-radius: 60px;
    width: 12px;
    height: 12px;
}

.base-topmenu
.wrapper-userinfo
ul
li
input.selectAcc[type="radio"]:checked + label
.mark {
    background: var(--primary-color);
    border: 2px solid var(--contrast-color);
}

.base-topmenu-pj
.wrapper-userinfo
ul
li
input.selectAcc[type="radio"]:checked + label
.mark {
    background: var(--primary-color);
    border: 2px solid var(--contrast-color);
}

.base-topmenu .wrapper-userinfo ul li input.selectAcc[type="radio"] + label h4 {
    margin: 0;
    padding: 0;
}

.base-topmenu-pj .wrapper-userinfo ul li input.selectAcc[type="radio"] + label h4 {
    margin: 0;
    padding: 0;
}

.base-topmenu .wrapper-userinfo ul li input.selectAcc[type="radio"] + label p {
    font-size: 12px;
    color: var(--tertiary-color);
}

.base-topmenu-pj .wrapper-userinfo ul li input.selectAcc[type="radio"] + label p {
    font-size: 12px;
    color: var(--tertiary-color);
}

.base-topmenu
.wrapper-userinfo
ul
li
input.selectAcc[type="radio"] + label
span {
    margin: 0 0 0 8px;
}

.base-topmenu-pj
.wrapper-userinfo
ul
li
input.selectAcc[type="radio"] + label
span {
    margin: 0 0 0 8px;
}

.base-topmenu
.wrapper-userinfo
ul
li
input.selectAcc[type="radio"] + label:hover {
    background: var(--concrete);
}

.base-topmenu-pj
.wrapper-userinfo
ul
li
input.selectAcc[type="radio"] + label:hover {
    background: var(--concrete);
}

.base-topmenu .wrapper-userinfo ul li > a {
    position: relative;
    margin: 0;
    width: 100%;
    display: block;
    padding: 18px 24px;
    border-bottom: 1px solid var(--contrast-color);
    transition: all 0.4s ease;
}

.base-topmenu-pj .wrapper-userinfo ul li > a {
    position: relative;
    margin: 0;
    width: 100%;
    display: block;
    padding: 18px 24px;
    border-bottom: 1px solid var(--contrast-color);
    transition: all 0.4s ease;
}

.base-topmenu .wrapper-userinfo ul li > a:hover {
    background: var(--concrete);
}

.base-topmenu-pj .wrapper-userinfo ul li > a:hover {
    background: var(--concrete);
}

.base-topmenu .item.checarSaldo input.dropdown.saldo[type="checkbox"] {
    display: none;
}

.base-topmenu-pj .item.checarSaldo input.dropdown.saldo[type="checkbox"] {
    display: none;
}

.base-topmenu .item.checarSaldo input.dropdown.saldo[type="checkbox"] + label {
    font-weight: normal;
}

.base-topmenu-pj .item.checarSaldo input.dropdown.saldo[type="checkbox"] + label {
    font-weight: normal;
}

.base-topmenu
.item.checarSaldo
input.dropdown.saldo[type="checkbox"] + label
.base-icone:before {
    content: "";
    position: absolute;
    top: 17px;
    left: -6px;
    width: 36px;
    height: 2px;
    background: var(--contrast-color);
    transform: rotate(-140deg);
    display: block;
}

.base-topmenu-pj
.item.checarSaldo
input.dropdown.saldo[type="checkbox"] + label
.base-icone:before {
    content: "";
    position: absolute;
    top: 17px;
    left: -6px;
    width: 36px;
    height: 2px;
    background: var(--white-color);
    transform: rotate(-140deg);
    display: block;
}

.base-topmenu
.item.checarSaldo
input.dropdown.saldo[type="checkbox"]:checked + label
.base-icone {
    color: var(--primary-color);
}

.base-topmenu-pj
.item.checarSaldo
input.dropdown.saldo[type="checkbox"]:checked + label
.base-icone {
    color: var(--white-color);
}

.base-topmenu
.item.checarSaldo
input.dropdown.saldo[type="checkbox"]:checked + label
.base-icone:before {
    display: none;
}

.base-topmenu-pj
.item.checarSaldo
input.dropdown.saldo[type="checkbox"]:checked + label
.base-icone:before {
    display: none;
}


.base-saldo {
    top: 0;
    width: 100%;
    position: fixed;
    vertical-align: bottom;
    margin: 0 0 0 0;
    background: var(--white-color);
    padding: 12px 0;
    z-index: 960;
    color: var(--dark-color);
    transform: translate(0, -108px);
    -webkit-transition: all 0.4s cubic-bezier(1, 0.01, 0, 1);
    transition: all 0.4s cubic-bezier(1, 0.01, 0, 1);
}

    .base-saldo.open {
        transform: translate(0, 74px);
        box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    }

.base-cardsaldo {
    color: var(--tertiary-color);
    padding-left: 40px;
}

    .base-cardsaldo .infos {
        font-weight: 400;
        display: flex;
        padding: 12px 36px 18px 0px;
        align-items: flex-end;
    }

        .base-cardsaldo .infos .base-icone {
            font-size: 30px;
            color: var(--primary-color);
            margin: 3px 24px 0 0;
        }

        .base-cardsaldo .infos h3 {
            font-size: 10px;
            color: var(--dark-color);
            font-weight: bold !important;
            text-transform: uppercase;
            margin: 0;
            padding: 0;
        }

        .base-cardsaldo .infos p {
            font-size: 12px;
            font-size: normal;
            text-transform: none;
            letter-spacing: 0;
            margin: 0;
            padding: 0;
        }

        .base-cardsaldo .infos h4 {
             
            font-size: 18px;
        }

            .base-cardsaldo .infos h4 span {
                font-size: 14px;
            }

.base-topmenu .btn-padrao {
    margin: 14px 0 0 0;
    padding: 4px 0 2px;
}

.selectCount {
    background: var(--concrete) !important;
}

    .selectCount h4 {
        color: var(--dark-color) !important;
    }


@media (max-width: 767px) {
    .base-topmenu {
        padding: 14px 0;
        top: 0;
        left: 0;
        box-shadow: 0 0 60px rgba(0,0,0,0.3);
    }

        .base-topmenu .base-logotipo {
            top: 22px;
            z-index: 1004;
        }

        .base-topmenu .col-xs-12 {
            padding: 0;
        }

        .base-topmenu label {
            width: 74%;
            margin: 0;
            padding: 0 0 0 30.7%;
        }

            .base-topmenu label .caret {
                position: fixed;
                right: 55px;
            }

            .base-topmenu label .user {
                padding-bottom: 5px;
            }

        .base-topmenu .wrapper-userinfo ul ul {
            width: 100%;
            top: 0;
            left: 0;
            transform: translate(0,0px);
            padding: 0px 0 0 0;
            transition: all .3s ease;
            transition-delay: .4s;
        }

        .base-topmenu .wrapper-userinfo ul {
            transform: translate(0,-405px);
        }

            .base-topmenu .wrapper-userinfo ul li {
                opacity: 0;
                transition: all .4s ease;
                transition-delay: .05s;
            }

        .base-topmenu .wrapper-userinfo input[type=checkbox]:checked ~ ul {
            top: -5px !important;
            left: 0;
            transform: translate(0,-14px)
        }

        .base-topmenu .wrapper-userinfo input[type=checkbox] ~ ul li:first-child label {
            border-top: 1px solid var(--contrast-color);
        }

        .base-topmenu label .user {
            margin: 0px 0px 4px 0;
        }

        .base-topmenu label h4 {
            font-size: 12px;
        }

        .base-topmenu label p {
            font-size: 12px;
        }
}

@media (min-width: 768px) and (max-width: 991px) {
    .base-topmenu {
        padding: 12px 0;
        top: 0;
        left: 0;
        box-shadow: 0 0 60px rgba(0,0,0,0.3);
    }

        .base-topmenu .base-logotipo {
            top: 22px;
            z-index: 1004;
        }

        .base-topmenu .container {
            width: 100%;
            margin: 0;
            padding: 0;
        }

        .base-topmenu .col-xs-12 {
            padding: 0;
        }

        .base-topmenu label {
            width: 288px;
            margin: 0;
            padding: 0 24px;
        }

            .base-topmenu label .avatar {
                width: 55px;
                flex: none !important;
            }

        .base-topmenu .wrapper-userinfo .user {
            padding-right: 30px;
        }

        .base-topmenu label .caret {
            position: absolute;
            right: 0;
        }

        .base-topmenu .wrapper-userinfo ul ul {
            width: 100%;
            top: 0;
            left: 0;
            transform: translate(0,0px);
            padding: 0px 0 0 0;
            transition: all .3s ease;
            transition-delay: .4s;
        }

        .base-topmenu .wrapper-userinfo ul {
            transform: translate(0,-405px);
        }

            .base-topmenu .wrapper-userinfo ul li {
                opacity: 0;
                transition: all .4s ease;
                transition-delay: .05s;
            }

        .base-topmenu .wrapper-userinfo input[type=checkbox]:checked ~ ul {
            top: -5px !important;
            left: 0;
            transform: translate(0,-14px)
        }

        .base-topmenu .wrapper-userinfo input[type=checkbox] ~ ul li:first-child label {
            border-top: 1px solid var(--contrast-color);
        }

        .base-topmenu label .user {
            margin: 0px 0px 4px 0;
        }

        .base-topmenu label h4 {
            font-size: 12px;
        }

        .base-topmenu label p {
            font-size: 12px;
        }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .base-cardsaldo .infos {
        padding: 12px 20px 18px 20px;
    }

    .base-topmenu label .user {
        margin: -7px 2px 0 0;
        width: 120px;
    }

    .base-topmenu label h4 {
        font-size: 10px;
        font-weight: bold;
        text-transform: uppercase;
        margin: 8px 0px 0px 0px;
        white-space: nowrap;
        overflow: hidden;
    }

    .base-topmenu label p {
        font-size: 10px;
        margin: 0 0 0 0;
    }

    .base-topmenu .wrapper-userinfo ul li input.selectAcc[type=radio] + label {
        position: relative;
        margin: 0;
        width: 100%;
        display: block;
        padding: 18px 24px 18px 44px;
        border-bottom: 1px solid var(--contrast-color);
        transition: all .4s ease;
    }

    .avatar img {
        height: 40px;
    }
}

.modal-header .close {
    margin-top: -2px;
    font-size: 40px !important;
    font-weight: 100 !important;
    color: var(--contra-color) !important;
    opacity: 1 !important;
    margin-right: 9px !important;
    margin-top: -1px !important;
    text-align: end;
}
/* CSS TOPO - FIM */

.row.flex-align {
    align-items: center;
}

.deposito-boleto {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: var(--primary-color);
    border-radius: 30px;
    border: 2px solid var(--primary-color);
    background-color: transparent;
    margin: 24px 0 0 0;
    padding: 6px 0;
    text-transform: uppercase;
}

.deposito-boleto span {
    font-size: 18px;
    margin: 0 12px 0 0;
}

    .deposito-boleto:hover {
        color: var(--white-color);
        background-color: var(--primary-color);
        box-shadow: 0 2px 6px rgba(244,130,30,.6);
    }

.page-interna.conta .valor-conta-total {
    margin: 0 0 0 0;
    padding: 15px 0 20px 0;
}

.page-interna.conta .saldo-total,
.page-interna.conta .saldo-total span {
    font-size: 24px;
    text-align: right;
    color: var(--success-color);
}

.page-interna.conta .escolhe-mes {
    margin: 48px 0 -60px -15px;
}

.page-interna.conta .escolhe-mes .segunda-via {
    margin: -18px 0 0 0
}

.page-interna.conta .escolhe-mes-box {
    margin: 48px 0 -90px -15px;
}

.page-interna.conta .valor-conta-total .btn-deposito {
    border: 2px solid var(--contra-color);
}

.page-interna.conta .base-tabela {
    margin-bottom: 100px;
}
/*** MODAL HEADER ***/
.modal.selfie .modal-header {
    border: none;
    padding: 15px 24px 0;
}

.modal.selfie .modal-header .btn-fechar {
    float: right;
    font-size: 20px;
}

/*** MODAL BODY ***/
.modal.selfie .modal-body {
    margin: 0;
    padding: 0 24px 24px 24px;
}

.modal.selfie .modal-body .form-custom {
    margin: 0 0 12px 0;
}

.modal.selfie .modal-body .form-custom.single {
    margin: 0 8%;
}

.modal.selfie .modal-body .form-custom input {
    margin: 0;
}

.modal.selfie .modal-body .text-body {
    text-align: center;
}

.modal.selfie .modal-body .text-body p {
    margin: 0;
    padding: 0;
}

/*** MODAL TITLE ***/

.modal.selfie .modal-body .modal-title {
    text-align: center;
    margin: 0 0 24px 0;
    padding: 0;
}

.modal.selfie .modal-body .modal-title .base-icone {
    font-size: 48px;
    color: var(--primary-color);
    line-height: 30px;
    text-align: center;
    border-radius: 50%;
    width: 108px;
    height: 108px;
    border: 4px solid var(--primary-color);
    margin: 0 auto 24px auto;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal.selfie .modal-body .modal-title h4 {
    font-size: 18px;
    color: var(--primary-color);
    letter-spacing: 1px;
    font-weight: lighter;
    text-transform: uppercase;
    margin: 0;
    padding: 0;
}


.modal.selfie .modal-body .modal-title.success .base-icone,
.modal.selfie .modal-body .modal-title.success h4 {
    color: var(--success-color);
}

.modal.selfie .modal-body .modal-title.success .base-icone {
    border-color: var(--success-color);
}

.modal.selfie .modal-body .modal-title.erro .base-icone,
.modal.selfie .modal-body .modal-title.erro h4 {
    color: var(--erro-color);
}

.modal.selfie .modal-body .modal-title.erro .base-icone {
    border-color: var(--erro-color);
}

/*** ALERT MODAL ***/
.modal.selfie .modal-body .alert-title {
    font-size: 14px;
    color: var(--primary-color);
    font-weight: bolder;
    text-transform: uppercase;
    padding: 8px 15px;
    border-radius: 4px 4px 0 0;
    background-color: rgba(245, 130, 32,.24);
}

.modal.selfie .modal-body .alert-title + .alert {
    border-radius: 0 0 4px 4px;
}

.modal.selfie .modal-body .alert.custom {
    margin: 0;
    background-color: var(--white-color);
    border: 1px solid rgba(245, 130, 32,.24);
}

.modal.selfie .modal-body .alert h4 {
    color: inherit;
    font-size: 16px;
    margin: 0 0 12px 0;
    padding: 0;
}

.modal.selfie .modal-body ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.modal.selfie .modal-body ul li {
    color: var(--tertiary-color);
    margin: 0 0 12px 0;
    padding: 0;
}

.modal.selfie .modal-body ul li:last-child {
    margin: 0;
}

.modal.selfie .modal-body .center-topics {
    color: var(--tertiary-color);
    text-align: center;
}

/*** MODAL FOOTER ***/
.modal.selfie .modal-footer {
    border-top: none;
    text-align: center;
    padding: 0 24px 36px 24px;
}

.modal.selfie .modal-footer .new-code {
    margin: 24px 0 0 0;
}

.modal.selfie .modal-footer .new-code a {
    color: var(--primary-color);
    text-decoration: underline;
}

.modal.selfie .modal-footer .btn {
    display: block;
    width: auto;
    margin: 0 auto;
}

/*** MODAL CAPTURA ***/

.modal.selfie .base-captura {
    position: relative;
    border-radius: 6px;
    margin: 0;
    padding: 2.4%;
    width: 100%;
    height: 600px;
    background-color: var(--dark-color);
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    overflow: hidden;
}

.modal.selfie .base-captura .captura-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(assets/img/mask_selfie.png);
    pointer-events: none;
    z-index: 1;
}

.modal.selfie .btn-captura {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-size: 30px;
    text-align: center;
    border: none;
    outline: none;
    border-radius: 100%;
    width: 60px;
    height: 60px;
    background-color: var(--primary-color);
    margin: 0 auto;
    padding: 0;
    z-index: 2;
}

/*** MODAL TOKEN ***/

.modal.selfie .plate-form {
    text-align: center;
}

.modal.selfie .plate-form .token-form {
    display: inline-block;
    position: relative;
}

.modal.selfie .plate-form .token-form .input-token {
    width: 60px;
    height: 70px;
    border-radius: 9px;
    border: 2px solid var(--contrast-color);
    margin: 0px 10px;
    font-size: 40px;
    font-weight: 900;
    text-align: center;
    padding-top: 7px;
    outline: none;
    color: var(--dark-color);
    display: inline-block;
}

/**** MEDIA QUERIES ****/

@media (max-width: 479px) {

    .modal.selfie .base-captura {
        height: 384px;
    }

    .modal.selfie .plate-form .token-form .input-token {
        margin: 0;
        width: 36px;
        height: 60px;
    }
}

/**************************************************
***************************************************
***************************************************
********************************* 07/01/2019 *****/

.base-header-secao.adesao.invest h3 + p {
    background-color: transparent;
    margin: 0;
    padding: 0;
}

.base-header-secao.adesao.invest.--register {
    height: auto;
    min-height: initial;
    padding: 60px 0;
}

.cs-invest_intro-text {
    margin: 0 0 36px 0;
}

    .cs-invest_intro-text p {
        font-size: 16px; /* Antes: font-size: 14px; */
        color: var(--dark-color); /* Antes: color: var(--tertiary-color); */
    }

    .cs-invest_intro-text .btn-padrao.laranja.--aderir {
        width: 192px;
    }

.box-white.invest {
    padding: 30px;
    min-height: 350px;
    border-radius: 8px;
}

    .box-white.invest.--active {
        min-height: auto;
    }

    .box-white.invest h4.adesao-title {
        font-size: 18px;
        color: var(--dark-color);
    }

    .box-white.invest.investimentos h4.adesao-title {
        font-size: 14px;
        color: var(--primary-color);
        margin: 0 0 6px 0;
        font-weight: 700;
    }

    .box-white.invest.--active h4.adesao-title {
        color: var(--primary-color);
    }

    .box-white.invest > p {
        font-size: 14px;
        color: var(--tertiary-color);
        margin: 0;
        padding: 0;
    }

.cs-invest_graphic--align {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

.cs-invest_graphic {
    margin: 18px 0 30px 0;
    padding: 0;
}

    .cs-invest_graphic .cs-invest_graphic-value {
        font-size: 14px;
        color: var(--tertiary-color);
        font-weight: bold;
        margin: 0 0 6px 0;
        padding: 0;
    }

    .cs-invest_graphic .cs-invest_graphic-mockup {
        display: flex;
        align-items: flex-end;
        justify-content: flex-start;
    }

        .cs-invest_graphic .cs-invest_graphic-mockup .cs-invest_graphic-mockup--bar {
            width: 72px;
            min-height: 72px;
            background-color: var(--tertiary-color);
        }

        .cs-invest_graphic .cs-invest_graphic-mockup .cs-invest_graphic-mockup--name {
            font-size: 12px;
            color: var(--tertiary-color);
            width: 84px;
            margin: 0 0 0 6px;
            padding: 0;
        }

    .cs-invest_graphic.--super-poup .cs-invest_graphic-value,
    .cs-invest_graphic.--super-poup .cs-invest_graphic-mockup .cs-invest_graphic-mockup--name {
        color: var(--primary-color);
    }

    .cs-invest_graphic.--super-poup .cs-invest_graphic-mockup .cs-invest_graphic-mockup--bar {
        height: 96px;
        background-color: var(--primary-color);
    }

.cs-invest_graphic_investimentos {
    position: unset;
    width: 50%;
    height: 200px;
    margin: 0px 0px 0px 0px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url('img/cross_selling/invest/grafico_investimentos.svg');
}


.cs-invest_rentabilidade .cs-invest_rentabilidade-value {
    font-size: 24px;
    font-weight: bold;
    color: var(--primary-color);
    margin: 6px 0;
    padding: 0;
}

.cs-invest-bloco-checklist {
    padding-left: 0px;
}

.cs-invest_checklist {
    list-style: none;
    margin: 0px 0;
    padding: 0;
    width: 139%;
    color: var(--tertiary-color);
}

    .cs-invest_checklist li {
        margin: 0 0 12px 0;
        padding: 0;
        display: flex;
    }

        .cs-invest_checklist li:last-child {
            margin: 0;
            padding: 0;
        }

        .cs-invest_checklist li > i {
            color: #4D4DAF; /* Antes: color: var(--primary-color);*/
            margin: 4px 15px 0 0;
            padding: 0;
        }

.cs-invest_success {
    margin: 0 0 36px 0;
}

    .cs-invest_success .cs-invest_success-text {
        font-size: 24px;
        color: var(--success-color);
        margin: 0;
        padding: 0;
    }

.cs-invest-row-investimentos {
    width: 117%;
}

.cs-invest-adesao-title {
    padding: 10px 0px 16px 18px;
}

    .cs-invest-adesao-title.opcoes-renda {
        font-size: 16px;
        color: var(--dark-color);
        font-weight: 700;
    }

.box-white.invest.investimentos {
    min-height: 139px;
    border-radius: 8px;
    padding: 16px 16px 16px 16px;
}

    .box-white.invest.investimentos p {
        color: var(--tertiary-color);
        font-weight: 400;
    }

.box-white.--active.--success p > span {
    color: var(--success-color);
    font-weight: bold;
}

.cs-invest-form_section {
    margin: 0 0 30px 0;
    padding: 0;
}

    .cs-invest-form_section .cs-invest-form_title {
        font-size: 16px;
        color: var(--primary-color);
        margin: 0 0 12px 0;
        padding: 0;
    }

    .cs-invest-form_section .cs-invest-form_subtitle {
        font-size: 14px;
        color: var(--tertiary-color);
        margin: 0 0 18px 0;
        padding: 0;
    }

.cs-invest-form_input {
    margin: 0 0 18px 0;
}

    .cs-invest-form_input .form-custom,
    .cs-invest-form_input .form-custom input,
    .cs-invest-form_input .form-custom select {
        height: auto;
        margin: 0;
        padding: 0;
    }

    .cs-invest-form_input .form-custom {
        position: relative;
    }

        .cs-invest-form_input .form-custom select {
            padding: 12px 18px;
        }

        .cs-invest-form_input .form-custom .cs-invest-form_chevron {
            position: absolute;
            top: 0;
            right: 0;
            width: 54px;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            pointer-events: none;
        }

            .cs-invest-form_input .form-custom .cs-invest-form_chevron > i {
                font-size: 16px;
                color: var(--primary-color);
                position: relative;
                margin: 0;
                padding: 0;
            }

        .cs-invest-form_input .form-custom input,
        .cs-invest-form_input .form-custom select {
            font-size: 12px;
            padding: 20px 12px 6px 18px;
        }

    .cs-invest-form_input > .form-custom > select {
        padding: 20px 48px 6px 18px;
    }

    .cs-invest-form_input .form-custom input:focus {
        box-shadow: 0 0 0 2px var(--primary-color);
    }

    .cs-invest-form_input .form-custom input + label,
    .cs-invest-form_input .form-custom select + label {
        display: flex;
        align-items: center;
        position: absolute;
        top: 0;
        left: 18px;
        margin: 0;
        padding: 0;
        width: auto;
        height: 100%;
        pointer-events: none;
    }

    .cs-invest-form_input.--with-mask .form-custom input + label,
    .cs-invest-form_input .form-custom input:focus + label,
    .cs-invest-form_input .form-custom input:valid + label,
    .cs-invest-form_input .form-custom select + label {
        font-size: 10px;
        color: var(--tertiary-color);
        top: -10px;
        left: 18px;
    }



    .cs-invest-form_input .form-custom > .cs-invest-form_info {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 0;
        right: 18px;
        width: auto;
        height: 100%;
        font-size: 18px;
        color: var(--primary-color);
    }

        .cs-invest-form_input .form-custom > .cs-invest-form_info > a {
            display: block;
            font-size: 18px;
            color: var(--primary-color);
            text-align: center;
        }

    .cs-invest-form_input .form-custom .cs-invest-form_chevron.--with-info {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 0;
        right: 48px;
        width: auto;
        height: 100%;
        font-size: 18px;
        color: var(--primary-color);
    }

.cs-invest-form_checkbox {
    margin: 12px 0 18px 0;
}

    .cs-invest-form_checkbox .form-custom {
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

        .cs-invest-form_checkbox .form-custom input[type="checkbox"],
        .cs-invest-form_checkbox .form-custom input[type="radio"] {
            position: relative;
            -webkit-appearance: none;
            width: 18px;
            height: 18px;
            border-radius: 5px;
            border: 2px solid var(--contrast-color);
            background-color: var(--white-color);
            outline: none;
            cursor: pointer;
        }

            .cs-invest-form_checkbox .form-custom input[type="checkbox"]:after,
            .cs-invest-form_checkbox .form-custom input[type="radio"]:after {
                content: "\e978";
                font-family: "icomoon";
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 12px;
                color: var(--white-color);
                text-align: center;
                font-weight: bold;
                height: 14px;
                opacity: 0;
            }

            .cs-invest-form_checkbox .form-custom input[type="checkbox"] + label,
            .cs-invest-form_checkbox .form-custom input[type="radio"] + label {
                color: var(--tertiary-color);
                font-weight: normal;
                margin: 4px 0 0 6px;
                padding: 0;
                cursor: pointer;
            }

            .cs-invest-form_checkbox .form-custom input[type="checkbox"]:checked,
            .cs-invest-form_checkbox .form-custom input[type="radio"]:checked {
                border-color: var(--primary-color);
                background-color: var(--primary-color);
            }

                .cs-invest-form_checkbox .form-custom input[type="radio"]:checked:after,
                .cs-invest-form_checkbox .form-custom input[type="checkbox"]:checked:after {
                    opacity: 1;
                }

            .cs-invest-form_checkbox .form-custom input[type="radio"] + label > a,
            .cs-invest-form_checkbox .form-custom input[type="checkbox"] + label > a {
                color: var(--primary-color);
                margin: 0 0 0 6px;
            }

/**** QUIZZ ****/

.cs-invest-form_quizz .cs-invest-form_checkbox .form-custom {
    align-items: flex-start;
    justify-content: flex-start;
    margin: 0 0 12px 0;
    padding: 0;
}

    .cs-invest-form_quizz .cs-invest-form_checkbox .form-custom input[type="radio"] {
        border-radius: 50%;
        width: 18px !important;
        height: 18px;
    }

        .cs-invest-form_quizz .cs-invest-form_checkbox .form-custom input[type="radio"] + label {
            max-width: 768px;
            margin: 3px 0 0 6px;
            padding: 0;
        }

        .cs-invest-form_quizz .cs-invest-form_checkbox .form-custom input[type="radio"]:after {
            font-size: 9px;
        }

/**** PERFIL INVESTIDOR ****/

.cs-invest_profile .cs-invest_profile-title {
    font-size: 16px;
    color: var(--dark-color);
    font-weight: bold;
    margin: 0 0 24px 0;
    padding: 0;
}

.cs-invest_profile .cs-invest_profile-subtitle {
    color: var(--dark-color);
    font-size: 14px;
    font-weight: bold;
    margin: 36px 0 18px 0;
}

.cs-invest_profile .box-white.cs-invest_profile-item {
    font-size: 14px;
    color: var(--dark-color);
    text-align: center;
    border-radius: 18px;
    margin: 0 0 36px 0;
    padding: 30px 24px;
}

    .cs-invest_profile .box-white.cs-invest_profile-item .cs-invest_profile-icon {
        font-size: 72px;
        color: var(--primary-color);
        margin: 0;
        padding: 0;
    }

    .cs-invest_profile .box-white.cs-invest_profile-item > p {
        font-size: 14px;
        margin: 0;
        padding: 0;
    }

.cs-invest_profile .cs-invest_profile-action {
    text-align: center;
    margin: 0 12%;
}

/**** MODAIS CROSSSELLING / INVESTIMENTO ****/

.cs-invest_modal .modal-content .modal-header {
    text-align: center;
}

    .cs-invest_modal .modal-content .modal-header .modal-title {
        color: var(--primary-color);
    }

.cs-invest_modal .modal-content .modal-body {
    padding: 0 24px 12px 24px;
}

.cs-invest_modal .modal-content .modal-footer .btn.btn-link {
    color: var(--primary-color);
    font-weight: bold;
    text-transform: uppercase;
}

.cs-invest_modal.--profile {
    text-align: center;
}

    .cs-invest_modal.--profile .modal-content .modal-header {
        padding: 30px 24px 0 24px;
    }

        .cs-invest_modal.--profile .modal-content .modal-header .cs-invest_modal-icon {
            width: 108px;
            text-align: center;
            margin: 0 auto 24px auto;
            padding: 0
        }

            .cs-invest_modal.--profile .modal-content .modal-header .cs-invest_modal-icon img {
                width: 100%;
            }

    .cs-invest_modal.--profile .modal-content .modal-body {
        padding: 0 60px 24px 60px;
    }

        .cs-invest_modal.--profile .modal-content .modal-body .btn-padrao.laranja {
            width: 252px;
            margin: 24px auto 0 auto;
        }

.cs-invest_modal.--termos .modal-content .modal-header,
.cs-invest_modal.--termos .modal-content .modal-footer {
    border-top: none;
    border-bottom: none;
}

.cs-invest_modal.--termos .modal-content .modal-header {
    text-align: left;
    padding: 15px;
}

    .cs-invest_modal.--termos .modal-content .modal-header .modal-title {
        color: var(--primary-color);
        margin: 0;
        padding: 0;
    }

    .cs-invest_modal.--termos .modal-content .modal-header button.close {
        opacity: 1;
    }

.cs-invest_modal.--termos .modal-content .modal-body {
    padding: 24px 15px;
}

    .cs-invest_modal.--termos .modal-content .modal-body .box-contrato {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        border-radius: 6px;
        background: var(--white-color);
        margin: 24px 0 0 0;
        padding: 30px;
        box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.06);
    }

.cs-invest_modal.--termos .modal-body .box-contrato .box-contrato_icon {
    font-size: 36px;
    color: var(--primary-color);
    margin: 0 18px 0 0;
}

.cs-invest_modal.--termos .modal-content .modal-body .box-contrato .box-contrato_info .box-contrato_info-title {
    font-size: 14px;
    font-weight: normal;
    margin: 0 0 6px 0;
}

.cs-invest_modal.--termos .modal-content .modal-body .box-contrato .box-contrato_info .btn.btn-link {
    color: var(--primary-color);
    text-transform: uppercase;
    margin: 0;
    padding: 0;
}

.cs-invest_modal .modal-content .modal-body .cs-invest-form_checkbox {
    text-align: center;
    margin: 24px 0 0 0;
}

    .cs-invest_modal .modal-content .modal-body .cs-invest-form_checkbox .form-custom {
        justify-content: center;
    }

.cs-invest_modal .modal-content .modal-footer .btn-padrao.laranja {
    width: 252px;
    margin: 0 auto 18px auto;
}

/* MGM - Member get Member */
.cs-invest_posiciona_btn {
    margin-left: 70%;
    margin-top: 16%;
}

.cs-invest_card-mgm {
    margin-top: -50px;
}

.cs-invest_row-mgm {
    margin-bottom: 3.2%;
    margin-left: 0px;
    margin-right: 0px;
}

.cs-invest_base-box-mgm {
    width: 950px;
    height: 80px;
    background: var(--white-color);
    border-radius: 6px;
    margin: -4% 0 0 14%;
    padding: 0 0 0 0;
    box-shadow: 0px 12px 12px 0px rgba(204, 204, 204, 0.6);
    position: relative;
}

    .cs-invest_base-box-mgm .borda-inicial {
        width: 4.78px;
        height: 80px;
        background: var(--primary-color);
        position: absolute;
        border-radius: 6px 0 0 6px;
    }

    .cs-invest_base-box-mgm .base-conteudo {
        padding: 0 14px;
    }

        .cs-invest_base-box-mgm .base-conteudo .conteudo {
            margin-top: 16px;
            font-size: 16px;
        }

.cs-invest_base-conteudo {
    margin-top: 16px;
    font-size: 16px;
    padding: 0 14px;
}

.cs-invest-margin-left-44 {
    margin-left: 44px !important;
}

/****** MEDIA QUERIES ***/
@media (min-width: 200px) and (max-width : 425px) {

    .cs-invest_intro-text .btn-padrao.laranja.--aderir {
        margin: 24px 0 0 0;
    }

    .box-white.invest {
        min-height: auto;
    }

        .box-white.invest.--active .btn-padrao.laranja {
            margin: 24px 0 0 0;
        }

    .cs-invest_row-mgm {
        margin-bottom: 0;
    }

    .cs-invest_card-mgm {
        padding: 0 15px 0 15px;
        margin-top: 27px;
    }

    .cs-invest_base-box-mgm {
        width: unset;
        height: 205px;
        margin: 0 0 0 -36px;
        padding: 0;
        position: relative;
    }

        .cs-invest_base-box-mgm .base-conteudo .conteudo {
            margin-top: 16px;
        }

        .cs-invest_base-box-mgm .borda-inicial {
            height: 205px;
        }

    .box-white.invest {
        padding: 30px;
        width: unset;
        border-radius: 8px;
        margin: 0 0 24px -63px;
    }

        .box-white.invest > p {
            font-size: 12px;
            margin: 0;
            padding: 0;
        }

        .box-white.invest.investimentos {
            min-height: 129px;
            border-radius: 8px;
            padding: 16px 16px 16px 16px;
            margin: 0 0 23px -79px;
            width: unset;
        }

            .box-white.invest.investimentos p {
                color: var(--tertiary-color);
                font-weight: 400;
                font-size: 16px;
            }

    .cs-invest_checklist {
        list-style: none;
        margin: 0px 0;
        padding: 0;
        width: 100%;
        color: var(--tertiary-color);
        font-size: 16px;
    }

    .cs-invest_graphic_investimentos {
        position: unset;
        width: 100%;
        height: 200px;
        margin: 0 0 0 7%;
        background-size: contain;
        background-repeat: no-repeat;
        background-image: url('img/cross_selling/invest/grafico_investimentos.svg');
    }

    .cs-invest-adesao-title.opcoes-renda {
        font-size: 18px;
        color: var(--dark-color);
        font-weight: 700;
        margin-left: -78px;
    }

        .cs-invest-adesao-title.opcoes-renda.vantagens {
            margin-left: -2px;
        }

    .cs-invest_modal-dialog {
        width: 370px;
        margin: 36% auto;
        top: auto;
        bottom: auto;
    }
}

@media (min-width: 426px) and (max-width : 768px) {
    .cs-invest_base-box-mgm {
        width: 763px;
        height: 80px;
        background: var(--white-color);
        border-radius: 6px;
        margin: -6% 0 0 3%;
        padding: 0 0 0 0;
        box-shadow: 0px 12px 12px 0px rgba(204, 204, 204, 0.6);
    }

    .cs-invest_base-conteudo {
        margin-top: 21px;
        padding: 0px 5px 6px 17px;
    }

    .cs-invest_intro-text p {
        font-size: 13px;
    }

    .cs-invest_base-box-mgm .borda-inicial {
        height: 80px;
    }

    .cs-invest_graphic_investimentos {
        position: unset;
        width: 75%;
        height: 200px;
        margin: 1px 0px 0px 24px;
        background-size: contain;
        background-repeat: no-repeat;
        background-image: url('img/cross_selling/invest/grafico_investimentos.svg');
    }

    .box-white.invest.investimentos {
        min-height: 182px;
        border-radius: 8px;
        padding: 14px 14px 14px 14px;
        margin: 0 0 27px 0px;
    }

    .box-white.invest {
        padding: 16px;
        min-height: 370px;
        border-radius: 8px;
    }

        .box-white.invest > p {
            font-size: 12px;
            margin: 0;
            padding: 0;
        }

    .cs-invest_row-mgm {
        margin-bottom: 0;
    }

    .cs-invest_intro-text .btn-padrao.laranja.--aderir {
        margin: 20px 0 0 20px;
    }

    .box-white.invest {
        min-height: 435px;
    }

        .box-white.invest.--active .btn-padrao.laranja {
            margin: 24px 0 0 0;
        }

    .cs-invest_checklist {
        list-style: none;
        margin: 0px 0;
        padding: 0px 0px 0px 0px;
        width: 138%;
        color: var(--tertiary-color);
    }

        .cs-invest_checklist li {
            margin: 0 0 5px 0;
            padding: 0;
            display: flex;
        }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .cs-invest_base-box-mgm {
        width: 827px;
        height: 80px;
        background: var(--white-color);
        border-radius: 6px;
        margin: -4% 0 0 4%;
        padding: 0 0 0 0;
        box-shadow: 0px 12px 12px 0px rgba(204, 204, 204, 0.6);
    }

        .cs-invest_base-box-mgm .base-conteudo .conteudo {
            margin-top: 16px;
            font-size: 14px;
        }

        .cs-invest_base-box-mgm .borda-inicial {
            height: 80px;
        }

    .cs-invest_graphic_investimentos {
        position: unset;
        width: 50%;
        height: 200px;
        margin: 62px 0px 0px 0px;
        background-size: contain;
        background-repeat: no-repeat;
        background-image: url('img/cross_selling/invest/grafico_investimentos.svg');
    }

    .box-white.invest.investimentos {
        min-height: 139px;
        border-radius: 8px;
        padding: 14px 14px 14px 14px;
        margin: 0 0 27px 0px;
    }

    .box-white.invest {
        padding: 16px;
        min-height: 370px;
        border-radius: 8px;
    }

        .box-white.invest > p {
            font-size: 12px;
            margin: 0;
            padding: 0;
        }

    .cs-invest_row-mgm {
        margin-bottom: 0;
    }

    .cs-invest_card-mgm {
        margin-top: 0;
    }

    .cs-invest_posiciona_btn {
        margin-left: 42%;
        margin-top: 18%;
    }

    .cs-invest-row-investimentos {
        width: 105%;
    }

    .cs-invest_intro-text p {
        font-size: 14px;
    }
}
/* FIM - MGM */

.custom-calendar {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.custom-calendar.--disabled {
    color: var(--tertiary-color);
    pointer-events: none;
}

.custom-calendar.--disabled * {
    color: var(--tertiary-color) !important;
}

/***************************************
****************************************
****************************************
**************** CALENDAR HEADER ******/

.custom-calendar__header {
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-calendar__header .custom-calendar__month {
    font-size: 14px;
    color: var(--dark-color);
    font-weight: bold;
    margin: 0;
    padding: 0 48px;
}

.custom-calendar__header .custom-calendar__prev,
.custom-calendar__header .custom-calendar__next {
    display: block;
    font-size: 18px;
    color: var(--primary-color);
    font-weight: bold;
    border: 0px;
    outline: none;
    background-color: transparent;
    transform: translate(0,2px);
}

.custom-calendar__header .custom-calendar__prev {
    text-align: left;
}

.custom-calendar__header .custom-calendar__next {
    text-align: right;
}

/***************************************
****************************************
****************************************
****************** CALENDAR BODY ******/

.custom-calendar__body .custom-calendar__body--item ul.custom-calendar__week,
.custom-calendar__body .custom-calendar__body--item .custom-calendar__days ul.custom-calendar__days--row {
    list-style: none;
}

.custom-calendar__body .custom-calendar__body--item ul.custom-calendar__week > li,
.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li {
    color: var(--dark-color);
    text-align: center;
    flex: 1;
    margin: 0;
    padding: 0;
}

.custom-calendar__body .custom-calendar__body--item ul.custom-calendar__week > li.--weekend,
.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li.--disabled > a {
    pointer-events: none;
    color: var(--contrast-color);
}

.custom-calendar__body .custom-calendar__body--item ul.custom-calendar__week {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: bold;
    margin: 24px 0 12px 0;
    padding: 6px 0;
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days {
    margin: 0 0 24px 0;
    padding: 0;
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 0;
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li {
    position: relative;
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li > input[type="radio"] {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li > input[type="radio"] + label {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-color);
    text-align: center;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    margin: 4px auto;
    padding: 0;
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li:hover > input[type="radio"] + label {
    background-color: var(--contrast-color);
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li > input[type="radio"]:checked + label {
    color: var(--white-color);
    font-weight: bold;
    background-color: var(--primary-color);
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li.--hidden > input[type="radio"] + label {
    opacity: 0;
}

/*** DISABLED STATEs ***/

.custom-calendar.--disabled .custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li.--selected > input[type="radio"] + label {
    color: var(--white-color) !important;
    background-color: var(--tertiary-color);
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li.--disabled {
    pointer-events: none;
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li.--disabled > input[type="radio"] {
    pointer-events: none;
}

.custom-calendar__body .custom-calendar__body--item .custom-calendar__days .custom-calendar__days--row > li.--disabled > input[type="radio"] + label {
    color: var(--contrast-color);
    pointer-events: none;
}

.text-underline {
    text-decoration: underline;
}

.policred_section {
    padding: 36px 0;
}

.policred_section-title {
    font-size: 30px;
    color: var(--primary-color);
    margin: 0 0 12px 0;
}

.policred_section-subtitle {
    font-size: 16px;
    color: var(--dark-color);
    margin: 0;
    padding: 0;
}

.box-analise {
    margin: 36px 0 0 0;
}

.box-analise_cartao-img {
    width: 216px;
    height: 134px;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url(/assets/img/politica-credito/cartao-banco-bmg.png);
}

.box-analise_content-entry p {
    font-size: 14px;
    color: var(--tertiary-color);
    margin: 0;
    padding: 0;
}

.box-analise_content-entry h3 {
    font-size: 18px;
    color: var(--primary-color);
    line-height: normal;
    margin: 24px 0;
    padding: 0;
}

.base-header-secao.cartoes .box-analise_content-entry .btn-padrao.laranja {
    margin: 0 !important;
}

.policred_box {
    border-radius: 18px;
    margin: 36px 0 0 0;
    padding: 36px;
}

.policred_box .policred_box-subtitle {
    font-size: 18px;
    color: var(--primary-color);
    margin: 0 0 24px 0;
    padding: 0;
}

.policred_box .policred_box-subtitle span.policred_box-status-alert {
    color: var(--erro-color);
}

.policred_box.--dicas ul.dicas-list {
    list-style: none;
    margin: 24px 0 0 0;
    padding: 0;
}

.policred_box.--dicas ul.dicas-list > .dicas-list_item {
    margin: 0 0 8px 0;
}

.policred_box.--upload {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    min-height: 201px;
}

.policred_upload-item {
    position: relative;
    margin: 0 0 18px 0;
    padding: 0;
}

.policred_upload-item input[type=file] {
    -webkit-appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
}

.policred_upload-item input[type=file] + label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
}

.policred_upload-item input[type=file] + label > .upload-icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--primary-color);
    text-align: center;
    border-radius: 50%;
    border: 2px dotted var(--primary-color);
    width: 48px;
    height: 48px;
    margin: 0 12px 0 0;
    padding: 0;
}

.policred_upload-item.upload-done input[type=file] + label > .upload-icon:after {
    content: "\e930";
    position: absolute;
    bottom: -4px; right: -8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: var(--white-color);
    text-align: center;
    font-family: "icomoon";
    border-radius: 50%;
    width: 24px; height: 24px;
    background-color: var(--primary-color);
}

.policred_upload-item input[type=file] + label > .upload-text {
    font-size: 14px;
    font-weight: 400;
    color: var(--tertiary-color);
    max-width: 180px;
    margin: 0;
    padding: 0;
}

.policred_action-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 24px 0 0 0;
}

.policred_action-bar .btn-padrao {
    font-size: 12px;
    text-align: center;
    margin: 0;
    padding: 12px;
    width: 204px;
    height: auto;
}

.policred_action-bar .btn-padrao.laranja.outline {
    color: var(--primary-color);
    margin: 0 12px 0 0;
    border: 2px solid var(--primary-color);
    background-color: transparent;
    background-image: none;
}

.policred_action-bar .btn-padrao.laranja.outline:hover {
    color: var(--white-color);
    background-color: var(--primary-color);
}

/**** STATUS SOLICITACAO ****/

.policred_status-plate {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 48px 0 0 0;
    padding: 0;
}

.policred_status-item {
    position: relative;
    flex: 1 auto;
    margin: 0 18px 0 0;
    padding: 0;
}

.policred_status-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--white-color);
    width: 54px;
    height: 36px;
    z-index: 2;
}

.policred_status-item:after {
    content: "";
    position: absolute;
    top: 17px;
    left: 0;
    background-color: var(--contrast-color);
    width: 100%;
    height: 2px;
    z-index: 1;
}

.policred_status-item:last-child {
    flex: 1;
}

.policred_status-item:last-child:before,
.policred_status-item:last-child:after {
    display: none;
}

.policred_status-icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--white-color);
    text-align: center;
    border-radius: 50%;
    background-color: var(--contrast-color);
    width: 36px;
    height: 36px;
    z-index: 3;
}

.policred_status-text {
    font-size: 12px;
    margin: 12px 0 0 0;
    padding: 0;
}

.policred_status-date {
    margin: 0;
    padding: 0;
}

/** WAITING **/
.policred_status-item.--waiting .policred_status-icon {
    background-color: var(--primary-color);
}

.policred_status-item.--waiting .policred_status-text,
.policred_status-item.--waiting .policred_status-date {
    color: var(--primary-color);
}

/** OK **/
.policred_status-item.--ok .policred_status-icon {
    background-color: var(--success-color);
}

.policred_status-item.--ok .policred_status-text,
.policred_status-item.--ok .policred_status-date {
    color: var(--success-color);
}

/** ERROR **/
.policred_status-item.--danger .policred_status-icon {
    background-color: var(--erro-color);
}

.policred_status-item.--danger .policred_status-text,
.policred_status-item.--danger .policred_status-date {
    color: var(--erro-color);
}

/***************************************
****************** MEDIA QUERIES*******/

@media (max-width: 768px) {

    .box-analise {
        text-align: center;
    }

    .box-analise_cartao-img {
        margin: 0 auto 36px auto;
    }

    .policred_box {
        margin: 0;
    }

    /**** STATUS SOLICITACAO ****/

    .policred_status-plate {
        flex-direction: column;
        margin: 48px 0 0 0;
        padding: 0;
    }

    .policred_status-item {
        margin: 0 0 0 0;
        padding: 0 0 60px 0;
    }

        .policred_status-item:before {
            width: 36px;
        }

        .policred_status-item:after {
            top: 0;
            left: 17px;
            width: 2px;
            height: 100%;
        }

    .policred_status-text,
    .policred_status-date {
        margin: 0;
        padding: 0 0 0 48px;
    }

    .policred_status-text {
        margin: -36px 0 0 0;
    }
}

.box-desbloqueio-de-cartao {
    margin-top: 65px
}

    .box-desbloqueio-de-cartao img {
        float: left;
        margin-right: 50px
    }

    .box-desbloqueio-de-cartao h3 {
        font-size: 18px;
        color: var(--primary-color);
        margin-bottom: 23px
    }

    .box-desbloqueio-de-cartao p {
        font-size: 14px;
        margin-bottom: 40px
    }

        .box-desbloqueio-de-cartao p:last-child {
            margin-bottom: 0;
            line-height: 50px
        }

        .box-desbloqueio-de-cartao p a:not(.btn-padrao) {
            text-decoration: underline
        }

        .box-desbloqueio-de-cartao p .btn-padrao.laranja {
            width: auto;
            display: inline-block;
            float: right;
            line-height: 12px
        }

.card-name.bloqueado{position: relative;}
.card-name.bloqueado h4, .card-name.bloqueado p {
    flex: none;
    color: var(--erro-color)
}

.card-name.bloqueado .img-cartao-css {
    height: 55px;
    background-image: url(/assets/img/cadeado-vermelho.svg)
}

.card-name.bloqueado .btn-padrao.laranja.desbloquear {
    font-size: 12px;
    height: 45px;
    margin: -5px 12px 0
}

    .card-name.bloqueado .aviso {
        font-size: 13px;
        margin-left: 24px;
        position: absolute;
        top: 22px;
        left: 43px;
    }

.card-name.bloqueado .btn-padrao.laranja.desbloquear {
    font-size: 12px;
    line-height: 20px;
    height: 45px;
    margin: -5px 12px 0
}

.card-name.ativo p.aviso {
    font-size: 13px;
    color: var(--success-color);
    margin-left: 24px
}

.card-name.bloqueado h4, .card-name.bloqueado p {
    flex: none;
    color: var(--erro-color)
}

.card-name.bloqueado .img-cartao-css {
    height: 55px;
    background-image: url(/assets/img/cadeado-vermelho.svg)
}

.cartao-select button.expand {
    margin: -1px 0 0 9px;
}

.box-solicitar-segunda-via {
    margin-top: 65px
}

    .box-solicitar-segunda-via img {
        float: left;
        margin-right: 50px
    }

    .box-solicitar-segunda-via h3 {
        font-size: 18px;
        color: var(--primary-color);
        margin-bottom: 23px
    }

    .box-solicitar-segunda-via p {
        font-size: 14px;
        margin-bottom: 12px
    }

    .box-solicitar-segunda-via .address-list {
        float: left;
        width: 520px
    }

        .box-solicitar-segunda-via .address-list li {
            list-style: none;
            margin-bottom: 12px
        }

            .box-solicitar-segunda-via .address-list li a {
                display: block;
                border: 1px solid var(--contrast-color);
                padding: 12px;
                border-radius: 20px
            }

                .box-solicitar-segunda-via .address-list li a.selected, .box-solicitar-segunda-via .address-list li a:hover {
                    border-color: var(--primary-color)
                }

            .box-solicitar-segunda-via .address-list li p {
                font-size: 10px;
                color: var(--tertiary-color);
                margin-bottom: 0;
                line-height: 14px
            }

                .box-solicitar-segunda-via .address-list li p span {
                    font-size: 14px;
                    color: var(--dark-color)
                }

    .box-solicitar-segunda-via .btn-padrao.laranja.solicitar-segunda-via {
        float: right;
        width: 250px;
    }

.box-perdi-roubaram {
    margin-top: 65px
}

    .box-perdi-roubaram img {
        float: left;
        margin-right: 50px
    }

    .box-perdi-roubaram h3 {
        font-size: 18px;
        color: var(--primary-color);
        margin-bottom: 23px
    }

    .box-perdi-roubaram p {
        font-size: 14px;
        margin-bottom: 12px
    }

    .box-perdi-roubaram .panel-group {
        width: 520px;
        float: left
    }

        .box-perdi-roubaram .panel-group .panel {
            border: 1px solid var(--contrast-color);
            border-radius: 20px
        }

        .box-perdi-roubaram .panel-group .panel-heading {
            padding: 12px 16px
        }

            .box-perdi-roubaram .panel-group .panel-heading h4, .box-perdi-roubaram .panel-group .panel-heading.collapsed h4 {
                font-size: 14px;
                color: var(--dark-color);
                margin: 0;
                text-transform: none
            }

            .box-perdi-roubaram .panel-group .panel-heading .glyphicon {
                color: var(--contrast-color);
                float: right
            }

        .box-perdi-roubaram .panel-group .panel-body, .panel-default > .panel-heading + .panel-collapse > .panel-body {
            padding: 16px;
            line-height: 22px;
            border-top: 1px solid var(--contrast-color)
        }

        .box-perdi-roubaram .panel-group .panel-body {
            border-top: 1px solid var(--contrast-color)
        }

            .box-perdi-roubaram .panel-group .panel-body a.laranja:hover {
                text-decoration: underline
            }

        .box-perdi-roubaram .panel-group .panel-collapse .btn-padrao.laranja {
            width: auto;
            display: inline-block;
            float: right;
            font-size: 12px;
            padding-bottom: 6px;
            padding-top: 6px;
            margin-top: 36px
        }

.menu-bloqueio {
    margin-top: 36px
}

    .menu-bloqueio li {
        margin-top: 16px;
        list-style: none
    }

        .menu-bloqueio li a {
            color: var(--primary-color);
        }

.bloqueio-temporario .modal-header, .bloqueio-temporario .modal-footer {
    border: 0
}

.bloqueio-temporario .modal-body {
    padding-top: 0;
    padding-bottom: 0
}

.bloqueio-temporario .base-icone.circle {
    border: 1.5px solid var(--primary-color);
}

.bloqueio-temporario .modal-header, .bloqueio-temporario .modal-footer {
    border: 0
}

.bloqueio-temporario .modal-body {
    padding-top: 0;
    padding-bottom: 0
}


.bloqueio-temporario button {
    width: 250px !important;
    display: inline-block;
    font-size: 12px;
    padding-bottom: 6px;
    padding-top: 6px;
    margin-top: 21px;
}

.bloqueio-temporario .modal-header, .bloqueio-temporario .modal-footer {
    border: 0
}

.bloqueio-temporario .modal-body {
    padding-top: 0;
    padding-bottom: 0
}

.bloqueio-temporario .base-icone {
    margin: 21px auto 0;
    font-size: 45px;
    border-radius: 62%;
    width: 90px;
    height: 90px;
    line-height: 87px;
    color: var(--primary-color);
}



.bloqueio-temporario h4 {
    width: 100%;
    font-size: 18px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 400;
    margin: 36px 0 21px
}

.bloqueio-temporario input {
    width: 372px;
    border: 1px solid var(--primary-color);
    background: none;
    height: 48px;
    border-radius: 35px;
    color: var(--tertiary-color);
    text-align: center;
    color: var(--tertiary-color) !important;
    font-size: 20px
}

.bloqueio-temporario.feedback h4 {
    text-transform: inherit;
    font-weight: 500
}

.bloqueio-temporario.feedback p {
    font-size: 14px;
    color: var(--tertiary-color);
    width: 50%;
    text-align: center;
    display: inline-block
}

.bloqueio-temporario .close.laranja {
    position: absolute;
    right: 15px;
    top: 15px;
    width: 34px !important;
    font-size: 30px;
    font-weight: 100;
    border-radius: 50%;
    border: 1px solid;
    margin: 0;
    padding: 0 5px;
    opacity: inherit;
}

    .bloqueio-temporario .close.laranja span {
        position: relative;
        top: -2px
    }

#modalValidarCVV .modal-header .base-title{
    justify-content:center;
}

@media (max-width: 991px) {
    .card-name.bloqueado{
        align-items: flex-start !important;
        margin-top: 6px;
    }
    .card-name.bloqueado .btn-padrao.laranja.desbloquear {
        margin: 24px 0 12px 0;
    }
    .card-name.bloqueado button.expand {
        margin: 11px 0 0 9px;
    }
}

@media(max-width: 767px) {
    .card-name.bloqueado .aviso {
        margin-left: 0;
        top: 45px;
        left: 0;
    }
    .card-name.bloqueado .btn-padrao.laranja.desbloquear {
        margin: 40px 0 12px 0;
    }
    .box-perdi-roubaram {
        margin-top: 0;
    }
    .box-perdi-roubaram .panel-group {
        width: 100%;
    }
    .box-perdi-roubaram img {
        float: initial;
        margin-right: 0;  
        margin-bottom: 20px;
    }
    .card-design {
        width: 100% !important;
    }
}

.base-portabilidade .titulo-laranja {
    color: var(--primary-color) !important;
}

.base-portabilidade {
    margin: 12px 0 8px 0;
    padding: 36px;
    border-radius: 18px;
    background-color: var(--white-color);
    box-shadow: 0 0 60px rgba(0,0,0,.1);
}

    .base-portabilidade.alturaMinima {
        min-height: 637px;
    }

    .base-portabilidade h3 {
        font-size: 18px !important;
        margin-bottom: 20px !important;
        font-weight: 500;
    }

    .base-portabilidade p {
        margin-bottom: 15px;
    }

    .base-portabilidade ul {
        margin-left: 20px;
    }

        .base-portabilidade ul li {
            margin-bottom: 5px;
        }

    .base-portabilidade .panel-group {
        border: 1px solid var(--contrast-color);
    }

        .base-portabilidade .panel-group .panel-default:last-of-type {
            border-bottom: none;
        }

    .base-portabilidade .panel-heading {
        padding: 0 !important;
    }

        .base-portabilidade .panel-heading a {
            padding: 15px 40px 15px 15px !important;
            position: relative;
            display: block;
            width: 100%;
        }

            .base-portabilidade .panel-heading a:after {
                color: var(--tertiary-color);
                content: "\e9b7";
                font-family: 'icomoon' !important;
                font-size: 16px;
                position: absolute;
                right: 15px;
                top: 15px;
            }

            .base-portabilidade .panel-heading a[aria-expanded="true"]:after {
                content: "\e9b6" !important;
            }

    .base-portabilidade .panel-default > .panel-heading + .panel-collapse > .panel-body {
        border-top: 1px solid var(--concrete) !important;
    }

.panel {
    margin-bottom: 12px !important;
}

.base-portabilidade .panel-group .panel + .panel {
    margin-top: 0 !important;
}

.base-portabilidade .panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-top: 1px solid var(--contrast-color);
    padding: 15px;
    line-height: 22px;
}

.base-portabilidade .form-custom {
    margin-bottom: 20px;
}

.bloqueio-temporario .modal-header, .bloqueio-temporario .modal-footer {
    border: 0
}

.bloqueio-temporario .modal-body {
    padding-top: 0;
    padding-bottom: 0
}

.bloqueio-temporario .base-icone.circle {
    border: 1.5px solid var(--primary-color);
}

.bloqueio-temporario .modal-header, .bloqueio-temporario .modal-footer {
    border: 0
}

.bloqueio-temporario .modal-body {
    padding-top: 0;
    padding-bottom: 0
}

.bloqueio-temporario .base-icone.circle {
    border: 1.5px solid var(--primary-color);
}

.bloqueio-temporario .modal-header, .bloqueio-temporario .modal-footer {
    border: 0
}

.bloqueio-temporario .modal-body {
    padding-top: 0;
    padding-bottom: 0
}

.bloqueio-temporario .base-icone {
    margin: 21px auto 0;
    font-size: 45px;
    border-radius: 62%;
    width: 90px;
    height: 90px;
    line-height: 87px;
    color: var(--primary-color);
}

    .bloqueio-temporario .base-icone.circle {
        border: 1.5px solid var(--primary-color);
    }

.bloqueio-temporario h4 {
    width: 100%;
    font-size: 18px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 400;
    margin: 36px 0 21px
}

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

.size-termo-portabilidade {
    height: 62vh;
}

.padding-modal-imprimir {
    padding: 36px 24px 0px 24px !important;
}

.bloqueio-temporario input {
    width: 372px;
    border: 1px solid var(--primary-color);
    background: none;
    height: 48px;
    border-radius: 35px;
    color: var(--tertiary-color);
    text-align: center;
    color: var(--tertiary-color) !important;
    font-size: 20px
}

.bloqueio-temporario.feedback h4 {
    text-transform: inherit;
    font-weight: 500
}

.bloqueio-temporario.feedback p {
    font-size: 14px;
    color: var(--tertiary-color);
    width: 50%;
    text-align: center;
    display: inline-block
}

.bloqueio-temporario .btn.btn-link {
    font-size: 14px;
    color: var(--primary-color);
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    margin: 0 0 24px 0;
    padding: 0;
}

.comprovante-portabilidade .modal-header {
    padding-bottom: 30px;
}

    .comprovante-portabilidade .modal-header p {
        margin-bottom: 20px;
    }

.comprovante-portabilidade .body-comprovante {
    background-color: var(--contrast-color);
}

    .comprovante-portabilidade .body-comprovante .header-comprovante {
        border-bottom: 1px solid var(--dark-color);
        height: 100px;
        display: flex;
        align-items: center;
        margin-bottom: 10px;
    }

        .comprovante-portabilidade .body-comprovante .header-comprovante h4 {
            text-align: left;
            padding-left: 20px;
        }

    .comprovante-portabilidade .body-comprovante table {
        width: 100%;
        margin-bottom: 5px;
    }

        .comprovante-portabilidade .body-comprovante table td {
            border: 1px solid var(--contrast-color);
            padding: 15px;
        }

.btn-nova-portabilidade {
    display: inline-block !important;
    margin-top: 30px;
    padding: 10px 20px !important;
    width: auto !important;
}

.item-portabilidade {
    padding: 25px;
}

    .item-portabilidade h4 {
        color: var(--dark-color);
        font-size: 14px;
    }

    .item-portabilidade p {
        color: var(--tertiary-color);
        font-size: 14px;
        margin-bottom: 0;
    }

    .item-portabilidade a {
        color: var(--primary-color);
        text-decoration: underline;
    }

        .item-portabilidade a:hover {
            text-decoration: none;
        }

/**** STATUS DA PROPOSTA ****/

.status-port.--analise {
    color: var(--primary-color);
}

.status-port.--aprovada {
    color: var(--success-color);
}

.status-port.--finalizada {
    color: var(--erro-color);
}

@media (max-width: 991px) {
    .item-portabilidade p {
        margin-bottom: 20px;
    }
}