/*fontes*/
    @font-face {
        font-family: 'open_sansbold';
        src: url('opensans/opensans-bold-webfont.woff2') format('woff2'),
             url('opensans/opensans-bold-webfont.woff') format('woff');
        font-weight: normal;
        font-style: normal;

    }
    @font-face {
        font-family: 'open_sansextrabold';
        src: url('opensans/opensans-extrabold-webfont.woff2') format('woff2'),
             url('opensans/opensans-extrabold-webfont.woff') format('woff');
        font-weight: normal;
        font-style: normal;

    }
    @font-face {
        font-family: 'open_sanslight';
        src: url('opensans/opensans-light-webfont.woff2') format('woff2'),
             url('opensans/opensans-light-webfont.woff') format('woff');
        font-weight: normal;
        font-style: normal;

    }
    @font-face {
        font-family: 'open_sansregular';
        src: url('opensans/opensans-regular-webfont.woff2') format('woff2'),
             url('opensans/opensans-regular-webfont.woff') format('woff');
        font-weight: normal;
        font-style: normal;
    }
/*geral*/
    html,body {
        /*background-color: #fff;*/
        font-family: 'open_sanslight';
        font-size: 12px;
        width: 100%;
        margin: 0; 
        padding: 0; 
        color: #000; 
    }
    /*centralizar divs do blade*/
    .centered {
        margin: 0 auto !important;
        float: none !important;
    } 
/*rodape*/
    footer.rodape{
        font-family: 'open_sanslight';
        background-color: #262626; 
        position: fixed;
        bottom: 0;
        left: 0;
        height: 50px;        
        width: 100%;
        color: #bde800;
        display: table-cell;
        z-index:11;    
    }
    #rodape_tab{
        font-family: 'open_sanslight';
        height: 50px;
        color: #bde800;
        vertical-align: middle;
    }
    #rodape_tab_link{
        font-family: 'open_sanslight';
        width: 50px;
        height: 50px;
        vertical-align: middle;
        cursor: pointer;
    }
    #rodape_tab_error {
        height: 50px;
        font-family: 'open_sanslight';
        font-size: 20px;        
        color: #bde800;
        vertical-align: middle;
    }
    .rodape_loja_on{
        font-size: 12px;
        color:#bde800
    }
    .rodape_loja_off{
        font-size: 12px;
        color:#FFD201
    }
/*modal*/
    .modal {
        text-align: center;
    }
    .DeliveryModal{
        background-color: #f5f5f5;
        padding: 15px;
        display: inline-block;
        vertical-align: middle;
        width: 60%;
        height: 90vh;
        margin-top: 5vh;
        border-radius: 5px;
    }
    .DeliveryModalFrame{
        width: 100%;
        height: 85vh;
        border: 0px none transparent;
        overflow-y:scroll;
        overflow-x:hidden;
    }
    .DeliveryModalBotoes {
        width: 100%;
        position: fixed;
        bottom: 5px;
        padding: 5px 2px 0px 2px;
    }
    /*modais msg genericas*/
    .DeliveryMensagensModal{
        background-color: #bde800;
        padding: 15px;
        margin: 150 auto;
        width: 220px;
        height: 220px;
        border-radius: 5px;
    }
    .DeliveryMensagensModal_texto_pequeno{
        font-size: 12px;
    }
    #DeliveryMensagensModal_tabs{
        background-color: #bde800; 
        height: 50px;
        font-family: 'open_sanslight';        
        font-size: 18px;
        color: #262626;
        vertical-align: middle;
    }
/*msgs oops*/
    .mensagem_oops{
        background-color: #bde800; 
        width: 100%;
        height: 100%;
        font-size: 16px;
        color: #000;
    }
    .status_pedido{
        font-size: 25px;
        color: #000;
    }
/*botão exclusivo*/
    .btn_delivery {
        display: inline-block;
        padding: 6px 12px;
        margin-bottom: 0;

        color: #262626;
        background-color: #bed800;
        border-color: #262626;

        width: 100%;
        height: 40px;
        
        font-family: 'open_sanslight';
        font-size: 18px;
        font-weight: bold;
        line-height: 24px;  

        text-align: center;        
        text-decoration: none;
        white-space: nowrap;

        vertical-align: middle;

        -ms-touch-action: manipulation;
          touch-action: manipulation;
        cursor: pointer;
        -webkit-user-select: none;
         -moz-user-select: none;
          -ms-user-select: none;
              user-select: none;
        background-image: none;
        border: 1px solid #262626;
        border-radius: 50px;
    }    
    .btn_delivery:focus,
    .btn_delivery:hover{
        background-color: #262626;
        border-color: #bed800;
        color: #bed800;
        text-align: center;        
        text-decoration: none;
    }    
    .btn_delivery-troco {
        display: block;
        width: 100%;
        height: 40px;
        font-size: 15px;
        font-weight: bold;
        line-height: 24px;
        border-width: 2px;        
    } 
    .btn_delivery-troco:focus,
    .btn_delivery-troco:hover{
        background-color: #FFD201;
        border-color: #000;
        color: #000;
    }
    .btn_delivery-acao {
        display: block;
        width: 100%;
        height: 80px;
        font-size: 25px;
        font-weight: bold;
        line-height: 54px;
        border-width: 4px; 
        border-radius: 25px;       
    } 
    .btn_delivery-acao:focus,
    .btn_delivery-acao:hover{
        background-color: #FFD201;
        border-color: #000;
        color: #000;
    }
/*paginas secundarias*/
    .pagsecundaria_topo{
        background-color: #262626; 
        width: 100%; 
        height: 40px;   
        line-height: 40px;      
        position: fixed; 
        top: 0; 
        display: table-cell;        
        font-size: 16px;
        font-weight: bold;
        color: #bde800;
        padding: 0px; 
    }
    .pagsecundaria_secao{
        background-color: transparent;
        position: relative;
        top: 40px;
        width: 400px;
        height: 320px;
        padding: 8px;      
        margin: 0 auto;
        color: #000;
        overflow-y: auto;
        border: none;
    }
    .pagsecundaria_rodape_botoes{
        background-color: transparent; 
        position: fixed;
        /*height: 60px;*/        
        width: 400px;
        bottom: 20px;
        left: 50%;
        margin-left: -200px;
        padding-left: 8px;
        padding-right: 8px;
        display: flex;
    }
    .pagpagamento_rodape_botoes{
        background-color: transparent; 
        position: fixed;    
        width: 400px;
        bottom: 20px;
        left: 50%;
        margin-left: -200px;
        padding-left: 8px;
        padding-right: 8px;
        display: flex;
    }
    #pagsecundaria_rodape_botoes_tab {
        background-color: transparent;
        font-size: 12px;
        font-weight: normal;
        color: #000;
        vertical-align: middle;
        padding: 3px;
    }
/*responsive*/
    @media (max-width: 768px) 
    {
        .DeliveryModal{
            width: 75%;
        }
    }
    @media (max-width: 576px)
    {
        .DeliveryModal{
            width: 85%;
        }
    }
    @media (max-width: 400px)
    {
        .DeliveryModal {
            width: 94%;
        }
        .DeliveryMensagensModal{
            margin: 120 auto;
        }
        .pagsecundaria_secao {
            width: 100%;
        }
        .pagsecundaria_rodape_botoes {
            width: 100%;
            left: 0;
            margin-left: 0;
        }
        footer.rodape {
            height: 40px; 
        }
        #rodape_tab{
            height: 40px;
        }
        #rodape_tab_link{
            height: 40px;
        }
    }