*,:before,:after {

-moz-box-sizing:border-box;

-webkit-box-sizing:border-box;

box-sizing:border-box;

}



table {

border-collapse:collapse;

border-spacing:0;

}



address,caption,cite,code,dfn,em,strong,th,var {

font-style:normal;

font-weight:400;

}



ol,ul {

list-style:none;

}



caption,th {

text-align:left;

}



h1,h2,h3,h4,h5,h6 {

font-size:100%;

font-weight:400;

}

b{
    font-weight: 400;
}

q:before,q:after {

content:'';

}



html {

font-family: 'Roboto', Arial, sans-serif !important;

font-size:1em;

line-height:1.5;

}



body {

width:100%;

font-family: 'Roboto', Arial, sans-serif;

margin:20px auto;

padding:10px 50px;

}



.thecell {

background-color:silver;

}



.messages {

background-color:#369;

}



.mainbodygraph {

background-color:#FFF;

}



.cvalues {

font-size:100%;

margin:0;

}



.cvalues2 {

font-weight:700;

font-size:100%;

margin:0;

}



.opacfilter {

filter:alpha(opacity=60);

-moz-opacity:.6;

opacity:.6;

}



.mainbody {

width:100%;

background-color:#FFF;

margin:20px auto;

}



img#bg {

position:absolute;

top:12px;

left:12px;

height:350px;

width:100%;

z-index:-1000;

}



#bgt {

top:0;

z-index:-999;

filter:alpha(opacity=8);

-moz-opacity:.08;

opacity:.08;

}



#rbi {

top:0;

z-index:-999;

align:right;

}



p {

color:#444;

cursor:default;

margin:2px 3px 2px 5px;

}



a:visited: {

color:#444;

}



a:hover {

text-decoration:none;

color:#444;

}



a {

text-decoration:none;

color:#457EBA;

}



a.fieldselect:hover {

font-weight:700;

}



.buttonsnormal {

line-height:18px;

outline:0 solid #FFF;

filter:alpha(opacity=100);

-moz-opacity:1;

opacity:1;

background-color:#FFF;

background-image:url(../images/b0.gif);

cursor:pointer;

border:1px solid #000;

font-size:90%;

font-weight:400;

color:#FFF;

margin:2px;

padding:2px 3px 3px;

}



.buttonssmall {

outline:1px solid #FFF;

background-color:#FFF;

background-image:url(../images/b0.gif);

cursor:pointer;

border:1px solid #000;

height:26px;

font-size:80%;

font-weight:400;

color:#FFF;

margin:2px;

}



.tableheaderbackground {

background-color:#457EBA;

}



.tableheaderbackgrouns {

background-color:#800204;

}



.tableheaderbackgroundmessage {

background-color:red;

}



.rowshowlia {

background-color:#4a73ab;

}



.charttitle {

margin-bottom:0;

color:#404040;

font-size:140%;

font-weight:700;

margin-left:0;

}



.adminmessage {

color:#404040;

cursor:default;

margin:2px 5px 6px;

}



.usermessage {

color:#404040;

font-weight:700;

cursor:default;

margin:2px 3px;

}



.morecourses {

color:#404040;

cursor:default;

margin:2px 3px 2px 5px;

}



.lessonname {

text-decoration:underline;

color:#444;

margin:4px 12px;

}



.lessonname:hover {

text-decoration:underline;

margin:4px 12px;

}



.groupname {

font-size:105%;

margin-left:4px;

font-weight:700;

margin-bottom:3px;

margin-top:3px;

color:#444;

cursor:pointer;

}



.title {

margin-bottom:0;

color:#444;

font-size:200%;

font-weight:700;

margin-left:20px;

}



.username {

margin-top:2px;

margin-bottom:2px;

color:#444;

}



.intro {

margin:15px;

color:#000;

}



.summary {

margin-bottom:9px;

margin-top:12px;

}



.copyright {

text-align:center;

font-style:italic;

font-size:85%;

margin-top:20px;

}



.coursename {

font-weight:700;

margin:6px 3px;

}



.coursenamedescription {

margin:6px 20px 6px 40px;

}



.coursenamedescriptionbutton {

margin:6px 20px 6px 38px;

}



.reportheader {

margin-left:5px;

font-size:120%;

font-weight:700;

margin-bottom:3px;

margin-top:13px;

color:#444;

}



.reportsubhead {

font-size:100%;

margin-bottom:6px;

margin-top:6px;

color:#369;

}



.reportminorhead {

margin-left:10px;

margin-bottom:6px;

margin-top:6px;

}



.reportbody {

font-size:10pt;

margin-bottom:0;

margin-top:0;

}



.r_detailed {

font-size:14pt;

font-weight:700;

margin-top:20px;

margin-left:0;

}



.r_question {

margin-left:20px;

margin-top:15px;

}



.r_ttaken {

margin-left:20px;

margin-bottom:10px;

}



.warning {

margin-bottom:12px;

margin-top:6px;

color:red;

font-weight:700;

}



