me_two.html

<html>
<head>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap">
    <style type="text/css">
    body,html{font-family:"Open Sans", "sans-serif"}
    h1 {font-size:30px; color: #4287f5 ; margin:0px 0px 30px 0px}
    h2 {font-size:20px; color: #098f31 ; margin:0px 0px 30px 0px}
    .list{text-align:center}
    .pt_img{
        float:left;
     width: 40%;
     height: 40%;
     margin-right:4%;
     background-image: url('images/padthai.jpg');
     background-repeat: no-repeat;
     background-size: contain;
     background-position: left;
    }
    .fx{
      position:fixed;
      top: 100px;
      right: 35px; 
        width: 30px
    }
    .fx2{
      position:fixed;
      top: 100px;
      right: 70px; 
      width: 30px
    }

    .pt_txt{
        text-align: right;
    }

    .ht{background-color: #caebca}
    ul {border: 1px solid #000000; text-align: left}

    .tablediv{
        width: 100%;
        overflow-x: auto;
    }

    .textf{
        margin-left: 1%;
        margin-bottom: 0.5%;
        font-size: 18px;
    }

    .selector{
        margin-left: 1%
    }

    .lbl{
       float: left;
       width: 10%;
       text-align: right;
    }
    


	</style>
</head>
<body>
<a href="https://www.facebook.com"; target = _blank><img class = "fx" src="https://upload.wikimedia.org/wikipedia/commons/b/b8/2021_Facebook_icon.svg"></a>
<a href="https://www.x.com"; target = _blank><img class = "fx2" src="https://upload.wikimedia.org/wikipedia/commons/c/cc/X_icon.svg"></a>
<h1> John LaVaccare </h1>
<h2>Favorite Trip</h2>
<p>Ever since I started working and earning "adult money", I've been traveling the big cities of the United States, yet one of my very best trips was to a small town that was never on my radar: Beacon, New York.
I traveled to Beacon for a weekend last fall, and it became a goodbye to the East Coast, as I was about to receive the job offer that caused me to move from Philadelphia to Seattle. 
It was one of the most pleasant weekends I can remember!
I hiked to the top of Mount Beacon, my first-ever summit and a hike that was a perfect mix of challenging and accessible, and I enjoyed the charms of a walkable town about an hour and a half from New York City.
</p>
<br />
<h2>Pet Names</h2>
<div class = "list">
<ul>
    <li>A cat named Camus</li>
    <li>A lizard named Liz</li>
    <li>A goldfish named Pineapple</li>
</ul>
</div>
<br />
<h2>Favorite Restaurant</h2>
<a href="https://thefreshworks.com/">The Fresh Works</a> 
<p>I used to live right by one of their locations in Philadelphia, 
    and I swear it is the best cheesteak I have ever had (always a contentious debate in Philly), 
    and more broadly just one of the best sandwiches I have ever had. 
    I don't know how they do it.</p>
<br />
<h2>Favorite Food</h2>
    <div class = "pt_img"></div>
    <div class = "pt_txt">
	<p>Pad thai is one of my most consumed foods, because I have a recipe for it that, while not authentic, is very affordable -- 
		definitely the tastiest meal I can make for that price. I make it often. 
		According to Wikipedia, pad thai originated as a street food in Thailand in the 1930s - so it is less than 100 years old! However, it has quickly become overwhelmingly popular.
		Tofu, shrimp, and scrambled eggs are the typical protein sources used in pad thai recipes; however, other fish or meat are commonly added as well.
		The key ingredient in my recipe is fish sauce -- you need to have just the right balance so you can taste it, but it doesn't overwhelm you!
		My recipe doesn't use tamarind paste - that can be a difficult ingredient to find in stores! However, it is a key ingredient of the typical pad thai found at a restaurant.
		My recipe also doesn't use any sugar - which is often included in a restaurant pad thai! That is due to my own preference.</p>
        </div>
<!---Text needs to wrap right ^--->
<br />
<br />
<br />
<div class = "tablediv">
<h2>Favorite Books</h2>
	<table border = "1" cellpadding="4" cellspacing="5">
		<tr>
			<th>The Picture of Dorian Gray</th>
			<th>The Death and Life of Great American Cities</th>
			<th>Friday Night Lights</th>
			<th>My Brilliant Friend</th>
		</tr>
		<tr class = "ht">
			<td><img src='images/dorian.webp' align='left' width='200'> </td>
			<td><img src='images/jane.webp' align='left' width='200'> </td>
			<td><img src='images/fnl.jpeg' align='left' width='200'> </td>
			<td><img src='images/mbf.jpg' align='left' width='200'> </td>
		</tr>
        <tr>
			<td>Oscar Wilde</td>
			<td>Jane Jacobs</td>
			<td>H.G. Bissinger</td>
			<td>Elena Ferrante</td>
		</tr>
        <tr class = "ht">
			<td>A book with themes of coming of age, guilt, and morality.
				It achieves a very rare feat: it remains not only poignant, but hilarious more than a century after its publication!
				I was so impressed at the way the humor translates for modern audiences.
			</td>
			<td>The seminal book on city planning, which criticized the prevailing ideas in city planning at the time and changed the way the field was conducted forever.
				A central point is the importance of "eyes on the street", the idea that urban areas are safer when there is constant human activity and residents keeping an eye on things.
				As a city planner, the book has been a touchstone for me for years, but newly relevant as it has helped me understand the reasons why west coast cities can sometimes be frustrating compared to east coast!
			</td>
			<td>The true story of a high school football team in a small town in Texas and the real-life stories intertwined with it.
				Themes include social class, perseverance, and the challenges of adolescence.
				I went to a high school in Illinois where our football team was a very big deal, and I covered the football team as a student journalist, so this book reminded me of that experience.
			</td>
			<td>The realistic fiction story of two girls growing up in Naples, Italy, which happens to also be where many of my ancestors were originally from. 
				It's an excellent portrayal of life in Naples in the late 20th century, as well as a coming-of-age story that shows the way close relationships evolve as you grow up.
				They experience the tough lessons of a childhood on 'the wrong side of the tracks', find themselves, and go through ups and downs in their relationship. There is a bit of magical realism involved.
			</td>
		</tr>
	</table>
    </div>
    <hr />
    <div class="form">
                            <form action="/action_page.php" class ="guestbook">
                                <h3>Guest Book</h3>
                                <label class = "lbl" for="fname">First Name</label>
                                <input type="text" class = "textf" id="fname" name="firstname" placeholder="First Name">
                                <br />
                                <label class = "lbl" for="lname">Last Name</label>
                                <input type="text" class = "textf" id="lname" name="lastname" placeholder="Last Name">
                                <br />
                                <label class = "lbl" for="email">Email</label>
                                <input type="text" class = "textf" id="email" name="email" placeholder="email@email.com">
                                <br />
                                <label class = "lbl" for="state">State</label>
                                <select class="selector" id="state" name="state">
                                    <option value="wa">Washington</option>
                                    <option value="or">Oregon</option>
                                    <option value="id">Idaho</option>
                                    <option value="ca">California</option>
                                    <option value="mt">Montana</option>
                                    <option value="bc">British Columbia, Canada</option>
                                </select>
        <!--- Insert form here-->
        <input type = "button" value = "Submit">
    </div>
</body>
</html>