/* -------------------- Basic HTML tags -------------------- */

body {font: 12px/1.5 "Trebuchet MS", "Verdana", sans-serif;color: #444444;background-color: #f6f6f6;}
a:focus {outline: 1px dotted invert;}
hr {border-color: #ccc;border-style: solid;border-width: 1px 0 0;clear: both;height: 0;}
h1 {font-size: 130%;}
h2 {font-size: 120%;}
h3 {font-size: 15px;}
h4 {font-size: 14px;}
h5 {font-size: 12px;}
h6 {font-size: 10px;}
ol {list-style: decimal;list-style-position: inside;}
ul.bullets {list-style: disc;}
ul.hollowbullets {list-style: circle;}
ul.bullets li, ul.hollowbullets li {margin-left: 20px;margin-bottom: 5px;}

.bodyArea { padding: 8px; }

p,
dl,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
ul,
pre,
/*table,*/
address,
fieldset {margin-bottom: 10px;}

.mt-15 {margin-top: 15px;}

a,
a:visited,
#admin-help h2 a,
#admin-help h2 a:visited
{color:#0063be; text-decoration:none;}
a.help
{float:right; width:25px; height:25px;}
a:hover,
a:active,
#admin-help h2 a:hover,
#admin-help h2 a:active
{text-decoration: underline;}

.moreLink
{display: block; clear: both;}

.extraInfo
{display: block; clear: both; padding-bottom: 10px;}

#system-status .status {
    margin-left: 20px;
}
.highlight, #system-status .status.good {color:mediumseagreen;}
.emphasis {color:#0070FF;}
.sites .emphasis {font-weight:bold;}

h1 a, h1 a:visited, h2 a, h2 a:visited, h3 a, h3 a:visited, h4 a, h4 a:visited, h5 a, h5 a:visited, h6 a, h6 a:visited {
    color: #444444; }

h1 a:hover, h1 a:active, h2 a:hover, h2 a:active, h3 a:hover, h3 a:active, h4 a:hover, h4 a:active, h5 a:hover, h5 a:active, h6 a:hover, h6 a:active {
    color:#0063be; }

#admin-home h2 a:link,
#admin-home h2 a:visited {
    color: #0063be;
}

.no-text-transform {
    text-transform: none !important;
}

/* --------------------  Custom general classes -------------------- */

.align-left    { text-align: left; }

.align-right   { text-align: right; }

.align-center  { text-align: center; }

.align-justify { text-align: justify; }

.float-left    { float: left !important; }

.float-right   { float: right !important; }

.bottom-spacing { margin-bottom: 20px; }

.clear-both { clear: both !important; }

.warning, #system-status .status.bad { color: #e50000; }
.heavy { font-weight: bold; }

.validation-error { border: 2px solid #e50000 !important; }

/* -------------------- Custom power user classes -------------------- */
/* -------------------- (see also Button section) -------------------- */

#menu_area ul#nav li#navid-events a .nav-item.superadmin {
    background-color: lightgoldenrodyellow;
    color: #000;
}

label.superadmin,
label .superadmin,
#about .superadmin,
#log-files .superadmin,
#api-access-page .superadmin,
#enrolment_form .superadmin,
#subnav-container ul li .superadmin,
#advanced-search-container .superadmin,
.user-enrolments #listing-container a.superadmin,
#edit-tutorial-settings-page .superadmin,
#user-history-tutorial td .superadmin,
#edit-purchase-page .hint,
.extraInfo .superadmin,
#grid table tr td .superadmin,
#groups-id-filter .superadmin,
p span.superadmin,
th span.superadmin,
td.superadmin .superadmin {
/* #purchases-page .button .superadmin */
    background-color: lightgoldenrodyellow;
}
#log-files .superadmin,
#api-access-page .superadmin {
    display: inline;
}
td.superadmin .dbtables {
    display: table-row;
}
td.superadmin .dbtables .superadmin {
    margin-right: 5px;
}
#logfiles .dbtable-container {
    padding: 2px 0 1px;
    display: block;
}
td.superadmin .dbtables .superadmin,
#logfiles .dbtable-container .dbtable {
    border: 1px solid #d9d9d9;
}
td.superadmin .superadmin.dbtable,
#logfiles .dbtable-container .logfile.dbtable {
    border-top: 3px solid #d9d9d9;
}
#logfiles .logfile.dbtable {
    padding: 2px;
}
#logfiles .logfile.dbtable .dbtable-link a {
    margin: 2px;
    display: inline-block;
}
.extraInfo .superadmin,
p .superadmin .warning {
    font-weight: bold;
}
label .superadmin,
#about .superadmin,
#log-files .superadmin,
#api-access-page .superadmin,
#enrolment_form .superadmin,
#subnav-container ul li .superadmin,
#advanced-search-container .superadmin,
.user-enrolments #listing-container a.superadmin,
#menu_area ul#nav li#navid-events a .nav-item.superadmin,
label .ultraadmin, .customise-category .ultraadmin,
#user-history-tutorial td .superadmin,
#edit-purchase-page .hint,
.extraInfo .superadmin,
p span.superadmin,
th span.superadmin {
    padding: 3px 5px;
}
td.superadmin .superadmin {
    padding: 2px 5px;
}
#groups-listing-container .superadmin {
    padding: 1px 3px 0 3px;
    display: inline-block !important;
}
.logfile .ultraadmin {
    padding: 2px 5px 1px;
}
#grid table tr td .superadmin {
    display: block;
}
#purchases-page .purchases-grid .superadmin {
    padding: 0px 3px 0 3px;
}
.user-enrolments #listing-container .user-enrol-edit-purchase a.superadmin {
    padding: 3px 4px 0 3px;
}
#purchases-page .purchases-grid .superadmin,
.user-enrolments #listing-container .user-enrol-edit-purchase a.superadmin {
    display: inline-block;
}
#purchases-page #grid table tr td .superadmin.approvedby {
    display: inline-block;
    padding: 0 5px;
}
#purchases-page #filter_ApprovedByLoginID {
    width: 100px;
}
label .ultraadmin, .customise-category .ultraadmin, .logfile .ultraadmin {
    background-color: #ffccff;
}
#edit-tutorial-settings-page .superadmin {
    padding: 9px 5px 3px 5px;
}
#edit-tutorial-settings-page th .superadmin {
    padding-top: 3px;
}
#purchases-page .purchase-type-container {
    width: 25px;
}
#purchases-page .superadmin .purchase-type {
    padding: 4px 0px 0px 4px;
}
#purchases-page .purchase-type-testing,
#purchases-page .purchase-type-demo,
#users-listing-container .purchase-type-testing,
#users-listing-container .purchase-type-demo {
    margin-left: 4px;
}
#purchases-page .purchase-type-testing,
#users-listing-container .purchase-type-testing {
    color: #999;
}
#purchases-page .purchase-type-demo,
#users-listing-container .purchase-type-demo {
    font-weight: bold;
}
#purchases-page .superadmin .audit-trail {
    padding: 4px 0px 0px 4px;
}

