body {background:url('images/bg.png');font-family:'Open Sans Condensed', Arial, Helvetica, sans-serif;}

form {margin:0;}
input {font-family:'Open Sans Condensed', Arial, Helvetica, sans-serif;}
.float-left {float:left;}
.float-right {float:right;}
.clear {clear:both;}
.notice {
  text-align:center;margin:15px 0 0;background:rgb(255, 255, 199);border:2px solid rgb(184, 184, 0);padding:4px;font-size:14px;
  -webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;border-radius:4px;
}
#error {
  background:url('images/error.png') 5px no-repeat rgb(248, 173, 173);border:1px solid #ff0000;padding:10px;display:block;margin:20px;padding-left:42px;
  -webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;border-radius:4px;
}

.buttons_container {overflow:hidden;}
.button_wrapper {
  padding:7px;width: 202px;margin:20px auto 0;background-color: #d9d9d9;
  -webkit-transition: background .3s ease-out;-moz-transition: background .3s ease-out;-o-transition: background .3s ease-out;transition: background .3s ease-out;
  -webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;border-radius:4px;
  -webkit-box-shadow: inset 0 1px 1px #909193, 0 1px 0 #fff;-moz-box-shadow: inset 0 1px 1px #909193, 0 1px 0 #fff;-o-box-shadow: inset 0 1px 1px #909193, 0 1px 0 #fff;box-shadow: inset 0 1px 1px #909193, 0 1px 0 #fff;
}
.button_wrapper input[type=submit], .button_wrapper input[type=button], .button_wrapper > span {
  width:200px;margin:0 auto;text-align: center;font-size:18px;padding:5px;color:#fff;border:solid 1px #186f8f;cursor:pointer;text-shadow: 1px 1px 2px #333;font-weight: 300;
  background: #3f8fd2;
  background: -moz-linear-gradient(top, #3f8fd2 0%, #25547b 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3f8fd2), color-stop(100%,#25547b));
  background: -webkit-linear-gradient(top, #3f8fd2 0%,#25547b 100%);
  background: -o-linear-gradient(top, #3f8fd2 0%,#25547b 100%);
  background: -ms-linear-gradient(top, #3f8fd2 0%,#25547b 100%);
  background: linear-gradient(to bottom, #3f8fd2 0%,#25547b 100%);
  -webkit-box-shadow: inset 0 1px 0 #3f8fd2, 0 1px 0 #fff;-moz-box-shadow: inset 0 1px 0 #3f8fd2, 0 1px 0 #fff;box-shadow: inset 0 1px 0 #3f8fd2, 0 1px 0 #fff;
  -webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;border-radius:4px;
  -webkit-transition: background 1s ease-out;-moz-transition: background 1s ease-out;-o-transition: background 1s ease-out;transition: background 1s ease-out;
}
.button_wrapper > span {display:block;width:190px;}
.button_wrapper > span img {width:24px;height:24px;margin-right:5px;vertical-align:middle;}
.button_wrapper input[type=submit]:hover, .button_wrapper input[type=button]:hover, .button_wrapper > span:hover {
  background:#25547b;
  background:-moz-linear-gradient(top,  #25547b 0%, #3f8fd2 100%);
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#25547b), color-stop(100%,#3f8fd2));
  background:-webkit-linear-gradient(top,  #25547b 0%,#3f8fd2 100%);
  background:-o-linear-gradient(top,  #25547b 0%,#3f8fd2 100%);
  background:-ms-linear-gradient(top,  #25547b 0%,#3f8fd2 100%);
  background:linear-gradient(to bottom,  #25547b 0%,#3f8fd2 100%);
}


#home_wrapper {width:960px;margin:0 auto;}
#intro {
  width:650px;float:left;
  /*
  background:#eee;padding:20px;border:5px solid #eee;
  -webkit-box-shadow:0 0 10px #333 inset;-moz-box-shadow:0 0 10px #333 inset;box-shadow:0 0 10px #333 inset;
  -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
  */
}
#intro h1 {font-size:21px;line-height:21px;margin-bottom:0;color:#fff;}
#intro p {margin-bottom:0;color:#f0f0f0;}
h1.login {color:#eee;text-align:left;margin:0 auto;margin-top:60px;font-size:48px;font-family:'Oleo Script', Arial, Helvetica, sans-serif;width:960px;}
#login {
  width:260px;background:#eee;padding:20px;border:5px solid #eee;float:right;
  -webkit-box-shadow:0 0 10px #333 inset;-moz-box-shadow:0 0 10px #333 inset;box-shadow:0 0 10px #333 inset;
  -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
}
#login #login_options .button_wrapper {margin:10px auto;}
#login h1 {margin:0;font-size:18px;margin-bottom:20px;text-align:center;}
#login .hint {font-weight:700;font-size:14px;}
#login .hint i {font-weight:300;}
#login p {margin-top:0;text-align:center;}
#login input[type=file] {width:200px;margin:0 auto;display:block;font-size:16px;margin-bottom:10px;}
#login input[type=password] {width:260px;margin:0 auto;display:block;font-size:16px;}
#login #existing .trigger_new, #login #new .trigger_existing {text-align:center;font-size:15px;margin-top:20px;cursor:pointer;margin-bottom:-10px;}
#login #existing {display:none;}
#login #new {display:none;}

#header {width:960px;margin:0 auto;overflow:hidden;}
#header h1.accounts {color:#eee;text-align:left;font-size:38px;font-family:'Oleo Script', Arial, Helvetica, sans-serif;float:left;margin:0;}
#header #exit {float:right;color:#fff;line-height:52px;text-decoration:none;}

#container {
  width:960px;margin:0 auto;background:#eee;padding:20px;border:5px solid #eee;
  -webkit-box-shadow:0 0 10px #333 inset;-moz-box-shadow:0 0 10px #333 inset;box-shadow:0 0 10px #333 inset;
  -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
}
#container #no_accounts {text-align:center;margin-bottom:0;}
#container #tip {text-align:right;padding:0;margin:0;font-weight:700;font-size:14px;margin-bottom:10px;}
#container #tip i {font-weight:300;}
#container .row {overflow:hidden;padding:8px 0 4px;border-bottom:1px solid #cfcfcf;}
#container .row .delete {display:inline-block;width:20px;height:32px;background:url('images/delete.png') no-repeat left center;background-size:20px 20px;float:left;cursor:pointer;opacity:.5;}
#container .row .delete:hover {opacity:1;}
#container .row .add {display:inline-block;width:32px;height:32px;background:url('images/add.png');float:left;margin-right:10px;}
#container .row .copy {float:left;cursor:pointer;width:18px;height:18px;margin:7px 0;margin-right:5px;opacity:.5;}
/*
#container .row .copy:hover {opacity:1;}
*/
#container .row select {font-family:'Open Sans Condensed', Arial, Helvetica, sans-serif;font-size:18px;width:190px;float:left;margin-right:20px;}
#container .row .name {font-weight:700;}
#container .row .url {width:280px !important;}
#container .row .comment {cursor:pointer;}
#container .row .comments {width:100%;font-family:'Open Sans Condensed', Arial, Helvetica, sans-serif;font-size:18px;min-height:60px;margin-top:5px;}
#container .row .icons {float:right;}
#container .row input[type=text], #container .row input[type=password], #container textarea {background:transparent;font-size:18px;width:180px;float:left;height:32px;line-height:32px;vertical-align:middle;padding:0 5px;border:1px solid transparent;}
#container .row input[type=text]:hover, #container .row input[type=password]:hover, #container .row textarea:hover {background:#fff;border:1px solid #aaa;
  -webkit-box-shadow:0 0 5px #aaa inset;-moz-box-shadow:0 0 5px #aaa inset;box-shadow:0 0 5px #aaa inset;
  -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
}
#container .row input.password {display:none;}
#container .row .details {display:none;clear:both;}
#container .row .details .url {width:100% !important;}
#container .row .details .comments {}

#container #new_account .row .blank {width:23px;height:32px;float:left;}

#container #legend {margin-top:10px;font-size:14px;padding-bottom:5px;border-bottom:1px solid #cfcfcf;}
#container #legend .row {line-height:18px;vertical-align:middle;border:0;display:inline-block;margin-right:40px;}
#container #legend .row img {width:18px;height:18px;margin-right:5px;line-height:18px;vertical-align:middle;}

#copyright {text-align:center;color:#fff;font-size:12px;}
#copyright a {color:#fff;text-decoration:none;}