/* Round buttons */
.btn-cont {
    display: inline-flex;
    flex-wrap: wrap;
}
.round-btn {
    color: white !important;
    padding: 8px 5px 8px 15px;
    margin: 3px 7px 3px 0;
    position: relative;
    font-family: "DM Sans";
    font-size: 14px;
    font-weight: 700;
    line-height: 32px;
    border-radius: 100px;
}
.jackpot-color-saysaloto .active-button-topnav {
    color: #EA0029 !important;
    background: white !important;
    pointer-events: none;
}

.jackpot-color-superloto .active-button-topnav {
    color: #FF5100 !important;
    background: white !important;
    pointer-events: none;
}

.jackpot-color-millypiyango .active-button-topnav {
    color: #0173B9 !important;
    background: white !important;
    pointer-events: none;
}

.jackpot-color-sanstopu .active-button-topnav {
    color: #E10098 !important;
    background: white !important;
    pointer-events: none;
}

.jackpot-color-onnumara .active-button-topnav {
    color: #9038A6 !important;
    background: white !important;
    pointer-events: none;
}

.jackpot-color-hizlionnumara .active-button-topnav {
    color: #722189 !important;
    background: white !important;
    pointer-events: none;
}

.round-btn:hover {
    text-decoration: none;
    background-color: #38383826 !important;
    color: white;
}


/* Play with */
.play-with {
    padding: 20px;
    border-radius: 4px 4px 0 0;
    margin-top: -20px;
}

.play-with h3, .play-with h2,
.play-with .h-mimic,
.play-with img {
    display: inline-block;
    float: left;
}

.play-with .loto-logo {
    width: 200px;
    height: 48px;
    -o-object-fit: cover;
       object-fit: cover;
}
.play-with h3, .play-with h2 {
    margin-right: 15px;
    color: #fff;
    margin-bottom: 0!important;
}
.play-with .h-mimic {
    margin-right: 15px;
    color: #fff;
    margin-bottom: 0!important;
}

.play-with .btn-cont {
    float: right;
}
.play-with .round-btn {
    padding: 5px 15px 5px 15px;
}


/* Check Wins */
.check-wins {
    height: 48px;
}
.check-wins img {
    width: 95px;
    height: 48px;
    display: inline-block;
    float: left;
}
.check-wins input {
    width: calc(100% - 281px);
    height: 48px;
    padding: 14px 12px;
    margin-left: 10px;
    margin-right: 10px;
    display: inline-block;
    float: left;
    border: 1px solid #DFDFDF;
    border-radius: 4px;
}
.check-wins input::-moz-placeholder {
    opacity: 0.5;
    color: #4F4F4F;
}
.check-wins input::placeholder {
    opacity: 0.5;
    color: #4F4F4F;
}
.check-wins button {
    width: 166px;
    height: 48px;
    display: inline-block;
    float: left;
    border-radius: 100px;
    border: 0;
    background-color: #9038A6;
    text-transform: uppercase;
    color: var(--general-white, #FFF);
    text-align: center;
    font-family: DM Sans;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 40px; /* 285.714% */
    letter-spacing: 0.087px;
}

/* Select */
.select-cont {
    position: relative;
}
.select-cont select {
    width: 100%;
    border: 1px solid #DFDFDF;
    border-radius: 4px;
    padding: 18px 30px 18px 18px;
    font-weight: 500;
    outline: none;
    cursor: pointer;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    max-width: 100%;

    font-size: 16px;
    line-height: 20px;
    color: #4F4F4F;
}
.select-cont:after {
    position: absolute;
    content: '';
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    right: 10px;
    top: 50%;
    transform: translatey(-50%);
    pointer-events: none;
    cursor: pointer;
}

/* Video Player */
.plyr {
    margin-top: 15px;
}

.hp-box {
    background-color: #fff;
}

@media (max-width: 979.98px) {
    .play-with {
        margin-bottom: 0;
        margin-top: -20px;
        margin-left: -30px;
        border-radius: 0;
    }

    .two-col {
        -moz-column-gap: 21px;
             column-gap: 21px;
    }
}

@media (max-width: 767.98px) {
    .play-with {
        padding-left: 20px;
        padding-right: 0;
    }
    .btn-cont {
        flex-wrap: nowrap;
        padding: 5px 0;
        margin-top: 5px;
        width: 100%;
    }
    .btn-cont a {
        flex: auto;
        text-align: center;
        justify-content: center;
    }
    .check-wins {
        height: 110px;
        text-align: center;
    }
    .check-wins img,
    .check-wins input,
    .check-wins button {
        width: 100%;
        margin: 5px 0 5px 0;
    }
    .hp-box {
        background-color: #9038A6;
    }
    .play-with {
        margin-bottom: 0;
        margin-top: -20px;
        margin-left: -15px;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }
    .play-with .round-btn {
        display: flex;
        font-family: "DM Sans Bold";
        font-size: 12px;
        letter-spacing: 0.06px;
        padding: 0 8px !important;
        height: 25px;
        align-items: center;
    }
    .round-btn {
        margin : 0;
    }
    .play-with h3, .play-with h2 {
        display: none;
    }
    .play-with .h-mimic {
        display: none;
    }
    .play-with .loto-logo {
        height: 20px !important;
        width: 82px !important;

    }


}
@media (max-width: 479.98px) {
    .btn-cont {
        flex-wrap: nowrap;
        padding: 5px 0;
        margin-top: 5px;
        margin-bottom: 3px;
    }
    .play-with .round-btn {
        padding: 0 4px !important;
    }
    .play-with .btn-cont {
        float: right;
    }
}
@media  (max-width: 359px) {
    .play-with .round-btn {
        font-size: 10px;
        padding: 0 4px !important;
    }
}

.play {
    padding: 0;
    margin-bottom: 0;
}

.millipyiango-navigator .h-mimic {
    margin-bottom: 15px;
}