* {
box-sizing: border-box;
}

/* style the container */

/* style inputs and link buttons */
.rowput {
float: left;
margin-bottom: 10px;
position: relative;
width: 100%;
}

.rowput .fa {
    background: none repeat scroll 0 0 #f5f5f5;
    border-radius: 3px 0 0 3px;
    color: #bbbbbb;
    font-size: 22px;
    left: 2px;
    line-height: 38px;
    position: absolute;
    text-align: center;
    top: 2px;
    width: 44px;
    padding-bottom: 5px;
}

input,
.btn {
width: 100%;
padding: 10px;
margin: 4px 0;
opacity: 1;
}



/* add appropriate colors to fb, twitter and google buttons */
.fb {
background-color: #3B5998;
color: white;
}

.twitter {
background-color: #55ACEE;
color: white;
}

.google {
background-color: #dd4b39;
color: white;
}

/* Two-column layout */
.col {
float: left;
width: 100%;
margin: auto;
padding: 0 50px;
margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}

.field-icon {
float: right;
margin-left: -38px;
margin-top: -38px;
position: relative;
z-index: 2;
font-size: 25px;
color: gray;
}

.divider-line {
position: relative;
margin-bottom: 15px;
font-size: 14px;
font-weight: 400;
color: #363636;
/*margin: 0 0 30px;*/
}

.divider-line::before {
    content: '';
    width: 70%;
    left: 50%;
    transform: translate(-50%,-50%);
    top: 50%;
    height: 1px;
    background: #d8d8d8;
    position: absolute;
    z-index: 0;
}

.divider-line span {
    position: relative;
    z-index: 10;
    background: #fff;
    padding: 0 7px;
    color: #787878;
    font-size: 11px;
    font-weight: 500;
}

.lognin {
display: inline !important;
padding-top: 0px;
color: #bd0808;
}
 .backgroundloginimage {
    background-image: url('../images/Visitbg.jpg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: bottom;
}
/* sign in FORM */
.loginimage {
    top: 0;
    position: relative;
    height: 100%;
    width: 100%;
}

    .loginimage img {
        width: 100%;
    }

.logoimgaeform {
    margin-bottom: 20px;
    text-align: center;
}

#logreg-forms {
    width: 450px;
    margin: 50px auto;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

/*#logreg-forms form*/
.form-signin {
    width: 100%;
    max-width: 410px;
    padding: 15px;
    margin: auto;
}


#logreg-forms .social-login {
    width: 390px;
    margin: 0 auto;
    margin-bottom: 14px;
}

#logreg-forms .social-btn {
    font-weight: 100;
    color: white;
    width: 190px;
    /*font-size: 0.9rem;*/
}

#logreg-forms a {
    display: block;
    color: #bd0808;
    text-align: center;
    font-family: sans-serif;
}

#logreg-form .lines {
    width: 200px;
    border: 1px solid red;
}


#logreg-forms button[type="submit"] {
    margin-top: 10px;
}

#logreg-forms .facebook-btn {
    background: #3C589C;
}

#logreg-forms .google-btn {
    background-color: #DF4B3B;
}

#logreg-forms .form-reset, #logreg-forms .form-signup {
    display: none;
}

  

/* .form-signup .social-login{
width:210px !important;
margin: 0 auto;
} */

/* Mobile */

@media screen and (max-width:500px) {
    #logreg-forms {
        width: 300px;
    }

        #logreg-forms .social-login {
            width: 200px;
            margin: 0 auto;
            margin-bottom: 10px;
        }

        #logreg-forms .social-btn {
            font-size: 1.3rem;
            font-weight: 100;
            color: white;
            width: 200px;
            height: 56px;
        }

            #logreg-forms .social-btn:nth-child(1) {
                margin-bottom: 5px;
            }

            #logreg-forms .social-btn span {
                display: none;
            }

        #logreg-forms .facebook-btn:after {
            content: 'Facebook';
        }

        #logreg-forms .google-btn:after {
            content: 'Google+';
        }
}