@media (max-width:1200px) {
    h1 {
        font-size: 60px;
    }
    section {
        padding: 50px 30px;
    }
    h2 {
        font-size: 50px;
    }
    p {
        font-size: 17px;
    }
    #popular .slider-img img {
        max-width: 350px;
        margin: 0 auto;
        height: 400px;
    }
    #play .play-text {
        padding-left: 30px;
    }
    #play .play-text ul li h4 {
        font-size: 26px;
    }
    #play .play-text ul li p {
        font-size: 17px;
    }
    .accordion-item .accordion-header h4 {
        font-size: 22px;
    }
    .accordion-item .accordion-body p {
        padding-bottom: 17px;
    }
    #customer .customer-slider .slide-text p {
        font-size: 17px;
    }
    #footer {
        background-size: 100% 100%;
        padding: 0px 30px;
        padding-top: 60px;
    }
    #footer .footer-item {
        flex-wrap: wrap;
    }
    #footer .footer-logo {
        width: 100%;
        justify-content: center;
        display: flex;
        padding-bottom: 20px;
    }
    #footer .footer-menu {
        width: 100%;
        justify-content: space-between;
    }
    #footer .footer-item h5 {
        font-size: 22px;
    }
}
@media (max-width:1024px) {
    .payment, .about-us, .games {
        width: 32%;
    }
    #play .border-animate ul li .number-img::before {
        left: -36px;
    }
    #play .border-animate ul li .number-img::after {
        width: 30px;
    }
    #play .border-animate ul li .number-img {
        width: 160px;
    }
    #play .play-text .number-text {
        padding-left: 20px;
    }
}
@media (max-width:992px) {
    h1 {
        font-size: 55px;
    }
    h2 {
        font-size: 45px;
    }
    section {
        padding: 40px 20px;
    }
    #popular .popular-text p {
        padding: 10px 0;
    }
    #popular .slider-img img {
        max-width: 290px;
        margin: 0 auto;
        height: 340px;
    }
    #popular button.owl-next, button.owl-prev img{
        width: 20px;
    }
    #popular button.owl-next {
        right: -3%;
    }
    #popular button.owl-prev {
        left: -3%;
    }
    #feature .feature-text h4 {
        font-size: 26px;
    }
    #feature .feature-text ul li:not(:nth-child(4)):before {
        left: -6%;
        top: 44%;
    }
    #customer .customer-slider .slide-text img {
        max-width: 90px;
    }
    #play .play-text .number-text {
        padding-left: 10px;
    }
    #play .play-text ul li h4 {
        font-size: 20px;
    }
    #play .play-text ul li p {
        font-size: 14px;
    }
    #play .border-animate ul li .number-img::before {
        left: -31px;
    }
    #play .border-animate ul li .number-img::after {
        width: 25px;
    }
    #play .play-text ul li:not(:nth-child(3)) {
        padding-bottom: 25px;
    }
    #play .play-text {
        padding-left: 20px;
    }
    #play .border-animate ul li .number-img::before {
        left: -35px;
    }
    #play .border-animate ul li .number-img::after {
        width: 25px;
    }
    #customer .customer-slider .slide-text p {
        font-size: 14px;
    }
    #customer button.owl-next img{
        width: 20px;
    }
    .payment, .about-us, .games {
        width: 32%;
    }
    #footer .footer-item .payment ul {
        flex-wrap: wrap;
        text-align: center;
        justify-content: center;
    }
    #footer .footer-item .payment ul li {
        padding-right: 0px;
        padding-bottom: 15px;
    }
}