.lessoncomment {

color:gray;

margin-left:14px;

margin-bottom:4px;

margin-right:12px;

font-style:italic;

font-size:90%;

}



.lessoncommentstatus {

color:#369;

margin-left:3px;

margin-right:3px;

font-style:italic;

font-size:90%;

}



.lessoncompare {

color:gray;

margin-left:6px;

margin-right:6px;

font-size:75%;

}



.headerlines {

background:#f0f0f0;

height:1px;

border-collapse:collapse;

}



.coursesep {

background-color:#369;

height:1px;

}



.tableheader {

color:#FFF;

font-weight:700;

text-align:center;

margin:6px;

}



.maintable {

width:100%;

-moz-border-radius:4px;

border:1px solid #457EBA!important;

empty-cells:show;

margin-left:0;

margin-right:0;

}



.maintable2 {

background-image:url(/kplms/pages/bb3.jpg);

border-collapse:separate;

background-color:red;

width:100%;

border:1px solid #FFF;

margin-left:0;

margin-right:0;

}



.rowhide {

border:1px solid #FFF;

background-color:#b6c8dc;

display:;

}



.rowshow {

border:1px solid #FFF;

display:;

height:35px;

background-color:transparent;

}



.thelesson {

background-color:#FFF;

height:35px;

}



.rowshowh2 {

border:0 solid #FFF;

display:;

background-color:#afc3d7;

}



.rowshowh {

background-color:#bdd1ef;

}



.thegroups {

background-color:#457EBA;

cursor:pointer;

}



.loading {

color:#000;

font-weight:700;

margin-bottom:6px;

margin-top:16px;

text-align:center;

font-size:150%;

}



.lessonnamesearch {

margin-left:10px;

margin-right:12px;

}



.logindetails {

font-weight:700;

margin-right:5px;

}



select.ui-datepicker-month,select.ui-datepicker-year {

display:inline-block!important;

padding:5px 0!important;

}



.logintext,.new,select {

background:#FFF;

border:1px solid #ccc;

box-shadow:0 0 1px #ccc, 1px 1px 5px #fafafa inset;

color:#444;

font-size:1.1em;

text-align:left;

width:300px;

overflow:hidden;

display:block;

transition:all .5s ease 0;

border-radius:2px;

font-family: 'Roboto', Arial, sans-serif;

margin:5px;

padding:8px 10px;

}



.new:hover,.new:focus,select:hover,select:focus,.logintext:hover,.logintext:focus {

box-shadow:0 0 1px #fff, 1px 1px 2px #ccc inset;

transition:all .5s ease 0;

border:1px solid #457EBA;

}



.oimage {

margin-top:5px;

margin-bottom:5px;

width:450px;

}



.lessonnumber {

font-weight:400;

margin:0 5px 0 24px;

}



.lessonname2 {

margin-left:3px;

margin-right:3px;

font-style:italic;

}



.groupnamesubimage {

margin-left:24px;

}



.groupnameimage {

margin-left:10px;

}



.groupnamesub {

margin-left:4px;

font-size:10pt;

font-weight:700;

margin-bottom:4px;

margin-top:4px;

}



.admin {

text-align:center;

font-weight:400;

font-size:10pt;

margin-bottom:0;

margin-top:0;

}



.rightcolumn {

margin-left:0;

margin-top:0;

margin-bottom:0;

}



.introleftmargin {

margin-left:20px;

margin-bottom:6px;

margin-top:6px;

}



.mainheadertable {

margin-left:2px;

margin-bottom:10px;

}



.limage2 {

background-image:url(../images/arrow_small_2.gif);

background-repeat:no-repeat;

width:13px;

height:10px;

}



#rego, .searchbox {

background-color:#FFF;

border-radius:5px;
border: 1px solid #ccc;

text-align:center;

width:600px;

font-family: 'Roboto', Arial, sans-serif;

margin:20px auto;

padding:20px 10px;

}



.button {


box-shadow:0 3px 2px -2px #444;

text-decoration:none;

transition:all .5s ease 0;
-moz-transition:all .5s ease 0;
-webkit-transition:all .5s ease 0;

border-radius:2px;

font-family: 'Roboto', Arial, sans-serif;

cursor:pointer;

width:auto;

height:auto;

margin:5px;

padding:8px 10px;

min-width: 120px;

font-size: 1em;

display: inline-block;

}



.button1 {


box-shadow:0 3px 2px -2px #444;

text-decoration:none;

transition:all .5s ease 0;
-moz-transition:all .5s ease 0;
-webkit-transition:all .5s ease 0;

border-radius:2px;

font-family: 'Roboto', Arial, sans-serif;

margin:5px;

}



.button:hover,.button:active,.button1:hover,.button1:active {

box-shadow:0 3px 2px -2px transparent;

transition:all .5s ease 0;
-moz-transition:all .5s ease 0;
-webkit-transition:all .5s ease 0;

}