#users-listing-container .purchase-type-container {
    width: 16px;
}



/* -------------------- Page elements -------------------- */



#header { margin-bottom: 0px; }

#header-status, #header-status a {background: #000000; padding: 0; color: #bbb;}
#header-status .superadmin strong {color: lightgoldenrodyellow;}

#header-status a { text-decoration: underline; }

#text-invitation, #text-contact {display: block; float: left; padding: 4px 0 4px 0;}
#text-contact .contact-item, #text-contact .contact-item a {text-decoration: none; color: #ffffff}

#message-notification {display: block; float: left; background: url(../images/mail-q-bg.jpg) top left no-repeat;
                       color: #6dc6e7; padding: 9px 0 11px 0; text-decoration: none; margin-left: 10px;}

#message-notification span { color: #444444; margin-right: 15px; text-align: center; display: block; float: left;
                             width: 32px; }

#message-notification a:hover,
#message-notification a:active { color: #ffffff; }

a#logout,
a#logout:visited { display: block; float: right; background: url(../images/system-shutdown-5.png) center right no-repeat;
                   color: #6dc6e7; padding: 4px 20px 4px 0px;text-decoration: none; }

a#logout:hover,
a#logout:active { color: #ffffff; }

#header-main-logo {border-bottom:1px solid #435770; height: 100%; min-height:80px; background-color: #005195; background-repeat: repeat-x; background-position: top left; position: relative;}

#header-main, x:-moz-any-link, x:default { background: #005195 url(../images/themes/blue/header-bg.jpg) repeat-x top left; height:81px; }

.header-site, .header-site a { font-weight: bold !important; text-decoration: none !important; color: #CCE6FF !important; }

#header-main #logo { /* 	background: url(../images/themes/blue/logo.gif) no-repeat left 10px;  */width: 100%;
    height: 70px; }

#subnav {background: #ffffff url(../images/submenu-bg.gif) repeat-x bottom left;height: 44px;}

#subnav ul { list-style: none;margin: 0;padding: 0;}

#subnav ul li { float: left; margin: 0 18px 0 0; padding: 0; }

#subnav ul a,
#subnav ul a:visited { display:block;float: left;color:#0063be; font-size: 105%; padding: 9px 0 0 0;text-decoration: none; }

#subnav ul a.active { font-weight: bold; text-decoration: underline; }

#subnav ul a:hover,
#subnav ul a:active { text-decoration: underline; }

#footer {padding: 0; color: #aaaaaa; padding: 12px 0 15px 0; margin-top: 30px; border-top: 1px solid #cccccc;clear:both;}

.browser-item-container,
.browser-icon-container {
    display: inline-block;
}
.browser-icon-container span.device {
    vertical-align: sub;
    margin-right: 3px;
}
.browser-icon-container .custom-old-edge,
.browser-icon-container .custom-old-windows {
    color: red;
}
.browser-icon-container .custom-new-edge {
    color: turquoise;
    font-style: normal;
}
.browser-icon-container .custom-chrome {
    color: lightsalmon;
}
.browser-icon-container .custom-ie {
    color: lightblue;
}
.browser-icon-container .custom-google {
    color: gold;
}
.browser-icon-container .custom-ff {
    color: orange;
}
.browser-icon-container .custom-safari {
    color: grey;
}
.browser-icon-container .custom-opera {
    color: darkred;
}
.browser-icon-container .custom-windows {
    color: dodgerblue;
}
.browser-item {
	padding: .3em .6em 0.3em;
	margin: 0 3px;
	line-height: 1.5;
	border-radius: .25em;
	color: white;
	background-color: lightslategrey;
}
.browser-item.browser-item-info {
    color: darkseagreen;
    background-color: transparent;
}
.icon-width-1,
.icon-width-2,
.icon-width-3,
.icon-width-5 {
    display: inline-block;
}
.icon-width-1 {
    width: 19px;
    margin: 0 4px 0 0;
}
.icon-width-2 {
    width: 15px;
    margin: 0 4px 0 5px;
}
.icon-width-3 {
    width: 19px;
    margin: 0 4px 0 4px;
}
.icon-width-5 {
    width: 26px;
    margin: 0 3px 0 4px;
}

/* -------------------- Nav tabs (sliding door technique) -------------------- */

ul#nav { float: left; margin-top: 48px;list-style: none; font-size:13px; margin-bottom: 0; position: absolute !important; bottom: 0 !important;}
/* ie9-only hack */
:root ul#nav { float: left; margin-top: 47px;list-style: none; font-size:13px; margin-bottom: 0;}

