#main-bar {
     background-color: #3E5170;
     background-image: url("../images/bg.png");
     border-bottom: 1px solid #303F59;
     height: 50px;
}

#canvas {
     bottom: 0px;
     left: 0px;
     min-width: 800px;
     position: absolute;
     right: 0px;
     top: 0px;
}

#logo {
     background-image: url("../images/logo.png");
     background-repeat: no-repeat;
     color: #FFFFFF;
     display: inline-block;
     font-size: 14px;
     font-weight: bold;
     margin-left: 10px;
     margin-top: 12px;
     padding: 3px 0px 3px 30px;
}

#logo span {
     color: #F17E31;
}

#user-profile {
     background-color: #2D3B53;
     background-image: url("../images/profile.png");
     background-position: 10px center;
     background-repeat: no-repeat;
     border-bottom: 1px solid #445775;
     color: #AAAAAA;
     cursor: pointer;
     float: right;
     font-size: 12px;
     margin-right: 10px;
     margin-top: 7px;
     padding: 10px 22px 10px 50px;
}

#primary-navigation {
     background-color: #465976;
     background-image: url("../images/bg.png");
     border-bottom: 5px solid #FB9337;
     border-top: 1px solid #61799B;
     clear: both;
}

#primary-navigation a {
     border-left: 1px solid #61799B;
     border-right: 1px solid #303F59;
     color: #FFFFFF;
     display: inline-block;
     font-size: 12px;
     height: 100px;
     opacity: 0.5;
     padding-top: 62px;
     text-align: center;
     text-decoration: none;
     width: 100px;
}

#primary-navigation a.active {
     font-weight: bold;
     opacity: 1;
}

#primary-navigation a:hover {
     background-color: #42526C;
}

#primary-navigation a.active:hover {
     background-color: transparent;
}

#primary-navigation .last {
     border-left: 1px solid #61799B;
     display: inline-block;
     height: 100px;
     vertical-align: top;
}

#secondary-navigation {
     background-color: #2D3B53;
     bottom: 0px;
     left: 0px;
     overflow: auto;
     position: absolute;
     right: 0px;
     top: 0px;
     width: 250px;
}

#content {
     background: #FFFFFF none repeat scroll 0% 0%;
     bottom: 0px;
     left: 0px;
     position: absolute;
     right: 0px;
     top: 156px;
}

#secondary-navigation ul li {
     border-bottom: 1px dotted #596A84;
     list-style: outside none none;
}

#secondary-navigation li a {
     color: #FFFFFF;
     display: block;
     font-size: 11px;
     font-weight: bold;
     opacity: 0.5;
     overflow: hidden;
     padding: 16px;
     text-decoration: none;
     text-indent: 35px;
     text-overflow: ellipsis;
     text-transform: uppercase;
     white-space: nowrap;
}

#main-content {
     bottom: 0px;
     left: 250px;
     overflow: hidden;
     position: absolute;
     right: 0px;
     top: 0px;
}

#content .header {
     background-color: #FDFDFD;
     border-bottom: 1px solid #DDDDDD;
     color: #485B79;
     font-size: 20px;
     font-weight: bold;
     left: 0px;
     padding: 15px 20px;
     position: absolute;
     right: 0px;
}

#content table a {
     color: #777777;
     text-decoration: none;
}

#content table, #content table td, #content table th {
     border-collapse: collapse;
     border: 1px solid #DDDDDD;
     font-size: 12px;
     padding: 8px;
}

#content table th, #content table tfoot td {
     background-color: #F4F4F4;
     color: #000000;
     font-weight: bold;
     text-align: center;
}

#content table {
     width: 100%;
}

#content table tbody tr:hover {
     background-color: #F5F5F5;
}

#content table td {
     color: #777777;
     font-size: 12px;
}

#content table td.no-results {
     text-align: center;
}

#content .content {
     bottom: 0px;
     left: 0px;
     overflow: auto;
     padding: 0px 20px;
     position: absolute;
     right: 0px;
     top: 60px;
}

#secondary-navigation li a:hover, #secondary-navigation li a.active {
     opacity: 1;
}

#content .header a {
     background-color: #EEEEEE;
     border: 1px solid #CCCCCC;
     box-shadow: 0px 0px 2px #DDDDDD;
     color: #888888;
     float: right;
     font-size: 12px;
     margin-left: 10px;
     padding: 6px 12px;
     text-decoration: none;
     cursor: pointer;
     vertical-align: middle;
     position: relative;
}

