@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
html {
    -webkit-user-select: none; 
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch; 
    display:table;
    width:100%!important;
    height:100%!important;
    /*background-image: url(img/miniLoader.gif);
    background-size: 50px;
    background-position:center;
    background-repeat: no-repeat;*/
   
}
html:before {
    content: "";
    position: absolute;
    top:50%;
    left: 50%;
    margin-left:-25px;
    margin-top:-25px;
    width: 50px;
    height: 50px;
    background-size: 50px;
    background-position:center;
    background-repeat: no-repeat;
    background-image: url(img/loader-app.svg);
    -webkit-animation-name: rotate;
    -webkit-animation-duration:2s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:linear;
    -moz-animation-name: rotate;
    -moz-animation-duration:2s;
    -moz-animation-iteration-count:infinite;
    -moz-animation-timing-function:linear;
}

@-webkit-keyframes rotate {
  from {-webkit-transform:rotate(0deg);}
  to {  -webkit-transform:rotate(360deg);}
}

@-moz-keyframes rotate {
  from {-moz-transform:rotate(0deg);}
  to {  -moz-transform:rotate(360deg);}
}

body {
    -webkit-touch-callout: none;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    text-size-adjust: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 0;
    color: #000;
    font-size: 16px;
    font-family: -apple-system;
    font-family: 'Inter', sans-serif;
    letter-spacing: 0.01em!important;
    /*! line-height: 20px; */
    text-rendering: optimizeLegibility;
    -webkit-backface-visibility: hidden;
    -webkit-user-drag: none;
    -ms-content-zooming: none;
    background-color: #ccc;
}

a,button,:focus,a:focus,button:focus,a:active,a:hover {
    outline: 0;
}

a {
    -webkit-user-drag: none;
    -webkit-tap-highlight-color: transparent;
}

a[href]:hover {
    cursor: pointer;
}

b,strong {
    font-weight: 700;
}

dfn {
    font-style: italic;
}

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
}

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

pre {
    white-space: pre-wrap;
}

q {
    quotes: "\201C" "\201D" "\2018" "\2019";
}

small {
    font-size: 80%;
}

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

sup {
    top: -.5em;
}

sub {
    bottom: -.25em;
}

fieldset {
    margin: 0 2px;
    padding: .35em .625em .75em;
    border: 1px solid silver;
}

button,input,select,textarea {
    margin: 0;
    font-size: 100%;
    font-family: inherit;
    outline-offset: 0;
    outline-style: none;
    outline-width: 0;
    -webkit-font-smoothing: inherit;
    background-image: none;
}
textarea, input {
    -webkit-user-select: auto !important;
    /*-webkit-user-select: none;*/
}
button,input {
    line-height: normal;
}

button,select {
    text-transform: none;
}

button,html input[type="button"],input[type="reset"],input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
}

button[disabled],html input[disabled] {
    cursor: default;
}

button::-moz-focus-inner,input::-moz-focus-inner {
    padding: 0;
    border: 0;
}

textarea {
    overflow: auto;
    vertical-align: top;
}

img {
    -webkit-user-drag: none;
}

table {
    border-spacing: 0;
    border-collapse: collapse;
}

*,:before,:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

p {
    margin: 0 0 10px;
}

small {
    font-size: 85%;
}

cite {
    font-style: normal;
}

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

.text-right {
    text-align: right;
}

.text-center {
    text-align: center;
}

.text {
    line-height: 1.2em;
}

.pontos {
    overflow: hidden;
    position: relative;
    line-height: 1.2em;
    max-height: 3.6em;
    margin-right: -1em;
    padding-right: 1em;
}

.pontos:before {
    content: '...';
    position: absolute;
    right: 0;
    bottom: 0;
}
.pontos:after {
    content: '';
    position: absolute;
    right: 0;
    width: 1em;
    height: 1em;
    margin-top: .2em;
}
#bannerOnpedido{
    width: 100%;
    margin: 0 auto;
    display: table;
    margin-top: 10px;
    margin-bottom: 5px;
}

/*** TELAS & MENUS ***/
#telaProduto{
    position: absolute;
    top: 50px;
    left: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background-color: #fafaf7;
    box-shadow: 0 4px 5px 0 #000 !important;
}
#telaConteudo {
    position: absolute;
    top: 50px;
    left: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    background: #fff;
    background: -moz-linear-gradient(top, #fff 0%, #f2f7fc 100%);
    background: -webkit-linear-gradient(top, #fff 0%, #f2f7fc 100%);
    background: linear-gradient(to bottom, #fff 0%, #f2f7fc 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f2f7fc', GradientType=0);
    box-shadow: 0 4px 5px 0 #000 !important; 
}

#telaCardapio,#telaCarrinho,#telaPromocoes {
    position: absolute;
    top: 120px;
    left: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background: #fff;
    background: -moz-linear-gradient(top, #fff 0%, #f2f7fc 100%);
    background: -webkit-linear-gradient(top, #fff 0%, #f2f7fc 100%);
    background: linear-gradient(to bottom, #fff 0%, #f2f7fc 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f2f7fc', GradientType=0);
  
    box-shadow: 0 5px 5px 0 #000 !important;
}

/* MENU */
#menu {
    position: absolute;
    z-index: 999;
   background-color: transparent!important;
}

.corpoMenu {
    width: 300px;
    height: 100%;
    float: left;
    box-shadow: 0px 0px 25px #000;
    position: relative;
}

#sombraMenu {
    right: 0px;
    height: 100%;
    position: absolute;
    z-index: 991;
    display: table;
}

.alturaTela {
    display: table;
    width: 300px;
    height: 300px;
}
#navApp {
    display: table;
    width: 100%;
    height: 69px;
    background: #fff;
    box-shadow: 0 2px 2px #b8b8b8;
}
.btCardapio,.btCarrinho,.btPromocoes {
    width: 33.3%;
    height: 70px;
    font-size:12px;
    float: left;
    text-align: center;
    color: #333;
    box-shadow: 0 0 3 #000;
    background-position: center 10px;
    background-repeat: no-repeat;
    background-size: 30px;
    border-bottom: 1px solid #eee;
}


.btCardapio font, .btCarrinho font, .btPromocoes font {
    font-size: 95%;
    font-weight: 600;
    display: table;
    text-align: center;
    width: 100%;
    margin-top: 45px;
    color: #777;
}
.btCardapio {
    background-image: url('data:image/svg+xml,<svg fill="%23777" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7,6H23a1,1,0,0,0,0-2H7A1,1,0,0,0,7,6Z"/><path d="M23,11H7a1,1,0,0,0,0,2H23a1,1,0,0,0,0-2Z"/><path d="M23,18H7a1,1,0,0,0,0,2H23a1,1,0,0,0,0-2Z"/><circle cx="2" cy="5" r="2"/><circle cx="2" cy="12" r="2"/><circle cx="2" cy="19" r="2"/></svg>');
}
.btCarrinho {
    background-image: url('data:image/svg+xml,<svg fill="%23777" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,6H18A6,6,0,0,0,6,6H3A3,3,0,0,0,0,9V19a5.006,5.006,0,0,0,5,5H19a5.006,5.006,0,0,0,5-5V9A3,3,0,0,0,21,6ZM12,2a4,4,0,0,1,4,4H8A4,4,0,0,1,12,2ZM22,19a3,3,0,0,1-3,3H5a3,3,0,0,1-3-3V9A1,1,0,0,1,3,8H6v2a1,1,0,0,0,2,0V8h8v2a1,1,0,0,0,2,0V8h3a1,1,0,0,1,1,1Z"/></svg>');
}
.btPromocoes {
    background-image: url('data:image/svg+xml,<svg fill="%23777" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17.5,1.917a6.4,6.4,0,0,0-5.5,3.3,6.4,6.4,0,0,0-5.5-3.3A6.8,6.8,0,0,0,0,8.967c0,4.547,4.786,9.513,8.8,12.88a4.974,4.974,0,0,0,6.4,0C19.214,18.48,24,13.514,24,8.967A6.8,6.8,0,0,0,17.5,1.917Zm-3.585,18.4a2.973,2.973,0,0,1-3.83,0C4.947,16.006,2,11.87,2,8.967a4.8,4.8,0,0,1,4.5-5.05A4.8,4.8,0,0,1,11,8.967a1,1,0,0,0,2,0,4.8,4.8,0,0,1,4.5-5.05A4.8,4.8,0,0,1,22,8.967C22,11.87,19.053,16.006,13.915,20.313Z"/></svg>');
}
.btCardapio:after,
.btPromocoes:after,
.btCarrinho:after{
  content: '';
  display: block;
  margin: auto;
  height: 3px;
  width: 0px;
  margin-top: 7px;
  background: transparent;
  border-radius:5px!important;
  transition: width .5s ease, background-color .5s ease;
}
@-webkit-keyframes btsTabs {
 0%   {  background-size: 30px auto; }
 50%  {  background-size: 37px auto; }
 100% {  background-size: 30px auto; }      
} 
/*
.tabAtivo {
  -webkit-transition: border-color 0.8s ease-out;
  -moz-transition: border-color 0.8s ease-out;
  -o-transition: border-color 0.8s ease-out;
  transition: border-color 0.8s ease-out;
  -webkit-animation: btsTabs 1s ease-in-out none;
}*/

.carregando {
    top: 50%;
    left: 50%;
    margin-left: -47px;
    margin-top: -47px;
    width: 94px;
    height: 94px;
    position: absolute;
    display: block;
    border-radius: 100px;
    box-shadow: 3px 3px 5px #000;
    background-color: #9b0000;
    background-size: 64px 64px;
    background-image: url(img/miniLoader.gif);
    background-repeat: no-repeat;
    background-position: center center;
}

#loader {
    position: absolute;
    z-index: 999;
}

header {
   width: 100%;
   margin: 0;
   height: 50px;
   background-color: #9b0000;
   display: flex;
   align-items: stretch;
   align-items: center;
}

#espacoBtVoltar {
    width: 50px;
    height: 50px;
    display: table;
    float: left;
}

#btVoltar {
    width: 50px;
    height: 50px;
    display: table;
    float: left;
    background-size: 25px;
    background-image: url(img/voltar.png);
    background-repeat: no-repeat;
    background-position: center center;
}

#tituloPagina {
    text-align: center;
    color: #fff;
    height: 50px;
    display: table;
    float: left;
    margin: 0 auto;
    width: auto%;
}

