1. html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="Images_media_form_elements.css" />
<title>Title</title>
</head>
<body>
<form>
<div><label for="name">Name</label>
<input type="text" id="name"></div>
<div><label for="email">Email</label>
<input type="email" id="email"></div>
<div class="buttons"><input type="submit" value="Submit"></div>
</form>
</body>
</html>
2. css
input[type="text"],
input[type="email"] {
margin: 0 0 1em 0;
padding: 10px;
width: 100%;
border: 2px solid darkseagreen;
border-radius: 0px;
font-weight: bolder;
font-size: 15px;
}
input[type="email"]:hover ,
input[type="text"]:hover {
border-radius: 0px;
border: 2px solid darkseagreen;
background-color: rgba(54, 168, 130, 0.1);
font-weight: bolder;
font-size: 15px;
}
input[type="email"]:focus,
input[type="text"]:focus {
border: 2px solid #ffd117;
font-weight: bolder;
font-size: 15px;
}