ul#nav li {background:transparent url(../images/themes/blue/tab-left.gif) no-repeat scroll left top;float:left;
           margin:0 3px 0 0;padding:0 0 0 6px;}

ul#nav li img.menuIcon { height: 14px; }

ul#nav li a, ul#nav li a:visited {background:transparent url(../images/themes/blue/tab-right.gif) no-repeat scroll right top;
                                  color:#FFFFFF;display:block;float:left;padding:7px 11px 6px 6px;text-decoration:none;}

/*ul#nav li a:hover {padding:8px 15px 5px 6px;}*/

ul#nav li.current { /* give the id="current" to the currently selected tab */
    background:transparent url(../images/themes/blue/tab-active-left.gif) no-repeat scroll left top;}

ul#nav li:hover { /* give the id="current" to the currently selected tab */
	background:transparent url(../images/themes/blue/tab-active-left.gif) no-repeat scroll left top;
    color:#444444;}

ul#nav li:hover > a{background:transparent url(../images/themes/blue/tab-active-right.gif) no-repeat scroll right top;
                    color:#444444;}


ul#nav li.current a {background:transparent url(../images/themes/blue/tab-active-right.gif) no-repeat scroll right top;
                     color:#444444;}

/* -------------------- Box module -------------------- */
div.help-container {display:none; border:1px solid #d9d9d9; padding:5px;}

div.module { background: url('../images/module-body-left-bg.gif') no-repeat scroll bottom left;  float: left;
             width: 100%; margin-bottom: 20px; margin-top: 5px;/*overflow:auto;*/}

div.module div.module-body { background: url('../images/module-body-right-bg.gif') no-repeat scroll bottom right;
                             padding: 20px 3% 20px 3%; float: left; width: 94%;}

/* Percentage padding in the module dependant on the cell width */
.grid_1 div.module div.module-body  { padding: 20px 8% 20px 8%; float: left; width: 84%; }
.grid_2 div.module div.module-body  { padding: 20px 7% 20px 7%; float: left; width: 86%; }
.grid_3 div.module div.module-body  { padding: 20px 6% 20px 6%; float: left; width: 88%; }
.grid_4 div.module div.module-body  { padding: 20px 5% 20px 5%; float: left; width: 90%; }
.grid_5 div.module div.module-body  { padding: 20px 4% 20px 4%; float: left; width: 92%; }
.grid_6 div.module div.module-body  { padding: 20px 3% 20px 3%; float: left; width: 94%; }
.grid_7 div.module div.module-body  { padding: 20px 2.75% 20px  2.75%; float: left; width: 94.5%;}
.grid_8 div.module div.module-body  { padding: 20px 2.5% 20px 2.5%; float: left; width: 95%; }
.grid_9 div.module div.module-body  { padding: 20px 2.25% 20px 2.25%; float: left; width: 95.5%; }
.grid_10 div.module div.module-body { padding: 20px 2% 20px 2%; float: left; width: 96%; }
.grid_11 div.module div.module-body { padding: 20px 1.75% 20px 1.75%; float: left; width: 96.5%; }
.grid_12 div.module div.module-body { padding: 20px 1.5% 20px 1.5%; float: left; width: 97%; }



div.module div.module-table-body { background: url('../images/module-body-right-bg.gif') no-repeat scroll bottom right;
                                   padding: 0; float: left; width: 100%; }

div.module h2 { /* Sliding right image */background: url('../images/module-header-left-bg.gif') no-repeat scroll top left;
    display: block;float: left;height: 32px;margin-right: 0px;padding-right: 0px;text-decoration: none;
    color: #444444;font-size:12px;font-weight:bold;width: 100%;margin-bottom: 0;
    letter-spacing: normal}

div.module h2 span { background: url('../images/module-header-right-bg.gif') no-repeat top right; display: block;
                     line-height: 20px;padding: 7px 0 5px 22px;}

div.module .help { display: block;float:left;margin-top: -29px;margin-left: 5px;cursor:pointer;border:0px;}

table.justborder {padding: 0; float: left; width: 100%; border: 1px solid #d9d9d9;}
table.justborder.tr {border-collapse: separate;}
table.justborder th {background-color: #eeeeee;color: #444444;padding: 5px;text-align: left;}
table.justborder tr:hover > span {background-color: #c4d8f1;}

table.borders {padding: 0; float: left; width: 100%; border-left: 1px solid #d9d9d9;border-bottom: 1px solid #d9d9d9;
                  margin-bottom:0px;}

table.borders.tr {border-collapse: separate;border-right: 1px solid #aaaaaa;border-left: 1px solid #aaaaaa;}

table.borders th {background-color: #eeeeee;color: #444444;padding: 5px;text-align: left;border: 1px solid #d9d9d9;}

table.borders td {background-color: #ffffff;padding: 3px;border-right: 1px solid #d9d9d9; vertical-align: middle;}

table.borders tr.odd td, table.select-tags-list div.odd {background-color: #f1f5fa;}

table.borders .subsequent {margin-left: 5px;}

table.borders tr:hover > td {background-color: #c4d8f1;}
table.borders tr.disabledsite:hover > td {background-color: #D9DBDD; color: #fff;}

.table-apply {width: 40%; float: right; text-align: right; margin-right: 10px;}

.htmlarea table td { padding: 0px !important; border: none !important; background-color: transparent !important; vertical-align: middle !important; }

/* -------------------- Pager -------------------- */
.pager {display: block; padding: 0px 10px 10px 10px;  width: 40%; float: left; }
.pager .first,
.pager .prev,
.pager .next,
.pager .last {margin-bottom: -2px;}

/* -------------------- Button (sliding door technique) -------------------- */

/* button outside a module box */
a.button {background: transparent url(../images/button-right-bg-m.gif) no-repeat scroll top right; display: block;
          float: left;height: 26px;padding-right: 11px;text-decoration: none;color: #444444;
          font-size:12px; cursor:pointer;}

a.inactive {cursor:default;}

a.button span {background: transparent url(../images/button-left-bg-m.gif) no-repeat top left; display: block;
               line-height: 15px;padding: 4px 0 7px 10px;cursor:pointer;}
a.button span.superadmin {background: transparent url(../images/button-left-bg-m-sa.gif) no-repeat top left;}

a.inactive span {cursor:default;color:#999999;}

a.button span img {border: 0px;padding-left: 2px;}

a.button:hover { background-position: bottom right; color:#0063be; }

a.button:hover span{background-position: bottom left;color:#0063be; height:15px;}

a.inactive:hover {background-position: top right;color:#999999; }

a.inactive:hover span{background-position: top left;color:#999999; }

/* button inside a module box */
div.module a.button {background: transparent url(../images/button-right-bg.gif) no-repeat scroll top right;
                     display: block;float: left;height: 26px;padding-right: 11px;text-decoration: none;color: #444444;
                     font-family: Arial, Helvetica, sans-serif;font-size:12px;}

div.module a.button span {background: transparent url(../images/button-left-bg.gif) no-repeat top left; display: block;
                          line-height: 15px;padding: 4px 0 7px 10px;}

/* -------------------- Pagination -------------------- */

.pagination { margin-bottom: 20px; float: right;  }
.pagination a.button { margin-right: 10px; }
.pagination a.last { margin-right: 0; }
.pagination .numbers { float: left; padding-top: 3px; margin-right: 15px; }
.pagination .numbers span { padding: 0 5px 0 5px; }
.pagination .current { font-weight: bold; }

/* -------------------- Text input and select input notifications -------------------- */

.notification-input {background:10px 50% no-repeat;margin: 0 0 0 5px;padding:5px 0 5px 32px;font-size: 12px;}

.ni-correct {background-image:url(../images/tick-on-white.gif);color: #00ae42;}

.ni-error {background-image:url(../images/cross-on-white.gif);color: #c9282d;}

/* -------------------- Boxed notifications -------------------- */

.notification {display: block;padding: 10px 15px 10px 45px;border: 1px solid;margin-bottom: 8px;margin-top: 8px;
                background-repeat: no-repeat;background-position: 20px 10px;max-height:100px;overflow:auto;}

.n-success {
    background-color: #a3e6bd;
    border-color: #68d59b;
    background-image: url(../images/notification-tick.gif);
}

.n-information {
    background-color: #9fddea;
    border-color: #5fceea;
    background-image: url(../images/notification-information.gif);
}

.n-attention {
    background-color: #f9e497;
    border-color: #ffcb4f;
    background-image: url(../images/notification-exclamation.gif);
}

.n-error {
    background-color: #ffc6ca;
    border-color: #efb9c3;
    background-image: url(../images/notification-slash.gif);
}

/* -------------------- Group Cert Logos and Free Enrolments (also used on Users page) -------------------- */

.file-exists {
    background-color: lightgoldenrodyellow;
    background-image: url(../images/notification-tick.gif);
    padding-left: 20px;
    background-position-y: center;
    background-repeat: no-repeat;
}

.file-missing {
    background-color: lightgoldenrodyellow;
    background-image: url(../images/notification-slash.gif);
    padding-left: 20px;
    background-position-y: center;
    background-repeat: no-repeat
}

.free-enrol {
    color: forestgreen;
    font-weight: bold
}

/* -------------------- Status messages -------------------- */

.task-complete {display: block;padding: 0 0 0 20px; /* margin-bottom: 8px;margin-top: 8px; */
                background-repeat: no-repeat;max-height:50px;overflow:auto;
                background-image: url(../images/tick-circle.gif);}

/* -------------------- Indicators -------------------- */

.indicator {width: 220px;height: 12px;background: url(../images/indicator-bg.gif) no-repeat top left;}

.indicator div {height: 12px;background: url(../images/indicator-green-to-red.gif) no-repeat top left;}

.indicator div.reverse {background: url(../images/indicator-red-to-green.gif) no-repeat top left;}

/* -------------------- Category list -------------------- */

a.removable,
a.removable:visited {padding: 5px 18px 5px 0px;}

a.removable:hover,
a.removable:active {background: url(../images/cross-small.gif) no-repeat center right;}

/* -------------------- To-do list -------------------- */

a.checkable,
a.checkable:visited {padding: 5px 18px 5px 0px;}

a.checkable:hover,
a.checkable:active {background: url(../images/tick-small.gif) no-repeat center right;}

a.completed,
a.completed:visited {color: #aaaaaa;}

/* -------------------- Messages -------------------- */
.separated { border-top: 1px solid #cccccc; padding-top: 15px; }

.user { display: block; padding-left: 22px; background: url(../images/user.gif) left 50% no-repeat;
        font-size: 14px; color: #666666; font-weight: normal;  }

.user-female { display: block; padding-left: 22px; background: url(../images/user-female.gif) left 50% no-repeat;
               font-size: 14px; color: #666666; font-weight: normal;  }

.reply { padding-left: 20px; background: url(../images/arrow-curve-180-left.gif) left 50% no-repeat; margin-right: 7px;}

.forward { padding-left: 20px; background: url(../images/arrow-curve-000-left.gif) left 50% no-repeat; margin-right: 7px; }

a.delete,
a.delete:visited { padding-left: 16px;background: url(../images/cross-small.gif) left 50% no-repeat; color: #C00;  }

h3.mail { display: block; padding: 20px 0px 20px 70px; background: url(../images/Crystal_Project_mail_open.gif) left 50% no-repeat;}

#p-messages {padding: 20px;}

/* -------------------- Dashboard -------------------- */

a.dashboard-module,
a.dashboard-module:visited { width: 142px; height: 142px; display: block; float: left;
                             background: url(../images/dashboard-module.gif) top left no-repeat; margin: 0 8px 8px 0;
                             text-align: center; color: #444444; }

a.dashboard-module:hover,
a.dashboard-module:active { background-position: bottom left; text-decoration: none; color:#0063be; }

a.dashboard-module img { margin-top: 20px; }

a.dashboard-module span { margin-top: 10px; display: block; }

div.okButton {margin-bottom:5px;float:left;}
div.okButton > a{ background: url(../images/submit-green-bg.gif) top left repeat-x; border: 0;
                  border-top: 1px solid #6bd091; border-left: 1px solid #6bd091; border-right: 1px solid #349c5c;
                  border-bottom: 1px solid #349c5c; color: #ffffff; font-size: 12px; padding: 3px 12px;
                  margin: 0px 10px 0 0;cursor: pointer;}

table.borders button {background: url(../images/submit-gray-bg.gif) top left repeat-x;border: 0; border: 1px solid #666;
                      color: #ffffff; font-size: 100%;padding: 2px 12px; margin: 0px 10px 0 0;cursor: pointer;}

table.borders button:hover { color: #000; }

table.borders #massActions_ {float:right;}

table.borders input[type="text"]{background: none;
/*                                     url(../images/input-bg.gif) top left repeat-x #f6f6f6;*/
                                 border: 0;
                                 border: 1px solid #cccccc;padding: 3px; }

table.borders input[type="text"]:focus{background: url(../images/input-bg-focus.gif) top left repeat-x #ffffff;
                                       border-color: #a9c2d1;}
table.borders .chosen-search input[type="text"]:focus{background: url(../css/chosen-sprite.png) no-repeat 100% -20px;
                                                       border-color: #aaa;}

table.borders .querySupport, table.borders .massActions{background-color: #c4d8f1;}

table.borders tfoot td {background-color: #c4d8f1;}

/*
table.borders .querySupport > div {
    margin-top:6px; margin-left:110px;position:absolute;
    }
*/

table.sites tr.disabledsite td { background-color: #EEE; }

#logfiles { min-width: 210px; }
#logfiles .logfile { margin-right: 10px; }
#logfiles .size, #logfiles .disabled { padding-left: 10px; }
#logfiles td.age { text-align: right; }
#logfiles td.age .now { color: #ff0000; }
#logfiles td.age .recent, .missing { color: #ca0000; }
#logfiles td.otherserver { padding-left: 5px; }

.paginationExport img{ margin-right:10px;}
.paginationExport { margin-top: 5px; float: right; }

ul.catalogue {width:90%; padding:10px; margin:10px;}
ul.catalogue li{width:30%; float:left;}

.catalogue-search-form {
    margin-bottom: 10px;
}
.catalogue-search-form #catalogue-search-input {
    width: 360px;
}
.catalogue-search-form #catalogue-search-submit {
    margin-left: 5px;
}

#admin-catalogue-content div#coursecatalogue .nodeblock {
    margin-top: 0;
}

.helpicon {float:left; padding:10px; cursor:pointer;}
.helpContainer {display:none; float:right; width:93%; padding:10px; margin:10px; background-color:#f6f6f6;}
.helpContainer ul {list-style-type:disc; margin-left:20px;}
.helpContainer ul li {line-height:2em;}


.siteUnitsRow td { background-color: #ffe45c !important;}

.padding-1p {padding:1%; width:98% !important;}
.siteUnitsRow td { background-color: #ffe45c !important;}

.no-background {background:none !important;}

#loadingDiv, #loadingDivThickbox {position: absolute; display:none; padding: 6px; width: 150px; text-align: center; left: 45%;
             top: 45%; border: 1px solid #000000; color: #ffffff; background: #fff;}
#loadingDiv div.loader, #loadingDivThickbox div.loader {background: url('../images/ajax-loader.gif') no-repeat center center;
    background-color: #394C74; padding: 6px;}

/** BUTTONS **/
.buttonUI {
		padding: 5px 10px !important;
		display: inline;
		background: #777 url(../images/button.png) repeat-x bottom;
		border: none !important;
		color: #fff !important;
		cursor: pointer;
		font-weight: bold;
		font-size: 12px;
		font-family: Verdana, Arial;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		text-shadow: 1px 1px #666;
		width: auto !important;
		}
	.buttonUI:hover {
		background-position: 0 center;
        text-decoration: underline;
		}
	.buttonUI:active {
		background-position: 0 top;
		position: relative;
		top: 1px;
		/*padding: 6px 10px 4px;*/
		}
    .buttonUI.processing,
    .buttonUI.processing:hover {
        background-color: #AAA;
        background-image: none;
        cursor: wait;
    }
    .buttonUI.processing:hover {
        text-decoration: none;
    }
    .buttonUI.processing:active {
        top: 0;
    }
	.buttonUI.red { background-color: #e50000; }
	.buttonUI.purple { background-color: #9400bf; }
	.buttonUI.green { background-color: #58aa00; }
	.buttonUI.orange { background-color: #ff9c00; }
	.buttonUI.blue { background-color: #2c6da0; }
	.buttonUI.black { background-color: #333; }
	.buttonUI.white { background-color: #fff; color: #000; text-shadow: 1px 1px #fff; }
	.buttonUI.small { font-size: 85%; padding: 3px 7px; }
	.buttonUI.small:active { padding: 4px 7px 2px; background-position: 0 top; }
	.buttonUI.large { font-size: 125%; padding: 7px 12px; }
	.buttonUI.large:active { padding: 8px 12px 6px; background-position: 0 top; }

.paddingRight { margin-right: 2px; }
/** XINHA **/
div.htmlarea-context-menu tr.item td.icon {vertical-align: top !important;}

/* jsTree */
.jstree-default .jstree-none:empty {
  width: 0;
}

/* misc */
.small-vertical-space,
.vertical-space {
  display: inline-block;
}
.small-vertical-space {
    margin-top: 10px;
}
.force-small-vertical-space {
    padding-top: 15px !important;
}
.just-vertical-space,
.vertical-space {
  margin-top: 25px;
}
.centre-horizontal {
    display: table;
    margin-left: auto;
    margin-right: auto;
}
.pad-horizontal {
    padding: 0 20px;
}
/* -------------------- About (plus general bullets) )-------------------- */

div#about .module-body ul {
    margin-bottom: 20px;
}

div#about .module-body ul li {
    margin-left: 15px;
    margin-bottom: 10px;
}
div#about .module-body ul li ul {
    margin-left: 10px;
    margin-top: 10px;
    list-style-type: disc;
}
.bodyArea ul.hollowbullets li ul,
div#about .module-body ul li ul.hollowbullets {

    list-style: circle;
}


div#about-pagination,
div#view-table-pagination {
    display: inline-block;
    background-color: #c4d8f1;
}
div#about-pagination .pagination,
div#view-table-pagination .pagination {
    margin: 10px;
}
div#view-table-pagination .pagination {
    float: left;
}


/* learning styles */

.viewCourse {
  margin-top: 15px;
}

.viewCourse th {
  text-align: left;
}

.viewCourse .tutorialTitle {
  padding-right: 50px;
}

.viewCourse .tutorialStatus {
  padding-left: 50px;
  padding-right: 50px;
  text-align: center;
}

.viewCourse .tutorialLastAccessedDate,
.viewCourse .tutorialTimesAccessed {
  padding-left: 50px;
  text-align: right;
}

#resendCompletionEmailLink {
  padding-top: 20px;
}

.linksList, .linksList ul, .linksList td {
    vertical-align: top !important;
}

#advanced-search-container dd, #advanced-search-container dt {
    display: inline;
}

#advanced-search-container tr.fixedRow {
    height: 26px;
    line-height: 26px;
}

#advanced-search-container td.fixedColumn {
    width: 200px;
}

#advanced-search-container td#RegistrationDate {
    width: 400px;
    vertical-align: middle;
    white-space: nowrap;
}

#advanced-search-container th {
    width: 100px;
    text-align: right;
    /* vertical-align: middle; */
    padding-top:2px;
    white-space: nowrap;
}


.disabled td, span.disabled { color: #ccc !important; }
table.borders tr.disabledsite td { color: #ccc; }

#Note-element,
.about-note
{ padding: 2px 0 2px 0; font-style: italic; }

.hint {float: left; padding-top:3px; padding-left:10px; display: block;}

.plain-text-area-class p {
    display: table-row;
    float: none;
    padding: 3px 5px;
}

p.iconkey span {
    margin-left: 22px;
    display: block;
}

p.iconkey img {
    padding-top: 1px;
    display: block;
    float: left;
}

dl.columnDefinitions dt {
    margin-top:2px;
    float:left;
    width: 12%;
    font-weight: bold;
    margin-bottom:2px;
}

dl.columnDefinitions dd {
    margin-top:2px;
    float:left;
    width: 88%;
    margin-bottom:2px;
}

.mce-tinymce, .cke { float: inherit !important; }

/*
#idf {
    width:60px;
}

#viewFields_chosen {
    width:178px !important;
}

*/

fieldset.customise-category {
  border: 1px solid black;
  padding-top: 4px;
  padding-bottom: 12px;
  margin-bottom: 10px;
}
fieldset.customise-category legend {
  padding: 5px;
  margin: 0;
  font-weight: bold;
}
fieldset.customise-category p {
    margin-bottom: 0;
}
fieldset.customise-category p a {
    display: block;
    padding-top: 5px;
}

#site-menu-edit-container .label,
#site-menu-add-container .label {
    width: 225px;
}

.enroll-disabled { text-decoration: line-through; }
.enroll-disabled a:hover { text-decoration: none; }

.nowrap { white-space: nowrap; }

.neverloggedin, .noemphasis, .superadmin.approvedby { color: #999; }
.noemphasis-ultra { color: #e8bbdc; }
.masteradmin-or-admin { font-weight: bold; color: #f5a033; }
.wrong { text-decoration: line-through; }

.fallthrough { /* - on the purchases page */
    background-color: grey;
}
#admin-users-index #users-listing-container .current-user { /* - on the users page */
    background-color: #5b8ec0;
}
#admin-users-index #users-listing-container .free-enrol.current-user { /* - on the users page */
    background-color: forestgreen;
}
.fallthrough,
#admin-users-index #users-listing-container .current-user {
    color: white;
    border-radius: 7px;
    padding: 3px 8px;
}

/* editable column on /admin/settings/customise-user-fields */
td.multi-checkbox {
    min-width: 60px;
}
td.multi-checkbox p {
    clear: none;
    width: inherit;
}
td.multi-checkbox p,
td.checkbox p {
    height: 10px;
}
td.multi-checkbox span.mandatory,
td.checkbox span.mandatory {
    vertical-align: text-bottom;
}
/*
th.editable-header,
td.multi-checkbox #editable-checkboxes {
    float: right;
}
*/

/* layout fixes */
div.bodyArea .container_12 #listing-container div.module-body form dl.zend_form dt#Submit-label, /* "Test Function" button on API Access page */
#header .container_12 form.wideform dl.zend_form dt#Submit-label { /* "Add" button on "# of Managers" layer from Groups page */
    float: left;
}

/* layout fixes (site switch page) */
#switch-site-page fieldset {
    padding: 0;
}
#switch-site-page label[for=SiteID] {
    width: 160px;
}
#switch-site-page label[for=site_name] {
    width: 120px;
    padding: 3px 5px;
    margin-right: 7px;
}

/* layout fixes (purchases page) */
#purchases-page #ExpiredPurchases_chosen {
    width: 175px !important;
}

#purchases-page .purchases-grid #grid table tr td div#filter_GroupName_chosen {
    width: 175px !important;
}
#purchases-page .purchases-grid #grid table tr td div#filter_Name_chosen {
    width: 175px !important;
}
#purchases-page .purchases-grid #grid table tr td div#filter_Duration_chosen {
    width: 105px !important;
}
#purchases-page .purchases-grid #grid table tr td input#filter_DiscountPercentage,
#purchases-page .purchases-grid #grid table tr td input#filter_StartDate,
#purchases-page .purchases-grid #grid table tr td input#filter_ExpiryDate {
    width: 65px;
}
#purchases-page .purchases-grid #grid table tr td input#filter_TotalUnits {
    width: 50px;
}

#purchases-page .purchases-grid #grid table tr td #move-units {margin-top:2px;}



/* layout fixes (/site-customisation pages) */
#site-customisation-page .conf-record {
    clear: both;
    display: block;
}
#site-customisation-page .description {
    float: left;
}
#site-customisation-page fieldset {
    margin: 0;
    padding: 0;
}
#site-customisation-page .has-value-label {
    color: crimson;
}
#site-customisation-page #test-button-container {
    margin-top: 20px;
}
#site-settings-page form.wideform label {
    width: 200px;
}

/* layout fixes (/site-menu-add page) */
#site-menu-add-container #page_path_chosen {
    min-width: 180px;
}

/* layout fixes (/groups/manager-groups page) */
#manager-groups-page #GroupName_chosen {
    min-width: 200px;
}

/* layout fixes (/groups/managers page) */
/*
#groups-managers-page #ThisSite-label {
    clear: both;
}
#groups-managers-page #ThisSite-element {
    margin-bottom: 15px;
}
*/
#groups-managers-page #has-linked-site {
    display: inline-block;
    margin-bottom: 15px;
}
#groups-managers-page #has-linked-site label[for=newLoginID],
#groups-managers-page #has-linked-site label[for=otherLoginID] {
    width: 200px;
}
#groups-managers-page #has-linked-site label[for=otherLoginID] {
    clear: both;
}
#groups-managers-page #has-linked-site #Submit-element {
    clear: both;
}

/* layout fixes (scorm connector report) */
#scorm-connector-report fieldset.group-reports table.criteria {
    width: 375px;
}
#scorm-connectors-listing-container #filter_ScormDate {
    width: 110px !important;
}
#scorm-connectors-listing-container #filter_CalmVersion {
    width: 50px !important;
}
#scorm-connectors-listing-container #filter_Course_ID {
    width: 60px;
}

/* layout fixes (enrolment keys report) */
#enrolment-keys-report fieldset.group-reports table.criteria {
    width: 375px;
}