#tituloPagina span {
    display: block;
    font-size: 16px;
    border: 0px solid #000;
    text-align: center;
    margin-top: 16px;
    width: 100%;
}
.headerPagina{
    text-align: center;
    color: #fff;
    display: table;
    float: left;
    background-color:#555;
    width: 100%;
    font-size: 16px;
    font-weight:500;
    padding-top: 10px;
    padding-bottom: 10px;
    background-image: url(img/preto30.png);
    background-position: center bottom;
    background-repeat: repeat;
}
.itemPagina{
    padding: 10px;
    display: table;
    border-bottom: 1px solid #eee;
    width: 100%;
    font-size: 16px;
    font-weight:400;
}
.iconPagina{
    background-position: 15px 15px; 
}

#btMenu {
    width: 50px;
    height: 50px;
    display: table;
    float: right;
    background-size: 30px;
    background-image: url(img/menu.png);
    background-repeat: no-repeat;
    background-position: center center;
}

.show {
    display: block;
}

.hide {
    display: none !important;
}

/*** PRODUTOS DO CARDAPIO ***/
.categoriaProduto {
    width: 97%;
    margin: 0 auto;
    border-radius: 3px;
    margin-bottom: 2.5px;
    margin-top: 5px;
    height: auto;
    display: table;
    background-color: #9b0000;
    color: #fff;
    padding: 10px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.categoriaProduto h1 {
    font-size: 16px;
    margin: 0;
    font-weight: 500;
    line-height: 1.2em;
    text-align: center;
}

.categoriaProduto font {
    font-size: 12px;
    font-weight: 400;
    display: table;
    text-align: center;
    width: 100%;
    margin: 0;
    line-height: 1.2em;
    opacity: 0.8;
    margin-top: 5px;
}
.acordiao{
    padding-bottom: 2.5px;
    padding-top: 2.5px;
   
}
.categoriaProdutoAtiva, .subCategoriaProdutoAtiva{
    background-repeat: no-repeat;
    background-size: 25px;
    background-position: 97% 50%;
    
}
.categoriaProdutoAtiva{
    background-image: url(https://static.onpedido.com.br/img/menos.svg);
}
.subCategoriaProdutoAtiva{
     background-image: url(../../app/img/menos.svg);
}
.categoriaProdutoInativa, .subCategoriaProdutoInativa{
    background-repeat: no-repeat;
    background-size: 25px;
    background-position: 97% 50%;
}
.categoriaProdutoInativa{
    background-image: url(https://static.onpedido.com.br/img/mais.svg);
}
.subCategoriaProdutoInativa{
    background-image: url(../../app/img/mais.svg);
}
.subCategoriaProduto.subCategoriaProdutoInativa,
.subCategoriaProduto.subCategoriaProdutoAtiva,
.categoriaProduto.categoriaProdutoInativa,
.categoriaProduto.categoriaProdutoAtiva{
    padding-right: 40px;
}
    
.subCategoriaProduto {
    width: 97%;
    margin: 0 auto;
    border-radius: 3px;
    margin-top: 0px;
    display: table;
    height: auto;
    display: table;
    background-color: #dbe0e5;
    color: #555;
    padding: 10px;
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
}

.subCategoriaProduto h1 {
    font-weight: 400;
    font-size: 14px;
    margin: 0;
    line-height: 1.2em;
    text-align: center;
}

.subCategoriaProduto font {
    font-size: 12px;
    font-weight: 400;
    display: table;
    text-align: center;
    width: 100%;
    margin: 0;
    line-height: 1.2em;
    opacity: 0.8;
    margin-top: 5px;
}
.produtoPromocao{
    background-color: #fff;
    box-shadow: 0 0px 1px #b8b8b8;
    color: #444;
    line-height: 1.2em;
    display: table;
    margin: 0px;
    width: 100%;
    padding: 10px;
    padding-right: 0px;
    margin-top:10px;
   
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.produtoPromocao h1 {
    display: table;
    margin: 0;
    width: 45%;
    font-size: 16px;
    font-weight: 600;
    padding-left: 15px;
    padding-bottom:5px;
    float: left;
    line-height: 1.2em;
}
.produtoPromocao spam {
    margin:0px!important;
    width:55%!important;
    text-align:right;
    float: right;
    padding-right: 10px;
    display: table;
    font-weight: 600;
    color: #34a203;
    padding-top:2px;
    font-size: 12px;
}
.produtoPromocao h2 {
    display: table;
    width: 100%;
    padding: 0;
    margin: 0;
    margin-left: 15px;
    padding-right:20px;
    font-size: 14px;
    margin-top: 10px;
    font-weight: 400;
    color: #333;
}

.produtoPromocao hgroup {
    display: table;
    width:75%;
    padding: 0;
    margin: 0;
    font-size: 95%;
    font-weight: 500;
    color: #555;
    float: left;
}
.produtoPromocao figure{
    height: 100%;
    margin: 0px;
    padding: 0px;
    float: left;
    width:25%;
    display: table;
}
.produtoPromocao figure img {
    width:100%;
    height: auto;
    display: table;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}
.produtoFoto{
    width: 97%;
    margin: 0 auto;
    border-radius: 3px;
    margin-top: 7px;
    margin-bottom: 7px;
    padding: 10px;
    background-color: #fff;
    box-shadow: 0 0px 1px #b8b8b8;
}
.produtoFoto table{
    width: 100%;
}
.produtoFoto .titulo { 
   width: 100%;
   border:0px solid #ccc;
   line-height: 1.2em;
   text-align: left;
   font-size: 14px;
}
.produtoFoto .descricao {
    border: 0px solid;
    font-size: 12px;
    font-weight: 400;
    color: #777;
    vertical-align: top;
}
.produtoFoto .percentualDesconto{
    margin-top:-26px;
    font-size: 12px;
    background-color: #34a203;
    z-index: 999999;
    position: absolute;
    padding: 3px 5px 3px 5px;
    font-weight: 400;
    color: #fff;
    border-radius:3px;
}
.produtoFoto .valor {
    text-align:right;
    float: right;
    width: 70px;
    border:0px solid #ccc;
    padding-right: 10px;
    display: table;
    font-weight: 600;
    color: #34a203;
    font-size:14px;
    vertical-align: top;
}
.produtoFoto .valor font:nth-child(1){
    text-align:right;
    float: right;
    width: 90px;
    border:0px solid #ccc;
    padding-right: 10px;
    display: table;
    font-weight: 600;
    margin-bottom: -3px;
    font-size:10px;
    line-height: 1.2;
    vertical-align: top;
}
.produtoFoto .valor font:nth-child(2){
    font-weight: 600;
    font-size:9px;
    margin-right:2px;
}
@-webkit-keyframes girar {
    from {
        -webkit-transform: rotate(0deg);
    } to {
        -webkit-transform: rotate(359deg);
    }
 }
.loadImagem {
  width: 90px;
  height: 90px;
  display: table;
  background-color: #ccc;
  border-radius: 3px;
  margin-right: 10px;
}
.loadImagem div{
  margin: 0 auto;
  margin-top: 20px;
  width: 50px;
  height: 50px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 32px;
  -webkit-animation: girar 2s infinite linear;
  background-image: url(/app/img/loader.png);
}
.produtoFoto .foto{
    width:90px;
    height: 90px;
}
.produtoFoto img{
    width:90px;
    margin-right: 10px;
    height: 90px!important;
    display: table;
    vertical-align: top;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}
.produto {
    background-color: #fff;
    box-shadow: 0 0px 1px #b8b8b8;
    color: #444;
    line-height: 1.2em;
    display: table;
    width: 97%;
    margin: 0 auto;
    border-radius: 3px;
    margin-top: 7px;
    margin-bottom: 7px;
    height: auto;
    padding: 10px;
    padding-bottom: 12px;
    padding-top: 12px;
    position: relative !important;
    text-shadow: 1px 1px 1px #fff;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

hgroup.descricaoProduto {
    padding: 0px;
}

.descricaoProduto {
    display: table;
    float: left;
    padding: 15px;
    overflow: hidden !important;
    height: auto;
    width: 100%;
    
}

.produto h1 {
    display: table;
    margin: 0;
    padding: 0;
    width: 50%;
    color: #9B0000;
    font-size: 14px;
}

.produto h2 {
    display: table;
    width: 100%;
    padding: 0;
    margin: 0;
    font-size: 12px;
    font-weight: 400;
    color: #777;
    align-content: top;
    margin-top: 8px;
    display: table;
    
}

.botaoPedir {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 14px;
    padding: 0px!important;
    width: 75px;
}

.botaoPedir spam font:nth-child(1){
    text-align:right;
    float: right;
    width: 100%;
    border:0px solid #ccc;
    padding-right: 10px;
    display: table;
    font-weight: 600;
    margin-bottom: -5px;
    font-size:9px;
    vertical-align: top;
    padding: 0px!important;
}
.botaoPedir spam font:nth-child(2){
    font-weight: 600;
    font-size:9px;
    margin-right:0px;
}
.botaoPedir spam font:nth-child(3){
    font-weight: 600;
    font-size:14px;
    margin-left:2px;
   
}
.botaoPedir spam:nth-child(1) {
    margin-left: 10px;
    display: table;
    float: left;
    font-weight: 600;
    color: #34a203;
    text-align: right;
    font-size: 12px;  
}

/******* itens pedido ******/
.tela aside {
    margin: 15px;
}

h2.tituloItensPedido {
    margin: 0;
    display: table;
    width: 100%;
    height: 48px;

    border-bottom: 5px solid;
}

h2.tituloItensPedido spam:first-child {
    padding: 12px 0 12px 15px;
    float: left;
    border: 0 solid #000;
}

h2.tituloItensPedido spam:last-child {
    width: 35px;
    height: 35px;
    display: table;
    float: right;
    margin: 5px 5px 0 0;
    background-image: url(img/setas.png);
    background-position: left top;
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

h3.tituloProdutoPedido {
    height: 30px;
    width: 100%;
    padding: 10px;
    padding-top:5px;
    padding-bottom: 5px;
    margin: 0;
    color: #fff;
    font-weight: 400;
    font-size: 14px;
    z-index: 555;
    background-color: #9b0000;
    font-weight: 400;
    display: table;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

h3.tituloProdutoPedido spam {
    float: right;
    border: 0;
    border-radius: 100%;
    color: #fff;
    height: 25px;
    width: 25px;
    border: 0 solid #fff;
    font-weight: 400;
    border: 0px solid #fff;
    margin-top: 0px;
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: 50%;
    background-image: url('data:image/svg+xml,<svg fill="%23FFF" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18,6h0a1,1,0,0,0-1.414,0L12,10.586,7.414,6A1,1,0,0,0,6,6H6A1,1,0,0,0,6,7.414L10.586,12,6,16.586A1,1,0,0,0,6,18H6a1,1,0,0,0,1.414,0L12,13.414,16.586,18A1,1,0,0,0,18,18h0a1,1,0,0,0,0-1.414L13.414,12,18,7.414A1,1,0,0,0,18,6Z"/></svg>');
}
.tituloProdutoPedido font {
    display: table;
    width: auto;
    padding-top:4px;
    float: left;
    border: 0px solid #fff;
}


.opcionaisPedido {
    margin: 0;
    margin-left: 0;
    display: table;
    padding: 0;
    width: 100%;
    border-left: 1px solid #dbe0e5;
}

.opcionaisPedido ul {
    margin: 0;
    padding: 0;
    width: 100%;
 
    list-style-position: inside;
}

.opcionaisPedido ul {
    margin: 0;
    background-color: #fff;
    color: #555;
    display: table;
    border-right: 0 solid #fff;
}

.opcionaisPedido ul li {
    padding: 0 0 0 5px;
    width: 100%;
    margin: 0;
    display: table;
    overflow: hidden !important;
    box-shadow: inset -1px 0 0 #ccc;
}

.opcionaisPedido ul li b {
    font-size: 12px;
    font-weight: 500;
    border: 0 solid #ccc;
    line-height: 26px;
}

.opcionaisPedido ul li:last-child {
    border-top: 0 solid #fff;
    border-bottom: 1px solid #333;
    background-position: center bottom;
    background-repeat: repeat-x;
    background-size: 100% 3px;
}

.opcionaisPedido ul li:first-child {
    border-top: 0 solid #fff;
    background-image: url(img/preto5.png);
    background-position: center bottom;
    background-repeat: repeat-x;
}

.opcionaisPedido ul li:last-child {
    border-bottom: 0 solid #f3f3f3;
}

.opcionaisPedido ul li b {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: table;
    padding: 1px 0 0;
    float: left;
}

.opcionaisPedido ul li spam {
    float: right;
    height: 26px;
    line-height: 26px;
    padding-left: 20px;
    color: #fff;
    width: 100px;
    margin: 0;
    margin-right: 0;
    font-weight: 500;
    font-size: 12px;
    text-align: right;
    padding-right:10px; 
    color: #555;
    background-color: #dbe0e5;
    background-image: url('img/setaBox.png');
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 30px 100%;
}

.opcionaisPedido ul li spam:first-child {
    z-index: -555;
    box-shadow: -10px 10px 10px #000;
}
.observacoesProdutoPedido {
    width: 100%;
    margin: 0;
    padding: 10px;
    display: table;
    background-color: #f3f3f3;
    text-shadow: 1px 1px 1px #fff;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.observacoesProdutoPedido h4 {
    margin: 0;
    padding: 0;
    font-size: 12px;
    font-weight: 600;
}

.observacoesProdutoPedido p {
    margin: 0;
    font-size: 12px;
    margin-top: 1px;
    line-height: 1.3em;
    font-weight: 400;
    color: #555;
}

.rodapeProdutoPedido {
    width: 100%;
    margin: 0;
    height: 40px;
    background-color: #dbe0e5;
    border-bottom: 0px solid #bbb;
    /*background-color: #7d7d7d;
    border-bottom: 5px solid #444;*/
    border-radius: 0px 0px 5px 5px;
}

#itensPedido {
    width: 100%;
    overflow: hidden;
    background: #fff;
    background: -moz-linear-gradient(top,#fff 0%,#f3f3f3 43%,#ededed 55%,#fff 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#fff),color-stop(43%,#f3f3f3),color-stop(55%,#ededed),color-stop(100%,#fff));
    background: -webkit-linear-gradient(top,#fff 0%,#f3f3f3 43%,#ededed 55%,#fff 100%);
    background: -o-linear-gradient(top,#fff 0%,#f3f3f3 43%,#ededed 55%,#fff 100%);
    background: -ms-linear-gradient(top,#fff 0%,#f3f3f3 43%,#ededed 55%,#fff 100%);
    background: linear-gradient(to bottom,#fff 0%,#f3f3f3 43%,#ededed 55%,#fff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#ffffff',GradientType=0);
}

#grupoCategoriasCarrinho {
    overflow: hidden;
}

ul.selectem-items {
    overflow: hidden !important;
}

.rodapeProdutoPedidoEsquerdo {
    float: left;
}

.rodapeProdutoPedidoDireito {
    float: right;
    color: #555;
    font-weight: 500;
    padding: 10px 10px 10px 0;
}

.rodapeProdutoPedidoDireito spam {
    font-weight: 300;
    font-weight: 400;
    font-size: 12px;
    margin-right:3px;
}

.btSomar,.btSubtrair {
    float: left;
    border: 0;
    border-radius: 100%;
    color: #fff;
    padding: 0;
    height: 25px;
    width: 25px;
    font-weight: 400;
    font-size: 22px;
    background-repeat: no-repeat;
    margin: 6px 10px 10px;
    background-size: 33px;
    background-position: center center;
    background-color: #9b0000;
}

.btSomar {
    background-color: #34A203!important;
    background-image: url(https://static.onpedido.com.br/img/mais.svg);
}

.btSubtrair {
    background-color: #555!important;
    background-image: url(https://static.onpedido.com.br/img/menos.svg);
}

.btSomar:hover,.btSubtrair:hover {
    /*box-shadow: 2px 2px 3px #333;*/
}

.btSomar:active,.btSubtrair:active {
    box-shadow: -2px -2px 3px #999;
}

.boxQtd {
    min-width: 27px;
    height: 27px;
    border-radius: 5px;
    text-align: center;
    color: #fff;
    float: left;
    font-size: 16px;
    font-weight: 600;
    padding: 4px 5px 1px;
    margin: 6px 0 0;
    border: 0 solid #fff;
    background-color: #444;
}

/*** OPCIONAIS ***/
.boxOpcoes {
    width: 100%;
}

.boxRollProduto {
    overflow-y: scroll;
    overflow-x: hidden;
}

#telaProduto {
    background-color: #f8f8f8;
}

.boxOpcoes textarea {
    min-height: 250px !important;
    width: 90% !important;
    margin: 0 auto;
    margin-top: 20px;
    display: table;
    border: 0 solid;
    color: #333;
    padding: 20px;
    font-size: 14px;
    font-weight: 400;
    background-color: #f9ffdf;
    box-shadow: 0 3px 2px #ccc;
}

.itemOpcao {
    display: table;
    width: 100% !important;
    padding: 0;
    border-top: 0px solid #fff;
    border-bottom: 1px solid #ddd;
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    color: #777;
}

.promocaoOpcao{
    font-size: 9px;
    text-align: center;
    border-radius: 3px;
    font-weight: 600;
    color: #fff;
    background-color: #34a203;
    padding-top: 1px;
    display: block;
    width: 100px;
    height: 20px;
    margin-bottom: 5px;
    
}
.promocaoOpcao:before {
  content: "";
  display: inline-block;
  vertical-align: bottom;
  margin-left: 60px;
  width: 0; 
  height: 0;
  margin-top:19px;
  position: absolute;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #34a203;
}
.categoriaOpcoes {
    width: 100%;
    height: auto;
    display: table;
    background-color: #ccc;
    color: #555;
    font-weight: 700;
    padding: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;   
}
.categoriaOpcoes h1 {
    font-size: 14px;
    margin: 0;
    font-weight: 600;
    line-height: 1.2em;
    text-align: center;
}
.categoriaOpcoes h2 {
    font-size: 12px;
    margin: 0;
    margin-top: 2px;
    font-weight: 400;
    line-height: 1.5em;
    text-align: center;
}
.boxOpcoes .itemOpcao:nth-child(1) {
    border-top: 0 solid #c00 !important;
}

.itemOpcao label span:nth-child(1) {
    font-size: 14px;
    font-weight: 600;
    color: #9b0000;
    width: 100%;
    display: table;
}
.boxFP .itemOpcao label span:nth-child(1) img {
    width: 60px;
    margin-top:0px;
    float: right;
    position: relative;
    border-radius: 3px;
    display: table;
    text-align:right;
}
.itemOpcao label span:nth-child(2) {
    font-weight: 600;
    color: #34a203;
    right: 0;
    margin-top: -20px;
    float: right;
    font-size:12px;
}
.itemOpcao label span:nth-child(2) img {
    width: 60px;
    float: right;
    position: relative;
    border-radius: 3px;
    display: table;
    text-align:right;
}
.itemOpcao label span:nth-child(3) {
    font-size: 14px;
    font-weight: 400;
    color: #777;
    float: left;
    width: 100%;
    display: table;
    
}

.itemOpcao label {
    margin: 0;
    height: 50px;
    width: 100%;
    padding: 10px;
    padding-left: 15px;
    float: left;
    display: table;
}

.itemOpcao input[type="radio"],
.itemOpcao input[type="checkbox"],
.mdItemOpcao input[type="radio"]{
    display: none;
}
.retiradaCheck input[type="radio"] + label{
    padding-left: 60px;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    background-position: 10px center;
    background-image: url(img/balcao.png);
}
.localidadeCheck input[type="radio"] + label{
    padding-left: 60px;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    background-position: 10px center;
    background-image: url(img/casa.png);
}
.novaLocalidadeCheck input[type="radio"] + label{
    padding-left: 60px;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    background-position: 10px center;
    background-image: url(img/novaCasa.png);
}
.relogioCheck input[type="radio"] + label{
    padding-left: 60px;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    background-position: 10px center;
    background-image: url(img/relogio64.png);
}
@-webkit-keyframes breath {
 0%   {  background-size: 30px auto; padding-left: 50px;}
 50%  {  background-size: 40px auto; padding-left: 60px;}
 100% {  background-size: 30px auto; padding-left: 50px;}      
} 
.inputsFormMD{
    display: flex!important;
    flex-wrap: wrap;
    align-items: flex-start;
}
.inputsFormMD select{
    padding-left: 67px!important;
    background-size: auto, 30px;
    background-position: 95% 50%, 3% 50%;
    background-repeat: no-repeat, no-repeat;
    background-color: #fff;
}
.inputsFormMD .inputIfIconMD{
    padding-left: 67px!important;
    background-size: 30px;
    background-position: 3% 50%;
    background-repeat: no-repeat;
    background-color: #fff;
}
.inputsFormMD textarea{
    resize: none!important;
}
.mdItemOpcao {
    width: 45%;
    border: 0px solid #ccc;
    margin-bottom: 5%!important;
    margin-left: 2.5%;
    margin-right: 2.5%;
    font-weight: 400;
    color: #ccc;
    box-shadow: 0px 0px 5px #ccc;
    border-radius: 5px!important;
    word-break: break-word;
    background-color: #fff;
}
.mdItemOpcao label{
    height: 100%;
    padding-top:15px;
    padding-bottom: 15px;
    border-radius: 5px!important;
    background-position: 10px 50%!important;
    vertical-align: middle!important;
    display: flex!important;
    border-bottom: 5px solid  #eee;
}
.mdItemOpcao .spanUm{
    padding-left: 5px;
    font-size: 18px!important;
    font-weight: 600;
    padding-right: 15px;
    height: auto!important;
}
.mdItemOpcao .spanTres{
    font-size: 12px!important;
    line-height: 16px!important;
}
.mdItemOpcao input[type="radio"]+ label,
.mdItemOpcao input[type="checkbox"] + label{
    padding-left: 50px;
    color: #444;
    background-color: none;
    background-repeat: no-repeat;
    margin: 0px;
    background-size: 30px 30px;
    background-position: 10px 15px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    border-radius: 5px!important;
}
.mdItemOpcao input[type="radio"]:checked  + label,
.mdItemOpcao input[type="checkbox"]:checked + label{
    padding-left: 50px;
    background-color: #ecffe8;
    border-bottom: 5px solid  #34A203;
    background-repeat: no-repeat;
    background-size:  30px 30px;
    background-position: 10px 15px;
    -webkit-transition: background 0.2s ease-in-out;
    -moz-transition: background 0.2s ease-in-out;
    -o-transition: background 0.2s ease-in-out;
    transition: background 0.2s ease-in-out;
    -webkit-animation: breath 1s ease-in-out none;
}
.mdItemOpcao input[type="radio"]:checked + label,
.mdItemOpcao input[type="checkbox"]:checked + label{
    padding-left: 50px;
    background-color: #ecffe8;
    background-repeat: no-repeat;
    background-size:  30px 30px;
    background-position: 10px 15px;
    background-image: url(img/checkCirculo.png);
    -webkit-transition: background 0.2s ease-in-out;
    -moz-transition: background 0.2s ease-in-out;
    -o-transition: background 0.2s ease-in-out;
    transition: background 0.2s ease-in-out;
    -webkit-animation: breath 1s ease-in-out none;
}
.itemOpcao input[type="radio"]+ label,
.itemOpcao input[type="checkbox"] + label{
    padding-left: 50px;
    background-color: none;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    background-position: 10px 15px;
    background-image: url(img/uncheckCirculo.png);
    -webkit-transition: background 0.2s ease-in-out;
    -moz-transition: background 0.2s ease-in-out;
    -o-transition: background 0.2s ease-in-out;
    transition: background 0.2s ease-in-out;
    
}
.itemOpcao input[type="radio"]:checked + label,
.itemOpcao input[type="checkbox"]:checked + label{
    padding-left: 50px;
    background-color: #ecffe8;
    background-repeat: no-repeat;
    background-size:  30px 30px;
    background-position: 10px 15px;
    background-image: url(img/checkCirculo.png);
    -webkit-transition: background 0.2s ease-in-out;
    -moz-transition: background 0.2s ease-in-out;
    -o-transition: background 0.2s ease-in-out;
    transition: background 0.2s ease-in-out;
    -webkit-animation: breath 1s ease-in-out none;
}
.itemOpcaoQtd {
    display: table;
    padding: 10px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #ccc;
    width: 100%;
}
.itemOpcaoQtd table,
.itemOpcaoQtd table td{
    border: 0px solid #ccc;
    valign: top;
}
.itemOpcaoQtd table td:nth-child(1){
    border: 0px solid #ccc;
    vertical-align: top;
}
.itemOpcaoQtd table td:nth-child(2){
    width: 100%;
    vertical-align: top;
}
.itemOpcaoQtd table td:nth-child(3){
    width: 100%;
    vertical-align: top;
    font-size:12px;
}

.itemOpcaoQtd .titulo{
    font-size: 14px;
    font-weight: 600;
    color: #c00;
    width: auto;
    display: table;
    float: left;
}
.itemOpcaoQtd .valor{
    font-weight: 600;
    color: #34a203;
    width: 90px;
    display: table;
    text-align:right;
}
.itemOpcaoQtd .imagem img{
    width: 60px;
    float: right;
    border-radius: 3px;
    display: table;
    text-align:right;
}
.itemOpcaoQtd .descricao{
    font-size: 14px;
    font-weight: 400;
    color: #333;
    float: left;
    width: 100%;
}

.itemOpcao span:nth-child(3){
    width: 100%;
    font-size: 14px;
    float: left;
}

.btMaisOpcao, .btMenosOpcao {
    float: left;
    border: 0;
    border-radius: 100%;
    color: #fff;
    /*! padding: 0; */
    height: 25px;
    width: 25px;
    /*! font-family: 'Open Sans',sans-serif; */
    font-weight: 400;
    font-size: 21px;
    cursor: pointer;
    outline: none;
    background-repeat: no-repeat;
    margin: 10px 10px 10px;
    background-size: 33px;
    background-position: -4px -4px;
    background-color: #c00;
    display: table!important;
    
}

.btMaisOpcao {
    /*background-image: url(https://static.onpedido.com.br/img/mais.svg);*/
    
    text-align: center;
    padding-top:15px!important;
    margin-right: 0px;
}
.btMaisOpcao::before { 
  content: "+";
  width: 20px;
  text-align: center;
    height: 20px!important;
    border: 0px solid #000;
    display: table;
    font-weight: bold;
    margin-top: -1px;
    margin-left: 2.5px;
}
.btMenosOpcao {
    /*background-image: url(https://static.onpedido.com.br/img/menos.svg);*/
    margin-left: 0px;
}
.btMenosOpcao::before { 
    content: "-";
    width: 20px;
    text-align: center;
    height: 20px!important;
    border: 0px solid #000;
    display: table;
    font-weight: bold;
     margin-top: -1px;
    margin-left: 2.5px;
}

.btMaisOpcao:hover,.btMenosOpcao:hover {
    box-shadow: 2px 2px 3px #ccc;
}

.btMaisOpcao:active,.btMenosOpcao:active {
    box-shadow: -2px -2px 3px #ccc;
}
.numeroItens{
    background-color: #555;
    width: 30px;
    height: 25px;
    float: left;
    display: table;
    border-radius: 3px;
    color: #fff;
    font-weight: bold;  
    margin: 10px 0px 0px;
}
.numeroItens div{
    display: table-cell; 
    vertical-align: middle; 
    text-align: center;  
}
.boxQtds {
    display:table;
    width: auto;
    float: left;
    border: 0px solid #ccc;
    padding: 0px;
    width: 110px;
}
.grupoRollOpcoes {
    display: table;
    width: 100%;
}
.tituloBox {
    font-weight: 400;
    color: #333;
    display: table;
    width: 100%;
    margin: 0px;
}

.tituloBox span {
    border-radius: 100%;
    width: 28px;
    height: 28px;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    line-height: 100%!important;
    background-color: #9b0000;
    
}

.tituloBox font {
    padding-left: 10px;
    padding-right: 15px;
    line-height: 1.2;
    display: table-cell;
    vertical-align: middle;
    font-size: 14px;
    font-weight:500;
    height: 25px;
}
.tituloBox font.iconeObservacao{
    padding: 0px;
    line-height: 2;
}
.iconeObservacao::before{
    content: "";
    border-radius: 50px;
    float: left;
    width: 28px;
    height: 28px;
    margin-right: 10px;
    display: block;
    background-color: #333;
    background-position: center center;
    background-size: 15px;
    background-repeat: no-repeat;
    background-image: url(https://onpedido.com.br/static/img/editarBranco.png);
}
.cabecalhoSecundarioOpcionais {
    width: 100%;
    display: table;
    height: 42px;
    padding: 0;
    background-color: #fff;
    vertical-align: middle;
    box-shadow: 0 2px 2px #b8b8b8;
}

.tituloBox {
    float: left;
    font-size: 16px;
    font-weight: 500;
    height: auto;
    width: 100%;
    display: table;
    margin-left: 10px;
    margin-top: 7px;
    margin-bottom: 7px;
    border: 0 solid #ccc;
}

.display {
    display: none;
}

/*** Box Lista ***/
#boxLista {
    top: 50px;
    left: 50%;
    height: auto;
    display: table;
    margin-left: -50%;
    position: absolute;
    line-height: 1.3em;
    background-color: #fff;
}

#boxListaTitulo {
    padding: 15px;
    padding-left: 15px;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    background-color: #9b0000;
    background-repeat: repeat;
}

#boxListaConteudo{
    overflow-y: scroll;
    overflow-x: hidden;
}

.boxListaCancelar {
    float: left;
    width: 50%;
    color: #fff;
    padding: 15px;
    display: table;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    background-color: #555;
}

.boxListaOk {
    float: left;
    width: 50%;
    color: #fff;
    padding: 15px;
    display: table;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    background-color: #34a203;
}
#boxLista .Ok {
    width: 100%;
}
/*** Aviso Alerta ***/
.avisoAlerta {
    top: 20%;
    left: 50%;
    width: 70%;
    height: auto;
    display: table;
    margin-left: -35%;
    position: absolute;
    line-height: 1.3em;
    background-color: #fff;
    box-shadow: 0 0 50px #000;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    z-index: 999;
}

.avisoTitulo {
    padding: 15px;
    padding-left: 15px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    background-color: #9b0000;
    background-repeat: repeat;
    -webkit-border-top-left-radius: 3px;
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-topright: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.avisoTexto {
    padding: 10px 15px;
    font-size: 14px;
}

.avisoCancelar {
    float: left;
    width: 50%;
    color: #fff;
    padding: 15px;
    display: table;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    background-color: #555;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-left-radius: 3px;
}

.avisoOk {
    float: left;
    width: 50%;
    color: #fff;
    padding: 15px;
    display: table;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    background-color: #34a203;
    -webkit-border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    border-bottom-right-radius: 3px;
}
.Ok {
    width: 100%;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.avancarTela,
.avancarTelaFP,
.avancarTelaCadastro,
.submeterFormulario{
    border: 0;
    color: #fff;
    float: right;
    height: 50px;
    padding: 10px;
    display: table;
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    overflow: hidden;
    text-align: center;
    border-radius: 0;
    background-color: #34a203;
  
}
.voltar,
.voltarFP,
.voltarCadastro {
    border: 0;
    color: #fff;
    float: left;
    height: 50px;
    padding: 10px;
    display: table;
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    overflow: hidden;
    text-align: center;
    border-radius: 0;
    background-color: #555;
    
}
.promocoesVazio,
.carrinhoVazio{
    width: 100%;
    margin:0 auto;
    margin-top:40px;
    margin-bottom:40px;
    text-align: center;
    display: table;
    border:0px solid #000;
}
.promocoesVazio font,
.carrinhoVazio font {
    font-size:18px;
    margin-top:10px;
    margin-bottom: 5px;
    display: table;
    width:100%;
    font-weight: 600;
    color: #9b0000;
    text-align:center;
}
.promocoesVazio p,
.carrinhoVazio p {
    color:#333;
    font-size: 14px;
    margin: 0px;
    width:100%;
    display:table;
    text-align:center;
}
.iconeSemPromocoes{
    width: 80px;
    height:80px;
    border-radius:100%;
    margin:0 auto;
    background-image: url('data:image/svg+xml,<svg fill="%23fff" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17.5,1.917a6.4,6.4,0,0,0-5.5,3.3,6.4,6.4,0,0,0-5.5-3.3A6.8,6.8,0,0,0,0,8.967c0,4.547,4.786,9.513,8.8,12.88a4.974,4.974,0,0,0,6.4,0C19.214,18.48,24,13.514,24,8.967A6.8,6.8,0,0,0,17.5,1.917Zm-3.585,18.4a2.973,2.973,0,0,1-3.83,0C4.947,16.006,2,11.87,2,8.967a4.8,4.8,0,0,1,4.5-5.05A4.8,4.8,0,0,1,11,8.967a1,1,0,0,0,2,0,4.8,4.8,0,0,1,4.5-5.05A4.8,4.8,0,0,1,22,8.967C22,11.87,19.053,16.006,13.915,20.313Z"/></svg>');
    background-repeat:no-repeat;
    background-position: center center;
    background-size: 40px auto;
    background-color: #9b0000;
}
.iconeCarrinhoVazio{
    width: 80px;
    height:80px;
    border-radius:100%;
    margin:0 auto;
    background-image: url('data:image/svg+xml,<svg fill="%23FFF" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M23,19H21V17a1,1,0,0,0-2,0v2H17a1,1,0,0,0,0,2h2v2a1,1,0,0,0,2,0V21h2a1,1,0,0,0,0-2Z"/><path d="M21,6H18A6,6,0,0,0,6,6H3A3,3,0,0,0,0,9V19a5.006,5.006,0,0,0,5,5h9a1,1,0,0,0,0-2H5a3,3,0,0,1-3-3V9A1,1,0,0,1,3,8H6v2a1,1,0,0,0,2,0V8h8v2a1,1,0,0,0,2,0V8h3a1,1,0,0,1,1,1v5a1,1,0,0,0,2,0V9A3,3,0,0,0,21,6ZM8,6a4,4,0,0,1,8,0Z"/></svg>');
    background-repeat:no-repeat;
    background-position: center center;
    background-size: 40px auto;
    background-color: #9b0000;
}
.itensMenu{
    margin-top: 50px!important;
}
.corpoMenu{
    background-image:url('img/bgGradiente.png');
    background-repeat:no-repeat;
    background-position: 0px 0px;
    background-size: 100% 100%;
    overflow-y: scroll;
    overflow-x: hidden;
    border-radius: 0px 30px 30px 0px;
    background-color:#A70000;
   
}
.corpoMenu .pedidos,
.corpoMenu .horarios,
.corpoMenu .taxas,
.corpoMenu .pagamento,
.corpoMenu .contato,
.corpoMenu .termos,
.corpoMenu .app{
    display: table;
    width: 300px;
    border: 0px solid #000;
    padding: 17px;
    padding-left:60px; 
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}
.corpoMenu .app {
    background-image:url('img/smartphone-download.png');
    background-repeat:no-repeat, repeat-x;
    background-position: 12px 50%,  0px top;
    background-size: 35px auto, 1px 1px;
}
.corpoMenu .termos {
    background-image:url('img/termos.png');
    background-repeat:no-repeat, repeat-x;
    background-position: 16px 50%,  0px top;
    background-size: 30px auto, 1px 1px;
}
.corpoMenu .taxas {
    background-image:url('img/motoBranco.png');
    background-repeat:no-repeat, repeat-x;
    background-position: 15px 50%,  0px top;
    background-size: 27px auto, 1px 1px;
}
.corpoMenu .pedidos {
    background-image:url('img/pedidoVazio.png');
    background-repeat:no-repeat, repeat-x;
    background-position: 15px 50%, 0px top;
    background-size: 27px auto, 1px 1px;
}
.corpoMenu .horarios {
    background-image:url('img/relogioBranco.png');
    background-repeat:no-repeat, repeat-x;
    background-position: 15px 50%, 0px top;
    background-size: 27px auto, 1px 1px;
}
.corpoMenu .pagamento {
    background-image:url('img/dinheiroBranco.png');
    background-repeat:no-repeat, repeat-x;
    background-position: 15px 50%, 0px top;
    background-size: 27px auto, 1px 1px;
}
.corpoMenu .contato {
    background-image:url('img/contatoBranco.png');
    background-repeat:no-repeat, repeat-x;
    background-position: 15px 50%, 0px top;
    background-size: 27px auto, 1px 1px;
}
.corpoMenu .telacheia {
    background-image:url('img/full-screen.png');
    background-repeat:no-repeat, repeat-x;
    background-position: 17px 50%, 0px top;
    background-size: 25px auto, 1px 1px;
    display: table;
    width: 300px;
    border: 0px solid #000;
    padding: 15px;
    padding-left:60px; 
    color: #fff;
    margin: 0px;
    font-size: 16px;
}
.direitos{
    width: 100%;
    margin-top: 0px;
    color: #fff;
    font-size: 12px;
    background-image:  url('img/preto10.png');
    background-repeat: repeat;
    background-position: 0px top;
    background-size: 1px 1px;
    padding: 7px;
    text-align: center;
    height: 60px;
    display: table;
}
.direitos .titulo,
.direitos .ano{
    position: relative;
    margin: 0px;
    width: auto;
    padding: 0px;
}

.direitos a:link,
.direitos a:active,
.direitos a:visited{
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    opacity: 0.5;
}
.direitos a:hover{
    opacity: 1;
}
.logoOnpedido{
    opacity: 0.7;
    height: 20px;
    margin: 0 auto;
    margin-top: 4px;
    background-image: url(https://onpedido.com.br/static/img/logoOnpedidoLettering.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 70px;
}
.tituloMenuSesssao{
    display: table;
    width: 300px;
    border: 0px solid #000;
    padding: 10px;
    color: #fff;
    margin: 0px;
    font-size: 14px;
    font-weight: 600;
    background-image:  url('img/setaBaixoGrande.png'), url('img/preto30.png');
    background-repeat:no-repeat, repeat;
    background-position: 260px 15px, 0px top;
    background-size: 25px auto, 1px 1px;
}
.cabecalhoMenu{
    margin: 0px;
    padding: 0px;
    height: 150px;
    
}

.corpoMenu .btEntrar{
    width: 150px;
    color: #fff;
    text-align: center;
    height: 45px;
    padding: 0px;
    float: left;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size: 14px;
    font-weight: 600;
    background-color: #34A203;
}
.corpoMenu #sairLogin{
    font-size: 14px;
    font-weight: 600;
}
.corpoMenu #btMenuCadastrese{
    font-size: 14px;
    font-weight: 600;
}
.corpoMenu .btCadastro{
    width: 150px;
    color: #fff;
    text-align: center;
    float: none;
    height: 45px;
    padding: 0px;
    float: left;
    display:flex;
    justify-content:center;
    align-items:center;
    background-color: #555;
}
.bottom20{
    width: 100%;
    height:20px;
    clear: both;
}
.pagina {
  display: table;
  margin-top:15px;
  width: 100%;
  padding-top:15px;
  padding-left:15px;
  padding-right: 15px;  
}
.pagina b {
    font-weight: 600;
}
.inputsForm label {
    color: #777;
    display: table;
    width: 100%;
    margin-top: -5px;
    margin-bottom: 5px;
}
.inputsForm {
    display: table;
    margin-top:15px;
    width: 100%;
    padding-left:15px;
    padding-right: 15px;
}
.inputsForm input,
.inputsForm textarea,
.inputsForm select{
    padding: 15px;
    width: 100%;
    margin:0 auto;
    font-size: 110%;
    font-weight:normal;
    background-color: #FFFFFF;
    color: #333;
    border-top: 1px solid #E5E6E9;
    border-right: 1px solid #DFE0E4;
    border-bottom: 0px solid #D0D1D5;
    border-left: 1px solid #DFE0E4;
    display: table;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    box-shadow: 0 2px 2px #b8b8b8;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
   -user-select: auto;
}
.inputsForm #login,
.inputsForm #cadastrese,
#locaisEntregaCadastro,
#recuperarSenhaCadastro,
.inputsForm .submeter{
   border:0px;
    font-size: 100%;
    line-height: 16.08px;
    word-spacing: 0px;
    color: #fff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 15px;
    font-size: 14px!important;
    width: 100%;
    margin:0 auto;
    display:block;
}
#locaisEntregaCadastro,
#recuperarSenhaCadastro,
.inputsForm .submeter,
.inputsForm #login{
   background-color: #34A203;
}

.inputsForm #cadastrese{
   background-color: #555;
}
.solido{
    width: 100%;
    display: table;
    border:0px solid #000;
}
.pedidoBox {
    width: 320px;
    padding: 12px;
    font-size: 12px!important;
    box-shadow: 0 0 3px #777;
    margin: 0 auto;
    margin-bottom: 15px;
    margin-top: 15px;
    background-color: #f9ffdf;
    color: #000;
    display: table;
    font-family: monospace; 
    font-style: normal;
    font-weight: 400;
}
.carrinhoValor{
    width:100%;
    height: 130px;
    background-color:#dbe0e5;
    text-align: left;
    padding-left:15px;
    display:flex;
    line-height: 1.7;
    justify-content:left;
    align-items:center;
    font-size: 14px;
    color: #555;
    font-weight: 400;/*
    background-position: center 0px;
    background-image: url(img/borda.jpg);
    background-repeat: repeat-x;
    background-size: 15px;
    padding-top: 10px;*/
}
.carrinhoValor span{
    width: 100%;
}
.carrinhoValor font{
    font-size: 85%;
    font-weight: 600;
}
.carrinhoValor table{
    width: 100%;
}
.btFinalizar{
    width:100%;
    height: 50px;
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    margin:0 auto;
    background-color: #34A203;
    text-align: center;
    display:flex;
    justify-content:center;
    align-items:center;
    z-index:600;
}
#corpoCarrinho {
    display: table;
    width: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
}
.right{
    float: right;
}
.formasPagamento{
   text-align: center;
   display:flex;
   justify-content:left;
   align-items:center; 
}
.formasPagamento img {
    border-radius: 3px;
    width:60px;
    margin-right:10px;
}
.imgDelivery {
    height: 200px;
    background-size: auto 100%;
    background-repeat: no-repeat, repeat-x;
    background-position: center top;
    background-image: url(img/delivery.jpg),url(img/delivery-continuos.jpg);
    margin-bottom: 20px;
}
.imgDeliveryErro {
    height: 200px;
    background-size: auto 100%;
    background-repeat: no-repeat, repeat-x;
    background-position: center top;
    background-image: url(img/imgAdvertencia.jpg),url(img/delivery-continuos.jpg);
    margin-bottom: 20px;
}
.imgIcon{
    height: 170px;
    background-size: auto 80%, auto 100%;
    background-repeat: no-repeat, repeat-x;
    background-position: center 50%, center top;
    margin-bottom: 20px;
}
.padding20{
    padding:20px;
}
.fullStatus {
    width: 97%;
    border-radius: 3px;
    margin: 0 auto;
    margin-top: 10px;
    background-color: #fff;
    font-weight: 600;
    padding-left:15px;
    padding-right:15px;
    display: table; 
    box-shadow: 0 0 2px #b8b8b8;
}
.fullStatus font {
    max-width: 85%;
}
.iconeMenuInformativo {
    float: left;
    display: table;
    width: 25px;
    height: 25px;
    margin-right: 15px;
    background-color: none;
    background-size: 25px;
    background-repeat: no-repeat;
    background-position: center top;
}
.status {
    padding: 10px 0;
    margin: 0 auto;
    float: left;
    min-height: 75px;
    display:flex;
    font-size:12px;
    font-weight: 400;
    justify-content:center;
    align-items:center;
}
.aberto {
    background-color: #ecffe8;
    color: #0e6c00;
}

.fechado {
    background-color: #ffd1d1;
    color: #9b0000;
}

.statusInativo {
    background-image: url(https://static.onpedido.com.br/img/erro.png),url(https://static.onpedido.com.br/img/pontoVermelho.gif);
    border-radius: 100px;
    background-size: 52% 52%,100% 100%;
    background-position: 50% 50%,center top;
    width: 25px;
    height: 25px;
    display: table;
}

.statusAtivo {
    background-image: url(https://static.onpedido.com.br/img/checadoBranco.png),url(https://static.onpedido.com.br/img/pontoVerde.gif);
    border-radius: 100px;
    background-size: 70% 70%,100% 100%;
    background-position: 50% 50%,center top;
    width: 25px;
    height: 25px;
    display: table;
}
.boxFP{
    overflow-y: scroll;
}
.boxFP label{
    font-size: 14px;
    color: #555;
}
.boxFP label font{
    display: table;
    float: right;
    width: auto;
    font-size: 12px;
    color: #a7a7a7;
}
#formaPagamentoFP {
    background-position: 7px 50%!important;
}
.inputSifrao input {
    width: 85%;
    border-radius: 0px 3px 3px 0px;
}
.inputsForm b {
    color: #333;
    font-weight: 600;
}
.inputSifrao .sifraoFP{
    width: 15%;
    float: left;
    color: #fff;
    margin-top: 0px;
    padding-top: 17px;
    text-align: center;
    height: 55px;
    margin-right: -1px;
    font-weight: 600;
    font-size: 110%;
    background-color: #34a203;
    color: #fff;
    border-top: 1px solid #E5E6E9;
    border-right: 0px solid #DFE0E4;
    border-bottom: 0px solid #D0D1D5;
    border-left: 0px solid #DFE0E4;
    display: table;
    border-top-left-radius: 3px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 0px;
    box-shadow: -1px 2px 2px #b8b8b8;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}
#boxDinheiroFP input {
    height: 55px!important;
    border-left:0px!important;
}
#boxDinheiroFP b {
    color: #34a203;
    font-size: 110%;
    text-align: center;
    text-shadow: 1px 1px 1px #fff; 
}
.cupomDesconto {
    background-color: #34A203;
    padding-left: 5px;
    padding-right: 5px;
    border-radius: 3px;
    margin-left:5px;
}
#retiradaFP .iconRestaurante{
    width: 77px;
    height: 77px;
    background-color: #34a203;
    border-radius: 100px;
    margin: 0 auto;
    margin-bottom: 20px;
    background-size:40px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url(https://static.onpedido.com.br/img/restaurante.png);
}
#retiradaFP{
    text-align: center;
    color:#444!important;
}
.carrinhoFP {
    display: table;
    padding: 15px;
    width: 100%;
    font-size: 100%;
    font-weight:normal;
    background-color: #E9F6EF;
    color: #444;
    border-top: 1px solid #E5E6E9;
    border-right: 1px solid #DFE0E4;
    border-bottom: 0px solid #D0D1D5;
    border-left: 1px solid #DFE0E4;
    display: table;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    box-shadow: 0 2px 2px #b8b8b8;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    
}
.carrinhoFP font.cupomDesconto {
    color: #fff;
    font-size: 80%;
}
.carrinhoFP font {
    font-size: 90%;
}
.imgSucessoFP {
    background-color: #000;
    height: 160px;
    background-image: url(img/sucessoPedido.png),url(https://static.onpedido.com.br/img/pontoVerde.gif);
    background-size: auto 130%, 100% 100%;
    background-repeat: no-repeat, repeat;
    background-position: center 50%;
    border-bottom: 3px solid #fff;
    box-shadow: 0 2px 2px #b8b8b8;
  
}
.infoBox{
    width: 100%;
    float: left;
    color: #fff;
    padding: 15px;
    text-align: left;
    font-size: 90%;
    background-color: #fff;
    color: #555;
    border-top: 1px solid #E5E6E9;
    border-right: 1px solid #DFE0E4;
    border-bottom: 1px solid #D0D1D5;
    border-left: 1px solid #DFE0E4;
    display: table;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    box-shadow: -1px 1px 2px #b8b8b8;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}
.infoBox b {
    width: 100%;
    display: table;
    font-size: 120%;
    margin-bottom: 10px;
    color: #9B0000;
}
.infoBox font b {
    color: #236c00;
    width: auto;
    font-size: 90%;
    display:inline;
}
.presente {
    padding-left:120px;
    background-position: 15px 50%;
    background-size:90px;
    background-repeat: no-repeat;
    background-image: url(//static.onpedido.com.br/img/descontoPresente.png);
}
.produtoFalta {
    text-shadow: none;
    background-color: #fed201;
    color: #6b5000;
    text-align: center;
    z-index:1;
    margin-top: 0px;
    padding: 3px;
    float: left;
    width: 140px;
    margin: 0 auto;
    border-radius: 3px;
    font-size: 12px;
    clear: both;
    margin-top: 5px;
}
.laminaPizza{
    background-image: url(img/preto30.png);
    background-repeat: repeat;
    display: block;
    border-radius: 5px;
    padding-bottom: 10px;
    overflow:auto;
}

.boxPizza{
    background-color: #000;
    margin:0 auto;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 0px;
    width: 97%;
    margin-top: 5px;
    border-radius: 5px;
    background-image: url('//onpedido.com.br/static/img/pizzaBackground.jpg');
    background-position: center top;
    animation: animatedBackgroundPizzas 20s linear 0s infinite alternate;
 }
 @keyframes animatedBackgroundPizzas {
     from { background-size: 600px auto; background-position: 20% 40%; }
     to { background-size: 1180px auto; background-position: 50% 80%;} 
}/*
.bgPizza{
    background-image: url(img/bgPizza.jpg);
    background-size: 90% auto;
    background-repeat: no-repeat;
    background-position: bottom right;
}*/
@media only screen and (min-width: 768px) {
    
    /*.bgPizza{
        background-size: 600px auto;
    }*/
   .boxPizza{
        background-color: #000;
        margin:0px;
        margin-top: 0px;
        margin-bottom: 0px;
        border-radius: 0px;
        width: 100%;
        border-radius: 5px;
        background-image: url('//onpedido.com.br/static/img/pizzaBackground.jpg');
        background-position: center;
        animation: animatedBackgroundPizzas 20s linear 0s infinite alternate;
   }
   @keyframes animatedBackgroundPizzas {
        from { background-size: 1024px auto; background-position: 35% 35%; }
        to { background-size: 1600px auto; background-position: 100% 80%;} 
    }
}

.boxPizza .titulo{
    display: block;
    width:auto;
    padding: 25px;
    padding-bottom: 15px;
    margin-bottom: 15px;
    height: 20px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    text-shadow: 2px 2px 2px #000;
}
.boxPizza .descricao{
    display: block;
    width:90%;
    margin: 0 auto;
    padding-bottom: 25px;
    text-align: center;
    color: #fff;
    font-weight: normal;
    font-size: 14px;
    text-shadow: 2px 2px 2px #000;
}
.boxPizza .botao{
    margin: 0 auto;
    margin-top: 25px;
    border-radius: 5px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 90%;
    color: #fff;
    margin-bottom: 25px;
    border: 0px solid #29a71a;
    background-color: #29a71a;
    box-shadow:  0px 0px 2px #000;  
    perspective: 2px;
}
.boxPizza table{
    font-size:12px;
    width: 90%;
    text-align: center;
    margin: 0 auto;
}
.boxPizza table td {
    background: #fff;
    border-left:1px solid #ddd;
    padding: 5px;
}
.boxPizza table tr:first-child td {
    border-left:1px solid rgba(0, 0, 0, .1);
    color: #fff;
    font-size:12px;
    text-transform: uppercase;
    font-weight: 500;
}
.boxPizza table tr:last-child td {
    background-color: #dbe0e5;
    color: #555;
    border-left: 1px solid rgba(0, 0, 0, .1);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.2em;
}
.boxPizza table tr:last-child td font:first-child{
    display: table;
    width: 50px;
    font-size:9px;
    margin: 0 auto;
    margin-bottom: -5px;
}
.boxPizza table tr:last-child td font:last-child{
    font-size:9px;
    margin: 0 auto;
    margin-right:2px;
}
.boxPizza table td:first-child {
    border-left: 0px solid transparent;
}
.boxPizza table tr:first-child td:first-child {
    border-radius: 5px 0px 0px 0px;
    border-left: 0px solid;
}
.boxPizza table tr:first-child td:last-child {
    border-radius: 0px 5px 0px 0px;
}
.boxPizza table tr:last-child td:first-child {
    border-radius: 0px 0px 0px 5px;
    border-left: 0px solid transparent;
}
.boxPizza table tr:last-child td:last-child{
    border-radius: 0px 0px 5px 0px;
}
.boxInformacoes{
    padding: 15px;
    padding-left: 5px;
    color: #236c00;
    background-color: #ecffe8;
    font-weight: 600;
    font-size: 14px;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
}
.boxInformacoes::before{
    content: "";
    width:35px;
    height: 35px;
    display: table;
    float: left;
    margin-top:-7px;
    margin-bottom: 0px;
    border-radius:100px;
    margin-right:15px;
    margin-left:5px;
    background-color: #236c00;
    background-image: url(https://onpedido.com.br/static/img/informacoes.png);
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: 45%; 
}
.buscasOpcaoAviso icon{
    width: 100%;
    display: table;
    font-size:26px;
    margin-bottom:15px;
}
.buscasOpcaoAviso{
    padding: 15px;
}
.buscasOpcaoAviso h1{
    font-size:16px;
    font-weight: 600;
    text-align: center;
}
.buscasOpcaoAviso h2{
    font-size:14px;
    font-weight: 400;
    text-align: center;
}
/*** OWL ***/
.owl-carousel .owl-wrapper:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.owl-carousel{
    display: none;
    position: relative;
    width: 100%;
    -ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper{
    display: none;
    position: relative;
    -webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
    overflow: hidden;
    position: relative;
    width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight{
    -webkit-transition: height 500ms ease-in-out;
    -moz-transition: height 500ms ease-in-out;
    -ms-transition: height 500ms ease-in-out;
    -o-transition: height 500ms ease-in-out;
    transition: height 500ms ease-in-out;
}
    
.owl-carousel .owl-item{
    float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
    cursor: pointer;
}
.owl-controls {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.grabbing { 
    cursor:url(grabbing.png) 8 8, move;
}

.owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility:    hidden;
    -ms-backface-visibility:     hidden;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
}
.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  margin-bottom: -1px;
  height: 0;
  border: 0px;
}
.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0px;
}
#loadPaginaExterna{
    border: 0px;
    width: 100%;
    margin: 0px;
}
/*** ANIMAÇÃO CSS ***/

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}
@-webkit-keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;

    transform: none;
  }
}

@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}
@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}
@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}
@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}
@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}
@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}
.switchDuplo{
    width: 320px;
    display: table;
    margin: 0 auto;
    margin-bottom: 20px;
}
.switchDuplo .bt{
    width: 47.5%;
    float: left;
    text-align: center;
    color: #fff;
    background-color: #555;
    padding: 7px;
    border: 0px; 
    font-size: 14px;
}
.switchDuplo .bt:nth-child(1){
    border-radius:  5px;
    margin-right:5%;
}
.switchDuplo .bt:nth-child(2){
    border-radius: 5px;
}
.switchDuplo .ativo {
    background-color:#009a57;
}
.switchDuplo .ativo:before { 
  content: "";
  display: inline-block;
  position: absolute;
  margin-top: 25px;
  margin-left: 10%;
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #009a57;
}
.switchDuplo font{
    position: relative;
    display: table;
    width: 25px;
    height: 25px;
    margin: 0px;
    padding: 3px;
    float: right;
    position: absolute;
    margin-top: -40px;
    margin-left: 130px;
    border-radius: 100%;
    background-color:#a70000;
    font-size: 12px;
    font-weight: 600;
}

