html{
    display: table;
    width: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0.40), rgba(0, 0, 0, 0.40)), url('bg.jpg');
    background-size: cover;
    height: 350px;
}
body{
    margin: 0;
    padding: 0;
    background: no-repeat;
    background-size: cover;
    padding-bottom:20px;
}
.box{
    background: rgba(129, 125, 125, 0.4);
    padding: 20px;
    text-align: center;
    margin: auto;
    margin-top:10%;
    color: whitesmoke;
    font-family: 'courier new';
}
.box h1{
    font-size: 55px;
    font-weight: 100;
}
.box p{
    text-align: center;
}
.box p a:hover{
    color: skyblue;
}
.box p a i{
    color: whitesmoke;
    text-decoration: none;
    font-size: 20px;
    letter-spacing: 20px;
    transition: all ease-in-out 250ms;
}
.box p a i:hover{
    color: skyblue;
}
ul{
    margin: 0;
    padding: 0;
}
.box li{
    display: inline-block;
    margin:6px;
    list-style: none;
}
.box li a {
    color: whitesmoke;
    text-decoration: none;
    font-size: 40px;
    letter-spacing: 20px;
    transition: all ease-in-out 250ms;
}
.box li a:hover{
    color: skyblue;
    display:block;
}