True Blogger API

This was my first code. It's a simple poster with HTML and CSS
<style>
        *{
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        .container{
            width:800px;
            height:500px;
            margin:30px auto;
            display: flex;
            flex-direction: column;
            border-radius: 30px;
        }

        .header, .services{
            width:350px;
            height:450px;
            box-shadow: 0 0 10px gray;
            display: flex;
            justify-content: center;
            flex-direction: column;
        }

        .header{
            background-color: #857E7B;
        }

        .items{
            list-style: none;
            background-color: #4C2719;
            color: #F2F4F3;
            display: flex;
            flex-direction: column;
            border-radius: 10px;
            
        }
        .services{
            background-color:#1B065E;
            
        }
        .mo{ width: 30px;
            height:30px;
            border-radius: 50%;
            background: conic-gradient( #243119)
            
        }
        .era{
            color: aliceblue;
        }
    </style>
</head>
<body>
    <main class="container">
        <!--header-->
        <header class="header">
            <!--title and tag-->
             <h1>History Reseen</h1>
            <p class="mo">🕰️</p>
            <h2>History Reseen - Bringing the past to life with immersive experiences!</h2>
        </header>
        <!--section-->
        <section class="services">
          <h2 class="era">Eras Available</h2>
          <!--List of eras + Address-->
           <ul>
            <li class="items">1860-1864</li>
            <li class="items">1914-1918</li>
            <li class="items">1939-1945</li>
            <li class="items">Relive History Today at: <address>875 N Michigan Ave, John Hancock Center</address></li>
           </ul>
        </section>
    </main>
</body>
dumb code

Comments