/* layout fixes (billing-report) */
#billing-report tr td.buyprice,
#billing-report tr td.sellprice,
#billing-report tr td.revenue {
    border-top: 1px solid #000;
}

/* layout fixes (enrolment keys generator) */
#listing-container #keysForm #Group_chosen {
    min-width: 150px;
}

/* layout fixes (groups page) */
#groups-listing-container #grid table.borders #filter_CreatedBy_chosen {
    min-width: 130px;
}

/* layout fixes (manager-groups page) */
#manager-groups-page #manager-groups-linked label[for=GroupName] {
    width: 200px;
}
#manager-groups-page #manager-groups-linked label[for=UserID] {
    width: 100%;
    text-align: left;
}

/* layout fixes (site-units-add page) */
#site-units-add-page #InvoiceCo_chosen {
    min-width: 130px;
}

/* layout fixes (#advanced-search-container) */
#advanced-search-container #vendor-selector-label {
    display: inline;
}
#advanced-search-container #vendor-selector-label > span,
#advanced-search-container #Vendors-element {
    float: left;
}
#advanced-search-container #vendor-selector-label > span {
    margin-right: 5px;
    margin-bottom: 5px;
}
#advanced-search-container #Vendors-label {
    display: none;
}

/* layout fixes (catalogue page - table view) */
#catalogue-table input#filter_Course_ID,
#catalogue-table input#filter_Date_Modified,
#catalogue-table input#filter_Hours_of_Training {
    width: 80px;
}
#catalogue-table input#filter_LaunchType {
    width: 65px;
}
#users-listing-container #grid table tr td .superadmin,
#flat-catalogue-tree-page #grid table tr td .superadmin,
#catalogue-table #grid table tr td .superadmin {
    display: inline-block;
    padding: 0 5px;
}
#catalogue-table #grid table tr td .superadmin.nolink {
    color: #c1c1c1;
}
#catalogue-table #grid table tr td .superadmin:hover {
    text-decoration: underline !important;
}
#catalogue-table #grid table tr td .superadmin.nolink:hover {
    text-decoration: none !important;
}

