/* Google Fonts Start */
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,300i,400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,400i,500,500i,600,600i,700,700i,800,800i&display=swap');
/* Google Fonts End */

body {
    /*font-weight: lighter;
    font-size: 1.25rem;*/
}

ol.g {
    list-style-type: decimal-leading-zero;
}

.navbar-brand img {
    height: 3rem;
}

.line-normal {
    line-height: normal;
}

.bg-img-none {
    background-image: none !important;
}

.bg-green-02 {
    background: rgb(36, 167, 26);
    background: -moz-linear-gradient(top, rgba(211, 238, 209, 1) 0%, rgba(36, 167, 26, 1) 3%, rgba(9, 123, 1, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(211, 238, 209, 1)), color-stop(3%, rgba(36, 167, 26, 1)), color-stop(100%, rgba(9, 123, 1, 1)));
    background: -webkit-linear-gradient(top, rgba(211, 238, 209, 1) 0%, rgba(36, 167, 26, 1) 3%, rgba(9, 123, 1, 1) 100%);
    background: -o-linear-gradient(top, rgba(211, 238, 209, 1) 0%, rgba(36, 167, 26, 1) 3%, rgba(9, 123, 1, 1) 100%);
    background: -ms-linear-gradient(top, rgba(211, 238, 209, 1) 0%, rgba(36, 167, 26, 1) 3%, rgba(9, 123, 1, 1) 100%);
    background: linear-gradient(to bottom, rgba(211, 238, 209, 1) 0%, rgba(36, 167, 26, 1) 3%, rgba(9, 123, 1, 1) 100%);
}

.bg-yellow-02 {
    background: #fdbc00;
    background: -webkit-linear-gradient(#fdbc00, #d67900) !important;
    background: -o-linear-gradient(#fdbc00, #d67900) !important;
    background: -moz-linear-gradient(#fdbc00, #d67900) !important;
    background: linear-gradient(#fdbc00, #d67900) !important;
    border: 1px solid #e08900;
}

.bg-silver-02 {
    backrgound: rgba(223, 223, 223);
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 33%, rgba(255, 255, 255, 0.5) 35%, rgba(254, 254, 254, 1) 37%, rgba(223, 223, 223, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(33%, rgba(255, 255, 255, 0)), color-stop(35%, rgba(255, 255, 255, 0.5)), color-stop(37%, rgba(254, 254, 254, 1)), color-stop(100%, rgba(223, 223, 223, 1)));
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 33%, rgba(255, 255, 255, 0.5) 35%, rgba(254, 254, 254, 1) 37%, rgba(223, 223, 223, 1) 100%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 33%, rgba(255, 255, 255, 0.5) 35%, rgba(254, 254, 254, 1) 37%, rgba(223, 223, 223, 1) 100%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 33%, rgba(255, 255, 255, 0.5) 35%, rgba(254, 254, 254, 1) 37%, rgba(223, 223, 223, 1) 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 33%, rgba(255, 255, 255, 0.5) 35%, rgba(254, 254, 254, 1) 37%, rgba(223, 223, 223, 1) 100%);
}

.btn {
    /*font-weight: lighter;
    font-size: 1.25rem;*/
}

.cursor-pointer {
    cursor: pointer;
}

.accordion-item .accordion-button {
    /*font-weight: lighter;
    font-size: 1.25rem;*/
}

.dropdown-item {
    /*font-weight: lighter;
    font-size: 1.25rem;*/
}

.form-control {
    /*font-weight: lighter;
    font-size: 1.25rem;*/
}

.tools {
    max-width: 440px;
    margin: 0 auto;
}

    .tools .tl-item-link {
        background: #efefef;
        border-radius: 3px;
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
        border: #efefef 1px solid;
    }

.text-coco {
    color: #6d4006;
}

#opendraw .container:nth-child(1) .a::after {
    content: "DAYS";
    font-size: 11px;
}

#opendraw .container:nth-child(2) .a::after {
    content: "HRS";
    font-size: 11px;
}

#opendraw .container:nth-child(3) .a::after {
    content: "MINS";
    font-size: 11px;
}

#opendraw .container:nth-child(4) .a::after {
    content: "SECS";
    font-size: 11px;
}

#confirmbet .col-2 {
    background-image: url(../../images/wblank.png?v3);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

#memBet .col-2 {
    background-image: url(../../images/wblank.png?v3);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    text-align: center;
    width: 20%;
}

    #memBet .col-2 select {
        appearance: none;
        font-size: 2rem;
        font-weight: bold;
    }

        #memBet .col-2 select:focus {
            outline: none;
            border: none;
        }

#memLogin span {
    /*font-weight: lighter;
    font-size: 1.25rem;*/
}

#memLogin input {
    /*font-weight: lighter;
    font-size: 1.25rem;*/
}

#myCanvas2 {
    display: none;
    width: 100%;
    max-width: 440px;
    margin: 0 auto;
    border-radius: 5px;
}

.drawdetail .col-2 {
    -ms-flex: 0 0 16.6666%;
    flex: 0 0 16.6666%;
    max-width: 16.6666%;
    font-size: 2rem;
    font-weight: bold;
}

.d-desktop {
    display: block;
}

.d-mobile {
    display: none;
}

.input-group-text {
    /*font-weight: lighter;
    font-size: 1.25rem;*/
}

.d-ruby {
    display: ruby;
}

#divDrawDate span {
    font-weight: lighter;
    font-size: 1.25rem;
}

#divDrawDate select {
    font-weight: lighter;
    font-size: 1.25rem;
}

#opendraw .container {
    background-color: darkred;
    border-radius: 5px;
    margin: 0 5px;
    border: #fd7676 1px solid;
}

    #opendraw .container .a {
        line-height: normal;
    }

        #opendraw .container .a div {
            color: #fff;
            font-weight: bold;
            line-height: normal;
            margin-top: 5px;
        }

#divtnc {
    width: 480px;
}

.loader {
    display: none;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin: 15px auto;
    position: relative;
    background: #FFF;
    box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    box-sizing: border-box;
    animation: shadowPulse 2s linear infinite;
}

@keyframes shadowPulse {
    33% {
        background: #FFF;
        box-shadow: -24px 0 #FF3D00, 24px 0 #FFF;
    }

    66% {
        background: #FF3D00;
        box-shadow: -24px 0 #FFF, 24px 0 #FFF;
    }

    100% {
        background: #FFF;
        box-shadow: -24px 0 #FFF, 24px 0 #FF3D00;
    }
}

@media only screen and (max-width: 479px) {
    #myCanvas {
        width: 200px !important;
        height: 200px !important;
    }

    .d-desktop {
        display: none;
    }

    .d-mobile {
        display: block;
    }

    .alert.alert-success.m-0, .alert.alert-danger.m-0 {
        min-width: initial !important;
    }

    #divtnc {
        width: 100%;
    }

    #ballMachine {
    }

    .tools {
        max-width: 100%;
        margin: 0 auto;
    }

        .tools .tl-item-nums span {
            width: 35px;
            height: 35px;
            font-size: 20px;
        }

    #memBet {
        padding: 0 10px;
    }

        #memBet .col-2 {
            float: left;
            width: 20%;
        }
}