/* 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; }
#signatureBox{
               margin-top: 50px;
               margin-left: auto;
               margin-right: auto;
               padding: 0;}
#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;}