.blue {

color:#fff !important;

border:solid 1px #3759AB;

background:#264476;

}



.blue:hover,.blue:active,.blue:visited {

background:#3759AB;

color: #fff !important;

}

.blue tr{
	border:none !important;
}

.red {

color:#fff !important;

border:solid 1px #c0392b;

background:#e74c3c;

}



.red:hover,.red:active,.red:visited {

background:#c0392b;

color: #fff !important;

}


#content {

margin:0 auto;

}



#content th {

color:#444;

text-align:right;

width:100%;

font-weight:400;

padding-right:20px;

vertical-align:middle;

}



#content th label{

font-size:1em;

}



#content td {

padding-right:20px;
font-size: 0.8em;

}



#checkboxes p {

margin:5px;

}



#checkboxes span {

margin:0 5px;

font-size: 1.1em
}



#checkboxes input,#checkboxes span {

vertical-align:middle;

}


#firstname,#lastname{
    text-transform: capitalize;
}

.expla {

color:#004689;

font-size:1em!important;

margin:5px 2px 0 0;

}



label.error {

color: #F22613;

float:right;

padding-right:10px;

vertical-align:top;

font-size:1em;

}



label.valid {
color: #26A65B;
float:right;
padding-right:10px;
vertical-align:top;
font-size:1em;

}

.required1 {

font-size:16px;

color:red;

margin:0 5px;

}



body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,form {

margin:0;

padding:0;

}



fieldset,img,abbr,acronym {

border:0;

}



.datelast,.completion,.courseexpiry,.coursepoints,.coursedescription {

display:inline;

}



.mainbody2,.mainbody3 {

background-color:#FFF;

margin-left:12px;

margin-right:12px;

margin-top:12px;

}



.rowshowtran,.comparetd,.headerbackcolor {

background-color:transparent;

}

.headerbackcolor tr{
	/*border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;*/
}

.headerbackcolor td{
	padding: 5px;
	/*border-right: 1px solid #ccc;*/
}

.headerbackcolor td p, .headerbackcolor td input{
	text-align: center;
	margin: 5px auto;
}

.totaltime,.purchasemorecourses {

color:#404040;

cursor:default;

margin:2px 3px;

}



.linkit,.linkit:hover {

color:#369;

text-decoration:underline;

}



.time,.status,.date,.score,.attempted {

font-style:italic;

}



.r_activity,.r_username,.r_date,.r_status,.r_score,.r_time,.r_answer,.r_result,.r_correct {

margin-left:20px;

}



#content tr,fieldset {

border:medium none;

}



::-webkit-input-placeholder,:-moz-placeholder,::-moz-placeholder,:-ms-input-placeholder,input[type="text"]:disabled {

color:#ccc;

}

.center{
	margin: 0 auto;
	vertical-align: middle;
	text-align: center;
}

#special{
	width:100%;
	max-width: 900px;
	margin: 15px auto;	
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	color: #444;
}
#special th{
	padding: 5px;
	color: #fff;
	background: #244476;
	text-align: center;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
}
#special td{
	padding: 5px;
	text-align: center;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

.tablelist
{
    width:100%;
    border-collapse:collapse;
    margin:20px auto;
}

.tablelist{
    margin-bottom: 60px;
}


.tablelist tr
{
    border-top:1px solid #f2f2f2;
    border-bottom:1px solid #f2f2f2
}

.tablelist tr:first-child
{
    border:none
}

.ui-dialog .tablelist tr td:first-child{
    max-width: 500px;
}
.ui-widget{
    font-family: Roboto, sans-serif;
}
.tablelist tr:nth-child(2n+3)
{
    background:#fafafa
}

.tablelist tr:nth-child(n+2)
{
    text-decoration:none;
    box-shadow:1px 1px 2px transparent;
    transition:all 0.5s ease 0s
}

.tablelist tr:nth-child(n+2):hover
{
    text-decoration:none;
    box-shadow:1px 1px 2px #999;
    transition:all 0.5s ease 0s
}

.tablelist tr td:last-child,.tablelist tr th:last-child
{
    text-align:center
}

.tablelist td
{
    text-align:left;
    padding:8px;
    border:none;
    font-size:.9em;
    vertical-align:middle;
}

.tablelist th
{
    font-size:1em;
    border:none;
    padding:8px;
    text-align:left;
    vertical-align: middle;
    color: #01579b;
}
.tablelist td input[type="submit"], .tablelist td input[type="button"], .tablelist td button{
    padding: 8px 15px;
}

.errormessage
{
    width:100%;
    background:#F44336;
    border:2px solid #D32F2F;
    color:#fff !important;
    display:block;
    clear:both;
    margin:20px auto;
    font-weight:400
}

.errormessage p
{
    text-align:center;
    font-family:'Roboto',sans-serif;
    margin: 5px auto;
    color:#fff !important;
}
.errormessage a{
    color:#fff;
    font-weight: 500;
    border-bottom: 1px solid #fff
}
.errormessage a:hover{
    border-bottom: none
}