/* RESET CSS */

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: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}


/* remember to define focus styles! */

:focus {
    outline: 0;
}


/* remember to highlight inserts somehow! */

ins {
    text-decoration: none;
}

del {
    text-decoration: line-through;
}


/* tables still need 'cellspacing="0"' in the markup */

table {
    border-collapse: collapse;
    border-spacing: 0;
}


/******************************************************************************/

body {
    font: 11px "Trebuchet MS";
}

#header {
    background: url(/public/images/head-bg.png) repeat-x;
    height: 111px;
    min-width: 970px;
}

#logo {
    width: 970px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 15px;
}

#info {
    color: #000;
    /*border: 1px solid #ccc;*/
}

.title h3 span {
    color: #009999;
}

#info h2 {
    font-size: 19px;
}

#info h2 span {
    color: #009999;
}

#info small {
    display: block;
    margin: 2px 0 2px;
}

#sidebar a {
    color: #134a9b;
    text-decoration: underline;
}

#top_nav {
    width: 970px;
    margin-top: 5px;
    margin-left: auto;
    margin-right: auto;
    height: 35px;
    padding: 5px;
    padding-left: 25px;
    min-width: 500px;
}

#top_nav ul li {
    color: white;
    text-decoration: none;
    border: none;
    font-size: 12px;
}

#top_nav a {
    color: white;
    text-decoration: none;
    border: none;
    font-size: 12px;
    margin-left: 25px;
}

#top_nav a:hover {
    color: white;
    border: none;
}

#top_nav ul {
    font-family: Arial, Verdana;
    font-size: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

#top_nav ul li {
    display: block;
    position: relative;
    float: left;
}

#top_nav li ul {
    display: none;
}

#top_nav ul li a {
    display: block;
    text-decoration: none;
    color: #ffffff;
    padding: 5px 15px 5px 15px;
    background: #10499e;
    margin-left: 1px;
    white-space: nowrap;
}

#top_nav ul li a:hover {
    background: #0a2b5d;
}

#top_nav li:hover ul {
    display: block;
    position: absolute;
}

#top_nav li:hover li {
    float: none;
    font-size: 11px;
}

#top_nav li:hover a {
    background: #3b3b3b;
}

#top_nav li:hover li a:hover {
    background: #10499e;
}

#wrap {
    float: left;
    width: 100%;
}

#wrap.fixed {
    width: 1024px;
    margin: 0 auto;
    float: none;
}

#wrap.login {
    width: 400px;
    margin: 0 auto;
    float: none;
    margin-top: 50px;
}

.bged {
    background: url(/public/images/major_bg.jpg) no-repeat;
}

#wrap.login #content {
    float: none;
    min-width: 0px;
    margin-right: 0px;
    width: auto;
}

#wrap.login #content .box {
    width: auto;
}

.inner .box {
    width: 692px;
}

#wrap.login #content .inner {
    margin-right: 0px;
    margin-left: 0px;
}


/* Content */

.bigcontent {
    min-width: 500px;
    margin-right: -265px;
}

#content {
    float: left;
    width: 100%;
    padding-top: 15px;
}

#content a:link,
#content a:visited {
    color: #134a9b;
    text-decoration: none;
}

#content a:hover {
    color: #000;
}

#content .inner {
    margin-right: 300px;
    margin-left: 30px;
}

#content .box,
#sidebar .box {
    background: #f4f4f4;
    border: 1px solid #e5e2e2;
    border-top: 0;
    margin-bottom: 15px;
}

#content .title {
    background: url(/public/images/title_bg.jpg) repeat-x;
    height: 45px;
}

#content .title h3,
#sidebar .title h3 {
    color: #FFF;
    font-size: 11px;
    font-weight: bold;
    padding-top: 15px;
    padding-left: 15px;
    float: left;
    width: auto;
}

#content .title.collapsed {
    margin-bottom: 10px;
}

#content .box .txt,
#sidebar .box .txt {
    border: 1px solid #FFF;
    padding: 10px;
}

#content .box .txt p {
    margin-bottom: 10px;
}

#content .icon_list {
    margin-top: 10px;
}

#content .icon_list li {
    background: #FFF;
    border: 1px solid #e5e2e2;
    width: 80px;
    height: 60px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    text-align: center;
    padding: 10px;
    float: left;
    margin-right: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
}

#content .icon_list li:hover {
    background: #FFF url(/public/images/icon_holder_bg.jpg) repeat-x bottom;
}

