.mc-daily-bonus {
    background-color: #212121;
    background: #3d3d3d;
    margin: 0 0 20px 0;
    display: table;
    width: 100%;
    position: relative;

    font-family: 'Exo 2', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #000;
    min-width: 300px;
}

.mc-daily-bonus img {
    max-width: 100%;
    height: auto;
    display: block;
}

.mc-daily-bonus p {
    margin: 0;
    padding: 0;
    line-height: 1.5;
}

.mc-daily-bonus ul, .mc-daily-bonus ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

.mc-daily-bonus a, .mc-daily-bonus button {
    transition: all .3s ease;
    padding: 0;
}

.mc-daily-bonus a {
    text-decoration: none;
    color: #000;
    border-bottom: 1px solid rgba(255, 204, 0, 0.87);
}

.mc-daily-bonus a:hover {
    text-decoration: none;
    border-bottom-color: transparent;
}

.mc-daily-bonus figure {
    margin: 0;
}

.mc-heading {
    text-transform: uppercase;
    font-weight: 500;
}

.mc-daily-bonus h1, .mc-daily-bonus h2, .mc-daily-bonus h3, .mc-daily-bonus h4 {
    margin: 0;
    padding: 0;
    font-weight: 400;
}

.mc-daily-bonus-next-in {
    text-align: center;
}

.mc-daily-bonus h1 a, .mc-daily-bonus h2 a, .mc-daily-bonus h3 a, .mc-daily-bonus h4 a {
    color: inherit;
}

* {
    box-sizing: border-box;
}

.mc-daily-bonus p {
    margin: 0;
    padding: 0;
    line-height: 1.5;
}

.mc-daily-bonus button {
    -webkit-appearance: button;
    cursor: pointer;
    text-transform: none;
    overflow: visible;
    color: inherit;
    font: inherit;
    border: 0;
    margin: 0;
    padding: 0;
}
.mc-daily-bonus a, .mc-daily-bonus button {
    transition: all .3s ease;
}
.mc-daily-bonus button:disabled {
    pointer-events: none;
    background: #CCC;
}
.mc-daily-bonus .mc-btn {
    text-transform: uppercase;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    font-weight: 700;
    line-height: 1;
    border-bottom: 0;
}

.mc-daily-bonus .mc-btn--attention {
    border: 2px solid transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fddd47), color-stop(1, #fccf2a));
    background-image: -webkit-linear-gradient(top, #fddd47, #fccf2a);
    background-image: linear-gradient(to bottom, #fddd47, #fccf2a);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#fddd47, endColorstr=#fccf2a,GradientType=0 );
    color: #000;
}

.mc-daily-bonus .mc-btn--attention:hover {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fccf2a), color-stop(1, #fddd47));
    background-image: -webkit-linear-gradient(top, #fccf2a, #fddd47);
    background-image: linear-gradient(to bottom, #fccf2a, #fddd47);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#fccf2a, endColorstr=#fddd47,GradientType=0 );
}

.mc-hint {
    position: absolute;
    bottom: 100%;
    margin-bottom: 30px;
    background: #dbe1e4;
    color: rgba(0,0,0, .87);
    padding: 15px;
    width: 300px;
    display: none;
    z-index: 300;
    font-size: 13px;
    text-transform: none;
    right: 50%;
    line-height: 1.5;
    text-align: left;
}

@media(max-width: 850px)
{
    .mc-hint {
        display: none;
    }
}

.mc-hint:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent #dbe1e4 transparent transparent;
    position: absolute;
    top: 100%;
    right: 0;
    border-width: 0 20px 20px 0;
}

.mc-hint-trigger {
    position: relative;
}

.mc-hint-trigger:hover .mc-hint{
    display: block;
}

.mc-hint--right {
    left: 50%;
}

.mc-hint--right:before {
    border-color: #dbe1e4 transparent  transparent transparent;
    position: absolute;
    top: 100%;
    left: 0;
    border-width: 20px 20px 0 0;
}



.mc-bold {
    font-weight: 700;
}

.mc-justify {
  text-align: justify;
}

.mc-justify > * {
    display: inline-block;
    vertical-align: middle;
}

.mc-justify:after {
    content: '';
    width: 100%;
    height: 0;
    font-size:0;
    line-height:0;
    display: inline-block;
}

.mc-text-center {
    text-align: center;
}


.mc-daily-bonus__content {
    display: table-cell;
    width: 75%;
    padding: 20px 10px 0;
}

.mc-daily-bonus--disabled .mc-daily-bonus__content {
    -moz-filter: blur(2px);
    -webkit-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);
    filter: blur(2px);
}

.mc-daily-bonus__action {
    display: table-cell;
    background: #242424;
    width: 25%;
    text-align: left;
    padding: 10px 20px;
    vertical-align: middle;
}

.mc-daily-bonus--disabled .mc-daily-bonus__action {
    -moz-filter: blur(2px);
    -webkit-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);
    filter: blur(2px);
}

.mc-daily-bonus__action--login {
    background: rgba(255, 204, 0, 1);
    text-align: center;
}
.mc-daily-bonus__action--login .mc-heading {
    color: rgba(0,0,0, .87);
}

.mc-daily-bonus__heading {
    color: #fff;
    font-weight: 700;
    font-size: 16px;
}

.mc-daily-bonus__item:last-child .mc-daily-bonus__icon:after {
    display: none;
}

.mc-daily-bonus__icon {
    display: inline-block;
    width: 62px;
    height: 62px;
    background-image: url(../images/daily-bonus/daily-bonus-spr-3.png);
    background-repeat: no-repeat;
    position: relative;
}

.mc-daily-bonus__icon:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 6px;
    border-color: transparent transparent transparent #5a5a5a;
    position: absolute;
    left: 100%;
    margin-left: 3px;
    top: 50%;
    margin-top: -5px;
}

