蓝桥杯Web前端 页面布局——给页面化个妆

css/style.css 是本次挑战需补充的样式文件。
images 是项目所用到的图片文件。
index.html 是登录页面。
点击去该项目蓝桥杯比赛地址
1.下载源码。
2.选中 index.html 右键启动 Web Server 服务（Open with Live Server），让项目运行起来。
3.打开环境右侧的【Web 服务】，就可以在浏览器中看到未完成的登录页面布局。

请完善 css/style.css 样式文件，让登录页面呈现如下所示的效果：

页面关键样式说明如下：

表单外观样式：高为 600px、宽为 450px、背景颜色为 rgba(0, 0, 0, .45)、圆角边框为 10px。
表单顶部的头像图片样式：宽和高均为 200px、圆角 50%。
表单中的二级标题样式：字体大小为 45px、字体粗细为 800。
表单中按钮样式：宽为 80px、高为 30px、边框颜色为 #041c32、背景颜色为 #2d4263、字体大小为 16px、字体颜色为 white。
表单中输入框的样式：字体大小为 20px、圆角边框为 5px、宽度为 300px。
css代码：

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
body {
    background-image: url('../images/background-pic.jpeg');
    background-size: cover;
    color: #fff;
    height: 945;
    width: 1920;
}
.nav-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.nav-bar img {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    margin: 15px;
}
.content{
height: 600px;
width: 450px;
background-color: rgba(0, 0, 0, .45);
border-radius: 5px;
margin: 50px auto 0 auto;
text-align: center;
}
.content img{
    width: 200px;
    height: 200px;
    border-radius: 50%;
    position: relative;
    top: -70px;
}
.content h2{
    font-size: 45px;
    font-weight: 800;
    position: relative;
    top: -70px;
}
.content button{
    height: 30px;
    width: 80px;
    border-color: #041c32;
    background-color: #2d4263;
    font-size: 16px;
    color: white;
}
.content input{
    font-size: 20px;
    border-radius: 5px;
    width: 300px;
    text-align: center;
    padding: 10px;
}
form input:nth-child(2){
    margin: 20px auto 20px auto;
}
.text{
    margin-top: 20px;
}
a{
    color: white;
    text-decoration: none;
}