.gritter-item-wrapper.dt-button-info {
    padding: 12px 11px 8px;
    z-index: 1999;
}
    .gritter-item-wrapper.dt-button-info > h2 {
        margin-top: 0;
    }

#gritter-notice-wrapper {
    min-width: 400px !important;
}

.gritter-item-wrapper {
    background-image: none !important;
    box-shadow: 0 2px 10px rgba(50, 50, 50, 0.5);
    background: rgba(50, 50, 50, 0.92);
}

    .gritter-item-wrapper.gritter-info {
        background: rgba(49, 81, 133, 0.92);
    }

    .gritter-item-wrapper.gritter-error {
        background: rgba(153, 40, 18, 0.92);
    }

    .gritter-item-wrapper.gritter-success {
        background: rgba(89, 131, 75, 0.92);
    }

    .gritter-item-wrapper.gritter-warning {
        background: rgba(190, 112, 31, 0.92);
    }

    .gritter-item-wrapper.gritter-light {
        background: rgba(245, 245, 245, 0.95);
        border: 1px solid #BBB;
    }
        .gritter-item-wrapper.gritter-light.gritter-info {
            background: rgba(232, 242, 255, 0.95);
        }
            .gritter-item-wrapper.gritter-light.gritter-info .gritter-item {
                color: #4A577D;
            }

        .gritter-item-wrapper.gritter-light.gritter-error {
            background: rgba(185, 67, 89, 0.95);
        }
            .gritter-item-wrapper.gritter-light.gritter-error .gritter-item {
                color: #894A38;
            }

        .gritter-item-wrapper.gritter-light.gritter-success {
            background: rgba(67, 185, 130, 0.95);
        }
            .gritter-item-wrapper.gritter-light.gritter-success .gritter-item {
                color: #416131;
            }

        .gritter-item-wrapper.gritter-light.gritter-warning {
            background: rgba(185, 132, 67, 0.95);
        }
            .gritter-item-wrapper.gritter-light.gritter-warning .gritter-item {
                color: #946446;
            }

.gritter-item p {
    text-align: center !important;
    font-family: 'Overpass', sans-serif !important;
    font-size: 15px !important;
}

.gritter-top,
.gritter-bottom,
.gritter-item {
    background-image: none;
}

.gritter-close {
    left: auto;
    right: 4px;
    background-image: none;
    width: 18px;
    height: 18px;
    line-height: 17px;
    text-align: center;
    border: 2px solid transparent;
    border-radius: 16px;
    color: #E17B67;
    font-size: 0;
    text-indent: 0;
}
    .gritter-close:before {
        font-family: FontAwesome;
        font-size: 16px;
        content: "\f00d";
    }

.gritter-info .gritter-close {
    color: #FFA500;
}

.gritter-error .gritter-close,
.gritter-success .gritter-close,
.gritter-warning .gritter-close {
    color: #FFEA07;
}

.gritter-close:hover {
    color: #FFF !important;
    text-decoration: none;
}

.gritter-title {
    text-shadow: none !important;
    text-align: center !important;
    font-family: 'Overpass', sans-serif !important;
    font-size: 18px !important;
}

.gritter-light .gritter-item,
.gritter-light .gritter-bottom,
.gritter-light .gritter-top,
.gritter-light .gritter-close {
    background-image: none;
    color: #444;
}

.gritter-light .gritter-title {
    text-shadow: none !important;
}

.gritter-light .gritter-close:hover {
    color: #8A3104 !important;
}

.gritter-center {
    position: fixed;
    left: 33%;
    right: 33%;
    top: 33%;
}

@media only screen and (max-width: 867px) {
    .gritter-center {
        left: 16%;
        right: 16%;
        top: 30%;
    }
}

@media only screen and (max-width: 580px) {
    .gritter-center {
        left: 30px;
        right: 30px;
    }
}

@media only screen and (max-width: 420px) {
    .gritter-center {
        left: 10px;
        right: 10px;
    }
}

.corpo-checkout {
    display: flex;
    align-items: center;
    background: #eef5f9;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    min-height: 100vh;
    padding: 0px;
    font-family: 'Overpass', sans-serif;
}

