sheercms/static/css/styles.css

Sheer Cliff CMS is a simple and powerful content management system (CMS) for Node JS.

/*=== Hides the page until AngularJS has finished loading */
[ng\:cloak], [ng-cloak], .ng-cloak {
    display: none !important;
}

body {
    background-color: #333;
    margin: 0;
    padding: 0;
}

.brand {
    padding: 10px 0px 10px 25px;
    font-weight: bold;
    color: #fff;
    font-size: 16px;
}
.brand-version {
    display: inline-block;
    margin-left: 5px;
    font-size: 11px;
    font-weight: normal;
}

.main-menu {
    padding: 10px 25px 10px 0px;
}

.main-menu .profile-name {
    color: #fff;
    font-size: 12px;
    font-weight: normal;
    padding: 4px;
    margin-right: 8px;
}

.navbar-main {
    min-height: inherit;
    margin: 0px;
}
.navbar-main .dropdown-menu  {
    left: -1px;
    box-shadow: 0px 10px 12px rgba(0, 0, 0, 0.176);
    border-top: none;
}
.navbar-main > ul > li {
    margin-left: 2px;
}
.navbar-main > ul > li > a {
    margin: 0px;
    padding: 4px 8px;
    color: #fff;
    line-height: inherit;
}
.navbar-main a {
    font-size: 12px;
    font-weight: normal;
}
.navbar-main li.active > a,
.navbar-main > ul > li > a:hover {
    color: #000;
    background-color: #eee;
}
.navbar-main li.open > a {
    background-color: #fff !important;
}

/*=== Main Content Area ===*/

.main {
    margin: 0px;
    padding: 0px 40px 20px 40px;
}

.main-container {
    background-color: #fff;
}

/*=== Main View: Content ===*/
.main-view {
    overflow: hidden;
}
.main-view-left {
    /*border-right: 1px solid #ccc;*/
    height: 100%;
    padding: 0px;
    background-color: #f4f3f1;
    background-image: url('../images/group-border-right.png');
    background-position: right top;
    background-repeat: repeat-y;
    width: 300px;
    float:left;
}
.main-view-left .toolbar {
    background-image: url('../images/group-border-right.png');
    background-position: right top;
    background-repeat: repeat-y;
    padding-left: 10px;
}
.main-view .group-list {
    border-bottom: 1px solid #e0e0e0;
}
.main-view .group-list ul {
    list-style-type: none;
    display:block;
    margin: 0;
    padding: 0;
}
.main-view .group-list > a {
    display: block;
    padding: 10px 20px;
    margin: 0;
    border-top: 1px solid #e0e0e0;
    font-size: 14px;
    text-decoration: none;
    color: #000;
    cursor: pointer;
    overflow:hidden;

    /* disable selection of text - for double click */
    -webkit-user-select: none;  /* Chrome all / Safari all */
    -moz-user-select: none;     /* Firefox all */
    -ms-user-select: none;      /* IE 10+ */

    /* No support for these yet, use at own risk */
    -o-user-select: none;
    user-select: none;
}
.main-view .group-list > a img {
    float:left;
    margin-right: 10px;
}
.main-view .group-list > a span {
    color: #666;
    font-size: 11px;
    display: block;
}
.main-view .group-list > a:hover {
    background-color: #fff;
    background-image: url('../images/group-border-right.png');
    background-position: right top;
    background-repeat: repeat-y;
}
.main-view .group-list > a.selected {
    background-color: #fff;
}
.main-view .group-list > a.selected:hover {
    background-color: #fff;
    background-image: none !important;
}
.main-view .group-list > a > div {
    float:left;
}
.main-view .group-list > a > i {
    float: right;
    color: #666;
    margin: 10px 0 0 0;
    font-size: 20px;
}
.group-sortable-helper {
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    height: 60px;
    background-color: #fff;
}
.group-sortable-placeholder {
    border: 1px dashed #000;
    height: 60px;
    background-color: #fff;
}

.main-view-center {
    margin-left: 300px;
    overflow: hidden;
}

.no-auth {
    margin-top: 20px;
}

