.fundoTecladoPix {
    background-color: azure;
    background-size: cover;
    z-index: 999999;
    width: 390px;
    border-radius: 25px;
    box-shadow: #000;
    background-color: #1225b2;
    border: 1px solid #0b1872;
    padding: 17px;
}

.pix-keys {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

.fundoTecladoPix .tecla {
    background-color: white;
    width: 130px;
    height: 104px;
    border: thin solid #eee;
    display: inline-block;
    font-size: 58px;
    font-weight: bold;
}

.fundoTecladoPix p.title {
    text-align: center;
    color: white;
    font-weight: bold;
    font-size: 24px;
    margin: 0 0 7px 0;

}

input[name=pix_value] {
    background-color: #000;
    color: azure;
    border-radius: 10px;
    font-size: 78px;
    width: 100%;
    font-family: FrutigerLTStd, Fallback, sans-serif;
    text-align: center;
    height: 133px;
    margin-bottom:4px;
    border:none !important;
    position:relative;
}

@font-face {
    font-family: "dotty";
    src: url("/static/assets/fonts/dotty.regular-webfont.woff");
    src: url("/static/assets/fonts/dotty.regular-webfont.woff") format("woff");
}

@font-face {
    font-family: "segment";
    src: url("/static/assets/fonts/segment7-4gml-webfont.woff");
    src: url("/static/assets/fonts/segment7-4gml-webfont.woff") format("woff"),
        url("/static/assets/fonts/Segment7-4Gml.otf") format("opentype");
}

.has_pix {
    background-color: white !important;
    border-color: gray !important;
}

.has_pix .title {
    color: #003 !important;
}

.has_pix input[name=pix_value],
.has_pix .pix-keys {
    display: none;
}

.ok {
    background-color: #218509 !important;
}

.tecla:hover,
.ok:hover {
    background-color: gray !important;
}
.ok div{
    position:absolute;
    top:12px;
}


.fundoTecladoPix .pix-display {
    display: block;
}
.pix-display{
    padding-bottom: 0.4em;
}
.fundoTecladoPix .pix-qrcode,
.pix-message-extra {
    display: none;
}

.has_pix .pix-display,
.has_pix .pix-message-extra {
    display: block !important;
}

p.pix-code {
    white-space: nowrap;
}

.has_pix .pix-qrcode {
    display: block !important;
}
.pix-qrcode img{
    width:100%;
}

.has_pix .pix-keypad {
    display: none !important;
}

.fundoTecladoPix ol {
    font-weight: normal;
    text-align: left;
    font-family: sans-serif;
    margin:0;
}

.pix-message {
    color: white;
    padding:0.4em;
}

.pix-message,
.pix-message-extra {
    font-weight: normal !important;
    padding: 0.1em;
}

.has_pix .pix-message {
    color: black !important;
}

.pix-display,
.pix-qrcode {
    text-align: center;
}

.pix-sub {
    font-weight: normal;
    text-align: left;
}

.pix-code {
    overflow: hidden;
}