214 lines
3.8 KiB
CSS
214 lines
3.8 KiB
CSS
*{
|
|
margin:0;
|
|
padding:0;
|
|
}
|
|
body{
|
|
font-family:Arial, sans-serif;
|
|
font-size:14px;
|
|
background:#f4f4f4 url(../images/bg.gif) repeat top left;
|
|
color:#333;
|
|
text-shadow:1px 1px 1px #fff;
|
|
overflow-y:scroll;
|
|
}
|
|
h1{
|
|
font-size:56px;
|
|
}
|
|
h2{
|
|
font-size:24px;
|
|
padding:0px 0px 40px 0px;
|
|
color:#333;
|
|
text-align:center;
|
|
}
|
|
h2 span{
|
|
color:#ffa800;
|
|
}
|
|
a{
|
|
color:#777;
|
|
}
|
|
a:hover{
|
|
color:#222;
|
|
}
|
|
p{
|
|
padding:5px 0px;
|
|
}
|
|
.wrapper{
|
|
width:960px;
|
|
margin:20px auto;
|
|
min-height:550px;
|
|
}
|
|
.box{
|
|
width:49%;
|
|
}
|
|
.left{
|
|
float:left;
|
|
}
|
|
.right{
|
|
float:right;
|
|
}
|
|
.clear{
|
|
clear:both;
|
|
}
|
|
a.back{
|
|
color:#777;
|
|
position:fixed;
|
|
top:5px;
|
|
right:10px;
|
|
text-decoration:none;
|
|
}
|
|
/* Form Style */
|
|
.form_wrapper{
|
|
background:#fff;
|
|
border:1px solid #ddd;
|
|
margin:0 auto;
|
|
width:350px;
|
|
font-size:16px;
|
|
-moz-box-shadow:1px 1px 7px #ccc;
|
|
-webkit-box-shadow:1px 1px 7px #ccc;
|
|
box-shadow:1px 1px 7px #ccc;
|
|
}
|
|
.form_wrapper h3{
|
|
padding:20px 30px 20px 30px;
|
|
background-color:#444;
|
|
color:#fff;
|
|
font-size:25px;
|
|
border-bottom:1px solid #ddd;
|
|
}
|
|
.form_wrapper form{
|
|
display:none;
|
|
background:#fff;
|
|
}
|
|
.form_wrapper .column{
|
|
width:47%;
|
|
float:left;
|
|
}
|
|
form.active{
|
|
display:block;
|
|
}
|
|
form.login{
|
|
width:350px;
|
|
}
|
|
form.register{
|
|
width:550px;
|
|
}
|
|
form.forgot_password{
|
|
width:300px;
|
|
}
|
|
.form_wrapper a{
|
|
text-decoration:none;
|
|
color:#777;
|
|
font-size:12px;
|
|
}
|
|
.form_wrapper a:hover{
|
|
color:#000;
|
|
}
|
|
.form_wrapper label{
|
|
display:block;
|
|
padding:10px 30px 0px 30px;
|
|
margin:10px 0px 0px 0px;
|
|
}
|
|
.form_wrapper input[type="text"],
|
|
.form_wrapper input[type="password"]{
|
|
border: solid 1px #E5E5E5;
|
|
background: #FFFFFF;
|
|
margin: 5px 30px 0px 30px;
|
|
padding: 9px;
|
|
display:block;
|
|
font-size:16px;
|
|
width:76%;
|
|
background:
|
|
-webkit-gradient(
|
|
linear,
|
|
left top,
|
|
left 25,
|
|
from(#FFFFFF),
|
|
color-stop(4%, #EEEEEE),
|
|
to(#FFFFFF)
|
|
);
|
|
background:
|
|
-moz-linear-gradient(
|
|
top,
|
|
#FFFFFF,
|
|
#EEEEEE 1px,
|
|
#FFFFFF 25px
|
|
);
|
|
-moz-box-shadow: 0px 0px 8px #f0f0f0;
|
|
-webkit-box-shadow: 0px 0px 8px #f0f0f0;
|
|
box-shadow: 0px 0px 8px #f0f0f0;
|
|
}
|
|
.form_wrapper input[type="text"]:focus,
|
|
.form_wrapper input[type="password"]:focus{
|
|
background:#feffef;
|
|
}
|
|
.form_wrapper .bottom{
|
|
background-color:#444;
|
|
border-top:1px solid #ddd;
|
|
margin-top:20px;
|
|
clear:both;
|
|
color:#fff;
|
|
text-shadow:1px 1px 1px #000;
|
|
}
|
|
.form_wrapper .bottom a{
|
|
display:block;
|
|
clear:both;
|
|
padding:10px 30px;
|
|
text-align:right;
|
|
color:#ffa800;
|
|
text-shadow:1px 1px 1px #000;
|
|
}
|
|
.form_wrapper a.forgot{
|
|
float:right;
|
|
font-style:italic;
|
|
line-height:24px;
|
|
color:#ffa800;
|
|
text-shadow:1px 1px 1px #fff;
|
|
}
|
|
.form_wrapper a.forgot:hover{
|
|
color:#000;
|
|
}
|
|
.form_wrapper div.remember{
|
|
float:left;
|
|
width:140px;
|
|
margin:20px 0px 20px 30px;
|
|
font-size:11px;
|
|
}
|
|
.form_wrapper div.remember input{
|
|
float:left;
|
|
margin:2px 5px 0px 0px;
|
|
}
|
|
.form_wrapper span.error{
|
|
visibility:hidden;
|
|
color:red;
|
|
font-size:11px;
|
|
font-style:italic;
|
|
display:block;
|
|
margin:4px 30px;
|
|
}
|
|
.form_wrapper input[type="submit"] {
|
|
background: #e3e3e3;
|
|
border: 1px solid #ccc;
|
|
color: #333;
|
|
font-family: "Trebuchet MS", "Myriad Pro", sans-serif;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
padding: 8px 0 9px;
|
|
text-align: center;
|
|
width: 150px;
|
|
cursor:pointer;
|
|
float:right;
|
|
margin:15px 20px 10px 10px;
|
|
text-shadow: 0px 1px 0px #fff;
|
|
-moz-border-radius: 4px;
|
|
-webkit-border-radius: 4px;
|
|
border-radius: 4px;
|
|
-moz-box-shadow: 0px 0px 2px #fff inset;
|
|
-webkit-box-shadow: 0px 0px 2px #fff inset;
|
|
box-shadow: 0px 0px 2px #fff inset;
|
|
}
|
|
.form_wrapper input[type="submit"]:hover {
|
|
background: #d9d9d9;
|
|
-moz-box-shadow: 0px 0px 2px #eaeaea inset;
|
|
-webkit-box-shadow: 0px 0px 2px #eaeaea inset;
|
|
box-shadow: 0px 0px 2px #eaeaea inset;
|
|
color: #222;
|
|
}
|