/*=== Group Properties Dialog ===*/
#GroupPropsForm {
    min-height: 500px;
}
#GroupPropsForm .group-views-list strong {
    display:block;
    margin-bottom: 10px;
}
#GroupPropsForm .group-views-list label {
    font-weight: normal;
    padding-left: 20px;
}
#GroupPropsForm .group-views-list input {
    margin-right: 5px;
}
#GroupPropsForm table.permissions {
    margin-top: 20px;
}
#GroupPropsForm table.permissions a.fa {
    text-decoration: none;
    font-size: 16px;
}
#GroupPropsForm table.permissions a.fa-times {
    color: red;
}

/* info box in top-left of edit content page */
.content-info {
    padding: 10px 10px 20px 10px;
    min-height: 100px;
    font-size: 11px;
}
.content-info > div {
    margin-bottom: 4px;
}
.content-info label {
    font-weight: bold;
    display:inline-block;
    margin: 0 10px 0 0;
    width: 60px;
}

/*=== End of Content View ===*/

/*=== Template View ===*/

.template-view {
    padding-bottom: 20px;
}

/*=== End of Template View ===*/

/*=== Menu View ===*/


/*=== End of Menu View ===*/

/*=== User View ===*/

.user-view {
    padding-bottom: 20px;
}

/*=== End of User View ===*/

/*=== Log View ===*/

.log-view {
    padding-bottom: 20px;
}

/*=== End of Log View ===*/

/*=== Caching View ===*/

.caching-view {
    padding-bottom: 20px;
}

/*=== End of Caching View ===*/

/*=== Package View ===*/

.package-view {
    padding-bottom: 20px;
}

/*=== End of Package View ===*/

/*=== Stats View ===*/

.stats-view {
    padding-bottom: 20px;
}

.table.backups {
    width: 600px;
}
.table.backups td > a {
    margin-right: 20px;
}

.backup-restore-results {
    margin: 20px 0px;
}
.backup-restore-results > strong {
    display:block;
    margin-bottom: 10px;
}

/*=== End of Stats View ===*/

/*.page-title {
    *//*background-color: #5CADFF;*//*
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    padding: 6px 10px;
    border-bottom: 1px solid #246BB2;

    background: #6db3f2; *//* Old browsers *//*
    background: -moz-linear-gradient(top,  #6db3f2 0%, #3690f0 100%, #54a3ee 100%, #1e69de 100%, #54a3ee 101%, #3690f0 101%); *//* FF3.6+ *//*
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6db3f2), color-stop(100%,#3690f0), color-stop(100%,#54a3ee), color-stop(100%,#1e69de), color-stop(101%,#54a3ee), color-stop(101%,#3690f0)); *//* Chrome,Safari4+ *//*
    background: -webkit-linear-gradient(top,  #6db3f2 0%,#3690f0 100%,#54a3ee 100%,#1e69de 100%,#54a3ee 101%,#3690f0 101%); *//* Chrome10+,Safari5.1+ *//*
    background: -o-linear-gradient(top,  #6db3f2 0%,#3690f0 100%,#54a3ee 100%,#1e69de 100%,#54a3ee 101%,#3690f0 101%); *//* Opera 11.10+ *//*
    background: -ms-linear-gradient(top,  #6db3f2 0%,#3690f0 100%,#54a3ee 100%,#1e69de 100%,#54a3ee 101%,#3690f0 101%); *//* IE10+ *//*
    background: linear-gradient(to bottom,  #6db3f2 0%,#3690f0 100%,#54a3ee 100%,#1e69de 100%,#54a3ee 101%,#3690f0 101%); *//* W3C *//*
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2', endColorstr='#3690f0',GradientType=0 ); *//* IE6-9 *//*
}*/

.main-content {
    padding: 20px;
    min-height:500px;
}

.main-content h3 {
    margin-top: 0px;
}

/****** Table styles ******/
.table .icon {
    float: left;
    margin-right: 10px;
}
.table .two-rows {
    float: left;
}
.table .two-rows .row1 {
    font-size: 13px;
}
.table .two-rows .row2 {
    font-size: 11px;
    color: #666;
}
.table .expander {
    float: left;
    padding: 4px 6px 0 0;
    width: 40px;
    text-align: right;
    display: inline-block;
}
.table .row-tray {
    padding: 6px 0px;
}
.table > tbody > tr.active > td,
.table > tbody > tr > td.active {
    background-color: #FDEEB3;
}
.table td.actions {
    vertical-align: middle;
}
.table i.fa {
    font-size: 24px;
    margin-right: 6px;
}
i.fa.disabled {
    color: #ccc;
    cursor: default;
}
.table > tbody > tr.invalid > td {
    color: red;
}


