/* General */
* {	margin:0; padding:0; font-family: 'Source Sans Pro', sans-serif; }
body { font-size:16px; background:#2980b9; }
a { color: inherit; text-decoration: underline; }
a:hover { color: #aaa ;}
img { border:none; }

/* Container */
#container { width: 990px; margin: auto; padding-bottom: 30px; background: #fff; margin-top: 15px; margin-bottom: 15px; box-shadow: 0 0 5px #000; }
.popup-back { display:none; top: 0; left: 0; position: fixed; width: 100%; height: 100%; z-index: 9; background: rgba(255, 255, 255, 0.8); }
.popup-front { display:none; top: 50%; left: 50%; position: fixed; width: 600px; z-index: 10; margin: -150px 0 0 -300px; background: #FFFFFF; box-sizing: border-box; border: 1px solid #CCC; box-shadow: 0 0 5px #CCC; }
.popup-front h1 { background: #1B5096; color: #fff; font-weight: 300; font-size: 24px; padding: 10px 20px; }
.popup-front p { margin: 20px 20px 50px; }
.popup-front p input { padding: 5px 7px; font-size: 16px; width: 300px; outline: none; }
.popup-front .close { position: absolute; height: 30px; cursor: pointer; right: 0; margin: 10px; }

/* Header */
#header { width: 100%; background: #DADDDD;   }
#logo { margin: 30px 35px 40px; }
#header h2 { font-size: 28px;font-weight: 700; margin: 45px 40px 0; letter-spacing: -1px; float: right; text-align: right;}

/* Login */
.login { border: 1px solid #CCC; padding: 20px; position: relative; left: 50%; width: 500px; margin: 50px 0 50px -250px; text-align: center; box-sizing: border-box; }
.login h3 { font-weight: 300; font-size: 24px; }
.login label { display: inline-block; position: absolute; }
.login input { margin-left: 135px; outline: none; font-size: 16px; width: 250px; }
.login input[type="button"] { margin: 0; padding: 7px 15px; background: #DDD; border: 1px solid #CCC; width: auto; }
.login input[type="button"]:hover { cursor: pointer; border-color: #aaa; }
.login .error { display: none; }
.login .register_section { border-top: 1px solid #CCC; margin: -20px; padding: 20px; }

/* Pages */
.welcome_box h1, .view_box h1, .changepassword h1 { float: left; margin: 25px 0; font-size: 18px; line-height: 20px; font-weight: normal; }
.welcome_box .right_panel, .view_box .right_panel, .changepassword .right_panel { float: right; margin: 25px 0; font-size: 18px; line-height: 20px; text-align: right; }
.welcome_box, .view_box, .changepassword { padding: 0 40px; }

/* Welcome page */
li.member { list-style: none; background: #EBEBEB; border: 1px solid #aaa; margin-bottom: 14px; height: 37px; }
li.member .edit img { height: 20px; margin: 9px 14px; vertical-align: top; }
li.member .name { width: 400px; display: inline-block; margin: 0; padding: 9px 20px; border-left: 1px solid #aaa; border-right: 1px solid #aaa; }
li.member .type { width: 145px; display: inline-block; padding: 9px 25px 0 20px; border-right: 1px solid #AAA; margin-right: 20px; height: 29px; }

/* View page */
.view_box .label { font-weight: bold; position: absolute; }
.view_box .text { margin-left: 175px; }

/* Change password */
.changepassword h3 { font-weight: 300; font-size: 24px; }
.changepassword label { display: inline-block; position: absolute; }
.changepassword input { margin-left: 175px; outline: none; font-size: 16px; width: 250px; }
.changepassword input[type="button"] { margin: 0; padding: 7px 15px; background: #DDD; border: 1px solid #CCC; width: auto; }
.changepassword input[type="button"]:hover { cursor: pointer; border-color: #aaa; }
.changepassword .error { display: none; }

/* Footer */
#footer { width: 990px; margin: auto; margin-top: 25px; border-top: 1px solid #CCC; padding-top: 30px; text-align: center;   font-size: 14px; }
#footer .bottom-section { clear: both; border-top: 1px solid #DDDDDD; margin: 20px 260px; text-align: center; color: #001145; font-size: 12px; padding-top: 20px; position: relative; }