.mc-daily-bonus__icon:before {
    content: '';
    width: 100%;
    height: 100%;
    z-index: 50;
    background: rgba(0,0,0,.35);
    position: absolute;
    top: 0;
    left: 0;
    transition: background .3s ease, color .3s ease, top .3s ease, padding .3s ease, margin .3s ease, opacity .3s ease;
}

.mc-daily-bonus__period {
    text-transform: uppercase;
    color: rgba(255,255,255,0.15);
    font-size: 12px;
    margin-top: 5px;
}

.mc-daily-bonus__bonuses {
    margin-top: 20px;
}

.mc-daily-bonus__timer {
    color: #fff;
    margin-top: 20px;
    margin-bottom: 10px;
}

.mc-daily-bonus__timer .countdown-section {
    display: inline-block;
    width: 50%;
    margin-right: -4px;
}

.mc-daily-bonus__timer .countdown-amount {
    font-size: 40px;
    border-left: 1px solid #242424;
    background: #3d3d3d;
    padding: 5px;
    width: 100%;
    display: block;
    font-weight: 300;
    text-align: center;
}

.mc-daily-bonus__timer .countdown-period {
    display: block;
    color: #3d3d3d;
    text-transform: uppercase;
    font-size: 12px;
    margin-top: 5px;
}

.mc-daily-bonus__timer .countdown-section:first-child {
    border-left: 0;
}

.mc-daily-bonus__item {
    position: relative;
}

.mc-daily-bonus__icon--credits-500-000 {
    background-position: 0 0;
}

.mc-daily-bonus__icon--exp-10-000 {
    background-position: -77px 0;
}

.mc-daily-bonus__icon--credits-2000-000 {
    background-position: -152px 0;
}

.mc-daily-bonus__icon--crates-gold-2 {
    background-position: -228px 0;
}

.mc-daily-bonus__icon--crates-platinum-2 {
    background-position: -304px 0;
}

.mc-daily-bonus__icon--type59 {
    background-position: -380px 0;
}

.mc-daily-bonus__icon--gold-500 {
    background-position: -456px 0;
}

.mc-daily-bonus__icon--credits-20-000{
    background-position: 0px -100px;
}

.mc-daily-bonus__icon--premium {
    background-position: -540px 0;
}

.mc-daily-bonus__icon--credits-100-000 {
    background-position: -152px -100px;
}

.mc-daily-bonus__icon--gold-100 {
    background-position: -456px -100px;
}

.mc-daily-bonus__icon--exp-5000 {
    background-position: -76px -100px;
}

.mc-daily-bonus__icon--day1 {
    background-position: 0 0;
    background-image: url(../images/daily-bonus/daily-bonus-spr.png);
}

.mc-daily-bonus__icon--day2 {
    background-position: 0 -70px;
    background-image: url(../images/daily-bonus/daily-bonus-spr.png);
}

.mc-daily-bonus__icon--day3 {
    background-position: 0 -140px;
    background-image: url(../images/daily-bonus/daily-bonus-spr.png);
}

.mc-daily-bonus__icon--day4{
    background-position: 0 -210px;
    background-image: url(../images/daily-bonus/daily-bonus-spr.png);
}

