.co-opinions-section {
  margin-top: 2.5rem;
  margin-bottom: 2rem;
}

.co-stars--input {
  display: flex;
  flex-direction: row-reverse;
  width: fit-content;
}

.co-stars--input input[type="radio"] {
  display: none;
}

.co-stars--input label {
  cursor: pointer;
  padding: 0 .15rem; 
  color: #ccc;
  transition: color .15s;
}

.co-stars .fa-star {
  font-size: 18px;
}

.co-stars--input label:hover .fa-star,
.co-stars--input label:hover ~ label .fa-star,
.co-stars--input input:checked ~ label .fa-star {
  color: #f0a500;
}

.co-stars--display,
.co-stars--small {
  display: inline-flex;
}

.co-stars--display .co-star::before,
.co-stars--small  .co-star::before {
  content: "★";
  font-size: 1.1rem;
}

.co-star--full::before  { color: #f0a500; }
.co-star--empty::before { color: #ccc;    }

.co-stars--small .co-star::before { font-size: .9rem; }

.co-char-count {
  float: right;
}

.co-alert {
  padding: .75rem 1rem;
  border-radius: .35rem;
  margin-bottom 1rem;
}
.co-alert.alert-success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.co-alert.alert-danger  { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }

.co-opinion {
  border: 1px solid #e9ecef;
  border-radius: .5rem;
}

.co-opinion--reply .card-body {
  padding: 0px 16px;
}

#coOpinionForm .form-group {
  margin-bottom: 10px;
}

.co-stars--input .your-rating-label {
  color: #000000;
  font-size: 16px;
  margin-left: 10px; 
}

#coOpinionFormContainer {
  margin-bottom: 20px;
}

.co-opinion--reply {
  margin-bottom: 15px;
  margin-right: 15px;
  margin-left: 10px;
  border:0;
  border-left: 3px solid #e3e3e3;
  border-radius: 0;
}

.exp-group {
  margin-bottom: 10px;
  font-size: 16px;
  color: #000000;
  text-align: left;
}

.exp-group label {
  color: #000000;
}
 
.co-opinion__author {
  font-size: 1rem;
}

.co-opinion__date {
  font-size: .8rem;
  padding-left: 15px;
}

.co-opinion__content {
  font-size: 16px;
  line-height: 1.6;
  word-wrap: break-word;
}

#coCancelReply {
  padding: 0 10px;
}

#showOpinionForm, #coSubmitBtn {
  margin-top: 10px;
  font-size: 16px;
  padding: 3px 30px;
}

.co-opinion .far,
.co-opinion .fas {
  font-size: 20px;
}

.co-like-btn:hover {
  background-color: transparent;
  color: #000000;
  .far { display: none; }
  .fas { display: inline; }
}

.co-like-btn {
  border:0;
  font-weight: bold;
  font-size: 16px;
  padding: 0 10px 0 0;
  color: #000000;
}

.co-like-btn .far {
  display: inline;
 
}
.co-like-btn .fas {
  display: none;
}
.co-like-btn:hover .far,
.co-like-btn.co-liked .far {
  display: none;
}
.co-like-btn:hover .fas,
.co-like-btn.co-liked .fas {
  display: inline;
}


.co-reply-count {
  font-size: 16px;
  font-weight: bold;
}

.co-reply-count .far + .fas {
  display: none;
}

.co-reply-count:hover {
  cursor: pointer;
  .far { display: none; }
  .fas { display: inline; }
}

.co-reply-count i {
  padding-right: 1px; 
}


.co-reply-btn {
  margin-left: 10px; 
  text-decoration: none; 
  padding: 3px; 
  font-size: 16px;
  color: #000000;
}
.co-reply-btn:hover { text-decoration: underline; background-color: transparent;  color: #000000;}
 
.co-replies { 
  margin-left: 1rem;
}

.co-btn-spinner { margin-left: .4em; }


.co-empty { color: #adb5bd; }

@media (max-width: 576px) {
  .co-stars--input label { font-size: 1.5rem; } 
}

.co-rating-summary-item-rating {
  font-size: 14px;
}

div.bar {
  height: 10px;
  background: #e3e3e3;
  border-radius: 5px;
  overflow: hidden;
  display:inline-block;
  width: 180px;
  margin-left:10px;
}

.co-rating-summary-item-rating-text {
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 10px;
}

#coOpinionFormContainer ::file-selector-button {
  display: inline-block;
  text-align: center;
  font-size: 16px;
  padding: 3px 8px;
  border: 0;
  cursor: pointer;
  border-radius: 10px;
  background-color: #173b40;
  color: #ffffff;
}

#coOpinionFormContainer ::file-selector-button:hover {
  display: inline-block;
  text-align: center;
  font-size: 16px;
  padding: 3px 8px;
  border: 0;
  cursor: pointer;
  border-radius: 10px;
  background-color: #000000;
  color: #ffffff;
}


.co-rating-summary-item-rating-value .co-avg-value {
  font-size: 20px;
}

.co-rating-summary-item-count {
  display: inline-block;
  text-align: left;
  padding-left: 5px;
}

.co-rating-summary-item {
  margin-bottom: 5px;
}

div.bar-fill {
  height: 100%;
  background: #173b40;
  border-radius: 5px;
  transition: width 0.3s ease-in-out;
}

@media(max-width: 992px)
{
  .co-rating-summary-text {
    width: 100% !important;
  }
  .co-rating-summary-bar {
    width: 100% !important;
    margin-bottom: 25px;
  }
}