#boxPendentes .avisoRastreio, #boxEntregues .avisoRastreio{
    display: table;
    width: 320px;
    margin: 0 auto;
    background-color: #f9ffdf;
    text-align: center;
    padding: 10px;
    color: #555; 
} 
#pendentes {
    padding:200px: 
}
.espacamento{
    width: 100%;
    display: table;
    height: 10px;
}
@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
.pedidoBox .pdBtImpressao input:hover{
    background-image: url(img/impressora.png), url(img/preto30.png);
}
#boxPendentes .pedidoBox .pdEntrega{
    background: linear-gradient(-90deg, #222299, #5a5aed, #222299, #5a5aed);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    background-color:#222299;
}
#boxPendentes .pedidoBox .pdAgendadoRetirado{
    background: linear-gradient(-90deg, #560081, #9f00ef, #560081, #9f00ef);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    background-color:#560081;
}
#boxPendentes .pedidoBox .pdAgendado{
    background: linear-gradient(-90deg, #ff6600, #ff802b, #ff6600, #ff802b);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    background-color:#ff6600;
}
#boxPendentes .pedidoBox .pdRetirada{
    background: linear-gradient(-90deg, #2b98f2, #5bb5ff, #2b98f2, #5bb5ff);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    background-color:#2b98f2;
}

