.user-image-section {
    float: left;
    margin-right: 10px;
    margin-bottom: 20px;
}

/* User details buttons */
.button-responsive-container {
    margin: 4px 0;
    width: 200px;
}
.btn-block-responsive {
    width: 100%;
}


/* Handle in responsive way - divide image from details */
@media (max-width: 768px) {
    .user-image-section {
        width: 100%;
    }
    .user-details-container {
        width: 100%;
    }
    .responsive-clearer {
        clear: both;
    }
    .user-image-container {
        margin: 0 auto;
    }
    .button-responsive-container {
        display: block;
        width: 100%;
    }
}
/* Align image vertically and horizontally */
.user-image-container {
    border: 1px solid black;
    width: 203px; 
    height: 303px;
    text-align:center;
    font: 0/0 a;
}
/* Pseudo full-height element */
.user-image-container:before {
    content: ' ';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}

/* Fit the container */
#user-image {
    max-width: 200px;
    max-height: 300px;
    display: inline-block;
    vertical-align: middle;
}

.user-details-container {
    overflow: hidden;
}

.user-book-panel .panel-body {
    font-size: 16px;
}

.user-book-panel .subtitle {
    float: left;
    width: 100px;
}

.user-panel-info-row {
    clear: both;
    position: relative;
    width: 100%;
    margin-bottom: 2px;
}

/* Feedback statistics */
.feedback-mini-circle-container {
    font-size: 18px;
    width: 36px;
    height: 36px;
    border-radius: 18px;
    border: 2px solid black;
    margin: 0 auto;
}

.feedback-mini-circle-container-positive {
    background-color: rgb(35, 255, 8);
}

.feedback-mini-circle-container-negative {
    background-color: red;
}

.feedback-mini-circle-container .glyphicon {
    margin: 0 auto;
    display: block;
    width: 18px;
    line-height: 36px;
}

.feedback-mini-row-container-inline {
    line-height: 36px;
}

.feedback-stat-label {
    float: left;
}
@media (max-width: 578px) {
    .feedback-stat-label {
        display: none;
    }
}

.feedback-stat-count {
    float: left;
}

.feedback-stat-percentage {
    float: left;
    width: 80px;
    text-align: right;
}