#content .icon_list li a {
    display: block;
    font-size: 11px;
    color: #727272;
    text-decoration: none;
}

#content .icon_list li a:hover {
    color: #000;
}


/* Table */

#content table {
    width: 100%;
    border: 0;
}

#content table thead th {
    font-weight: bold;
    text-align: left;
    background: #FFF;
    border-bottom: 1px solid #e5e2e2;
}

#content table tbody {
    border-bottom: 1px solid #e5e2e2;
}

#content table tbody tr td {
    background: #FFF;
}

#content table thead th,
#content table tbody tr td {
    padding: 10px;
}

#content table tbody tr td.alt {
    background: transparent;
}


/* Table2 - popup jquery dialogs */

#content2 table {
    width: 100%;
    border: 0;
}

#content2 table thead th {
    font-weight: bold;
    text-align: left;
    background: #FFF;
    border-bottom: 1px solid #e5e2e2;
}

#content2 table tbody {
    border-bottom: 1px solid #e5e2e2;
}

#content2 table tbody tr td {
    background: #FFF;
}

#content2 table thead th,
#content2 table tbody tr td {
    padding: 10px;
}

#content2 table tbody tr td.alt {
    background: transparent;
}

#crud #crudContent table {
    width: 100%;
    border: 1px solid #ddd;
    border-top: none;
    border-collapse: collapse;
}

#crud #crudContent table thead tr {
    background: #0A65AF;
}

#content2 table th {
    color: #fff;
    font-weight: bold;
}

#content2 table th a {
    color: #fff;
    font-weight: bold;
}

#content2 table th {
    text-align: left;
    padding: 6px 5px;
}

#content2 table td {
    text-align: left;
    padding: 4px 5px;
}

#content2 table td {
    border-bottom: 1px solid #eee;
}

#content2 table tr.even {
    background: #f9f9f9;
}


/* Tabs */

#content .selector {
    float: right;
    margin-top: 17px;
    margin-right: 10px;
    width: auto;
}

#content .selector a:link,
#content .selector a:visited,
#content .selector a:visited {
    text-decoration: none;
    color: #FFF;
    margin-left: 5px;
}

#content .selector a.active {
    background: #FFF;
    color: #000;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px;
}

#content .selector a.activeNonJs {
    background: #FFF;
    color: #000;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px;
}


/* Form */

form p {
    margin-bottom: 10px;
}

form label {
    display: block;
    margin: 5px;
    font-weight: bold;
    margin-left: 0;
    color: #444444;
}

form small {
    display: block;
    padding: 5px;
    padding-left: 0;
    color: #737373;
}

.txt-input,
.select-input,
.textarea-input {
    font: 11px "Trebuchet MS";
    background: #FFF;
    color: #5e5e5e;
    border: 1px solid #e5e2e2;
    padding: 5px;
    font-size: 11px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    margin-bottom: 5px;
}

.txt-input.small,
.select-input.small,
.textarea-input.small {
    width: 50%;
}

.txt-input.medium,
.select-input.medium,
.textarea-input.medium {
    width: 70%;
}

.txt-input.large,
.select-input.large,
.textarea-input.large {
    width: 90%;
}

.button-blue,
.button,
.delete,
.reset {
    background: #134a9b;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    padding: 5px;
    padding-right: 15px;
    padding-left: 15px;
    color: #FFF;
    margin-right: 5px;
}

.button-blue {
    background-color: #CCFFFF;
    color: #000;
}

.reset {
    background: #a5a5a5;
}

.delete {
    background: #8B0000;
}

.remember {
    float: right;
    padding: 5px;
    width: auto;
}


/* Sidebar */

#sidebar {
    float: left;
    width: 222px;
    padding-right: 20px;
    margin-top: 39px;
}

#sidebar .title {
    background: url(/public/images/sidebar/title_bg.jpg) no-repeat;
    width: 222px;
    height: 45px;
}

#sidebar ul {
    margin-top: 5px;
}

#sidebar ul li {
    background: url(/public/images/global/green_dot.jpg) no-repeat;
    padding-left: 15px;
    margin-bottom: 10px;
    margin-top: 10px;
}

#sidebar ul.todo li {
    background: url(/public/images/global/green_dot.jpg) no-repeat top left;
    padding-left: 15px;
    margin-bottom: 15px;
}

#sidebar ul.todo li a {
    text-decoration: none;
}

#sidebar ul.todo li p {
    color: #7d7d7d;
    font-size: 9px;
    margin-top: 5px;
}

