CSS Media Queries

<!DOCTYPE html>
<html>
<head>
    <style>
        .banner-responsif {
            background-color: #0d2e5c;
            color: white;
            padding: 20px;
            text-align: center;
            font-family: sans-serif;
        }
        @media screen and (max-width: 600px) {
            .banner-responsif {
                background-color: #04AA6D;
            }
        }
    </style>
</head>
<body>
    <div class="banner-responsif">
        Layar Lebar = Navy. Layar HP (&lt; 600px) = Hijau.
    </div>
</body>
</html>