@charset "utf-8";
/* CSS Document */

/* http://meyerweb.com/eric/tools/css/reset/ 
----------------------------------------------------------------------------------------- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin : 0; padding : 0; border : 0; outline : 0; font-size : 100%; vertical-align : baseline; background : transparent; }
body { line-height : 1; }
ol, ul { list-style-type : none; }
blockquote, q { quotes : none; }
blockquote:before, blockquote:after, q:before, q:after { content : ''; content : none; }
:focus { outline : 0; }
ins { text-decoration : none; }
del { text-decoration : line-through; }
table { width : 99%; margin-bottom : 1.4em; }
tr:nth-child(even) { background-color : #dbdbdb; }
th { font-weight : bold; text-align : left; color: #d00040; font-size: 15px; }
td { }
th,td { padding : 4px 10px 4px 8px; }
tr:last-child td { border-bottom-width : 0; }
tfoot { font-style : italic; }
caption { background : transparent; }

/* Modified from: http://code.google.com/p/blueprintcss/ 
----------------------------------------------------------------------------------------- */
body { font : 12px/1.5 Arial, Helvetica, sans-serif; }
h1,h2,h3,h4 { font-weight : normal; }
h1 { font-size : 2.833em; line-height : 1.1; margin-bottom : 0.5em; }
h2 { font-size : 2.5em; line-height : 1; margin-bottom : 0.5em; }
h3 { font-size : 1.66em; line-height : 1.1; margin-bottom : 0.4em; }
h4 { font-size : 1.2em; line-height : 1.25; margin-bottom : 1.25em; }
p { margin-bottom : 1.5em; }
ul, ol { margin : 1.5em 0; }
ul { list-style-type : none; list-style-position : inside; }
ol { list-style-type : decimal; list-style-position : inside; }
abbr, acronym { border-bottom-width : 0; }
strong { font-weight : bold; }
em { font-style : italic; }

/* Author styles ------------------------------------------ */