#sidebar ul.todo li ul.links li {
    display: inline;
    background: url(/public/images/global/link_arrow.jpg) no-repeat;
    padding-left: 11px;
}

#sidebar ul.todo li ul.links li a {
    font-size: 9px;
    color: #a2cb47;
    font-weight: bold;
}

#sidebar #datepicker {
    width: 215px;
    margin: 0 auto;
}


/* Notifications */

.message {
    background: #fefbcc;
    border: 1px solid #e6db55;
    padding: 15px;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    margin-bottom: 10px;
}

.message h3 {
    font-size: 16px;
    font-weight: bold;
}

.message p {
    color: #4d4d4d;
}

.message a {
    color: #000;
    text-decoration: underline;
}

.message.warning {
    background: #fefbcc url(/public/images/icons/warning.png) no-repeat left;
    background-position: 10px;
}

.message.info {
    background: #d9e4ff url(/public/images/icons/info.png) no-repeat left;
    background-position: 10px;
    border: 1px solid #8dacf7;
}

.message.error {
    background: #ffcfcd url(/public/images/icons/delete.png) no-repeat left;
    background-position: 10px;
    border: 1px solid #e2918d;
}

.message.success {
    background: #d4fccd url(/public/images/icons/add.png) no-repeat left;
    background-position: 10px;
    border: 1px solid #99dc8d;
}

.message.warning p,
.message.info p,
.message.error p,
.message.success p {
    margin: 0;
    margin-left: 18px;
}

.clear {
    clear: both;
}


/** Administration area **/

h1 {
    font-size: 20px;
    margin: 10px 0px;
}

h2 {
    font-size: 16px;
    margin: 10px 0px;
}

#crud {
    margin: 0;
    padding: 0;
    font-family: 'Helvetica', 'Arial', sans-serif;
    font-size: 90%;
    color: #111;
}


/** Header **/

#crud #crudHeader {
    background: #111111;
    padding: 10px 20px;
}

#crud #crudHeader h1 {
    margin: 0;
    font-weight: normal;
}

#crud #crudHeader h1 a {
    color: gold;
    text-decoration: none;
}


/** Breadcrumb **/

#crudBreadcrumb {
    padding: 5px 0px;
    border-bottom: 1px solid #ddd;
}

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

#crudBreadcrumb li {
    display: inline;
}

#crudBreadcrumb a {
    color: #333;
}

#crudBreadcrumb li:last-child a {
    color: #888;
    text-decoration: none;
}


/** Flash message **/

.crudFlash {
    padding: 5px 20px;
    border-bottom: 1px solid #ddd;
    color: #fff;
}

.flashError {
    background: #c00;
}

.flashSuccess {
    background: #54BD06;
}


/** Content **/

#crud #crudContent {
    padding: 10px 20px;
}

#crud #crudContent h2 {
    color: #333;
    font-weight: normal;
    margin-top: 10px;
}

#crud #crudContent a {
    color: #444;
}


/** Tables **/

#crud #crudContent table {
    width: 100%;
    border: 1px solid #ddd;
    border-top: none;
    border-collapse: collapse;
}

#crud #crudContent table thead tr {
    background: #0A65AF;
}

#crud #crudContent table th {
    color: #fff;
    font-weight: bold;
}

#crud #crudContent table th a {
    color: #fff;
    font-weight: bold;
}

#crud #crudContent table th {
    text-align: left;
    padding: 6px 5px;
}

#crud #crudContent table td {
    text-align: left;
    padding: 4px 5px;
}

#crud #crudContent table td {
    border-bottom: 1px solid #eee;
}

#crud #crudContent table tr.even {
    background: #f9f9f9;
}

#crud #crudContent table tr:last-child td {
    border-bottom: 1px solid #ddd;
}

.crudSortedAsc:after {
    content: '▼';
}

.crudSortedDesc:after {
    content: '▲';
}


/** Forms **/

form {
    margin: 0;
}

input,
textarea,
select {
    font-family: 'Helvetica', 'Arial', sans-serif;
    font-size: 12px;
}

textarea {
    padding: 2px;
}

.objectForm {
    border: 1px solid #ddd;
}

label {
    display: block;
    font-weight: bold;
    width: 20%;
    float: left;
    color: #666;
    cursor: pointer;
}

.crudField {
    padding: 10px;
    border-bottom: 1px solid #eee;
    position: relative;
}

.crud_hidden {
    display: none;
    height: 0px;
}

.crudButtons {
    background: #efefef;
    text-align: right;
    margin: 0;
    padding: 10px;
}

