container.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Container</title>
    <link href="https://fonts.googleapis.com/css2?family=Kalam:wght@300&display=swap" rel="stylesheet">
    <style>
        body {
            /* Set a background color that will be displayed
                while the background image is loading */
            background-image: url("https://images.unsplash.com/photo-1587826080692-f439cd0b70da?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60");
            background-color: #464646;
            
        }
        .navbar{
            
            background-color: rgb(9, 1, 17);
            color: rgb(243, 230, 236);
            border-radius: 24px;
        }
        .navbar ul{
            overflow: auto;
        }
        .navbar li{
            /* text-decoration: none; */
            float: left;
            list-style: none;
            padding: 10px;
        }
        .sticky{
            position: sticky;
            top: 12px;
        }
        .navbar li a{
            text-decoration: none;
            color: rgb(243, 230, 236);
            padding-left: 12px;
        }
        .navbar li a:hover{   
            color: rgb(103, 226, 150);
        }
        .Search{
            float: right;
            padding: 12px 100px;
        }
        .navbar input{
            /* padding: 4px;; */
            border-radius: 20px;
            text-align: center;
        }
        .marathi_text{
            margin: auto;
            font-family: 'Kalam', cursive;
            font-size: 24px;
            width: auto;
            padding: 5%;
            border-radius: 50px;
            border: 4px solid rgb(131, 27, 228);
            color: rgb(97, 54, 4);
        }
    </style>
</head>
<body>
    <div class="sticky">
    <nav class="navbar">
        <ul>
            <li><a  href = "#">Home</a></li>
            <li><a  href = "#">Contact us</a></li>
            <li><a  href = "#">About</a></li>
            <li><a  href = "#">Services</a></li>
            <div class="Search"> 
                <input type="Search here" placeholder="Seach Here">
            </div>
        </ul>
    </nav>
    </div>
    <div class="marathi_text">
        लॉक डाउन, नासिकची सत्य कथा

        दोन टोकं ..!
        
        इंस्पेक्टर पाटील नुकतेच पंचवटी पोलिस स्टेशनला बदलून आले होते आणि ही करोनाची धावपळ चालू झाली. 
        कडक शिस्तीचा माणूस, कायद्याच्या जरा विरूध्द गेलं की यांच्या मस्तकावरची शीर थड थड उडायला लागायची. 
        
    </div>
</body>
</html>