.mc-daily-bonus__icon--day5 {
    background-position: 0 -630px;
    background-image: url(../images/daily-bonus/daily-bonus-spr.png);
}

.mc-daily-bonus__icon--day6 {
    background-position: 0 -350px;
    background-image: url(../images/daily-bonus/daily-bonus-spr.png);
}

.mc-daily-bonus__icon--day7 {
    background-position: 0 -420px;
    background-image: url(../images/daily-bonus/daily-bonus-spr.png);
}

.mc-daily-bonus__icon--medical-3 {
    background-image: url(../images/daily-bonus/medical-3.svg);
}

.mc-daily-bonus__icon--fire-5 {
    background-image: url(../images/daily-bonus/fire-5.svg);
}

.mc-daily-bonus__icon--parts-30 {
    background-image: url(../images/daily-bonus/parts-30.svg);
}

.mc-daily-bonus__check {
    display: none;
    background: url(../images/daily-bonus/daily-bonus-check.png) 0 0;
    width: 21px;
    height: 21px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
}

.mc-daily-bonus__item--pending .fa {
    display: none;
}

.mc-daily-bonus__item--pending .mc-daily-bonus__icon {
    -webkit-box-shadow: inset 0px 0px 0px 2px rgba(255, 204, 0, 0.87);
    -moz-box-shadow: inset 0px 0px 0px 2px rgba(255, 204, 0, 0.87);
    box-shadow: inset 0px 0px 0px 2px rgba(255, 204, 0, 0.87);
}

.mc-daily-bonus__item--pending .mc-daily-bonus__period {
    color: rgba(255,255,255,0.87);
}

.mc-daily-bonus__item--pending .mc-daily-bonus__icon:before {
      content: '';
      width: 100%;
      height: 100%;
      z-index: 50;
      background: rgba(255,204,0,0.4);
      position: absolute;
      top: 0;
      left: 0;
      transition: background .3s ease, color .3s ease, top .3s ease, padding .3s ease, margin .3s ease, opacity .3s ease;
}

.mc-daily-bonus__item--active .fa {
    display: inline-block;
}

.mc-daily-bonus__item--active .mc-daily-bonus__period {
    color: rgba(255,255,255,0.87);
}

.mc-daily-bonus__item--active .mc-daily-bonus__check {
    display: block;
}

.mc-daily-bonus__item--active .mc-daily-bonus__icon:before {
    display: none;
}

.mc-daily-bonus .mc-daily-bonus__receive-btn {
    font-size: 16px;
    padding: 5px;
    width: 100%;
    height: 60px;
    background: #ffe700; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffe700 0%, #ffaf00 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #ffe700 0%,#ffaf00  100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffe700 0%,#ffaf00 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#ffe700, endColorstr=#ffaf00,GradientType=0 ); /* IE6-9 */
}

.js-daily-bonus-error {
    display: none;
}


.mc-daily-bonus__tooltip {
    margin-bottom: -10px;
}

.mc-daily-bonus__disable {
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(0,0,0,0.6);
    width: 100%;
    height: 100%;
    z-index: 500;
    color: #fff;
    box-sizing: border-box;
    text-align: center;
    font-size: 30px;
    display: none;
    text-transform: uppercase;
    padding: 15px 100px;
}

.mc-daily-bonus__disable .fa-warning, .mc-daily-bonus__disable .fa-ban {
    color: #d10000;
    font-size: 70px;
}

.mc-daily-bonus__disable-text {
    font-size: 18px;
    font-weight: 700;
}

.mc-daily-bonus__disable-date {
    color: rgba(255,255,255,0.54);
    font-size: 16px;
    margin-top: 10px;
}

.mc-daily-bonus__x2-icon{
    position: absolute;
    right: -15px;
    top: -15px;
}

.js-daily-bonus-receive{
    position: relative;
}

.count-bonuses-10 .mc-daily-bonus__icon:after {
    display: none;
}

.count-bonuses-10 .mc-justify {
    text-align: initial;
    display: flex;
    gap: 9px;
    padding-bottom: 20px;
    width: 100%;
}

.count-bonuses-10 .mc-justify:after {
    display: none;
}

@media (max-width:1200px) {
    .mc-daily-bonus__x2-icon img{
        width: 40px;
        height: 40px;
    }
}
@media (max-width:650px) {
    .mc-daily-bonus__x2-icon img{
        width: 24px;
        height: 40px;
    }
}
