.mb-input:-moz-read-only {
    
    background-color: rgba(244,244,244,1);
}

.mb-input:read-only {
    
    background-color: rgba(244,244,244,1);
}

.mb-input {

    width: 100%;
    height: 50px;
    margin-bottom: 1em;
    padding: 0 15px 2px;
    border: 2px solid #ebebeb;
    background: rgba(255, 255, 255, 1);
    font-size: 17px;

    .border-radius(4px);
    .box-shadow(inset 0 -2px #ebebeb);
}

.mb-textarea {

    width: 100%;
    min-height: 150px;
    height: 50px;
    margin-bottom: 1em;
    padding: 0 15px 2px;
    border: 2px solid #ebebeb;
    background: rgba(255, 255, 255, 1);
    font-size: 17px;

    .box-shadow(inset 0 -2px #ebebeb);
}

.mb-select {

    width: 100%;
    margin-top: 1em;
    margin-bottom: 1em;
    background: rgba(255, 255, 255, 1);
    border: 2px solid #ebebeb;
    color: #333333;

    .border-radius(4px);
    .box-shadow(inset 0 -2px #ebebeb);

    option {

        padding: 10px;
        cursor: pointer;
    }
}

:focus { outline:none; }
::-moz-focus-inner { border: 0; }

/* -------------------------- *
 *           GROUP            *
 * -------------------------- */
.st_group {

    margin-bottom: 10px;
    margin-top: 10px;
    padding: 0;

    /* -------------------------- *
     *           @LABEL           *
     * -------------------------- */
    .group-label {

        float: left;
        width:auto;
        min-width: 160px;
        padding-top: 5px;
    }

    .group-control {

        margin-left: 160px;
    }

    input {

        width: 90%;
    }
}

.st-tooltip {

    position: relative; 
    left: 7px;

    z-index: 2;

    display: inline-block; 

    .box-sizing();

    &:hover {

        z-index: 3;

        .content { 

            right: 36px;
            display: block;

            .opacity(1); 
        }
    }

    span {

        position: relative;
        right: 0;

        display: inline-block; 
        width: 17px; 
        height: 17px; 
        padding: 1px 0 0;

        background-color: #00AEEF; 
        border-radius: 10px;

        line-height: 130%; 
        font-size: .9em; 
        font-weight: bold; 
        color: #ffffff; 
        text-align: center;

        cursor: help;

        .box-sizing();

        a {

            color: #ffffff;
            cursor: help;
        }
    }

    .content { 

        position: absolute; 
        top: 0; 
        right: 0; 

        width: 340px;
        min-width: 200px;
        padding: 8px; 

        border-radius: 6px; 
        background-color: #333; 

        color: #FFF; 
        font-size: 0.9em; 

        pointer-events: none; 

        .opacity(0);
        .transition(all .5s cubic-bezier(0.1, 0.1, 0.25, 2));

        &:hover {

            display: block;
            z-index: 4;
            .opacity(1); 
        }

        b { 

            position: absolute; 
            right: -14px; 

            height: 0; 
            width: 0; 

            border-color: #333 transparent transparent #333;
            border-style: solid; 
            border-width: 5px 7px; 
        }

        h3 {

            margin-top: 0;
            color: #ffffff; 
        }

        p {

            padding: 0; 
            color: #ffffff; 
        }
    }
}

.st-tooltip.down {

    .content {

        left:auto; 
        right:0; 
        top:30px; 

        b {

            left:auto; 
            right:6px; 
            top:-10px; 
            border-width:5px; 
            border-color:transparent #333 #333 transparent; 
        }
    }
}