/*
escondemos los botones de radio
*/
input[type="radio"] {
  display: none;
}

/*
damos un color gris a las estrellas, y un tamaño de 28px
*/
label {
  color:#fff;
  margin: 0 8px;
}
label i{
  font-size: 28px!important;
}

/*
La propiedad direction: rtl; cambia la dirección de escritura  de derecha a izquierda ( right to left ). La otra propiedad unicode-bidi ( bidi de bidireccional ) se utiliza junto con la propiedad direction para cambiar  la dirección del texto.
*/
.clasificacion {
  direction: rtl;
  unicode-bidi: bidi-override;
  display: flex;
  align-items: center;
  justify-content: center;
}

/*
También cambian de color todas las etiquetas <label> precedidas ( ~ ) por aquella <label> que tiene el ratón encima ( hover )
*/
label:hover,
label:hover ~ label {
  color: #e5b200;
}

/*
Al marcar el botón de radio ( radio:checked ) todas las etiquetas <label> que le preceden ( ~ ) se vuelven color naranja
*/
input[type="radio"]:checked ~ label {
  color: #e5b200;
}

/*
Damos a las estrellas color naranja al momento de mostrarse
*/
.starColor i{color: orange!important;}
/*------------------------------------
# .0 Testimonial maven
------------------------------------*/
.t-gold{color: #e5b200;}
.pad_testi {padding: 10px 0px 10px;}
.pad_tes{padding: 0 0 75px 0;}
.pad_te{padding: 72px 0 14px 0;}
.pad_t{padding: 0 0 14px 0;}
.smallbnt{width: 36%;}.pagination>li {display: contents!important; }
.well2 {min-height: 20px; padding: 19px; margin-bottom: 20px; background:#00293f; border-radius: 9px; }
.pagination>li>a, .pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #000000;
    border: 1px solid #000000;
}
.pagination>li>a:focus, .pagination>li>span:focus, .pagination>li>span:hover {
    z-index: 2;
    color: #23527c;
    background-color: #5d5d5d;
    border-color: #5d5d5d;
}
.pagination>li>a:hover{background-color: rgb(0, 42, 82);border-color: rgb(0, 42, 82);}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color:#000;
    border-color:#000;
}
.well {
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}
.btn-primary , .btn-primary:hover, .btn-primary:active{
    color: #fff;
    background-color: #00ba24!important;
    border-color: #00ba24!important;
    box-shadow: none!important;
}
/*hover bottom*/
.boton {
  color: #fff !important;
  font-size: 20px;
  font-weight: 500;
  padding: 0.5em 1.2em;
  background: #000;
  border: 2px solid;
  border-color: #000;
  position: relative;
}
.boton2 {
  color: #fff !important;
  font-size: 18px;
  font-weight: 500;
  padding: 0.5em 1.2em;
  background: #a30000;
  position: relative;
  border:1px solid transparent;
  cursor: pointer;
  transition: .3s ease;
  border-radius: 10px;
}
.boton2:hover{
  background-color: #000;
  color: #fff !important;
  border: 1px solid #fff;
}
.boton:before, .boton2:before {
  content:"";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 0px;
  height: 100%;
  background: rgb(155 134 73 / 25%);
  transition: all 1s ease;
}
.boton:hover:before, .boton2:hover:before {
width: 100%;
}