body {
       background-color: rgb(209, 184, 209);
       font-family: Arial, Helvetica, sans-serif;
   }

   a {
       color: mediumpurple;
   }

   .container {
       margin: 120px auto;
       max-width: 600px;
   }

   header {
       margin-bottom: 30px;
   }

   h1 {
       font-size: 36px;
       font-weight: 800;
       text-align: center;
       line-height: 1.5;
       color: #272844;
   }

   .content {
       padding: 15px 20px;
       background-color: white;
       border-radius: 10px;
       box-shadow: 0 4px 8px rgb(0, 0, 0, 0.1);
       margin-bottom: 30px;
   }

   form {
       display: flex;
   }

   .idea {
       line-height: 1.5;
       margin-top: 5px;
       font-size: 12px;
       opacity: 0.5;
   }

   .info {
       padding: 16px 24px;
       font-size: 16px;
       line-height: 20px;
       border: 1px solid rgba(190, 196, 200, 0.859);
       border-radius: 50px;
       color: antiquewhite;
       width: 80%;
   }

   .button {
       margin-left: 10px;
       background-color: darkgrey;
       color: white;
       border: none;
       padding: 14px, 24px;
       border-radius: 50px;
       width: 140px;
       font-size: 16px;
   }

   .poem {
       padding: 20px;
       line-height: 3;
       background-color: #fff;
       font-size: 14px;
       box-shadow: 0 4px 8px rgb(0, 0, 0, 0.1);
       border-radius: 10px;
       border-left: 3px solid darkgrey;
   }

   .hidden {
       display: none;
   }

   .poem strong {
       color: darkgray;
   }

   footer {
       text-align: center;
       font-size: 13px;
       margin: 30px;
   }


   .generating {
       animation: blink-animation 1s steps(5, start) infinite;
   }

   @keyframes blink-animation {
       to {
           visibility: hidden;
       }
   }

   @-webkit-keyframes blink-animation {
       to {
           visibility: hidden;
       }
     }