/* DateTime Picker */
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 45%; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
.ui-timepicker-rtl dl dt{ float: right; clear: right; }
.ui-timepicker-rtl dl dd { margin: 0 45% 10px 10px; }


.code-editor {
    border: 1px solid #666;
}

/****** Tabs ******/
.tabs-head {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}
.tabs-head li {
    display:inline-block;
    border-top: 1px solid #b2b2b2;
    border-left: 1px solid #b2b2b2;
    border-right: 1px solid #b2b2b2;
    padding: 5px 10px;
    margin: 0px 10px 0px 0px;
    /*border-top-left-radius: 4px;
    border-top-right-radius: 4px;*/
    background-color: #f2f2f2;
    border-bottom: 1px solid #b2b2b2;
    margin-bottom: -1px;
}
.tabs-head li.active {
    border-bottom: 1px solid #fff;
    background-color: #fff;
}
.tabs-head li a {
    display:block;
    outline:0;
    text-decoration: none;
    color: #000;
    cursor: pointer;
}
.tabs-body {
    border: 1px solid #b2b2b2;
    padding: 15px;
    background-color: #fff;
    min-height: 400px;
}
.tabs-body > div {
    display:none;
}
.tabs-body > div.active {
    display:block;
}

/*==== Uploads ====*/
.upload-box {
    background: #F8F8F8;
    border: 5px dashed #DDD;
    height: 200px;
    text-align: center;
    padding-top: 80px;
    margin-bottom: 20px;
}

.upload-box.dragover {
    border: 5px dashed blue;
}

.upload-box.dragover-err {
    border: 5px dashed red;
}

.upload-box > div {
    padding-top: 6px;
}

.upload-dialog label {
    font-weight: normal;
    font-size: 1.1em;
    padding-bottom: 10px;
}

.upload-dialog .buttons {
    margin: 20px 0px 0px 0px;
}

.upload-dialog .progress {
    margin-bottom: 10px;
}

.upload-dialog .file-name {
    padding-bottom: 6px;
}

.modal-or-label {
    text-align: center;
    font-weight: bold;
    font-size: 2.0em;
    padding: 10px 0px;
}

/*==== Template Fields ====*/
.field-group-header {
    margin-bottom: 15px;
}
.field-group-header span {
    font-weight: bold;
    font-size: 1.2em;
}
.field-group a {
    margin-left: 20px;
    font-size: .9em;
}

/*==== Custom Pill List ====*/
ul.pill-list {
    list-style-type: none;
    margin: 0px 0px 10px 0px;
    padding: 0px;
}
ul.pill-list li {
    display:inline-block;
    margin: 0px 10px 0px 0px;
    padding: 0px;
}
ul.pill-list a {
    display:inline-block;
    margin: 0px;
    padding: 4px 10px;
    text-decoration: none;
    min-width: 60px;
    text-align: center;
    border: 1px solid #fff;
    outline: 0;
}
ul.pill-list li.active a {
    background-color: #7BAEDA;
    color: #fff;
    /*border: 1px solid #7BAEDA;*/
}
ul.pill-list a:hover {
    border: 1px solid #7BAEDA;
}

/*=== Item List Filters ===*/
.filters select {
    min-width: 100px;
    display: inline-block;
    margin: 0px 10px;
}
.filters a {
    text-decoration: underline;
}

/*=== End of: Item List Filters ===*/

.item-icon-list {
    min-height: 200px;
    max-height: 400px;
    overflow-y: auto;
}
.item-icon-list ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.item-icon-list ul li {
    display:inline-block;
    overflow:hidden;
    border: 1px solid #fff;
    margin: 0px 6px 6px 0px;
    padding: 6px 4px 0px 4px;
    width: 100px;
    text-align: center;
    height: 80px;
}
.item-icon-list ul li:hover {
    border: 1px solid #ccc;
}
.item-icon-list ul li.selected {
    border: 1px solid #999;
    background-color: #eee;
}
.item-icon-list ul li span {
    font-size: 11px;
    margin: 0;
    padding: 0;
    display:block;
}