.crudField .error {
    color: #c00;
    padding-left: 10px;
    position: absolute;
    top: 15px;
    font-size: 80%;
}

.crudField .hasError {
    color: #c00;
}

.crudField select[multiple] {
    max-height: 100px;
}

.crudField .crudHelp {
    font-size: 80%;
    color: #888;
    display: block;
    margin-left: 20%;
    margin-top: 5px;
}

form .currentAttachment {
    display: block;
    font-size: 80%;
    margin-left: 20%;
    padding-top: 4px;
}

form .removeAttachment {
    display: block;
    font-size: 80%;
    margin-left: 20%;
}


/** Footer **/

#crud #crudFooter {
    font-size: 80%;
    color: #aaa;
    padding: 10px 20px;
    border-top: 1px dashed #ccc;
    border-bottom: 1px dashed #ccc;
    margin-top: 20px;
}

#crud #crudFooter a {
    font-size: 90%;
    color: #333;
}


/** Home **/

.crudNew {
    text-align: right !important;
}

.crudNew a {
    background: #54BD06;
    padding: 2px 10px;
    font-size: 90%;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    color: #fff !important;
    text-decoration: none;
}

.crudNew a:hover {
    opacity: .8;
}


/** List **/

#crudList {
    position: relative;
}

#crudListAdd a {
    margin: 0;
    position: absolute;
    top: 0;
    right: 0;
    background: #54BD06;
    padding: 3px 10px;
    font-size: 90%;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    color: #fff !important;
    text-decoration: none;
}

#crudListAdd a:hover {
    opacity: .8;
}

#crudListSearch {
    padding: 4px 5px;
    border: 1px solid #ddd;
    background: #efefef;
}

#crudListSearch input[type=text] {
    width: 40%;
}

#crudListSearch a {
    color: #111 !important;
    font-size: 90%;
}

#crudListPagination {
    padding: 4px 5px;
    border: 1px solid #ddd;
    background: #efefef;
    border-top: 0;
    font-size: 90%;
    position: relative;
}

#crudListPagination .crudCount {
    margin: 0;
}

#crudListPagination .crudPages {
    margin: 0;
    position: absolute;
    right: 5px;
    top: 4px;
}


/** Show **/

#crudShow {
    position: relative;
}

.crudDelete input {
    color: #fff;
    border: none;
    background: #c00;
    padding: 2px 10px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    cursor: pointer;
}

.crudDelete input:hover {
    opacity: .7;
}

.permissionModule {
    font-weight: bold;
    color: orange;
}

#permissionsTh {
    text-align: left;
}

#left-buttons {
    float: left;
    margin: 5px;
    width: 200px;
}

.marginRight {
    margin-right: 20px;
}

#generateNewPasswordForm {
    float: left;
}

#deleteForm {
    float: left;
}

.viewFieldTitle {
    font-weight: bold;
}

.viewField {
    width: 80%
}

.field {
    text-align: left;
}

.viewTableTitle {
    color: darkOrange;
}

.viewTableTitle {
    background-color: #292929;
}

#tiny table thead th,
#tiny table tbody tr td,
#tiny table tbody {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    background: transparent;
}

#tiny table {
    width: auto;
}

#sylabbusItemForm table tbody tr th {
    vertical-align: bottom;
}

#sylabbusItemForm .crudHelp {
    font-size: 80%;
    color: #888;
    display: block;
}

#sylabbusItemForm .error {
    color: red;
}

#header-print {
    display: none;
}

#footer-print {
    display: none;
}

#coursehead {
    margin: 10px;
}

#preload {
    display: none;
}

.tblconf {
    background: transparent;
}

#tableconfirm tr.preloader {
    text-align: center;
    margin-top: 10px;
}

#tableconfirm tr {
    border: grey dotted 1px;
}

#tableconfirm tr.GREEN {
    background: #89cc85;
}

#tableconfirm tr.YELLOW {
    background: #fffabe;
}


/*#tableconfirm tr.RED{background: #ff8888; }*/

#tableconfirm tr.RED {
    background: #ffcccc;
}

.answerblocktable tr {
    margin: 0px;
    padding: 0px;
}

.answerblocktable tr td {
    margin: 0px;
    padding: 0px;
}

.rightanswer {
    border: 2px solid #00ff6f;
}

.rightanswer {
    background-color: #00ff6f;
}

select,
option {
    background-color: white;
}

.answerBox {
    width: 10px;
    height: 10px;
    vertical-align: bottom;
}

.answerBoxBorder {
    width: 10px;
    border: 1px solid black;
    padding: 0px
}

