/******************************
http://www.freetimelearning.com
http://www.freetimelearn.com
*******************************/
@charset "utf-8";
@import url(http://weloveiconfonts.com/api/?family=fontawesome);
.main{ margin:40px auto 20px !important; width:450px;}
[class*="fontawesome-"]:before {
font-family: 'FontAwesome', sans-serif;
}
body {
background:#F8F8F8;
color: #606468;
font: 87.5%/1.5em 'Open Sans', sans-serif;
margin: 0;
}
input {
border: none;
font-family: 'Open Sans', Arial, sans-serif;
font-size: 16px;
line-height: 1.5em;
padding: 0;
-webkit-appearance: none;
}
p {
line-height: 1.5em;
}
after { clear: both; }
#login {
margin: 50px auto;
width: 320px;
}
#login form {
margin: auto;
padding: 22px 22px 22px 22px;
width: 100%;
border-radius: 5px;
background:#606;
border-top: 3px solid #603;
border-bottom: 3px solid #603;
}
#login form span {
background-color: #608;
border-radius: 3px 0px 0px 3px;
border-right: 3px solid #434a52;
color: #FFF;
display: block;
float: left;
line-height: 50px;
text-align: center;
width: 50px;
height: 50px;
}
#login form input[type="text"] {
background-color:#8C008C;
border-radius: 0px 3px 3px 0px;
color: #FFF;
margin-bottom: 1em;
padding: 0 16px;
width: 235px;
height: 50px;
}
#login form input[type="password"] {
background-color: #8C008C;
border-radius: 0px 3px 3px 0px;
color: #FFF;
margin-bottom: 1em;
padding: 0 16px;
width: 235px;
height: 50px;
}
#login form input[type="submit"] {
background:#808;
border: 0;
width: 100%;
height: 40px;
border-radius: 3px;
color: white;
cursor: pointer;
transition: background 0.3s ease-in-out;
}
#login form input[type="submit"]:hover {
background:#608;
}