.table-click tbody tr td {
    cursor: pointer;
}
.table-click tbody tr.disabled td {
    cursor: default;
}

.center {
    text-align: center;
}

div.buttons {
    margin-bottom: 15px;
}

.btn.min-width {
    min-width: 80px;
}

/* CSS class applied to elements being sorted using ko-sortable */
.sort-moving {
    border: 2px dashed grey;
    background-color:#FFFFFF;
}

.sort-moving td {
    border-style: none !important;
}

/*=== Pagination ===*/
#content-page {
    padding-bottom: 20px;
}
.pagination-container{
    text-align: right;
    margin-bottom: 10px;
}
.pagination-container .pagination {
    margin: 0 0 0 15px;
}
.pagination-container label {
    display:inline-block;
    margin-top: 8px;
    font-weight: normal;
}
.pagination-container .paginator {
    margin: 8px 0px 5px 40px;
    font-weight: normal;
}
#content-page .items-container .table {
    margin-bottom: 8px;
}



.form-control.selector {
    display: inline-block;
    margin-right: 10px;
}
.select-container {
    margin-bottom: 10px;
}
.select-container label {
    font-weight: bold;
    margin-right: 10px;
}

/*=== Gallery Content View ===*/
ul.gallery {
    list-style-type: none;
    margin: 20px 0 0 0;
    padding: 0px;
}
ul.gallery li {
    display:inline-block;
    width: 162px;
    height: 140px;
    overflow: hidden;
    margin: 0px 10px 20px 0px;
    text-align: center;
}
ul.gallery li img {
    max-height: 120px;
    max-width: 160px;
    cursor: pointer;
    border: 1px solid #b2b2b2;
}
ul.gallery li > div {
    text-align: center;
    overflow: hidden;
    margin-top: 4px;
    font-size: 11px;
}
ul.gallery li a {
    text-align: center;
    text-decoration: none;
    overflow: hidden;
    margin-top: 4px;
    font-size: 11px;
}
ul.gallery li a:hover {
    text-decoration: underline;
}
ul.gallery li.active {
    border: 2px solid green;
}
ul.gallery div.not-image {
    border: 1px solid #ccc;
    text-align: center;
    height: 100px;
    width: 160px;
    display: table-cell;
    vertical-align: middle;
}
ul.gallery img.gallery-icon {
    padding: 30px 50px;
}
ul.gallery li.disabled a {
    color: #b2b2b2;
}
ul.gallery li i {
    cursor: pointer;
}


/*=== Icon Selector ===*/
.icon-selector-field {
    overflow: hidden;
}
.icon-selector-field > img {
    float:left;
    margin-right: 10px;
}
ul.icon-list {
    list-style-type: none;
    margin: 20px 0 0 0;
    padding: 0px;
}
ul.icon-list li {
    display:inline-block;
    padding: 5px;
    margin: 0px 10px 20px 0px;
    border: 1px solid #fff;
}
ul.icon-list li:hover {
    border: 1px solid #ccc;
}
ul.icon-list li.selected {
    border: 1px solid #999;
    background-color: #eee;
}
ul.icon-list li img {
    height: 32px;
    width: 32px;
    cursor: pointer;
}

/*=== Dialogs ===*/
.medium-dialog .modal-dialog {
    width: 600px;
}
.large-dialog .modal-dialog {
     width: 800px;
 }
.xlarge-dialog .modal-dialog {
    width: 1000px;
}


/*=== Content Fields ===*/
.image-selector-field {
    overflow: hidden;
}
.image-selector-field img {
    border: 1px solid #000;
    float:left;
    margin-right: 10px;
}
.image-selector-field img.hidden {
    display: none;
}
.image-selector-field .btn {
    margin-right: 10px;
    width: 100px;
}

.item-selector-field {
    max-width: 900px;
}

.dropdown-field {
    max-width: 500px;
}

.field-error {
    color: red;
}

.content-field label {
    display:block;
}

.content-field .help-text {
    font-weight: normal;
    font-style: italic;
}

