bloqueia site na vertical

vertical_block.html

<!-- CSS -->
<style type="text/css">
    /* verifica se esta na vertical ou horizontal */
    #aviso-vertical { display: none; background:red; color:white; padding:20px; margin-top:100px; }
    #aviso-vertical p { text-align:center; font-family: 'Trebuchet MS'; margin-left: -295px; font-size:22px; }
    @media only screen and (orientation:portrait) {
        #container { display:none; }
        #aviso-vertical { display:block; }
    }
    @media only screen and (orientation:landscape) {
        #container { display:block; }
        #aviso-vertical { display:none; }
    }
</style>

<!-- HTML -->
<div id="aviso-vertical">
    <p>Este jogo funciona somente com o tablet na posição horizontal</p>
</div>