/**
 * Labels and notifications
 */
.notification {
    font-size: 11px;
    font-weight: bold;
    text-align: center;
    line-height: 14px;
    color: #ffffff;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #999999;
    padding:5px 8px 4px 8px;
    border-radius: 25px;
}

.notification.red {
    background-color: #ff2b25;
}

.notification.orange {
    background-color: #F16863;
}

.notification.green {
    background-color: #91bd09;
}

.notification.blue {
    background-color: #2daebf;
}

.notification.pink {
    background-color: #fe57a1;
}

.notification.magenta {
    background-color: #a9014b;
}

.notification.yellow {
    background-color: #ffb515;
}

.notification.flat {
    border-bottom:none;
    box-shadow: none;
}

/**
 * Box shadows 
 */
.box_shadow {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

/**
 * Highlight
 */
.highlight {
    background: #FFF7A8;
    color: #444444;
}

/**
 * Cancel list styles
 */
.nolist {
    list-style: none;
    margin: 0;
    padding:0;
}

/**
 * Cancel margins 
 */
.ntm {
    margin-top: 0;
}

.nbm {
    margin-bottom: 0;
}

.nlm {
    margin-left: 0;
}

.nrm {
    margin-right: 0;
}

/**
 * Cancel borders
 */
.nb {
    border: none;
}

.ntb {
    border: none;
}

.nbb {
    border: none;
}

.nlb {
    border: none;
}

.nrb {
    border: none;
}

/**
 * Colors 
 */
.muted {
    color: #888888;
}

/**
 * Positioning 
 */
.alignleft {
    float: left;
}

.alignright {
    float: right;
}

.aligncenter {
    float: none !important;
    margin: 0 auto;
    text-align: center;
}

.textleft {
    text-align: left;
}

.textright {
    text-align: right;
}

.textcenter {
    text-align: center;
}

.inline {
    display: inline;
}

/**
 * Hide from screenreaders and browsers. 
 */
.hidden {
    display: none !important;
    visibility: hidden;
}

/**
 * Hide only visually, but have it available 
 * for screenreaders. 
 */
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding:0;
    position: absolute;
    width: 1px;
}

/**
 * Extends the .visuallyhidden class to allow 
 * the element to be focusable when navigated 
 * to via the keyboard. 
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/**
 * Hide visually and from screenreaders, but 
 * maintain layout 
 */
.invisible {
    visibility: hidden;
}

/**
 * Floats
 */
.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    zoom: 1;
}

/**
 * Misc
 */
.help-text {
    font-size: 12px;
}

.overflowhidden {
    overflow: hidden;
}