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

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

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h6, 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--or : #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,h5,h6 { font-weight : normal; }
h1 { font-size : 2.833em; line-height : 1.1; margin-bottom : 0.5em; }
h2 { font-size : 2.5em; margin-bottom : 0.5em; }
h3 { font-size : 1.66em; line-height : 1.1; margin-bottom : 0.5em; }
h4 { font-size : 1.66em; margin-left : 1.0em; color : #fff; }
h5 { font-size : 1.4em; color : #d00040; font-weight: bold; line-height : 1.25; margin-bottom : 1.00em; }
h6 { font-size : 1.1em; 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 }

html > body { left: 50%; margin-left: -500px; width: 960px; position: absolute }
#scrollbox { left: -2px; overflow: auto; width: 960px; bottom: 40px; position: absolute; top: 191px; padding: 30px 0 40px 0; 
}
#top { left: 0px; overflow: hidden; width: 960px; position: absolute; TOP: 0px; height: 171px; margin: 20px 0 0 0; 
}
#bottom { left: 0px; overflow: hidden; width: 960px; bottom: 0px; position: absolute; height: 40px 
}

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

h1 { color : #fff; }

/* Front ------------------------------------------ */

DIV.front
{
font-size : 1.4em; color : #000; font-weight: bold; line-height : 1.25; margin-bottom : 0.0em;
}

/* Quotes ------------------------------------------ */

DIV.quotes
{
font-size : 1.0em; color : #000; font-style: italic; font-weight: bold ; padding : 0px 20px 14px 15px;
}

/* Small Text ------------------------------------------ */

DIV.smalltext
{
font-size : 0.9em; line-height : 1.5; margin-bottom : 0.5em; 
}

/* Essay Header Text ------------------------------------------ */

DIV.essayhead
{
font-size : 1.2em; padding : 0px ; color : #d00040; font-weight: bold; line-height : 1.25; margin-bottom : 1.1em;
}

/* Sidebar Text ------------------------------------------ */

DIV.sidebartext
{
font-size : 1.2em; padding : 0 0 0 8px ; color : #d00040; font-weight: bold; line-height : 1.25; margin-bottom : 1.1em;
}

/* Logobox Header Text ------------------------------------------ */

DIV.logoheader
{
font-size : 1.1em; color : #000 ; font-weight: bold; line-height : 1.25; margin-bottom : 0.8em;
}

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

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

/* Inset images ------------------------------------------ */
.insetRight { float:right; margin: 0 0 0 12px; }
.insetLeft { }

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

#logo { float : left; margin : 0; width : 300px; height : 72px; 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 : 72px; }
#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; }
#subnav { float : left; width : 145px; margin-right: 15px }
.header { width : 940px; height : 100px; margin : 0 auto; }
.section { width : 940px; margin : 0 auto; padding: 30px 0 40px 0; position: relative; }
.content { float : left; width : 620px; }
.contentmiddle { float : left; width : 465px; }
.sidebar { float : right; width : 300px; }
.header:after, .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; font-weight:normal; text-align:center; height : 36px; border-right: 1px solid #fff; padding : 4px 12px 0 12px; }
.nav li:first-child 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: top left;  }
.search { float : right; height : 30px; padding : 10px 12px 0 12px; font-size : 14px; }