/* layout fixes (export catalogue page) */
#flat-catalogue-tree-page #process-screenshot-data {
    display: none;
}
#flat-catalogue-tree .buyprice,
#flat-catalogue-tree .sellprice {
    text-align: right;
}
#flat-catalogue-tree .datemodified {
    text-align: center;
    white-space: nowrap;
}

/* layout fixes (enrolment options page) */
#catalogue-export-page #filter_Course_ID,
#catalogue-export-page #filter_BuyPrice,
#catalogue-export-page #filter_SellPrice {
    width: 65px;
}
#catalogue-export-page #filter_Hours_of_Training {
    width: 110px;
}

/* layout fixes (edit-course-info page) */
#edit-course-info-page label {
    min-width: 110px;
}
#edit-course-info-page.superadmin-course-info-page label {
    min-width: 170px;
}
#edit-course-info-page label[for=Demo_Course] {
    margin-bottom: 0;
}
#edit-course-info-page .superadmin.helptext {
    margin-left: 175px;
}
#edit-course-info-page input#Course_Title {
    min-width: 500px;
}
#edit-course-info-page textarea[name=Course_Overview],
#edit-course-info-page textarea[name=Course_Outline],
#edit-course-info-page #edit-course-info-overview,
#edit-course-info-page #edit-course-info-outline {
    width: 100%;
    max-width: 942px;
}
#edit-course-info-page textarea[name=Course_Overview] {
    height: 150px;
}
#edit-course-info-page #edit-course-info-overview,
#edit-course-info-page #edit-course-info-outline {
    display: inline-block;
    background: #F9F9F9;
    border: 1px solid #cccccc;
    padding: 0 5px;
    min-height: 100px;
}
#edit-course-info-page #edit-course-info-overview {
    margin-bottom: 10px;
}
#edit-course-info-page .plain-text-area-class {
    padding-right: 10px;
}