#content .header a.delete {
     padding-left: 28px;
}

#content .header a.delete span {
     background: rgba(0, 0, 0, 0) url("../images/editor.png") no-repeat scroll 0 0;
     display: inline-block;
     height: 16px;
     left: 4px;
     margin-top: -10px;
     position: absolute;
     top: 50%;
     vertical-align: sub;
     width: 16px;
}

#content .header a:hover {
     background-color: #D3D3D3;
     border: 1px solid #AAAAAA;
     color: #777777;
}

#content .header a.pending {
     background-color: blue;
}

#content .sub-merge {
     background-color: #F4F4F4;
     padding: 8px 10px;
}

#content .sub-merge {
     border: 1px solid #DDDDDD;
     margin-bottom: -1px;
}

#content .merge {
     margin-bottom: -1px;
}

#content .sub-merge.bottom, #content .merge.bottom {
     margin-bottom: 0px;
     margin-top: -1px;
}

#content .sub-merge .button, #content .sub-merge input[type="submit"] {
     background-color: #F0F0F0;
     border: 1px solid #CCCCCC;
     cursor: pointer;
     display: inline-block;
     font-family: helvetica;
     font-size: 12px;
     height: 28px;
     padding: 5px 10px;
     vertical-align: middle;
}

#content .sub-merge .button:hover, #content .sub-merge input[type="submit"]:hover {
     background-color: #DDDDDD;
     border-color: #AAAAAA;
}

#content .sub-merge .pagination a {
     background-color: #EEEEEE;
     border: 1px solid #CCCCCC;
     color: #777777;
     display: block;
     font-size: 11px;
     padding: 4px 8px;
     text-decoration: none;
}

#content .sub-merge .pagination {
     list-style: outside none none;
     text-align: center;
}

#content .sub-merge .pagination li {
     display: inline-block;
}

#content .sub-merge .pagination li.disabled a {
     color: #CCCCCC;
}

#content .sub-merge .pagination li.active a {
     background-color: #485B79;
     border-color: #485B79;
     color: #FFFFFF;
}

#content table th select {
     border: 1px solid #CCCCCC;
     color: #777777;
     padding: 2px;
     text-align: center;
     width: 100%;
}

#content .fixed-size table {
     min-width: 100%;
     table-layout: fixed;
     width: auto;
}

#content .fixed-size table td, #content .fixed-size table th {
     max-width: 300px;
     min-width: 200px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
}

#content .fixed-size {
     overflow: auto;
}

div.standard-form p label {
     background-color: #F4F4F4;
     border-right: 1px solid #DDDDDD;
     box-sizing: border-box;
     color: #555555;
     display: inline-block;
     font-size: 12px;
     font-weight: bold;
     padding: 15px 10px;
     width: 200px;
}

div.standard-form p > span {
     color: #777777;
     font-size: 14px;
     margin: 0px 10px;
}

div.standard-form p {
     border-collapse: collapse;
     border: 1px solid #DDDDDD;
     margin-top: -1px;
}

.standard-form input[type="text"], .standard-form input[type="password"], .standard-form select, .pretty-form.file-upload {
     border: 1px solid #CCCCCC;
     box-shadow: 0px 0px 2px #DDDDDD;
     padding: 4px 5px;
     width: 500px;
}

.pretty-form.file-upload input {
     width: 100%;
}

.pretty-form.file-upload span, .pretty-form.file-upload div {
     bottom: 0px;
     display: block;
     position: absolute;
     top: 0px;
}

.pretty-form.file-upload .progress {
     background-color: #EEEEEE;
     left: 0px;
     width: 0%;
}

.pretty-form.file-upload .value {
     color: #777777;
     font-size: 14px;
     left: 0px;
     overflow: hidden;
     padding: 4px 5px;
     right: 30px;
     text-overflow: ellipsis;
     white-space: nowrap;
}

.content .standard-form .pretty-form.file-upload .icon {
     background-image: url("../images/file-upload.png");
     background-position: center center;
     background-repeat: no-repeat;
     right: 0px;
     width: 30px;
}

div.standard-form p.submit {
     padding: 15px 10px;
}

div.standard-form input[type="submit"], div.standard-form input[type="reset"] {
     background-color: #485B79;
     border: 1px solid #596A84;
     color: #FFFFFF;
     font-size: 12px;
     font-weight: bold;
     padding: 5px 12px;
}

div.standard-form input[type="submit"]:hover, div.standard-form input[type="reset"]:hover {
     background-color: #546A8C;
     cursor: pointer;
}

