.form-horizontal{
background-color: #402B2C;
font-family: 'Rubik', sans-serif;
padding: 20px 30px 0;
border-radius: 10px;
overflow: hidden;
position: relative;
z-index: 1;
}
.form-horizontal .heading{
color: rgba(0,0,0,0.7);
font-size: 40px;
text-transform: capitalize;
text-align: center;
text-shadow: 0 0 1px #000;
margin: 0 0 30px 0;
}
.form-horizontal .heading:after{
content: '';
background: radial-gradient(#1B0C0C ,#1B0C0C,transparent);
height: 1px;
width: 150px;
margin: 10px auto;
display: block;
}
.form-horizontal .form-group{
background-color: #fff;
padding: 5px 0 5px 40px;
margin: 0 0 20px;
box-shadow: 0 0 0 5px rgba(255,255,255,0.5);
border-radius: 10px;
position: relative;
}
.form-horizontal .form-group>i{
color: #999;
font-size: 25px;
position: absolute;
left: 8px;
top: 13px;
}
.form-horizontal .form-control{
color: #5B1B04;
background-color: transparent;
font-size: 16px;
letter-spacing: 1px;
height: 40px;
padding: 5px 10px 5px 10px;
box-shadow: none;
border: 0 solid rgba(0,0,0,0.2);
border-left: 1px solid rgba(0,0,0,0.2);
border-radius: 0;
}
.form-control::placeholder{
color: rgba(0,0,0,0.5);
font-size: 15px;
text-transform: uppercase;
}
.form-horizontal .form-control:focus{ box-shadow: none; }
.form-horizontal .btn{
color: #fff;
background-color: #FF8051;
font-size: 28px;
font-weight: 700;
text-transform: uppercase;
width: 100%;
height: 60px;
padding: 7px 30px;
margin-bottom: 30px;
border-radius: 10px;
border: 2px solid #FF8051;
display: inline-block;
transition: all 0.3s ease;
}
.form-horizontal .btn:focus,
.form-horizontal .btn:hover{
color: #5B1B04;
background-color: #fff;
border: 2px dotted #5B1B04;
}
.form-horizontal .social-login{
background-color: #93f4ff;
text-align: center;
padding: 40px 0 30px;
margin: 0 -30px;
position: relative;
z-index: 1;
}
.form-horizontal .social-login:before{
content: '';
background: linear-gradient(-45deg, transparent 75%, #402B2C 75%) 0 50%,linear-gradient( 45deg, transparent 75%, #402B2C 75%) 0 50%;
background-repeat: repeat-x;
background-size: 16px;
height: 50px;
width: 100%;
transform: translateX(-50%);
position: absolute;
left: 50%;
top: 0;
}
.form-horizontal .social-login .twitter-login{
color: #056f84;
background-color: #00B9D8;
font-size: 20px;
width: 80%;
padding: 15px 15px;
border-radius: 10px;
display: inline-block;
transition: all 0.3s;
}
.form-horizontal .social-login .twitter-login:hover{
color: #fff;
box-shadow: 0 0 5px #fff;
}