body {
    background-color: #2e73fc;
}

hr {
    background-color: #ffffff;
    width: 30%;
    height: .4rem;
    border-radius: .2rem;
    margin: 3rem auto 1rem auto;
}

.wrapper-container {
    background-color: #2e73fc;
    background-image: url("../img/layout/bg-second.png");
}

.ranking-container {
    max-width: 90rem;
    margin: 0 auto;
}

.border-ranking {
    border-radius: 1.2rem;
    border: .1rem solid #fff;
    box-shadow: 0 0 1rem #ffffff,
        inset 0 0 1rem #ffffff;
    margin: 0 0 3rem;
}

.box-ranking {
    padding: 12rem 3rem 2rem;
    text-align: center;
    position: relative;
    background: url("../img/icon/big-cup-white.png") no-repeat top center;
    transition: .5s;
}

.box-ranking img {
    display: none;
}

.box-ranking.selected img {
    display: inline;
    position: absolute;
    bottom: -17px;
    left: calc(50% - 20px);
}

.box-ranking:hover, .box-ranking.selected {
    background: url("../img/icon/big-cup-blue.png") no-repeat top center;
    background-color: #ffffff;
    transition: .5s;
}

.box-ranking:nth-child(1):hover, .box-ranking.selected:nth-child(1) {
    border-top-left-radius: 1.2rem;
    border-bottom-left-radius: 1.2rem;
}

.box-ranking:nth-child(3):hover, .box-ranking.selected:nth-child(3),
.winners .box-ranking:nth-child(4):hover,.winners .box-ranking.selected:nth-child(4) {
    border-top-right-radius: 1.2rem;
    border-bottom-right-radius: 1.2rem;
}

.box-ranking:nth-child(2):hover, .box-ranking.selected:nth-child(2),
.winners .box-ranking:nth-child(3):hover,.winners .box-ranking.selected:nth-child(3) {
    border-radius: 0;
}

.box-ranking:hover h3, .box-ranking:hover h4, .box-ranking.selected h3, .box-ranking.selected h4 {
    color: #2e73fc;
    transition: .5s;
}

.podium {
    margin: 0;
}

.podium.out .box-user {
    background-color: rgba(255, 255, 255, 0.75);
}

.box-user {
    background-color: #ffffff;
    border-radius: 3.5rem;
    padding: 1rem 3rem;
    margin-top: 2rem;
    display: flex;
    align-items: center;
}

.box-user .img-user {
    flex: 0 0 5rem;
    height: 5rem;
    border-radius: 50%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.votes {
    display: flex;
    align-items: center;
    margin-left: auto;
}
/* table winners  */

th, td {
    font-family: 'Martel', serif;
    font-weight: 700;
    font-size: 1.5rem;
    color: #666666;
}

th:not(:last-child), td:not(:last-child) {
    border-right: 1px solid #ffffff;
}

.table td {
    background-color: #f3f3f3;
}
.box-win img {
    max-width: 15rem;
    width: 100%;
}
.box-win a, .box-win a:hover {
    color: #00acdd;
    text-decoration: underline;
}

.table thead th {
    color: #ffffff;
    background-color: #00acdd;
    border-top: none;
    width: 1%;
    padding: 1rem;
}

tr:last-child td:first-child {
    border-bottom-left-radius: 1rem;
}

tr:last-child td:last-child {
    border-bottom-right-radius: 1rem;
}

th:first-child {
    border-top-left-radius: 1rem;
}

th:last-child {
    border-top-right-radius: 1rem;
}

.info-asterisk {
    font-size: 1.2rem;
}

.ranking-page-title{
    font-weight: bold;
    margin-bottom: 2rem;
}

.ranking-item{
    display: flex;
    align-items: center;
    margin-bottom: 2rem;
    cursor: pointer;
}

.ranking-info{
    margin-left: 2rem;
}

.ranking-image{
    height: 100%;
    position: relative;
}

.ranking-position{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: 100%;
    background-color: #f1b527;
    color: #fff;
    font-family: Londrina Solid,cursive;
    font-size: 2.4rem;    
}

/* resposive */
@media (max-width: 768px) {
    .box-ranking.selected img {
        display: none;
    }

    .box-ranking:nth-child(1):hover, .box-ranking.selected:nth-child(1) {
        border-top-left-radius: 1.2rem;
        border-top-right-radius: 1.2rem;
        border-bottom-left-radius: 0;
    }

    .box-ranking:nth-child(3):hover, .box-ranking.selected:nth-child(3),
    .winners .box-ranking:nth-child(4):hover,.winners .box-ranking.selected:nth-child(4) {
        border-top-right-radius: 0;
        border-bottom-left-radius: 1.2rem;
        border-bottom-right-radius: 1.2rem;
    }
    .box-user .img-user {
        display: none;
    }
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 850px;
        margin: 1.75rem auto;
    }
}

@media (max-width: 767px) {
    .box-win {
        text-align: center;
    }
}