Suporte » Temas e templates » Problema no header da versão mobile

  • Olá, pessoal!

    Estou com dificuldades para corrigir um problema no template de uma página na versão mobile.

    Inseri um código para que na versão mobile a imagem do header fique automaticamente redimensionada, contudo, com esse código, o botão do menu não está abrindo mais. Como corrigir?

    Exemplo: http://u2br.com/turnes/the-joshua-tree-tour-2019/

    O código usado para o template é:

    <?php get_header(); ?>
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id(), array( 1155, 450,true ) ); ?>
    
    <style scoped>
    
    .on-the-fly-behavior { background-image: url('<?php echo $image[0]; ?>'); background-position: center; background-size: cover; height: 649px; width: 100%; margin-top: 120px;}
    
    @media (max-width: 767px)
    
    .on-the-fly-behavior { background-image: url('<?php echo $image[0]; ?>') top center no-repeat; width: 100%; height: 250px !important; background-size: 556px; background-position: top center no-repeat; float: left; margin-top: 90px !important;}
    
    }
    
    </style>
    
    <span class="on-the-fly-behavior"></span>
    <div id="headerpage">