/*=== Paginator ===*/
.paginator span {
    margin: 0px 8px;
}
.paginator i {
    cursor: pointer;
}
.paginator i.arrow-prev {
    margin-right: 4px;
}
.paginator i.arrow-next {
    margin-left: -4px;
}

/*=== Dialogs ====*/
.selector-body .selector-items-row {
    min-height: 400px;
    margin-top: 15px;
}
.selector-body h3 {
    font-size: 20px;
    margin: 0;
}
.selector-body .left-side {
    border-right: 1px solid #ddd;
}
.selector-body .label {
    display:inline-block;
    padding: 4px 6px;
    margin-top: 8px;
}
.selector-body table.item-list {
    border-top: 1px solid #ddd;
}
.selector-body table.item-list .two-rows {
    overflow: hidden;
    max-width: 380px;
}
.selector-body .selected-items table.item-list .two-rows {
    max-width: 320px;
    overflow: hidden;
}
.selector-body table.item-list > tbody > tr > td {
    border-top: none;
    padding: 4px;
    border-bottom: 1px solid #ddd;
}
.selector-body .col-selection-header .hint {
    font-style: italic;
    margin-left: 15px;
}
.selector-body .image-preview {
    margin-bottom: 15px;
}
.selector-body .image-name {
    font-weight: normal;
    overflow:hidden;
    margin-top: 10px;
}
.selector-body .image-url {
    overflow:hidden;
    font-size: .9em;
    color: #666;
}
.selector-body .selection-props {

}
.selector-body .selection-props-form {
    margin-top: 10px;
}
.selector-body .selection-props-form label {
    font-weight: normal;
}
.selector-body .group-dropdown {
    margin-right: 20px;
}
.selector-body label.show-recent {
    font-weight: normal;
}

.table tr.disabled td,
.table tr.disabled .row1,
.table tr.disabled .row2 {
    color: #b2b2b2;
}

.image-preview img {
    max-height: 500px;
}

/*=== Editor Dialogs ===*/
body#EditorDialog {
    height: 100%;
    background-color: #fff;
}
.editor-dialog {
    padding: 15px;
    height: 100%;
}
.editor-dialog ul.gallery {
    margin: 0px;
}
.editor-dialog ul li {
    border: 2px solid #fff;
    margin: 0 10px 0 0;
}
.editor-dialog ul li.selected {
    border: 2px solid red;
}
.editor-dialog table.item-list > tbody > tr > td {
    border-top: none;
}
.editor-dialog .modal-footer {
    border-top: none;
    padding: 0px 20px 20px 20px;
    position: fixed;
    bottom: 0;
    width: 100%;
    left: 0;
    right: 0;
}

.upload-msg {
    float: left;
    margin: 10px 20px 0px 20px;
    font-weight: bold;
    font-size: 12px;
    color: #666;
}

.breadcrumb-container {
    padding-bottom: 10px;
}
ul.breadcrumbs {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: inline-block;
}
ul.breadcrumbs li {
    display: inline-block;
    margin: 0;
    padding: 0;
}
ul.breadcrumbs li a {
    margin: 0 4px 0 6px;
}
ul.breadcrumbs .last-crumb {
    margin: 0 0 0 6px;
}

/*=== Users and Roles ===*/
.role-description {
    /*margin-bottom: 20px;*/
}
.role-description textarea{
    width: 600px;
    height: 60px;
    margin-right: 15px;
    display: inline-block;
}
.role-description button {
    margin-bottom: 20px;
}

/*=== System Stats ===*/
.system-stats table {
    margin: 0px 0px 20px 0px;
}
.system-stats h3 {
    font-size: 1.6em;
    margin-bottom: 20px;
}
.system-stats table td.stat-label {
    font-weight: bold;
    padding-right: 10px;
    text-align: right;
}
.system-stats-json {
    margin: 20px 0px;
}
.system-stats-json textarea {
    width: 100%;
    height: 300px;
    margin-top: 15px;
}


/*=== Log Levels ===*/
.level-trace {
    color: #666;
}
.level-debug {
    color: #000;
}
.level-info {
    color: #0066ff;
}
.level-warn {
    color: #ff9933;
}
.level-error {
    color: #ff0000;
}
.level-fatal {
    color: #ff0000;
}