/**/
.pedidoBox .pdEntrega{
    background-color:#222299;
}
.pedidoBox .pdAgendadoRetirado{
    background-color:#560081;
}
.pedidoBox .pdAgendado{
    background-color:#ff6600;
}
.pedidoBox .pdRetirada{
    background-color:#2b98f2;
}
.pedidoBox table{
    font-size:12px;
    width: 100%;
    display: table;
    margin-bottom:10px;
    text-align: center;
    margin: 0 auto;
    font-family: "-apple-system","Helvetica Neue","Segoe UI",sans-serif;
    text-rendering: optimizeLegibility;
}
.pedidoBox table tr:nth-child(1) th{
    font-size: 12px;
    font-weight: 600;
    color: #fff;   
    padding: 10px;
    border-bottom: 0px solid transparent;
    -webkit-border-radius: 5px 5px 0px 0px!important;
    -moz-border-radius: 5px 5px 0px 0px!important;
    -ms-border-radius: 5px 5px 0px 0px!important;
    border-radius: 5px 5px 0px 0px!important;
}
.apple .pedidoBox table tr th {
    -webkit-border-radius: 5px 5px 0px 0px!important;
    -moz-border-radius: 5px 5px 0px 0px!important;
    -ms-border-radius: 5px 5px 0px 0px!important;
    border-radius: 5px 5px 0px 0px!important;
}
.pedidoBox table td { 
    background: #fff; 
    border-left:1px solid #ddd;
    padding: 5px;
}
.pedidoBox table tr:nth-child(2) td {
    border: 1px solid rgba(0, 0, 0, .1);
    color: #fff;
    font-size:10px;
    background-color: #ccc;
    text-transform: uppercase;
    font-weight: 600;
    height: 50px; 
    background-repeat: no-repeat;
    background-size: 40px;
    background-position: 50% 50%;
}
.pedidoBox table tr:nth-child(3) td{
    font-size:10px;
    font-weight: 600;
    line-height: 1.5;
}
.pedidoBox .rodape b {
    color: #fff;
    display: table;
    margin: 0 auto;
    margin-top: -2px;
}
.pedidoBox .rodape{
    padding: 5px;
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    background-color: #555;
    border:0px solid;
    -webkit-border-radius: 0px 0px 5px 5px!important;
    -moz-border-radius: 0px 0px 5px 5px!important;
    -ms-border-radius: 0px 0px 5px 5px!important;
    border-radius: 0px 0px 5px 5px!important;
}