.content .message {
     font-size: 14px;
     margin-bottom: 10px;
     padding: 10px 6px;
}

.message.error {
     background-color: #FAD5CF;
     border: 1px solid #BA0300;
     color: #BA0300;
}

.message.success {
     background-color: #EFFEB9;
     border: 1px solid #759112;
     color: #759112;
}

.message.warning {
     background-color: #FFE9AD;
     border: 1px solid #8E7430;
     color: #8E7430;
}

.message.announcement {
     background-color: #FFFFDF;
     border: 1px solid #5E5E00;
     color: #5E5E00;
}

.message::before {
     background-image: url("../images/messages.png");
     background-repeat: no-repeat;
     content: " ";
     display: inline-block;
     height: 30px;
     margin-right: 5px;
     vertical-align: middle;
     width: 30px;
}

.message.error::before {
     background-position: -30px 0px;
}

.message.success::before {
     background-position: 0px -30px;
}

.message.warning::before {
     background-position: -30px -30px;
}

.message.announcement::before {
     background-position: 0px 0px;
}

#content .content::after, #content .content::before {
     content: " ";
     display: block;
     padding-bottom: 20px;
}

.pretty-form {
     background-repeat: no-repeat;
     display: inline-block;
     position: relative;
}

.pretty-form.checkbox {
     background-image: url("../images/pretty-form.png");
     background-position: -2px -2px;
     height: 14px;
     width: 14px;
}

.pretty-form.checkbox.active {
     background-position: -20px -2px;
}

.content .standard-form .pretty-form.file-upload {
     padding: 0px;
}

.pretty-form input {
     cursor: pointer;
     opacity: 0;
     vertical-align: middle;
}

.editor {
     background-image: url("../images/editor.png");
     background-repeat: no-repeat;
     cursor: pointer;
     display: inline-block;
     height: 16px;
     margin: 0px 10px;
     overflow: hidden;
     text-indent: -1000px;
     width: 16px;
}

.editor.delete {
     background-position: -2px -2px;
     height: 16px;
     width: 16px;
}

.editor.delete:hover {
     background-position: -22px -2px;
     height: 16px;
     width: 16px;
}

.editor.delete-products {
     background-position: -2px -22px;
     height: 16px;
     width: 16px;
}

.editor.delete-products:hover {
     background-position: -22px -22px;
     height: 16px;
     width: 16px;
}

.editor.edit {
     background-position: -42px -2px;
     height: 16px;
     width: 16px;
}

.editor.edit:hover {
     background-position: -42px -22px;
     height: 16px;
     width: 16px;
}

.content-divider.two .divider-column {
     float: left;
     width: 50%;
}

.content-divider .divider-column.padding {
     padding: 0px 10px;
}

.standard-form p.form-header {
     background-color: #F4F4F4;
     color: #555555;
     font-weight: bold;
     margin-bottom: -1px;
     padding: 10px;
}

div.interactive-table td input[type="text"] {
     border: medium none;
     bottom: 0px;
     box-shadow: none;
     height: 100%;
     left: 0px;
     position: absolute;
     right: 0px;
     top: 0px;
     width: 100%;
}

div.interactive-table td.error {
     color: #FF0000 !important;
}

.content .progress-bar {
     background-color: #EEEEEE;
     border: 1px solid #AAAAAA;
     position: relative;
     text-align: center;
}

.content .progress-bar span {
     color: #333333;
     line-height: 20px;
     position: relative;
     z-index: 1000;
}

.content .progress-bar div {
     background-color: #CCCCCC;
     bottom: 0px;
     left: 0px;
     position: absolute;
     top: 0px;
     z-index: 0;
}

div.interactive-table tr.empty {
     display: none;
}

.content a.button-simple {
     background-color: #546A8C;
     border-radius: 5px;
     color: #ffffff ! important;
     padding: 4px 20px;
}

div.interactive-table table {
     table-layout: fixed;
}

div.interactive-table table td:nth-child(1), div.interactive-table table th:nth-child(1) {
     text-align: center;
     width: 50px;
}

div.interactive-table table td:last-child, div.interactive-table table th:last-child {
     text-align: center;
     width: 100px;
}

div.interactive-table table td, div.interactive-table table th {
     height: 44px;
}

#content div.interactive-table td.editable {
     position: relative;
     background-clip: padding-box;
}

#content div.interactive-table td {
     background-color: #F9F9F9;
}
