body{
    overflow-x: hidden;
}
.row.no-gutters {
    margin-right: 0 !important;
    margin-left: 0 !important;
}
.yalda {background: #bb2937;min-height: 100vh;}
.yalda .top-banner{padding: 20px 0}
.yalda .bott-banner{padding: 10px 0 20px}

.yalda .reward-icons{
    display: flex;
    flex-wrap: wrap;
    margin: 20px 0;
}
.yalda .reward-icons .reward-icon{
    flex: 1 0 10%;
    margin: 15px;
}

.yalda .reward-icons .reward-icon:hover{
    animation: swing 1s infinite linear;
}

.reward-box .reward-title {
    font-size: 1.1em;
}

.reward-box .reward-title > span {
    color: #bb2937;
}

.reward-box .gift-box {
    position: relative;
    text-align: center;
}

.reward-box .gift-box .desc{
    position: absolute;
    width: 90%;
    top: 40%;
    color: #fff;
    font-weight: bold;
    right: 5%;
    font-size: 1.1em;
}

.reward-box .gift-box .desc.code{
    position: absolute;
    width: 90%;
    top: 50%;
    color: #fff;
    font-weight: bold;
    right: 5%;
    font-size: 1.5em;
}

.reward-box .btn.rounded{
    border-radius: 1.75rem !important;

}

@-webkit-keyframes swing {
    20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }
    20% { -webkit-transform: rotate(15deg); }
    40% { -webkit-transform: rotate(-10deg); }
    60% { -webkit-transform: rotate(5deg); }
    80% { -webkit-transform: rotate(-5deg); }
    100% { -webkit-transform: rotate(0deg); }
}

@keyframes swing {
    20% { transform: rotate(15deg); }
    40% { transform: rotate(-10deg); }
    60% { transform: rotate(5deg); }
    80% { transform: rotate(-5deg); }
    100% { transform: rotate(0deg); }
}


@media only screen and (max-width: 767px) {
    .yalda .reward-icons{
        display: flex;
        flex-wrap: wrap;
        margin: 20px 0;
    }
    .yalda .reward-icons .reward-icon{
        flex: 1 0 15%;
        margin: 15px;
    }
}