<html>
    <head>
        <style>
            .centered {
                  position: absolute;
                  top: 38%;
                  left: 10%;
                  transform: translate(-40%, -50%);
                    opacity:0%;
                }
            .centered:hover{
                position: absolute;
                top: 38%;
                left: 10%;
                transform: translate(-40%, -50%);
                opacity:100%
                    
            }
            
            .img1:hover{
                opacity:`30%;
            }
        </style>
        <link rel="stylesheet" href="Restaurant.css">
        <title>Restaurant.Menu1</title>
    </head>
    <body>
        <h1 style="font-size: 35px">Spicy Chicken Tacos</h1>  
        <hr>
        <img class="img1" src="spicy-chicken-tacos-image.jpg" width=350px height=525px>
        <div class="centered">Marinated grilled chicken, pickled onions, 
            <br>
            fresh cilantro, and chipotle mayo 
            <br>
            on soft corn tortillas.</div>
    </body>

</html>