html { }
body { min-width : 1000px; color : #333; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 1.5; margin: 21px 0 0 0 }

/* Headings ------------------------------------------ */

h1 { color : #fff; }

/* Link anchors ------------------------------------------ */

a, a:visited { color : #d00040; text-decoration : none; }
a:hover { color : #d00040; text-decoration : underline; }

/* Main LSJ logo ------------------------------------------ */

#logo { float : left; margin : 0; width : 300px; height : 80px; text-indent : -9999px; opacity : 1; background-image: url(../images/lsj-logo.gif); background-repeat: no-repeat; background-position: 0 0; }
#logo a:hover { opacity : .25; }
#logo a { display : block; width : 300px; height : 80px; }
#logo a:hover { text-decoration : none; }

/* Site layout divisions ------------------------------------------ */

#nav { width : 940px; height : 40px; background-image : url(../images/nav-bkgd.gif); background-repeat : no-repeat; background-position : 0 0; background-color : #c8c8c8; margin : 0 auto; }
body > .header { width : 940px; height : 80px; margin : 0 auto; }
.section { width : 940px; margin : 0 auto; padding: 16px 0 20px 0; position: relative; }
.content { float : left; width : 620px; }
.sidebar { float : right; width : 300px; }
body > .header:after, body > .section:after { content : "."; display : block; height : 0; clear : both; visibility : hidden; }

/* Site navigation ------------------------------------------ */

.nav { margin : 0; padding: 0; }
.nav li { float: left; }
.nav li a { font-size : 14px; letter-spacing : 1px; line-height : 1.1em; color : #252525; display : block; text-align:center; height : 28px; padding : 12px 12px 0 12px; border-right: 1px solid #fff; }
.nav li a:hover, .nav li a.active { color : #fff; text-decoration : none; background-image : url(../images/nav-bkgd-on.gif); background-repeat : repeat-x;  }
.nav li:first-child a:hover, .nav li:first-child a.active  { color : #fff; text-decoration : none; background-image : url(../images/nav-bkgd-on.png); background-repeat: no-repeat; background-position: 0 0;  }

/* Admin navigation ------------------------------------------ */

.adminav { margin : 0; }
.adminav li { float: right; }
.adminav li a { font-size : 14px; letter-spacing : 1px; line-height : 1.1em; display : block; text-align : center; height : 36px; border-left: 1px solid #fff; color : #fff; text-decoration : none; background-image : url(../images/adminav-bkgd.gif); background-repeat : repeat-x; padding-top: 4px; padding-right: 12px; padding-bottom: 0; padding-left: 12px; }
.adminav li:first-child a { color : #fff; text-decoration : none; background-image : url(../images/adminav-bkgd.png); background-repeat: no-repeat; background-position: right top; }
.adminav li a:hover, .nav li a.active { color : #fff; text-decoration : none; background-image : url(../images/nav-bkgd-on.gif); background-repeat : repeat-x; }
.adminav li:first-child a:hover, .adminav li:first-child a.active  { color : #fff; text-decoration : none; background-image : url(../images/nav-bkgd-on.png); background-repeat: no-repeat; background-position: right top; }

.lecturenav li a { font-size : 14px; letter-spacing : 1px; line-height : 1.1em; color : #252525; display : block; text-align : center; height : 28px; padding : 12px 12px 0 12px; border-left: 1px solid #fff; text-decoration : none; background-image : url(../images/nav-bkgd-off.gif); background-repeat : repeat-x; float: right; }
.lecturenav li a:hover, .nav li a.active { color : #fff; text-decoration : none; background-image : url(../images/nav-bkgd-on.gif); background-repeat : repeat-x; }
.lecturenav li:first-child a { text-decoration : none; background-image : url(../images/nav-bkgd.gif); background-repeat: no-repeat; background-position: right top; }
.lecturenav li:first-child a:hover { text-decoration : none; background-image : url(../images/nav-bkgd-on.png); background-repeat: no-repeat; background-position: right top; }
.lecturenav li:last-child a { text-decoration : none; background-image : url(../images/nav-bkgd.gif); background-repeat: no-repeat; background-position: left top;  }
.lecturenav li:last-child a:hover { text-decoration : none; background-image : url(../images/nav-bkgd-on.png); background-repeat: no-repeat; background-position: left top;  }


/* Lectures & Tutorials Roomboxes ------------------------------------------ */

.lecturebox, .tutorialbox, .chatroombox, .reviewbox, .mentorbox { width : 276px; padding : 10px; margin : 0 12px 12px 0; border: 2px solid; float : left; font-size: 14px; line-height:1.3em; height: 221px; }
.lecturebox ul, .tutorialbox ul, .chatroombox ul, .reviewbox ul, .mentorbox ul { margin : 0 0 10px 0; }
.lecturebox li, .tutorialbox li, .chatroombox li, .reviewbox li, .mentorbox li { background-image: url(../images/roombox-divder.gif); background-repeat: repeat-x; background-position: left bottom; padding: 3px 0; }
.lecturebox { background-color: #ccdcf2; border-color: #ccdcf2; }
.lecturebox span { color:#3373cc; font-weight:bold; }
.tutorialbox { background-color: #d7c9e0; border-color: #d7c9e0;}
.tutorialbox span { color:#612982; font-weight:bold; }
.chatroombox { background-color: #c7e0d9; border-color: #c7e0d9; }
.chatroombox span { color:#218569; font-weight:bold; }
.reviewbox { background-color: #FFE2AF; border-color: #FFE2AF; }
.reviewbox span { color:#218569; font-weight:bold; }
.mentorbox { background-color: #FFE2AF; border-color: #FFE2AF; }
.mentorbox span { color:#218569; font-weight:bold; }
.roombar { background-color: #e5e5e5; font-size: 14px; width: 924px; margin: 0 0 12px 0; padding: 8px 8px 0 8px; height: 30px; }
.key { position: absolute; text-align: right; top: 40px; right: 0px; width: 400px; font-size: 14px; }

/* Lectures & Tutorials Roomboxes ------------------------------------------ */
/*
.lecturepanel, .questionpanel, .chatpanel, .attendeepanel { background-color: #dbdbdb; padding: 12px; }
.lecturepanel span, .chatpanel span, .attendeepanel span { font-size : 16px; display: block; font-weight: bold; background-image: url(../images/roombox-divder.gif); background-repeat: repeat-x; background-position: center bottom; padding: 0 0 4px 0; margin: 0 0 12px 0; }
.questionpanel span { font-size : 16px; display : block; font-weight : bold; padding : 0 0 4px 0; margin : 0; }
.lecturepanel { margin-bottom: 12px; width: 596px; height: 376px; }
.questionpanel { height: 96px; width: 596px; }
.questionpanel a.button { margin: 0 0 4px 0; }
.questionpanel textarea { width : 490px; height : 60px; resize : none; float: left; margin: 0 12px 0 0; }
.chatpanel { margin-bottom: 12px; width: 276px; height: 376px; }
.chatpanel textarea { width : 270px; height : 70px; resize : none; float: left; margin: 0 12px 0 0; }
.chatpanel label { font-size: 14px; font-weight:bold; }
.chatpanel a.button { margin: 10px 0 0 0; float:right; }
.attendeepanel { width: 276px; height: 96px; }
*/

/* Exams ------------------------------------------ */
.examtable { font-size: 14px; }
.examtable a, .examtable a:visited { color : #333; text-decoration : underline; }
.examtable a:hover { color : #d00040; text-decoration : underline; }
.examtable span.finished { display: block; background-image: url(../images/tick-exam.png); background-repeat: no-repeat; background-position: 4px 50%; padding-left: 26px; }
.examtable span.progress { display: block; background-image: url(../images/clock-exam.png); background-repeat: no-repeat; background-position: 0px 50%; padding-left: 26px; }

/* Student Booking ------------------------------------------ */
.calendar { background-color: #dbdbdb; padding: 12px 15px 12px 15px; height: 700px; }
.calheader { height: 40px; margin: 0 3px; }
.calheadleft, .calheadmid, .calheadright { float:left; height: 40px; }
.calheadleft { width: 300px; text-align: left; }
.calheadmid { width: 300px; text-align: center; }
.calheadmid span { display: block; width: 230px; float: left; height: 30px; font-size: 22px; }
.calheadright { width: 300px; text-align: right; padding: 4px 0 0 0; height: 36px; }
.calbody { }
.caldays { margin: 0; padding: 0; }
.caldays li { float: left; font-size : 15px; letter-spacing : 1px; line-height : 1.1em; color : #F5F5F5; display : block; text-align:center; padding : 6px 0 6px 0; width: 124px; font-weight: bold; background-color: #aeaeae; margin: 0 3px 3px 3px; }
.caldates { padding: 0; margin: 0; }
.caldates li { float: left; display: block; width: 124px; height: 100px; text-align: center; font-size: 60px; font-weight: bold; color: #AEAEAE; background-color: #EFEFEF; line-height: 1.7em; margin: 3px; }
.caldates li.caldatedark { background-color: #E5E5E5; }
.caldates .today { color: #df7797; }


/* Login panel and form styling ------------------------------------------ */

#headpanel { float : right; width : 640px; height : 60px; text-align: right; }
#login { padding: 22px 0 0 0; }
#login label { padding : 0 4px 0 0; }
#login .username, #login .password { margin: 0 10px 0 0; }
#login .name { margin-right: 80px; }
#login input[type="image"] { margin-bottom: -6px; }
.login { display: block; height: 60px; background-image: url(../images/loginbox-left.gif); background-repeat: no-repeat; background-position: left top; padding-left: 8px; float: right; position: relative; }
.login span { display: block; height: 60px; background-image: url(../images/loginbox-right.gif); background-repeat: no-repeat; background-position: right top; padding-right: 8px; text-align: left; }
.login p { font-size : 17px; font-weight : bold; margin : 0px; padding : 0px; position: absolute; top: 3px; }

/* Login panel and form styling ------------------------------------------ */
.loggedin { display: block; height: 60px; width: 300px; float: right; background-image: url(../images/logged-in-box-bkgd.gif); background-repeat: no-repeat; background-position: 0px 0px; }
.loggedintext { float: left; height: 48px; text-align: left; padding: 12px 0 0 12px; }
.loggedinbutton { float: right; height: 48px; text-align: right; padding: 12px 12px 0 0; }
.loggedin span { font-size : 17px; font-weight : bold; margin : 0px; padding : 0 0 3px 0; line-height: 1em; display: block; }

/* Login form styling (for temporary login page) ------------------------------------------ */
#formlogin { }
#formlogin ol { margin: 0; padding: 0; }
#formlogin li { list-style: none; padding: 0px; margin: 0; }
#formlogin label { width: 80px; } /* Width of labels */
#formlogin label { display: inline-block; line-height: 1.8; vertical-align: top; }
#formlogin input[type="text"], #formlogin input[type="password"] { margin: 0 0 12px 0; width: 210px; }


#formlogin .user { }
#formlogin .pass { }

/* Breadcrumb under nav ------------------------------------------ */

#breadcrumb { width : 940px; height : 30px; margin : 0 auto; border-bottom : 1px solid #cccccc; font-size : 11px; }
#breadcrumb .crumbleft { float : left; height : 22px; padding : 8px 0 0 0;  }
#breadcrumb .crumbright { float : right; height : 22px; padding : 8px 0 0 0; }

/* Sidebar content ------------------------------------------ */

#sidebox { width : 300px; padding : 0 0 12px 0; background-color : #dbdbdb; background-image: url('../images/sidebox-bottom.gif'); background-repeat: no-repeat; background-position: center bottom; margin: 0 0 20px 0; }
#sidebox ul { font-size: 14px; line-height : 1.4em; margin : 0px; padding: 12px 0 0 0; background-image: url(../images/sidebox-top.gif); background-repeat: no-repeat; background-position: center top; }
#sidebox li { padding : 0 12px 10px 12px; background-image: url('../images/sidebox-divider.gif'); background-repeat: repeat-x; background-position: center bottom; margin-bottom: 10px; }
#sidebox li.span { }
.logobox { border : 1px solid #bfbfbf; padding : 12px; font-size: 17px; font-weight: bold; line-height : 1.2em; }

/* Tasks and Diary ------------------------------------------ */

.tasks { width: 460px; float: left; margin: 20px 0 0 0; }
.diary { width: 460px; float: right; margin: 20px 0 0 0; }
ol.tasklist { list-style-type : none; background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px bottom; padding-bottom: 2px; }
ol.tasklist p { margin-bottom: 12px; }
ol.tasklist  .task { background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px top; padding: 12px 0 0 0; }
ol.tasklist .tasktitle { color: #d00040; font-weight: bold; margin: 0 0 0.6em 0; }

/* Red site buttons ------------------------------------------ */

a.button { background: transparent url('../images/button-right.png') no-repeat scroll top right; display: block; float: left; height: 30px; margin-right: 6px; padding-right: 12px; text-decoration: none; color: #fff; font-size:14px; font-weight:bold; }
a.button span { background: transparent url('../images/button-left.png') no-repeat; display: block; line-height: 30px; padding: 0 0 0 12px; }
.btnhold { padding : 0 12px; height : 30px; }

/* Grey site buttons ------------------------------------------ */

a.greybutt { background: transparent url('../images/greybutt-right.png') no-repeat scroll top right; display: block; float: left; height: 30px; margin-right: 6px; padding-right: 12px; text-decoration: none; color: #fff; font-size:14px; font-weight:bold; }
a.greybutt span { background: transparent url('../images/greybutt-left.png') no-repeat; display: block; line-height: 30px; padding: 0 0 0 12px; color: #fff }
.btnhold { padding : 0 12px; height : 30px; }

/* Site footer ------------------------------------------ */

#footer { width : 940px; margin : 0 auto; height : 40px; border-top : 1px solid #cccccc; }
.footnav { display: block; float: left; height: 30px; margin: 0; padding: 10px 0 0 0; }
.footnav span { padding: 0 4px; }
.footnav li { display: inline; }
.footnav li a { color:#252525; }
.copyright { float: right; height: 30px; margin: 0; padding: 10px 0 0 0; }