@import url('legacy.css') layer(legacy);

@layer legacy, default;

@layer default {

    #ttt-menu .menu {
        padding: 40px 20px 20px 20px;

        @media (min-width: 768px) {
            padding: 100px 20px 60px;
        }
    }

    #ttt-menu table {
        width: 90%;
    }

    #ttt-menu .menu-header {
        position: relative;
        max-width: 800px;
        margin-top: -25%;
        margin-bottom: 5%;

        @media (min-width: 768px) {
            margin-top: -15%;
            margin-bottom: 5%;
        }
    }

    .menu-header h4 .fa-paw {
        display: none !important;
        
        @media (min-width: 768px) {
            display: flex !important;
        }
    }

    .menu-header h4 {
        margin: 0;
    }

    .menu-header h4 span {
        display: block;
        font-size: 0.8rem;
        
        @media (min-width: 768px) {
            font-size: 1rem;
        }
    }
}