/* Feedback component */
    .wrap { box-sizing: border-box; }

    /* Feedback list */    
    #lbl-type {
        display: block;
        margin-bottom: 10px;
    }
    #lbl-type label {        
        margin-left: 10px;
    }
    
    #search-filter { width: 33%; }
    
    #negative-reasons-filter { 
        border: 1px solid #d5d5d5;
        padding: 8px ;
        margin: 10px 0;        
    }
    
    .col-title { width: 50%; }
    
    @media screen and (max-width: 1700px) {
        .col-title { width: 40%; }
    }
    @media screen and (max-width: 1600px) {
        .col-title { width: 30%; }
    }
    @media screen and (max-width: 1300px) {
        .col-title { width: 20%; }
    }
    
    
    .label-sortable { float: left; margin-right: 8px; }
    
    #header-comments {
        border-bottom: 0px;        
    }
    
    #feedback-listing-table th .checkbox_wrapper { 
        height: 16px;
        width: 17px;
        float: left;        
        margin-right: 10px;
    }
    
    #feedback-listing-table th input[type="checkbox"] {        
        opacity:0;
        height: 16px;
        width: 17px;
        position: absolute;
        /*top: 0;
        left: 0;*/
        z-index: 2;
    }

    #feedback-listing-table th input[type="checkbox"] + label{
        background-image: url(../img/ic_up.png);
        background-position: center;
        background-repeat: no-repeat;
        height: 16px;
        width: 17px;
        display:inline-block;        
        position: absolute;        
        z-index: 1;
    }

    #feedback-listing-table th input[type="checkbox"]:checked + label{
        background-image: url(../img/ic_down.png);
        background-position: center;
        background-repeat: no-repeat;        
        width: 17px;
        display:inline-block;        
    }
    
    th.delete-feedback-comment-header input[type="checkbox"] {
        padding: 0; margin: 0!important;
    }
    
    .delete-individual-feedback-comment { 
        color: #0074a2;
        border: 0px;
        background: none;
        cursor: pointer;
        visibility: hidden;
        padding: 0 0 4px 0;
    }
    
    #ranking-acceptance-ratio-best-table tr:hover .delete-individual-feedback-comment { visibility: visible; }
    
    /* End feedback list */

    .ic_feedback { 
        background: url("../img/ic_title_feedback.png") no-repeat scroll 0 2px;
        display: inline-block;
        height: 22px;
        width: 38px;
        margin-bottom: -2px;
    }
    
    #feedback-component{
        margin-bottom: 20px;        
    }
    
    #feedback-component div.feedback {
        margin-top: 0px;
    }
    
    .negative-reason-title {
        font-size: 14px;
        font-weight: bold;
        padding: 11px 5px 7px 7px;
    }
    
    #negative-reasons-form ul {
        padding-left: 10px;
    }
    #negative-reasons-form li {
        list-style: none;
        padding: 5px 0px
    }
    #negative-reasons-form li label { display: inline!important; width: auto; } 
    #negative-reasons-form li label input { outline: none; }
    #negative-reasons-form li label p{        
        margin-top: 1px;
    }  
    #feedback-submit {
        border: 0 none !important;
        float: right;
        margin-bottom: 10px;
        margin-right: 6px;
        margin-top: 10px;
    }    
    #feedback-comment {
        border-bottom: 1px solid #EEE;
        height: 90px;
        line-height: 15px;
    }
    
    #comments-details h3 { 
        border-bottom: 0px; 
        height: 21px;
    }
    
    #comments-details h3 span { 
        float: left;
        margin-right: 10px;
    }
    
    #comments-details h3 a { 
        cursor: default;
    }
    
    #comments-details h3 span.comment-count { float: none; }
    
    #comments-details h3 .post-com-count-wrapper { 
        float: left;
        margin-top: -3px;
    }
        
    #comments-list {
        max-height: 250px;
        overflow-y: auto;        
        border-bottom: 1px solid #DDD;
    }  
    
    #comments-list table { border-top:0px; }

    /* Loading */
    .animation-loading {
        /*background: url(../img/ajax-loader.gif) no-repeat center #FFFFFF!important;*/
        background-color: #ffffff;
        box-sizing: border-box;
        height: 100%;
        margin-right: 20px;
        margin-top: 10px;        
        padding: 100px;
    }
    .new-animation {        
        border-color: rgba(0, 0, 0, 0.4) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
        border-radius: 100%;
        border-style: solid;
        border-width: 8px;
        height: 50px;
        left: 50%;
        margin: auto;
        padding: 16px;
        width: 50px;
        -webkit-animation: rot .6s infinite linear;
                animation: rot .6s infinite linear;
    }    

    .feedback-listing-table tr:nth-child(even) {
        
    }
    
    .feedback-listing-table tr:nth-child(odd) {
        background-color: #f9f9f9;
    }
    
    .feedback-listing-table a.post-com-count {    
        cursor: default;
    }


    /* Pagination */
    
    a.active { background: #2ea2cc!important; color: #fff; }
    
    a.no-link { background: none!important; cursor:default; }
    a.no-link:hover { color:#2ea2cc!important;  }
    
    .pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
    }
    
    .pagination > li {
      display: inline;
    }
    
    .pagination > li > a,
    .pagination > li > span {
      position: relative;
      float: left;
      padding: 6px 12px;
      margin-left: -1px;
      line-height: 1.42857143;
      color: #428bca;
      text-decoration: none;
      background-color: #fff;
      border: 1px solid #ddd;
    }
    
    .pagination > li:first-child > a,
    .pagination > li:first-child > span {
      margin-left: 0;
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
    }
    
    .pagination > li:last-child > a,
    .pagination > li:last-child > span {
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px;
    }
    
    .pagination > li > a:hover,
    .pagination > li > span:hover,
    .pagination > li > a:focus,
    .pagination > li > span:focus {
      color: #2a6496;
      background-color: #eee;
      border-color: #ddd;
    }
    
    .pagination > .active > a,
    .pagination > .active > span,
    .pagination > .active > a:hover,
    .pagination > .active > span:hover,
    .pagination > .active > a:focus,
    .pagination > .active > span:focus {
      z-index: 2;
      color: #fff;
      cursor: default;
      background-color: #428bca;
      border-color: #428bca;
    }
        
    /* Feedbacks ranking */
    #fieldset-min-vote {
        border: 1px solid #bbb;
        box-sizing: border-box;
        padding: 10px 0 5px 20px;
        width: 100%;
        margin-bottom: 5px;
    }
    #fieldset-min-vote legend { font-size: 15px; padding: 4px; }
    
    
    .box-ranking {
        float:left; 
        width: 50%;
        box-sizing: border-box;
        padding-right: 20px;
    }
    
    .box-ranking h3 {
        background-color: #fff;
        border: 1px solid #ddd;
        margin: 10px 0 0;
        padding: 9px 12px;
    }
    
    .box-scroll {
        border-bottom: 1px solid #ddd;
        height: 335px;
        overflow-y: auto;
    }
    
    .ic-yes { background: url("../img/ic_thumb_up.png") no-repeat scroll 10px center; padding: 9px 12px 9px 35px!important; }
    .ic-no { background: url(../img/ic_thumb_down.png ) no-repeat scroll 10px center; padding: 9px 12px 9px 35px!important; }
    
    .num-chart {
        width: 20%; 
        text-align: right; 
        padding: 2px 10px; 
        float: left;        
    }
    
    @media screen and (max-width: 1400px) {
        .num-chart { 
            white-space: nowrap; 
            text-align: left;
        }
    }
    
    .graph-chart {
        width: 70%; 
        border: 1px solid #ddd; 
        padding: 2px; 
        float: left;
    }
    
    td.ranking-color-bad {
        color:red;        
    }
    
    #feedback-count-chart-area .graph-chart,
    #ranking-absolute-votes .graph-chart { border: 0px; }
    
    div.color-yes-no {
        background: rgba(109,160,222,1);
        background: -moz-linear-gradient(left, rgba(109,160,222,1) 0%, rgba(56,108,240,1) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(109,160,222,1)), color-stop(100%, rgba(56,108,240,1)));
        background: -webkit-linear-gradient(left, rgba(109,160,222,1) 0%, rgba(56,108,240,1) 100%);
        background: -o-linear-gradient(left, rgba(109,160,222,1) 0%, rgba(56,108,240,1) 100%);
        background: -ms-linear-gradient(left, rgba(109,160,222,1) 0%, rgba(56,108,240,1) 100%);
        background: linear-gradient(to right, rgba(109,160,222,1) 0%, rgba(56,108,240,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6da0de', endColorstr='#386cf0', GradientType=1 );
    }
    
    div.ranking-color-bad {
        background: rgba(240,112,53,1);
        background: -moz-linear-gradient(left, rgba(240,112,53,1) 0%, rgba(255,8,8,1) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(240,112,53,1)), color-stop(100%, rgba(255,8,8,1)));
        background: -webkit-linear-gradient(left, rgba(240,112,53,1) 0%, rgba(255,8,8,1) 100%);
        background: -o-linear-gradient(left, rgba(240,112,53,1) 0%, rgba(255,8,8,1) 100%);
        background: -ms-linear-gradient(left, rgba(240,112,53,1) 0%, rgba(255,8,8,1) 100%);
        background: linear-gradient(to right, rgba(240,112,53,1) 0%, rgba(255,8,8,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f07035', endColorstr='#ff0808', GradientType=1 );
    }
    
    td.ranking-color-good {
        color:green;
    }
    
    div.ranking-color-good {
        background: rgba(156,204,84,1);
        background: -moz-linear-gradient(left, rgba(156,204,84,1) 0%, rgba(29,178,16,1) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(156,204,84,1)), color-stop(100%, rgba(29,178,16,1)));
        background: -webkit-linear-gradient(left, rgba(156,204,84,1) 0%, rgba(29,178,16,1) 100%);
        background: -o-linear-gradient(left, rgba(156,204,84,1) 0%, rgba(29,178,16,1) 100%);
        background: -ms-linear-gradient(left, rgba(156,204,84,1) 0%, rgba(29,178,16,1) 100%);
        background: linear-gradient(to right, rgba(156,204,84,1) 0%, rgba(29,178,16,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9ccc54', endColorstr='#1db210', GradientType=1 );
    }
    
    td.ranking-color-average {
        color: #F8CA3B;
    }
    
    div.ranking-color-average {
        background-color: #F8CA3B;
    }
    
    .list-group {
	padding-left: 0;
	margin-bottom: 20px;
	border-radius: 4px;
	border: 3px solid #ddd!important;
	max-height: 500px;
        /*max-width: 1000px;*/
	overflow-x: auto;
    }

    .ui-dialog-content p { padding: 0px; margin: 0px; }
    .ui-dialog-content p span { display: none; }
    
    
    /* Feedbacks settings */
    
    .fieldset-settings { 
        display: block;
        margin-left: 2px;
        margin-right: 2px;
        padding-top: 0.35em;
        padding-bottom: 0.625em;
        padding-left: 0.75em;
        padding-right: 0.75em;
        border: 1px solid;
    }

    /* Feedback lisiting */

    .feedback_listing_item {
        font-weight: bold;
        color: black;
        text-decoration: none;
    }

    .access_button {
        

    }
    
    .remove_button {
        background: url(../img/ic_remove.png) no-repeat scroll 0 2px;
        height: 22px;
        width: 22px;
        margin-bottom: -2px;
    }

    .test_hidden {
        display: none;
    }
    
    .tooltip-help {
        background: url(../img/ic_help_circle_grey.png) no-repeat scroll 0 2px;
        display: block;
        width: 22px;
        height: 28px;
        float: right;
        margin: -4px 2px 0;
    }
    
    /* Details */    
    .box-feedback {
        box-sizing: border-box;
        padding-right: 20px;
        clear: both;
    }    
    .box-feedback h3 {
        background-color: #fff;
        border: 1px solid #ddd;
        margin: 10px 0 0;
        padding: 9px 12px;
    }
    
    .box-feedback-content {
        background: #FFF;
        padding: 20px;
        border-right:1px solid #DDD;
        border-left:1px solid #DDD;
        border-bottom:1px solid #DDD;
    }
        .content-fields         { margin-bottom: 5px; }
        .content-fields label   { display: block; margin-bottom: 5px; }
    
        .box-feedback-content label.actions {
            display: inline-table;
            margin: 10px 0;
        }
        
    .box-feedback-footer {
        background: #F8F8F8;
        padding: 12px 15px;
        border-right:1px solid #DDD;
        border-left:1px solid #DDD;
        border-bottom:1px solid #DDD;
    }
    
    .box-feedback-content.ranking-position span {
        font-size: 80px; 
        font-weight: bold; 
        padding: 25px 30px 30px 15px ; 
        display: block;
    }
    
    #detail-yes .ic-yes,
    #detail-no .ic-no {
        text-align: left;
        font-size: 16px;
        padding-left: 45px!important;
        width: 150px;
    }
    
    #detail-yes .graph-chart,
    #detail-no .graph-chart {
        margin-top: 10px;
        width: 75%!important;
    }
    
    .delete-feedback-comment, .delete-feedback-comment-header{
        width: 20px;
    }
    
    /* feedback settings */
    #words-black-list-form, #range-colors { width: 500px; }
    
    
    #slider-range { margin-bottom: 5px; }
    #slider-range .ui-widget-header { background: #FFC926!important; }
    #slider-range .ui-slider-handle { border-radius: 20px; }
    .field-feedback { 
        clear: both;
        height: 20px;
        min-width: 300px;
        padding: 8px 0;
    }
    .field-feedback label { 
        display: block;
        float: left;
        padding: 8px 0;
    }
    .field-feedback input { 
        background: transparent none repeat scroll 0 0;
        float: right;
        margin-right: 20px;
        padding: 5px 0;
        text-align: center;
    }
    
    /*  ranking acceptance ratio pie chart */
    .pie {
        position: relative;
	width: 166px;
        height: 166px;
	margin: 3rem auto;
	border-radius: 100%
    }

    .pie:after {
        content: attr(data-percentage) '%';
        width: 110px;
        height: 110px;
        border-radius: 100%;
        background: #ecf0f1;
        position: absolute;
        top: 50%;
        left: 50%;
        font-size: 25px;
        text-align: center;
        text-indent: 0;                
        margin: -55px 0 0 -55px;
        line-height: 107px;
    }
    
    .pie-slice {
        border-radius: 50%;
        clip: rect(0px, 166px, 166px, 83px);
        height: 100%;
        position: absolute;
        width: 100%;
    }
    
    #pie-slice-right {
        transform: rotate(0deg);
    }
    
    #pie-slice-left {
        transform: rotate(180deg);
    }
    
    #pie-slice-right-background {
        border-radius: 50%;
        clip: rect(0px, 83px, 166px, 0px);
        height: 100%;
        position: absolute;
        width: 100%;
        font-family: monospace;
        font-size: 1.5rem;
    }
    
    #pie-slice-left-background {
        border-radius: 50%;
        clip: rect(0px, 83px, 166px, 0px);
        height: 100%;
        position: absolute;
        width: 100%;
        font-family: monospace;
        font-size: 1.5rem;
    }
    
    
    .field-feedback span {
        display: block;
        float: right;
        height: 37px;
        width: 82px;
    }
    
    .bad-threshold span { background: url(../img/ic_bad_acceptance.png) no-repeat center; }
    .good-threshold span { background: url(../img/ic_good_acceptance.png) no-repeat center;  }
    #save-settings { margin-top: 10px; }
    
    #words-black-list-area .box-scroll  { border-top: 1px solid #ddd; margin: 0px 0 8px; max-height: 150px; }
    #add-new-word { width: 370px; }
    .box-scroll li { 
        display: block; 
        padding: 10px;
    }
    .box-scroll li:hover { 
        background: #DDD;         
    }
    
    .box-scroll button {
        float: right;
        background: url(../img/ic_del.png) no-repeat center;
        border: none;
        border-radius: 4px;
        cursor: pointer;
    }
    .box-scroll button:hover { background-color: #FFF!important; }
    
    /* padding */
    #feedback-component #seg-recaptcha, #seg-recaptcha-blacklist {        
        margin-top: 0!important;        
    }
    #feedback-component #seg-recaptcha, #seg-recaptcha-blacklist iframe {
        margin-top: 7px!important;        
    }
    
    /* icon close of dialog */
    .ui-dialog-titlebar-close::before {
        content: ""!important;        
    }
    
    #dialog-confirm p {
        font-size: 12px;
    }    
    
    /* loading */
    .loading {
        position: absolute;
        left: 50%;
        top: 50%;
        margin: -25px 0 -25px 0;
        border-bottom: 6px solid rgba(0, 0, 0, .1);
        border-left: 6px solid rgba(0, 0, 0, .1);
        border-right: 6px solid rgba(0, 0, 0, .1);
        border-top: 6px solid rgba(0, 0, 0, .4);
        border-radius: 100%;
        height: 50px;
        width: 50px;
        -webkit-animation: rot .6s infinite linear;
                animation: rot .6s infinite linear;
    }
    @-webkit-keyframes rot {
        from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
        to {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
    }
    @keyframes rot {
        from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
        to {-webkit-transform: rotate(359deg);transform: rotate(359deg);}
    }
    
    /* front end */
    #feedback-error-msg p {
        background: #ffffbf url("../img/ic_alert.png") no-repeat scroll 5px 3px;
        font-size: 13px;
        font-weight: normal;
        margin-top: 10px;
        padding: 10px 10px 10px 40px;
    }
    
    
    /* loading front-end */
    
    .feedback-loader-dinamic {
        background: #f3f3f3 url("../img/comment-loader.gif") no-repeat scroll center center;        
        height: 70px;
        position: absolute;
        width: 73%;
        z-index: 10;
    }
    
    .loading-dots {
        background: url("../img/comment-loader.gif");
        height: 11px;
        width: 16px;
        display: inline-block;
        margin-left: 15px;
        margin-bottom: -7px;
    }
    
    /* front-end retry button */
    .btn.btn-primary.btn-feedback-retry {
        visibility: collapse;
    }