@media (max-width:768px) {
    #banner .banner-item {
        padding: 30px 0;
    }
    #banner .banner-box {
        text-align: center;
    }
    #popular .popular-text {
        margin: 15px 0;
        text-align: center;
    }
    #popular button.owl-next {
        right: 0%;
    }
    #popular button.owl-prev {
        left: 0%;
    }
    #popular .popular-item {
        justify-content: center;
    }
    #popular .slider-img img {
        max-width: 250px;
        margin: 0 auto;
        height: 280px;
    }
    #feature .feature-item {
        text-align: center;
        flex-wrap: wrap;
    }
    #feature .feature-text {
        margin: 0 auto;
    }
    #feature .feature-text ul li::after {
        left: -10%;
    }
    #feature .feature-text ul li:not(:nth-child(4)):before {
        left: -8%;
    }
    
    #play .play-text {
        padding-left: 0px;
        padding-top: 30px;
    }
    #footer .footer-item .payment ul li {
        padding-right: 10px;
        padding-bottom: 10px;
    }
    #download .download-text {
        text-align: center;
        padding-bottom: 20px;
    } 
    #download .app-down {
        flex-direction: column-reverse;
        display: flex;
    }
    #download .download-text ul li {
        padding-right: 0px;
        width: 200px;
        text-align: center;
        margin: 0 auto;
    }
    #play .play-content {
        flex-wrap: wrap;
        justify-content: center;
    }
 
    #play .number-img {
        width: 160px;
    }
    #play .border-animate ul li .number-img::before {
        left: -33px;
    }
    #play .border-animate ul li .number-img::after {
        left: -26%;
    }
    .accordion-item .accordion-body p {
        font-size: 14px;
        padding: 0;
    }
    .accordion-item .accordion-header h4 {
        font-size: 20px;
        padding: 0;
    }
    #footer .footer-menu {
        flex-wrap: wrap;
        justify-content: center;
    }
    .about-us, .games {
        width: 50%;
        text-align: center;
    }
    .payment {
        width: 100%;
        text-align: center;
        padding-top: 10px;
    }
    #header .hamburger {
        display: block;
        z-index: 10;
    }
    #header .social {
        padding-left: 0px;
        padding-right: 15px;
    }
    .header-menu {
        position: fixed;
        width: 100%;
        height: 100%;
        left: -100%;
        top: 0;
        z-index: 10;
        transition: all 0.5s linear;
        background-color: #000131;
    }
    #header .header-menu ul {
        display: block;
        border: none;
        padding-top: 20px;
    }
    #header .header-menu ul li {
        padding: 20px;
    }
    .active .header-menu {
        left: 0%;
    }
    .active #header .hamburger span:nth-child(1){
        top: 8;
        transform: rotate(45deg);
    }
    .active #header .hamburger span:nth-child(2){
        opacity: 0;
    }
    .active #header .hamburger span:nth-child(3){
        top: 0px;
        transform: rotate(-45deg);
    }
}
@media (max-width:767px) {
    #play .border-animate ul li .number-img::before {
        display: none;
    }
    #play .border-animate ul li .number-img::after {
        display: none;
    }
    #feature .feature-text ul li::after {
        display: none;
    }
    #feature .feature-text ul li:not(:nth-child(4)):before {
        display: none;
    }
    #play .arrow {
        display: none;
    }
    #play .arrow::before {
        display: none;
    }
    #play .arrow::after {
        display: none;
    }
    #banner .banner-item {
        flex-direction: column-reverse;
    }
    #feature .feature-item {
        flex-direction: column-reverse;
    }
}
@media (max-width:576px) {
    h1 {
        font-size: 45px;
    }
    h2 {
        font-size: 40px;
    }
    p {
        font-size: 14px;
    }
    #feature .feature-text h2 {
        padding-bottom: 20px;
    }
    #feature .feature-text h4 {
        font-size: 22px;
    }
    #feature .feature-text ul li::after {
        height: 12px;
        width: 12px;
    }
    #play .play-text ul li h4 {
        font-size: 22px;
    }
    #play .play-text ul li p {
        font-size: 14px;
    }
    
    #download .download-text ul li {
        width: 160px;
    }
    #customer .customer-slider .custom-name h5 {
        font-size: 22px;
    }
    #customer .customer-slider .custom-name h6 {
        padding: 8px 0;
        font-size: 16px;
    }
    #customer .customer-slider .slide-text {
        padding: 0px 10px;
    }
    #customer .customer-slider .slide-text p {
        font-size: 13px;
    }
    .accordion-item .accordion-header h4 {
        font-size: 18px;
        padding: 10px 0;
    }
    .accordion-item .accordion-body p {
        font-size: 13px;
        padding: 0;
    }
    #footer {
        padding: 0px 20px;
    }
    #footer .footer-item h5 {
        font-size: 18px;
    }
    #footer .footer-item ul li a {
        font-size: 16px;
    }
    #footer .copyright h6 {
        font-size: 14px;
        padding: 20px;
    }
}

@media (max-width:481px) {
    h1 {
        font-size: 40px;
    }
    h2 {
        font-size: 35px;
    }
    section {
        padding: 30px 15px;
    }
    #header .social ul li:not(:nth-child(4)) {
        padding-right: 15px;
    }
    #banner {
        background-size: 100% 100%;
    }
    #popular .slider-img img {
        max-width: 200px;
        height: 250px;
    }
    #popular button.owl-next {
        right: -4%;
    }
    #popular button.owl-prev {
        left: -4%;
    }
    br {
        display: none;
    }
    #feature .feature-text {
        padding-left: 10px;
    }
    #feature .feature-text ul li::after {
        left: 0%;
    }
    #feature .feature-text ul li:not(:nth-child(4)):before {
        left: 2%;
        top: 39%;
    }
    #feature .feature-text h4 {
        font-size: 20px;
    }
    #play .play-text ul li h4 {
        font-size: 20px;
    }
    #play .play-text ul li p {
        font-size: 13px;
    }
    #play .play-text .number-text {
        padding-left: 10px;
    }
    #play .number-img {
        width: 160px;
    }
    #play .border-animate ul li .number-img::before {
        left: -34px;
    }
    #play .border-animate ul li .number-img::after {
        left: -24%;
    }
    #customer .customer-slider .slide-text img {
        max-width: 70px;
    }
    #customer {
        background-size: 100% 100%;
    }
    #customer .customer-slider .custom-name {
        padding-left: 15px;
    }
    #customer .customer-slider .custom-name h5 {
        font-size: 18px;
    }
    #customer .customer-slider .custom-img {
        width: 80px;
    }
    #customer button.owl-next img {
        width: 15px;
    }
    #customer button.owl-prev img {
        width: 15px;
    }
    #customer button.owl-next {
        right: -5%;
    }
    #customer button.owl-prev {
        left: -5%;
    }
    #download .download-text ul li {
        width: 130px;
    }
    #download .download-text {
        padding: 0;
    }
    .accordion-item {
        padding-bottom: 10px;
    }
    .about-us, .games {
        width: 100%;
    }

}