.painel-checkbox {
    background: rgba(255, 255, 255, 1.0);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.lado-azul {
    background: #438eb9;
    color: #fff;
}

.imagem-topo {
    display: flex;
    align-items: center;
    margin-top: 20px;
    justify-content: center;
}

.espaco-titulo {
    padding-left: 5px;
}

.espaco-titulo-centro {
    margin-top: 5px !important;
    text-align: center;
}

.linha-hr-checkout {
    margin: 0px 0px 10px 0px !important;
}

.tamanho-label-checkout {
    font-size: 15px;
}

.aba-forma-pagamento {
    float: left;
}

.texto-forma-pagamento {
    color: #438eb9 !important;
    background: #f5f5f5;
    border: 0px solid transparent;
    border-radius: 8px 8px 0px 0px;
    padding: 15px;
    text-decoration: none !important;
}

.texto-forma-pagamento-selecionado {
    color: #438eb9 !important;
    background: #FFF;
    border: 0px solid transparent;
    border-radius: 8px 8px 0px 0px;
    padding: 15px;
    text-decoration: none !important;
    box-shadow: 1px 0px 0px rgba(0, 0, 0, 0.2);
}

.painel-checkout {
    color: #438eb9;
    background: #fff;
    margin-bottom: 10px;
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.botao-checkout-azul {
    background: #4388b9;
    font-size: 15px;
    line-height: 55px;
    color: #fff;
    border: 0px solid transparent;
    width: 100%;
    height: 50px;
}

.botao-checkout-verde {
    background: #29b920;
    font-size: 15px;
    line-height: 55px;
    color: #fff;
    border: 0px solid transparent;
    width: 100%;
    height: 50px;
}

.texto-valor-total {
    padding: 0px !important;
    margin: 0px !important;
}

.linha-hr-pontilhada {
    border-top: dotted 1px #eeeeee;
    margin: 5px 0px !important;
}

.linha-hr-total {
    border-top: dotted 1px #eeeeee;
    margin: 5px 0px !important;
}

.linha-hr-centralizada {
    margin-top: 5px;
    margin-bottom: 5px;
}

.label-cartao {
    color: #FFF;
    font-weight: normal;
    width: 100%;
}

.input-text-cartao {
    background: transparent !important;
    color: #fff !important;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.2), 0 0px 0px 0 rgba(0, 0, 0, 0.19) !important;
    font-weight: bold;
    letter-spacing: 3px;
    font-family: 'Saira Condensed', sans-serif;
    text-shadow: 2px 2px rgba(0, 0, 0, 0.2);
    border-radius: 0px !important;
}
    .input-text-cartao::placeholder {
        color: #FFF !important;
        opacity: 1 !important;
        font-size: 12px;
    }

.texto-estatico-cartao {
    color: #fff !important;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.2), 0 0px 0px 0 rgba(0, 0, 0, 0.19) !important;
    font-weight: bold;
    letter-spacing: 3px;
    font-family: 'Saira Condensed', sans-serif;
    text-shadow: 2px 2px rgba(0, 0, 0, 0.2);
}

.input-text-cartao-sem-valor {
    border: 0px solid transparent !important;
    border-bottom: 1px solid white !important;
}

.input-text-cartao-com-valor {
    border: 0px solid transparent !important;
}

.select-cartao {
    background: transparent !important;
    color: #fff !important;
    font-weight: bold;
    letter-spacing: 3px;
    font-family: 'Saira Condensed', sans-serif;
    text-shadow: 2px 2px rgba(0, 0, 0, 0.2);
    border-radius: 0px !important;
    border: 0px solid transparent !important;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.2), 0 0px 0px 0 rgba(0, 0, 0, 0.19) !important;
    cursor: pointer;
}
    .select-cartao option {
        color: #fff;
        background-color: #437ab9 !important;
        border: 0px solid white !important;
        font-size: 14px !important;
    }

#listaImagensDirective > ul {
    list-style-type: none !important;
}

#listaImagensDirective > ul > li > div:hover {
    background: #5791b3 !important;
}

.select-cartao-sem-selecao {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url("../assets/img/seta-baixo.png") no-repeat right !important;
    background-size: 12px !important;
    border-bottom: 1px solid white !important;
    font-size: 10px !important;
}

.select-cartao-selecionado {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-size: 12px !important;
    font-size: 14px !important;
}

.painel-loading {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pulse {
    display: block;
    box-shadow: 0 0 0 rgba(255, 255, 255, 0.4);
    animation: pulse 1s infinite;
}

.modal-body {
    background: #438eb9;
}
.modal-header {
    background: #438eb9;
}
.emv-pix {
    width: 100%;
    height: 100%;
    color: #333;
}
.valorPix {
    color: lawngreen;
}

.valorPixExpirado {
    color: lightgoldenrodyellow;
}

.valorPixCancelado {
    color: maroon;
}

.fechar{
    color: whitesmoke;
}
.imagem-icone {
    width: 100px;
    height: auto;
    display: block;
    margin: 20px auto; 
}

.imagem-responsiva {
    width: 100%;
    height: 50%;
    margin-top: 20px;
    margin-bottom: 20px;
}

.closeModal {
    color: whitesmoke;
    font-size: 30px;
}

.loading-pix {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

.icone-titulo {
    width: 50%;
    height: auto;
    margin-right: 5px;
}
@-webkit-keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }

    70% {
        -webkit-box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
    }

    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

@keyframes pulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }

    70% {
        -moz-box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
    }

    100% {
        -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }

}