/* layout fixes (add-edit-category-page) */
#add-edit-category-page #after_chosen {
    min-width: 185px;
}

/* layout fixes (manual-enrolment-page) */
#manual-enrolment-page .copyButton:hover {
    cursor: pointer;
}
#manual-enrolment-page .enrol_price {
    padding-left: 15px;
}

/* layout fixes (view-course-info-page) */
#view-course-info-page #course-checkbox label {
    margin-bottom: 0;
}
#view-course-info-page #course-checkbox .cbx_getUser {
    display: inline-block;
    vertical-align: text-top;
}
/* layout fixes (view-course-tags-page) */
#view-course-tags-page .module-body {
    width: 100%;
}
/* layout fixes (view-course-info-page & view-course-tags-page) */
#view-course-info-page #admin-outline-view,
#view-course-tags-page #admin-outline-view {
    padding: 10px;
    border: 1px solid #CCC;
}
#view-course-info-page #admin-outline-view #purchase_container,
#view-course-tags-page #admin-outline-view #purchase_container {
    display: none;
}
#view-course-info-page #admin-outline-view #course-footer,
#view-course-tags-page #admin-outline-view #course-footer {
    clear: both;
}

/* layout fixes (user-history-tutorial page) */
table#user-history-tutorial .a-span-nowrap a span {
    white-space: nowrap;
}