.answerBoxBorderTrue {
    width: 10px;
    border: 1px solid green;
    padding: 0px;
    color: green;
}

.answerBreak {
    width: 5px;
}

.qNumberAnsBreak {
    width: 5px;
    height: 10px;
}

.qNumberAns {
    width: 10px;
    height: 10px;
}

.answerblock {
    float: left;
    padding: 0px
}

.answerblock tbody tr td {
    float: left;
    padding: 5px;
    margin: 0px;
}

#exam p {
    margin: 5px 0 5px 0;
}

#exam {
    background-color: white;
}

.hiddentoogle {
    display: none;
}

.questionConfirmQBox {
    width: 40%;
    float: left;
}

.questionConfirmStat {
    width: 60%;
    float: right;
}

#tableconfirm tr td {
    vertical-align: top;
}

#questionDetails {
    background-color: white;
}

#questionDetails th {
    background-color: black;
    color: white;
}

.questionDetailsDiv {
    width: 100%
}

#tableconfirm tr .rightanswer {
    border: 2px solid #89cc85;
}

.questionDetailsToogle {
    clear: both;
    cursor: pointer;
    border-top: 1px solid white;
}

#tableconfirm img {
    max-width: 90%;
}

div.positioner {
    position: absolute;
}


/*may not be needed: see below*/

div.fixated {
    width: 70px;
    height: 35px;
    position: fixed;
    top: 500px;
    margin-left: -320px;
}

.ui-timepicker-div .ui-widget-header {
    margin-bottom: 8px;
}

.ui-timepicker-div dl {
    text-align: left;
}

.ui-timepicker-div dl dt {
    height: 25px;
}

.ui-timepicker-div dl dd {
    margin: -25px 0 10px 65px;
}

.ui-timepicker-div td {
    font-size: 90%;
}

#certificateBox {
    text-align: center;
    font-size: 12px;
}

#certificateBox h1 {
    font-size: 30px;
}

#certificateBox h2 {
    font-size: 24px;
}

#leftbox {
    float: left;
    width: 45%;
    text-align: left;
}

#rightbox {
    width: 45%;
    text-align: left;
}

#centeringBox {
    text-align: center;
    width: 100%;
}

#centeringBox table {
    width: 800px;
    margin-left: auto;
    margin-right: auto;
    border: 0;
    text-align: center;
}

#centeringBox table thead th {
    font-weight: bold;
    background: #FFF;
    border-bottom: 1px solid #e5e2e2;
}

#centeringBox table tbody {
    border-bottom: 1px solid #e5e2e2;
}

#centeringBox table tbody tr td p {
    margin-top: 50px;
}

#centeringBox table tbody tr td {
    background: #FFF;
}

#centeringBox table thead th,
#centeringBox table tbody tr td {
    padding: 10px;
}

#centeringBox table tbody tr td.alt {
    background: transparent;
}

.right {
    text-align: right;
}

.left {
    text-align: left;
}

.prettysmall {
    color: #ccc;
    font-size: xx-small;
    margin-left: 30px;
    display: inline;
}

.prettysmall a:link,
.prettysmall a:visited,
.prettysmall a {
    color: #ccc
}

#ftree {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px dotted #ccc;
}

.qdeact {
    color: grey;
}

.qact {
    color: green;
}

.fileId,
.folderId {
    color: grey !important;
    font-size: 80%;
}

.unread {
    font-size: 20px;
    color: #0099ff;
}

#syllabusformtable tr td {
    padding: 5px !important;
}

.qnok {
    background-color: #FFD1D1;
}

.qok {
    background-color: #AFECFF;
}

.questionAnswersHidden {
    display: none;
}

.levelRadio {
    display: none;
}

.comments {
    width: 100%;
    margin-top: 5px;
}

.userComment {
    color: #4b8df8;
    width: 20%;
}

.deleteComment {
    color: grey;
    text-decoration: none;
}

.deleteComment:hover {
    color: red;
    text-decoration: underline;
}

#commentSend {
    font-weight: bold;
}

#addCommentLink,
#showAllComments,
#commentSend {
    color: #4b8df8;
    text-decoration: none;
}

#addCommentLink:hover,
#showAllComments:hover,
#commentSend:hover {
    color: #55aaff;
    text-decoration: underline;
}

.taskattribs {
    width: 100%;
    text-align: center;
    border: none;
    font-weight: bold;
}

#allFields {
    max-height: 300px;
}

#selectedFields {
    max-height: 300px;
}