css samples

.bg-img{

background-image : url("https://wallpaperaccess.com/full/1393334.jpg");

height: 100vh;

background-position: cover;

}

.content{

    position: absolute;

    left:50%;

    top:50%;

    transform: translate(-50%,-50%);

    padding: 40px;

    background-color: rgb(0,0,0,0.7);

    width: 300px;

    /* text-align: center; */

}.head{

    text-align: center;

    color:white;

    font-size:large;

    font-weight: 600;

    font-family:' sans-serif';

    margin:20px auto

}

.form{

    margin: 20px 0;

}

.login{

    width: 60%;

    /* border-radius: 10px; */

    border:0;

    padding: 6px 0;

}.login:hover{

    cursor: pointer;

    background-color : cadetblue;

}

.submit{

    text-align: center;

    position: relative;

    left: 0px;

    bottom: 20px;

}

.form input{

border-radius:2px;

border: 0;

outline: none;

margin-left: 10px;

padding: 5px 0;

width: 80%;    

text-align: center;

}

.forget{

    font-size: small;

    cursor: pointer;

    margin: 10px 30px;

    padding-bottom: 5px;

    color: white;

}

.forget:hover{

    color: blue;

}

.links{

    display: flex;

    justify-content: space-around;

    margin-top: 10px;

}.facebook{

    background-color: blue;

    color:white;

    margin:10px 0;

    padding:5px 5px;

    border-radius: 2px;

}.insta{

background-color :rgb(226, 78, 103);

color:white;

margin:10px 0;

padding:5px 5px;

border-radius:2px;

}

.login-with{

    text-align: center;

    color: white;

    font-size: small;

    font-weight: 300;

}.sign-up{

    text-decoration: underline;

    color: blue;

}.sign-up:hover{

    color: white;

    cursor: pointer;

}.acc{

    color:white;

    font-size: medium;

    font-weight: 400;

    padding: 10px;

}.insta:hover{

    cursor: pointer;

    color:rgb(84, 84, 160)

}.facebook:hover{

    cursor: pointer;

    color: rgb(216, 169, 185);

}