*{
    font-family: "Roboto Slab", serif;
}
body{
    background-color: rgba(213, 214, 215, 0.744);
}
.container{
    display: flex;
    flex-wrap: wrap;
    margin:140px; 
    flex-direction: row;
    /* background-color: rgba(213, 214, 215, 0.744); */
    justify-content: space-between;
}
.facebook
{
    color: #0866ff;
    padding: 20px;
    width: 40%;
    background: transparent;
    /* background-color: rgba(213, 214, 215, 0.744); */
    /* border: 2px solid black; */
}
.facebook h2{
    font-size: 80px;
    background: transparent;
}
.facebook p{
    color: #111;
}
.login
{
    width: 50%;
    padding-left: 20px;
    background-color: rgb(255, 255, 255);
    padding-top: 30px;
    box-shadow: 2px 2px 4px gray;
}
.login input{
    width: 89%;
    padding: 10px 5px;
    margin: 4px;
    outline: none;
    border: none;
    font-size: 1em;
    background:rgba(0, 0, 0, 0.1);
    /* border: 2px solid white; */
    border-radius: 30px;
    color:#000000;
}
.login input::placeholder
{
    color:#999 ;
}
.login input[type='submit']
{
    background: #0041aa;
    margin-top: 15px;
    margin-bottom: 15px;
    border: none;
    font-weight: 500;
    color: #fff;
    cursor: pointer;
    transition: 0.5s;
}
.login input[type='submit']:hover
{
    box-shadow: 0 0 10px #0041aa, 0 0 30px #0041aa;
}
.group {
    text-decoration: none;
    color: #0866ff;
    background-color: rgb(255, 255, 255);
    text-align: center;
}
.group .for{
    text-decoration: none;
    text-align:center ;
    background: transparent;
}
.login input[type='button'] 
{
    background: #006100;

    text-align: center;
    margin-top: 15px;
    border: none;
    font-weight: 500;
    color: #fff;
    cursor: pointer;
    transition: 0.5s;
}
.login input[type='button']:hover
{
    box-shadow: 0 0 10px #006100, 0 0 40px #006100;
}

@media (max-width:1200px) {
    *{
        padding: 0px;
        margin: 0px;
    }
    .container{
        display: flex; 
        padding: 0px;
        margin: 0px;
        width: 100%;
        flex-direction: row;
        justify-content:center;
    }

    .facebook h2{
        font-size: 40px;
        text-align: center;
        margin-top: 50%;
        background: transparent;
    }
    .facebook p{
        display: none;
    }
.login
{
    width: 80%;
    background-color: rgb(255, 255, 255);
    margin-top:10%;
    box-shadow: 2px 2px 4px gray;
    padding-bottom:30px ;
}     
.group .for{
    text-align: center;
}
}