/* layout fixes (customise site text page) */
#listing-container .action {
    float: left;
}
#listing-container .action-container {
    width: 60px;
}
#listing-container .wysiwyg-edit {
    padding: 2px 4px 0 4px;
}
#listing-container .delete-it {
    padding-top: 1px;
}

/* "chosen" style fix */
/*
.chosen-container a {
    display: -webkit-inline-box !important;
}
*/
.chosen-container a span {
    display: inline-block !important;
}

/* User Edit Page */
.sent_email_button_container,
.login_history_button_container {
    width:100%;
    max-width:880px;
    margin:0 auto;
    display:block;
    margin-top:20px;
    margin-bottom:30px;
}
.sent_emails_list,
.login_history_list {
    width:100%;
    max-width:880px;
    margin:0 auto;
    display:block;
    margin-bottom:40px;
}
.sent_emails_list tr.email_overview {
    cursor:pointer;
}
.login_history_loginout {
	min-width: 100px;
}
.sent_emails_list tr.email_overview:hover,
.login_history_list tr:hover {
    background-color: #EEE;
}
.sent_emails_list td.open_message,
.sent_emails_list td.email_details,
.login_history_list td {
    border: 1px solid black;
    padding: 3px 12px;
}
.sent_emails_list td.resend_email_container {
    vertical-align: middle;
}