.apple .pedidoBox .rodape {
    -webkit-border-radius: 0px 0px 5px 5px!important;
    -moz-border-radius: 0px 0px 5px 5px!important;
    -ms-border-radius: 0px 0px 5px 5px!important;
    border-radius: 0px 0px 5px 5px!important;
}

.pedidoBox table tr:nth-child(2) td:nth-child(1){
    background-image: url(https://static.onpedido.com.br/img/pedidoEnviado.png);  
}
.pedidoBox table tr:nth-child(2) td:nth-child(2){
    background-image: url(https://static.onpedido.com.br/img/ok.png);
}
.pedidoBox td.entrega {
    background-image: url(https://static.onpedido.com.br/img/pedidoSaiu.png);  
}
.pedidoBox td.retirada {
    background-image: url(https://static.onpedido.com.br/img/balcao.png);  
}
.pedidoBox table tr:nth-child(2) td:nth-child(4){
    background-image: url(https://static.onpedido.com.br/img/bag2.png);  
}
.pedidoBox table tr:nth-child(4) td:last-child {
    border-right: 1px solid rgba(0, 0, 0, .1);
}
.pedidoBox table tr:nth-child(4) td {
    background-color: #fff;
    border-left: 1px solid rgba(0, 0, 0, .1);
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    font-size:10px;
    font-weight: 600;
    width: 25%;
    color: #888;
    line-height: 1.2em;
}
.pedidoBox table .pdAtrasado{
    color: #fff;
    background-image: url(img/pontoVermelho.gif);
}
.pedidoBox table .pdAtrasado font{
    color: #fff;
    width: 100%;
    margin:0 auto;
    padding:0px;
}
.pedidoBox table tr:nth-child(2) td.statusPedidoConcluido{
    background-color: #236c00!important;
}
.pedidoBox table tr:nth-child(3) td.statusPedidoConcluido{
    background-color: #ecffe8!important;
    color: #236c00;
}
.pedidoBox table tr:nth-child(2) td.statusPedidoAtivo{
    background-color: #13b800!important;
}
.pedidoBox table tr:nth-child(3) td.statusPedidoAtivo{
    background-color: #ecffe8!important;
    color: #236c00;
}
.pedidoBox table.pedidoCancelado tr:nth-child(2) td{
    color: #fff;
    background-color: #b80000;
    background-repeat: no-repeat;
    background-image: url(https://static.onpedido.com.br/img/blocking.png);
}
.pedidoBox table.pedidoCancelado tr:nth-child(3) td{
    color: #fff;
    font-weight: 600;
    background-color: #555;
}
.pedidoBox table.pedidoCancelado tr:nth-child(4) td{
    font-size: 12px;
}
.headerPaginaBt{
    text-align: center;
    color: #fff;
    display: table;
    float: left;
    background-color:#555;
    width: 100%;
    font-size: 16px;
    font-weight:500;
    padding-top: 0px;
    padding-bottom: 0px;
    background-image: url(img/preto30.png);
    background-position: center bottom;
    background-repeat: repeat;
}
.headerPaginaBt .alinha{
    width: 320px;
    margin: 0 auto;
}
.headerPaginaBt .tituloHeaderPagina{
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0px;
    float: left;
}
.headerPaginaBt .btHeader{
    width: 100px;
    font-weight: 600;
    font-size: 12px;
    float: right;
    margin-top: 10px;
    margin-right: 0px;
    border-radius: 3px;
    padding-top: 3px;
    padding-bottom: 3px;
    background: linear-gradient(-45deg, #009a57, #32c131, #009a57, #32c131);
    background-size: 400% 400%;
    animation: gradient 3s ease infinite;
    background-color:#009a57;
    
}
#iscaBuscar{
    font-size: 16px;
    z-index: 0!important;
    width: 97%!important;
    padding: 10px;
    width: 100%;
    margin:0 auto;
    margin-top: 10px;
    margin-bottom: 10px;
    font-weight:300;
    background-color: #FFFFFF;
    color: #a3a3a3;
    border-top: 1px solid #E5E6E9;
    border-right: 1px solid #DFE0E4;
    border-bottom: 0px solid #D0D1D5;
    border-left: 1px solid #DFE0E4;
    display: table;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    box-shadow: 0 2px 2px #b8b8b8;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
   -user-select: auto;
     background: url(https://onpedido.com.br/static/img/lupaCinza.png) 98% 45% no-repeat #fff!important;
    background-size: 33px!important; 
}
.boxBuscar{
    font-size: 14px;
    display: table;
    margin: 2px;
    margin: 0 auto;
    width: 97%;
    padding-top: 10px;
    padding-bottom: 5px;
}
.boxBuscar .lupa{
    width: 25px;
    height: 25px;
    float: right;
    display: table;
    top:0px;
    margin-left: -30px;
    position: relative;
    background: url(https://onpedido.com.br/static/img/lupaCinza.png) 90% 40% no-repeat transparent!important;
  background-size: 25px!important;
}
#buscar{
    font-size: 16px;
    z-index: 0!important;
    width: 97%!important;
    padding: 10px;
    width: 100%;
    margin:0 auto;
    margin-top: 10px;
    margin-bottom: 10px;
    font-weight:300;
    background-color: #FFFFFF;
    color: #333;
    border-top: 1px solid #E5E6E9;
    border-right: 1px solid #DFE0E4;
    border-bottom: 0px solid #D0D1D5;
    border-left: 1px solid #DFE0E4;
    display: table;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    box-shadow: 0 2px 2px #b8b8b8;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
   -user-select: auto;
     background: url(https://onpedido.com.br/static/img/lupaCinza.png) 98% 45% no-repeat #fff!important;
    background-size: 33px!important; 
}
#buscar:focus{
    background: url(https://onpedido.com.br/static/img/lupaCinza.png) 98% 45% no-repeat rgba(236,255,232,1)!important;
    background-size: 33px!important;
 }
.boxBuscar #buscar {
   background: url(https://onpedido.com.br/static/img/lupaCinza.png) 95% 50% no-repeat #fff;
   background-size:25px;
}
.focusBuscar {
    position: fixed;
    top: 110px;
    width: 100%;
    z-index: 9999;
}
.focusBuscar #buscar{
    width: 100%;
    border-radius: 0px;
    border:0px;
    border-bottom: 3px solid #01A200;
}
#nadaEncontrado, #maisCaracteres{
    background-color: #fed201;
    color: #6b5000;
    text-align: center;
    margin-top: 0px;
    padding: 3px;
    width: 140px;
    margin: 0 auto;
    border-radius: 3px;
    font-size: 12px;
    margin-top: 5px;
    width: 97%;
    margin: 0 auto;
    box-shadow: none;
}
#boxListaTitulo{
    background-repeat: repeat;
    background-image: url(img/preto30.png);
    text-align: center;
    padding: 10px;
}
img.iconPagamento {
    width: 50px;
    float: right;
    clear: both;
    margin-top: 7px;
    margin-bottom: -30px;
    border: 1px solid #ccc;
    border-radius: 3px;
}
#addCreditCard{
    padding: 12px;
}
#addCreditCard p {
    width: auto;
    border: 0px solid #ccc;
    display: table;
    margin: 0 auto;
}
#addCreditCard span:last-child{
    font-weight: 600;
    display: table;
    position: relative;
    float: left;
    margin-top: 4px;
    margin-left: 10px;
}
#addCreditCard span:first-child{
    background-image: url(https://onpedido.com.br/static/img/mais.svg);
    background-size:25px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
    display: table;
    float: left;
}
.semCartao{
    width: 100%;
    display: table;
    padding: 15px;
    padding-top: 210px;
    text-align: center;
    background-image: url(https://onpedido.com.br/static/img/carteira-arte.png);
    background-size:200px;
    background-position: 50% 30px;
    background-repeat: no-repeat;
}
.semCartao h1{
    font-size: 21px;
}
.semCartao p{
    font-size: 14px;
    color: #333;
}
/* PGO */
.showPix {
    width: 100%;
    display: table;
    padding: 15px;
    padding-bottom: 0px;
    text-align: center;
}
#loadQRCodePIX {
    width: 277px;
    display: table;
    margin: 0 auto;
    background-color: #fff;
    padding: 7px;
    border-radius: 7px;
    border:1px solid #D0D1D5;
}
.showPix h1{
    line-height: 1.2;
    font-size: 27px;
}
#copiarCodePix{
    padding: 12px;
    background-color: #337de7;
}
#copiarCodePix p {
    width: auto;
    border: 0px solid #ccc;
    display: table;
    margin: 0 auto;
}
#copiarCodePix span:last-child{
    font-weight: 600;
    display: table;
    position: relative;
    float: left;
    margin-top: 4px;
    margin-left: 10px;
}
#copiarCodePix span:first-child{
    background-image: url(https://onpedido.com.br/static/img/duplicarIcon.png);
    background-size:22px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    width: 25px;
    height: 25px;
    display: table;
    float: left;
} /**/
.grid2Box{
    width: 100%;
    padding: 10px;
    padding-top: 0px;
    float: left;
    display: table;
    height: 900px!important;
}
.bandeiras{
    margin: 0 auto; 
}
.bandeiras img{
    width: 12%;
    margin: 1.1%;
    float: left;
    border-radius:3px;
    border: 1px solid #ccc;
        
}
#boxListaConteudo {
   background-color: #F7F7F7;
}