/* Site sub-navigation ------------------------------------------ */
#subnav { padding : 0 0 0 0; background-color : #dbdbdb; background-image: url('../images/sidebox-bottom2.gif'); background-repeat: no-repeat; background-position: center bottom; margin-bottom: 20px ; }
.subnav { margin : 0px; padding: 0 0 0 0; background-image: url(../images/sidebox-top2.gif); background-repeat: no-repeat; background-position: center top; }
.subnav li { background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; font-weight: normal; background-position: 0px top; }
.subnav li:first-child { background : none ; }
.subnav li a { font-size: 14px; color: #333; margin-left: 8px ; display: block; font-weight: normal ; padding: 4px 0; }
.subnav li a:hover, .subnav li a.active { color: #d00040; text-decoration: none; }


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

#headpanel { float : right; width : 640px; height : 60px; text-align: right; }
#headlogin { float : right; margin : 0; width : 228px; height : 30px; text-indent : -9999px; opacity : 1; background-image: url(../images/existinglogin.png); background-repeat: no-repeat; background-position: 0 0; }
#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; }
.nologin span { display: block; height: 60px; background-image: url(../images/nologinbox-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; }

/* Top nav panel (about us, contact us) ------------------------------------------ */

#topnav { float : right; width : 640px; height : 40px; text-align: right; }
#topnav ul { margin : 0.75em 0 0 0; padding : 0; }
#topnav li { display : inline; font-size : 1.2em; }
#topnav span { color: #d00040; padding : 0 0.75em; }

/* 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; }

/* Hero panel on home page ------------------------------------------ */

#hero { width : 580px; height : 225px; padding : 20px; background-image: url('../images/hero-home-bkgd_test.png'); background-repeat: no-repeat; background-position: 0 0; }
#antihero { width : 620px; height : 227px; padding : 0px; background-image: url('../images/pana2.png'); background-repeat: no-repeat; background-position: 0 0;}
#serioushero { background-repeat: no-repeat; background-position: 0 0;}
#hero ul { font-size: 16px; color: #FFF; margin : 0px; }
#hero li { background-image: url(../images/hero-tick.gif); background-repeat: no-repeat; background-position: 0px 50%; padding: 0 0 2px 24px; }

/* Course boxes on home page ------------------------------------------ */

.courseboxleft { width : 276px; height : 128px; padding : 12px; background-image: url(../images/coursebox-bkgd.gif); background-repeat: no-repeat; background-position: 0px 0px; float: left; margin: 0 20px 20px 0; }
.courseboxleft p { margin-bottom : 12px; }
.coursebox { width : 276px; height : 128px; padding : 12px; background-image: url(../images/coursebox-bkgd.gif); background-repeat: no-repeat; background-position: 0px 0px; float: left; margin: 0 0 20px 0; }
.coursebox p { margin-bottom : 12px; }

/* Tables ------------------------------------------ */
.examtable { font-size: 14px; }
.examtable a, .examtable a:visited { color : #333; text-decoration : none; font-weight: normal; }
.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; }

/* Course Syllabus styling for ordered lists ------------------------------------------ */
ol.syllabus { list-style-type : none; background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px bottom; padding-bottom: 2px; }
ol.syllabus p { margin-bottom: 12px; }
ol.syllabus  .lesson { background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px top; padding: 12px 0 0 0; }
ol.syllabus .lessontitle { font-size : 1.4em; color : #d00040; font-weight: bold; line-height : 1.25; margin: 0 0 0.6em 0; margin-bottom : 1.00em; }

/* Left Menu Sidebar content ------------------------------------------ */

#leftsidebox { width : 147px; 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; }
#leftsidebox 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; }
#leftsidebox li { padding : 0 12px 10px 12px; background-image: url('../images/sidebox-divider.gif'); background-repeat: repeat-x; background-position: center bottom; margin-bottom: 10px; }
#leftsidebox li.span { }
#leftsidebox .title { font-size: 2em; background-image: url(../images/sidebox-top.gif); background-position: 0px 0px; background-repeat: no-repeat; padding: 4px 0 0 12px; margin-bottom: 0.2em; }
.leftlogobox { border : 1px solid #bfbfbf; padding : 12px; font-size: 15px; font-weight: bold; line-height : 1.3em; }
.leftfeetable { margin: 0 12px 12px 12px; width: 276px; background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px bottom; }
.leftfeetable th, .feetable td { padding : 4px 0px 4px 0px; }
.leftfeetable td { background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px 0px; }

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

#stupidsidebox { 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; }
#stupidsidebox 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; }
#stupidsidebox li { padding : 0 12px 10px 12px; background-image: url('../images/sidebox-divider.gif'); background-repeat: repeat-x; background-position: center bottom; margin-bottom: 10px; }
#stupidsidebox li.span { }
#stupidsidebox .title { font-size: 2em; background-image: url(../images/sidebox-top.gif); background-position: 0px 0px; background-repeat: no-repeat; padding: 4px 0 0 12px; margin-bottom: 0.2em; }
.stupidlogobox { border : 1px solid #bfbfbf; padding : 12px; font-size: 15px; font-weight: bold; line-height : 1.3em; }
.stupidfeetable { margin: 0 12px 12px 12px; width: 276px; background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px bottom; }
.stupidfeetable th, .feetable td { padding : 4px 0px 4px 0px; }
.stupidfeetable td { background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px 0px; }

/* 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 { }
#sidebox .title { font-size: 2em; background-image: url(../images/sidebox-top.gif); background-position: 0px 0px; background-repeat: no-repeat; padding: 4px 0 0 12px; margin-bottom: 0.2em; }
.logobox { border : 1px solid #bfbfbf; padding : 12px; font-size: 17px; font-weight: bold; line-height : 1.2em; }
.feetable { margin: 0 12px 12px 12px; width: 276px; background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px bottom; }
.feetable th, .feetable td { padding : 4px 0px 4px 0px; }
.feetable td { background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px 0px; }

/* Table Test ------------------------------------------ */

.smalltable { margin: 0 12px 12px 12px; background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px bottom; }
.smalltable th, .smalltable td { padding : 4px 0px 4px 0px; }
.smalltable td { background-image: url(../images/sidebox-divider.gif); background-repeat: repeat-x; background-position: 0px 0px; }

/* 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; }
.btnheld { padding : 0 0 8px; height : 30px; }
.btnlord { padding : 0 0px; height : 30px; position: right; }
a.sidebutton { width: 140px; height: 36px; display: block; color: #FFFFFF; background-image: url(../images/sidebutton.png); background-repeat: no-repeat; background-position: 0px 0px; text-align: center; font-size: 22px; font-weight: bold; }
a.sidebutton:hover  { text-decoration:none }
a.enrolbutton { width: 276px; height: 36px; margin: 0 auto 6px auto; display: block; color: #FFFFFF; background-image: url(../images/enrolbutton.png); background-repeat: no-repeat; background-position: 0px 0px; text-align: center; font-size: 22px; font-weight: bold; }
a.enrolbutton:hover  { text-decoration:none }

/* 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; }
a.greybutt span { background: transparent url('../images/greybutt-left.png') no-repeat; display: block; line-height: 30px; padding: 0 0 0 12px; color: #fff; font-size:14px; font-weight:normal; }
.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; }