/*=== Item Statuses ===*/
.status-new {
    background-color: #999;
    border-color: #999;
    color: #fff;
}
.status-saved {
    background-color: #5BC0DE;
    border-color: #5BC0DE;
    color: #fff;
}
.status-published {
    background-color: #5CB85C;
    border-color: #5CB85C;
    color: #fff;
}
.status-modified {
    background-color: #F0AD4E;
    border-color: #F0AD4E;
    color: #fff;
}
.status-deleted {
    background-color: #D9534F;
    border-color: #D9534F;
    color: #fff;
}
.status-none {
    background-color: #999;
    border-color: #999;
    color: #fff;
}

/*=== Tooltips ===*/
.tip-title {
    overflow:hidden;
    border-bottom: 1px solid #efefef;
    font-size: 1.2em;
    padding-bottom: 4px;
    margin-bottom: 5px;
}
.tip-title i {
    float: right;
    cursor: pointer;
}
.tip-buttons {
    border-top: 1px solid #efefef;
    padding-top: 6px;
}
.tip-buttons a {
    color: #fff;
    font-size: 1.8em;
    text-decoration: none;
    margin-right: 8px;
}

/*=== Calendar Events ===*/
.event-tip label {
    width: 50px;
}

/*=== Packages ===*/
.package-results {
    height: 300px;
    overflow-y: scroll;
    margin: 20px 0 0 0;
    padding: 10px;
    border: 1px solid #ccc;
}
/* Status: None */
.package-result-0 {
    color: #000;
}
/* Status: Success */
.package-result-1 {
    color: #3c763d;
}
/* Status: Error */
.package-result-2 {
    color: #a94442;
}

/*=== Toolbars ===*/
.toolbar {
    border-bottom: 1px solid #ccc;
    background-color: #fff;
}
.tooltipster-content .toolbar {
    border-bottom: none !important;
}
.toolbar ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.toolbar ul li {
    display:inline-block;
    /*padding: 5px;*/
    margin: 0;
}
.toolbar ul li a {
    display: inline-block;
    padding: 5px 5px;
    margin: 5px;
    text-decoration: none;
    color: #666;
    text-align: center;
    border: 1px solid transparent;
    min-width: 60px;
}
.toolbar ul li a span {
    display:block;
    text-align:center;
    font-size: 11px;
    color: #1a1a1a;
}
.toolbar ul li a:hover {
    border: 1px solid #ccc;
    border-radius: 0px;
    background-color: #f5f5f5;
}
.toolbar img {
    width: 32px;
    height: 32px;
}

.toolbar.no-border {
    border-bottom: none;
}

/*=== Sortable Multiselect ===*/
.sortable-multiselect {
    overflow: hidden;
    height: 100%;
}
.sortable-multiselect .list-source,
.sortable-multiselect .list-selected {
    float: left;
    width: 42%;
    box-sizing: border-box;
    border: 1px solid #ccc;
    min-height: 200px;
    height: 100%;
    overflow-y: scroll;
}
.sortable-multiselect .list-source > div,
.sortable-multiselect .list-selected > div {
    padding: 4px;
    cursor: pointer;
}
.sortable-multiselect .list-source > div.active,
.sortable-multiselect .list-selected > div.active {
    background-color: #e6e6e6;
}
.sortable-multiselect .list-move-buttons,
.sortable-multiselect .list-sort-buttons{
    float: left;
    width: 8%;
    box-sizing: border-box;
    padding-top: 20px;
}
.sortable-multiselect .list-move-buttons a,
.sortable-multiselect .list-sort-buttons a {
    display:block;
    width: 40px;
    font-size: 24px;
    text-decoration: none;
    color: #000;
    margin: 0px auto 10px auto;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 3px;
}
.sortable-multiselect .list-move-buttons a.disabled,
.sortable-multiselect .list-sort-buttons a.disabled {
    color: #ccc;
}


/*=== End of Sortable Multiselect ===*/

/*=== Misc Stuff ===*/
.wrap-text {
    white-space: pre-wrap;      /* CSS3 */
    white-space: -moz-pre-wrap; /* Firefox */
    white-space: -pre-wrap;     /* Opera <7 */
    white-space: -o-pre-wrap;   /* Opera 7 */
    word-wrap: break-word;
}