<html>
<head>
<meta charset="utf8">
<title>google</title>
<style>
.div1{
padding-top: 8px;
text-align: right;
}
.textos-top{
text-decoration: none;
font-family: arial, sans-serif;
font-size: 13px;
padding-left: 15px;
color: black;
vertical-align: middle;
}
.img_top{
display: inline-block;
text-align: right;
padding-left: 15px;
vertical-align: middle;
margin-right: 12px;
}
.fazer_login{
display: inline-block;
font-family: arial,sans-serif;
font-size: 13px;
font-weight: bold;
text-decoration: none;
color: white ;
text-align: center;
background-color: #4387fd;
border-radius: 2px;
line-height: 30px;
padding-left: 13px;
padding-right: 13px;
margin-right: 20px;
}
.logo{
text-align: center;
vertical-align: middle;
margin-top: 145px;
}
.barra_de_pesquisa{
display:inline-block;
margin-top: 42px;
width: 25%;
border: 1px solid #e6e6e6;
border-right: none;
line-height : 20px;
height : 20px ;
padding : 7.5px
}
.div_barra_pesquisa{
display: inline-block;
background-color: black;
border-left: none;
}
</style>
</head>
<body>
<div class="div1">
<a href="" class="textos-top"> Gmail </a>
<a href="" class="textos-top"> Imagens </a>
<a href=""><img src="botao_google.png" class="img_top"></a>
<a href="" class="fazer_login" >Fazer login</a>
<center>
<img src="logo_google.png" class="logo">
<br>
<input type="" name="" class="barra_de_pesquisa";>
<div class="div_barra_pesquisa">
</div>
<br>
</center>
</body>
</html>