/* audit trail */
#audit-trail .null,
#edit-tutorial-settings-page .null {
    color: #CCC;
}

/* translations */
#translations h1 {
    font-size: 200%;
}
#translations h4 {
    margin-bottom: 3px;
}
#translations p {
    margin: 0px;
}
#translations .noemphasis {
    color: #BBB;
}

#group-add-edit-page form.wideform label {
    min-width: 150px;
}

form.wideform input.formCbx {
    width: 17px;
    margin-top: 5px;
}

#groupContainerDynamic {
    height: 80px;
}

/* password meter */
#user-add-edit-page .passwordStrength {
    padding-left: 140px;
    max-width: 348px;
    box-sizing: border-box;
}
.passwordStrength #password-strength-text {
    margin-top: 0px;
    margin-bottom: 15px;
}
.passwordStrength meter {
  /* Reset the default appearance */
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;

  margin: 5px auto 0px;
  width: 100%;
  height: 0.5em;

  /* Applicable only to Firefox */
  background: none;
  background-color: rgba(0, 0, 0, 0.1);
}

.passwordStrength meter::-webkit-meter-bar {
  background: none;
  background-color: rgba(0, 0, 0, 0.1);
}

.passwordStrength meter[value="1"] { background-color: red; }
.passwordStrength meter[value="2"] { background-color: yellow; }
.passwordStrength meter[value="3"] { background-color: orange; }
.passwordStrength meter[value="4"] { background-color: green; }

/* Webkit based browsers */
.passwordStrength meter[value="1"]::-webkit-meter-optimum-value { background-color: red; }
.passwordStrength meter[value="2"]::-webkit-meter-optimum-value { background-color: yellow; }
.passwordStrength meter[value="3"]::-webkit-meter-optimum-value { background-color: orange; }
.passwordStrength meter[value="4"]::-webkit-meter-optimum-value { background-color: green; }

/* Gecko based browsers */
.passwordStrength meter[value="1"]::-moz-meter-bar { background-color: red; }
.passwordStrength meter[value="2"]::-moz-meter-bar { background-color: yellow; }
.passwordStrength meter[value="3"]::-moz-meter-bar { background-color: orange; }
.passwordStrength meter[value="4"]::-moz-meter-bar { background-color: green; }

/* password meter end */