#formCartao input:focus{
    border-color: #01a200;
}
#formCartao input{
    font-size: 16px;
    z-index: 0!important;
    padding: 10px;
    width: 100%;
    font-weight:600;
    background-color: #FFFFFF;
    color: #333;
    border-top: 1px solid #E5E6E9;
    border-right: 1px solid #DFE0E4;
    border-bottom: 1px solid #D0D1D5;
    border-left: 1px solid #DFE0E4;
    display: table;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    box-shadow: 0 2px 2px #d8d8d8;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
   -user-select: auto;
    /*background: url(https://onpedido.com.br/static/img/lupaCinza.png) 98% 45% no-repeat #fff!important;*/
    background-size: 33px!important;  
}
#formCartao #numero,
#formCartao #nome{
    width: 100%;
}

#formCartao #expira{
    margin-right: 4%;
    margin-left: 0%!important;
}
#formCartao label{
    display: table;
    width: 100%;
    margin-top: 10px;
    font-size: 14px;
    color: #555;
}
#formCartao .duoInput{
  width: 48%;
  float: left;
  margin-top: 0px;
  margin-bottom: 10px;
}
#formCartao .duoInput:nth-child(4){
  margin-right:2%!important;
   margin-top: 10px;
}
#formCartao .duoInput:nth-child(5){
  margin-left: 5%;
  margin-top: 10px;
  width: 35%;
}
#formCartao .duoInput:nth-child(5) input{
    width: 100%;
}
#formCartao .duoInput:nth-child(6){
  width: 100%;
}
#formCartao .duoInput:nth-child(7){
  width: 100%;
}
#formCartao .duoInput:nth-child(8){
    width: 100%;
}
input {
    width: 100%;
    display: block;
    margin-top: 5px;
}
#formCartao .info{
    width: 10%;
    height: 40px;
    margin-top: 37px;
    float: right;
    cursor: pointer;
    display: block;
    margin-bottom: -50px;
    background-image: url(https://onpedido.com.br/static/img/icon-info.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 28px;
    border:0px solid #000;
    z-index: 9999!important;
}
.termosSessao{
    margin-top: 15px;
    text-align: center!important;
    font-size: 12px;
    color: #777;
}
.termosSessao div {
    text-align: center;
    color: #34A203;
}
#msgRecuperarSenha label font{
    display: table;
    float: right;
    width: auto;
    font-size: 12px;
    color: #a7a7a7;
}

