.UserCompras{
    padding: 0px;
}

.UserCompras .img-thumbnail {
    width: 100%;
}

.pagPerfil{
    min-height: 51.7vh;
}

/*Pestañas Perfil*/
#tile-1 .nav-tabs {
    position: relative;
    border: none;
    background-color: #fff;
    border-radius: 6px;
}

#tile-1 .nav-tabs li {
    margin: 0px;
}

#tile-1 .nav-tabs li a {
    position: relative;
    margin-right: 0;
    padding: 20px 0;
    font-size: 16px;
    border: none;
}

#tile-1 .nav-tabs a:hover,
#tile-1 .nav-tabs a:focus {
    background-color: transparent;
    border: none;
}

#tile-1 .slider{
    display: inline-block;
    width: 30px;
    height: 4px;
    border-radius: 3px;
    background-color: #ce484b;
    position: absolute;
    z-index: 1;
    bottom: 0;
    transition: all .4s linear;
}

#tile-1 .nav-tabs li i {
    margin-right: 10px;
}

/*Compras Usuario*/
.itemCompra{
    border:none;
    box-shadow: 0px 0px 10px 1px rgb(0 0 0 / 4%);
}

.comprasUser{
    padding: 15px 0;
}

.progress-bar {
    background-color: #f7f7f7;
    border-radius: 4px;
    position: relative;
    margin: 0;
    height: 32px;
    width: 100%;
}

.progress i{
  margin-right: 5px;
}

.progress {
    background: linear-gradient(to left, #d65e61, #FF9472);
    box-shadow: 0 3px 3px -5px #d65e61, 0 2px 5px #d65e61;
    border-radius: 4px;
    color:#fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    width: 0;
    transition: 1s ease 0.3s;
    z-index: 2;
}

.tituloCompraPro{
    margin-top: 0;
}

.btnComentar a input[type="button"]{
    margin-top: 0;
}

.textComentario{
    margin: 10px 0;
}

.comentarioPerfil {
    text-align: right;
}

.starsComentario {
    margin-top: 0;
}

/*Peril Usuario*/
#imgPerfil img {
    width: 100%;
}

.imgPerfil input[type="button"]{
    margin-top: 0;
}

#perfil #subirImagen{
  display: none;
  margin-top: 20px;
  overflow: hidden;
  cursor: pointer;
}

#perfil #subirImagen img{
  width:100%;
  padding-top:20px;
}

#datosImagen{
    border: 1px solid #ccc;
}

.iconsPerifl,
.formPerfil,
.formPerfil[readonly],
.formPerfil:focus {
    border: none;
    background-color: #fff;
    box-shadow: none;
    border-radius: 0;
    border-bottom: 2px solid #ce484b;
}

#perfil #eliminarUsuario{
    margin-bottom: 20px;
}

/*Modal Comentario*/
.cont{
    padding: 0 30px;
    text-align: center;
    background: #333;
    color: #EEE;
    border-radius:0 0 5px 5px;
    overflow: hidden;
}

div.stars{
    display: inline-block;
}

input.star{
    display: none;
}

.starsCal{
  display: block;
    margin-left: auto;
    margin-right: auto;
}

label.star {
    float: right;
    padding: 5px;
    font-size: 36px;
    color: #444;
    transition: all .2s;
}

input.star:checked ~ label.star:before {
    content:'\f005';
    color: #FD4;
    transition: all .25s;
}

input.star-5:checked ~ label.star:before {
    color:#FE7;
    text-shadow: 0 0 20px #952;
}

input.star-1:checked ~ label.star:before {
    color: #F62;
}

label.star:hover{
    transform: rotate(-15deg) scale(1.3);
}

label.star:before{
    content:'\f006';
    font-family: FontAwesome;
}

input.star:checked ~ .rev-box{
    height: 125px;
    overflow: visible;
}

/*Medias*/
@media (max-width:767px){
    #imgPerfil img{
        margin-top: 10px;
    }

    #tile-1 .nav-tabs li a {
        padding: 10px 0px;
    }

    .btnActualizar{
        margin-right: 10px;
    }

    .btnComentar{
        float: left!important;
    }

    .textComentario{
        float: left!important;
        margin-bottom: 0px;
    }

    .starsComentario {
        text-align: left;
        margin: 0;
    }

    .comentarioPerfil{
        margin: 10px 0;
        text-align: left;
    }

    .btnComentar a input[type="button"]{
        margin-top: 20px;
    }
}

@media (max-width:394px){
    label.star {
        padding: 3px;
        font-size: 25px;
    }
}

@media (max-width:390px){
    .btnElimnar{
        float: left!important;
    }
}


