body {
    background: url(../img/background.jpg) no-repeat top center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

    font-family: Arial, 'Open Sans', 'Lato';
    font-size: 14px;
    color: #fff;
}

@font-face {
    font-family: "forte";
    src: url(../fonts/ForteMTStd.otf);
}

.no-gutters { padding-left: 0; padding-right: 0; }

.header-wrapper {
    background: #f4f4f4;
    background: -moz-linear-gradient(top, #f4f4f4 12%, #e8e8e8 58%, #e8e8e8 58%, #cccccc 58%, #cccccc 58%, #f4f4f4 100%);
    background: -webkit-linear-gradient(top, #f4f4f4 12%,#e8e8e8 58%,#e8e8e8 58%,#cccccc 58%,#cccccc 58%,#f4f4f4 100%);
    background: linear-gradient(to bottom, #f4f4f4 12%,#e8e8e8 58%,#e8e8e8 58%,#cccccc 58%,#cccccc 58%,#f4f4f4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#f4f4f4',GradientType=0 );
    margin-bottom: 1px;
}

a.logo {
    display: block;
    padding: 10px 0;
}

.login-wrapper {
    background: #b40b0b;
    background: -moz-linear-gradient(top, #b40b0b 26%, #660808 100%);
    background: -webkit-linear-gradient(top, #b40b0b 26%,#660808 100%);
    background: linear-gradient(to bottom, #b40b0b 26%,#660808 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b40b0b', endColorstr='#660808',GradientType=0 );

    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px;

    padding: 8px 15px;
}

form.login-form .input-group-sm>.input-group-prepend>.input-group-text {
    background: #5b5b5b;
    background: -moz-linear-gradient(top, #5b5b5b 0%, #000000 20%, #000000 80%, #5b5b5b 100%);
    background: -webkit-linear-gradient(top, #5b5b5b 0%,#000000 20%,#000000 80%,#5b5b5b 100%);
    background: linear-gradient(to bottom, #5b5b5b 0%,#000000 20%,#000000 80%,#5b5b5b 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b5b5b', endColorstr='#5b5b5b',GradientType=0 );

    font-size: 12px;
    padding: 5px 10px;
    color: #fff;
    border: 1px solid #000;
}
form.login-form .input-group>.form-control {
    border: 1px solid #000;
    font-size: 12px;
    padding: 5px 10px;
    color: #000;
}
form.login-form .input-group:not(:last-child) { margin-right: 10px; }
.btn-login {
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f0a70a 58%);
    background: -webkit-linear-gradient(top, #ffffff 0%,#f0a70a 58%);
    background: linear-gradient(to bottom, #ffffff 0%,#f0a70a 58%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f0a70a',GradientType=0 );

    border: 1px solid #fff;
    border-radius: 10px;
    -moz-border-radius: 10px;

    font-size: 18px;
    font-weight: bold;
    color: #000;
    padding: 5px 13px;
    line-height: 14px;
    text-transform: uppercase;
}
form.login-form .input-group-sm>.form-control, form.login-form .input-group-sm>.input-group-prepend>.input-group-text {
    line-height: 1;
    border-radius: 1rem;
}
form.login-form .input-group>.input-group-prepend>.input-group-text {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
form.login-form .input-group>.form-control:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.main-menu-wrapper {margin-top: 1.5rem;}
.main-menu-wrapper ul {
    margin: 0;
    padding: 0;
}
.main-menu-wrapper ul li { line-height: 1; }
.main-menu-wrapper ul li:not(:last-child) {
    border-right: 1px solid #000;
    margin-right: 0;
}
.main-menu-wrapper ul li a {
    font-size: 18px;
    font-weight: bold;
    color: #000;
    text-transform: uppercase;
    padding: 5px;
}
.main-menu-wrapper ul li a:hover {
    text-decoration: none;
    color: #a91212;
}

a.btn-register {
    background: #4c0000;
    background: -moz-linear-gradient(top, #4c0000 0%, #c81616 28%, #4c0000 99%);
    background: -webkit-linear-gradient(top, #4c0000 0%,#c81616 28%,#4c0000 99%);
    background: linear-gradient(to bottom, #4c0000 0%,#c81616 28%,#4c0000 99%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c0000', endColorstr='#4c0000',GradientType=0 );

    border-radius: 10px;
    -moz-border-radius: 10px;
    font-size: 24px;
    font-weight: bold;
    color: #fff;
    text-transform: uppercase;
    line-height: 24px;
    border: 1px solid #fff;
}

.news-ticker-wrapper {
    background: #ac0303;
    background: -moz-linear-gradient(top, #ac0303 25%, #4d3e3e 100%);
    background: -webkit-linear-gradient(top, #ac0303 25%,#4d3e3e 100%);
    background: linear-gradient(to bottom, #ac0303 25%,#4d3e3e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ac0303', endColorstr='#4d3e3e',GradientType=0 );

    border-bottom: 3px solid #fff;
    padding-top: 2px;
    padding-bottom: 2px;
}
.nt-box {position: relative;}
.nt-box .nt-img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.nt-box .nt-text {
    position: relative;
    z-index: 0;
    background: #fff;
    color: #000;
    font-size: 18px;
    font-weight: bold;
    padding: 5px 10px;
    margin-top: 7px;
    margin-bottom: 5px;
}

a.btn-bonus {
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f0a910 100%);
    background: -webkit-linear-gradient(top, #ffffff 0%,#f0a910 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#f0a910 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f0a910',GradientType=0 );

    font-size: 26px;
    font-weight: bold;
    color: #000;
    text-transform: uppercase;
    padding: 5px 10px;

    border-radius: 10px;
    -moz-border-radius: 10px;
    border: 1px solid #fff;
}

.slider-wrapper {
    border: 2px solid #fff;
}

.contacts-wrapper {}
.contacts-wrapper ul {
    margin: 0;
    padding: 0;
}
.contacts-wrapper ul li {
    width: 24%;
    padding: 5px 10px 0;
    vertical-align: top;
}
.contacts-wrapper ul li.bg-bbm {
    background: #222222;
    background: -moz-linear-gradient(top, #222222 0%, #151515 100%);
    background: -webkit-linear-gradient(top, #222222 0%,#151515 100%);
    background: linear-gradient(to bottom, #222222 0%,#151515 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#151515',GradientType=0 );
}
.contacts-wrapper ul li.bg-line-wa {
    background: #a4d717;
    background: -moz-linear-gradient(top, #a4d717 1%, #a4d717 50%, #49ab00 50%, #49ab00 100%);
    background: -webkit-linear-gradient(top, #a4d717 1%,#a4d717 50%,#49ab00 50%,#49ab00 100%);
    background: linear-gradient(to bottom, #a4d717 1%,#a4d717 50%,#49ab00 50%,#49ab00 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4d717', endColorstr='#49ab00',GradientType=0 );
}
.contacts-wrapper ul li i {
    background: transparent url(../img/contact-sprites.png) no-repeat;
    height: 50px;
    width: 50px;
    text-indent: -999px;
    overflow: hidden;
    display: inline-block;
}
.contacts-wrapper ul li i.bbm {background-position: 0 0;}
.contacts-wrapper ul li i.line {background-position: 0 -50px;}
.contacts-wrapper ul li i.wa {background-position: 0 -100px;}
.contacts-wrapper ul li span {
    font: 24px Impact;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: black;
    display: inline-block;
    vertical-align: top;
    text-transform: uppercase;
    line-height: 1;
}

.box-jackpot {
    position: relative;
}
.box-jackpot img {
    position: relative;
    z-index: 0;
}
.box-jackpot span {
    position: absolute;
    z-index: 1;
    top: 25%;
    left: 40%;
    font: 30px forte;
}

.box-latest {
    position: relative;
}
.box-latest img {
    position: relative;
    z-index: 0;
}
.box-latest ul {
    position: absolute;
    top: 20%;
    left: 0;
    margin-left: 5rem;
}
.box-latest ul li {
    padding: 5px;
    margin-bottom: 1.05rem;
}

.post {
    /*background-color: rgba(255, 255, 255, 0.3);*/
    /*color: rgba(255, 255, 255, 0.3);*/

    background: #171717;
    border: 3px solid #493d04;
    border-radius: 10px;
    -moz-border-radius: 10px;
    padding: 2rem;
}
.post p {text-align: center;}
.post h1, .post h2, .post h3, .post h4 {
    font-weight: bold;
    color: #feeb1d;
    text-align: center;
}
.post h1 {font-size: 24px;}
.post h2 {font-size: 18px;}
.post h3 {font-size: 16px;}
.post h4 {font-size: 14px;}

.footer-wrapper {}
.footer-wrapper p {
    margin-bottom: 0;
    text-align: center;
}
.footer-wrapper p a { color: #fff; }
.footer-wrapper p a:hover { color: #feeb1d; }

/* berlaku untuk 992px ke atas */
@media (min-width: 992px) {
    .container {max-width: 960px;}
}

/* berlaku untuk 768px ke bawah */
@media (min-width: 420px) and (max-width: 768px ) {
    .contacts-wrapper ul li {
        width: 48%;
        margin-bottom: 2px;
    }
    .box-latest ul {margin-left: 4rem;}
    .box-latest ul li {
        margin-bottom: 0.75rem;
        font-size: 9px;
    }
}

/* berlaku untuk 420px ke bawah */
@media (max-width: 420px) {
    .main-menu-wrapper ul { text-align: center; }
    .contacts-wrapper ul li {
        width: 100%;
        margin-bottom: 2px;
    }
    .box-latest ul {margin-left: 5.7rem;}
    .box-latest ul li {margin-bottom: 1.2rem;}
}

/* berlaku untuk 768px */
@media (width: 768px) {
}