#boxAddressContent #sucessoEndereco {
    font-size: 14px;
    border-radius: 5px;
    padding: 15px;
    background-color: #efefef;
}
#boxAddressContent #sucessoEndereco strong{
    font-weight: 600;
    margin-top: 15px!important;
    margin-bottom: 0px;
}
#boxAddressContent #content .botaoAcao {
    background-color: #337de7;
}
#boxAddressContent #sucessoEndereco .btRemoveAddress{
    width: 50px;
    height: 50px;
    float: right;
    display: table;
    background-color: #a70000;
    cursor: pointer;
    border-radius: 15px;
    background-size: 80px 80px;
    background-position: 50% 50%;
    background-image: url("https://onpedido.com.br/static/img/fechar.svg")
}
#boxAddressContent .btFindAddress:hover,
#boxAddressContent #sucessoEndereco .btRemoveAddress:hover{
    opacity: 0.8;
}
#boxAddressContent .btFindAddress {
    font-size: 16px;
    z-index: 0!important;
    padding: 10px;
    width: 100%;
    margin:0 auto;
    font-weight:400;
    color: #fff;
    display: table;
    border-radius: 5px;
    text-align: center;
    box-shadow: 0 2px 2px #b8b8b8;
    background-color: #337de7;
    cursor: pointer;
}
.pac-matched{
    font-size: 16px!important;
}
.pac-item {
    padding: 7px;
    cursor: pointer;
    font-size: 14px!important;
    background-color: transparent!important;
}
.iconPointerMap{
    background-repeat: no-repeat;
    cursor: pointer;
}
.showAlert {
    width: 100%;
    display: table;
    padding: 15px;
    padding-bottom: 0px;
    text-align: center;
}
.showAlert h1{
    line-height: 1.2;
    font-size: 27px;
}
#artLoginRulesOptional{
    background-repeat: no-repeat;
    margin: 0 auto;
    width:300px;
    height: 300px;
    background-size: auto 100%;
    background-position: 5px 50%;
    background-image: url("https://onpedido.com.br/static/img/pedido-sem-cadastro-art.png")
}
#entrarAlertOptionalLogin,
#cadastreseAlertOptionalLogin{
    width: 48%;
    float: left;
    margin-top: -5px;
    background-color: #337de7;
}
#cadastreseAlertOptionalLogin{
    background-color: #555;
    margin-left: 4%;
}