/* Large screens ---------- */
@media screen and (min-width: 1824px){
   /* .about-bg h1{left:45%;top:35%;}*/
    .contact-bg h1{left:45%;top:35%;}
    .parent-co{height:30vh;}
    .parent-co2{height:30vh;}
    .contact-box .form-control{margin-bottom:20px; border-radius: 0rem;}
}
@media(max-width: 1600px){
    .padding-top:4.9%;{padding-top:6%;}
}
@media(max-width: 1300px){
    .padding-top:4.9%;{padding-top:7%;}
}
@media(max-width: 767px){
    .padding-top:4.9%;{padding-top:14%;}
}

@media(max-width: 576px){
.padding-top:4.9%;{padding-top:23%;}
.about-bg{background-size: 100% 100%; height: 30vh;}
.about-bg h1{font-size: 2rem;}
/*.about-bg{background-size: contain; height: 18vh;}
.about-bg h1{font-size: 1.5rem;}*/
.shop-button .payment {top: unset; bottom: unset; width: 300px; line-height: 50%;padding: 19% 5%;}
}


/* Tablets, iPads (landscape) ---------- */
@media screen and (min-width: 1300px) and (max-width: 1600px){
    .carousel-inner .carousel-caption{right:5%;top:20%; left: 10%; height: 300px; width:45%;}
    .carousel-inner .carousel-caption .banner-text{font-size: 45px; }
    .carousel-item {height:86vh;margin-top:132px;}
    .stats-col {padding: 25px 0 15px 0;}
    .box .pagename{width: 25%;font-size: 21px;}
    .bod h4 {font-size: 18px;}
    .bod .desig {font-size: 16px;}

}

@media screen and (min-width: 1201px) and (max-width: 1299px) {
    .carousel-inner .carousel-caption {right: 52%!important; top:25%; width: 43%; height: 270px;}
    .carousel-inner .carousel-caption .banner-text{font-size: 38px; }
    .btn-primary {padding:12px 18px;font-size:15px;}
    .carousel-item .btn-outline-dark {padding:12px 18px;font-size:15px;}
    .carousel-item {height:85vh;margin-top:132px;}
    .stats-col {padding: 25px 0;}
    .bod h4 {font-size: 17px;}
    .bod .desig {font-size: 15px;}
    .box .pagename {width: 25%}

}

/* Tablets, iPads (landscape) ---------- */
@media screen and (min-width: 1024px) and (max-width: 1200px){
    .carousel-item {height:84vh;margin-top:132px;}

    .stats-col {padding: 20px 0;}
    .carousel-caption {left:10%;}
    .carousel-inner .carousel-caption {right: 52%!important; top:25%; width: 48%; height: 220px;}
    .carousel-inner .carousel-caption .banner-text{font-size: 32px; }
    .carousel-indicators{top: 48%;}
    .carousel-indicators li {width: 15px; height: 15px;}
    .carousel-indicators .active:before {width: 13px; height: 13px;}
    .btn-primary {padding:12px 18px;font-size:13px;}
    .carousel-item .btn-outline-dark {padding:12px 18px;font-size:13px;}
    .box .pagename{width: 25%;font-size: 21px;}
    .box h1 {font-size: 2rem; margin: 20px 0 30px 0;}

}

/* Tablets, iPads (portrait and landscape) ---------- */
@media screen and (min-width: 768px) and (max-width: 1023px){
    /* styles */
    .header-top {padding:10px 10px;  text-align:center;}
    .navbar-expand-lg .navbar-nav .nav-link  { font-size: 18px;}
    .footer-contact {text-align: center;}
    .footer-contact a{margin-top:20px;}
    .box .pagename{width: 32%;font-size: 21px;}
    .carousel-indicators {position: absolute; right:0; left:0; top: 93%; align-items:center; height:20px; -webkit-transform: rotate(0deg);}
    .carousel-inner .carousel-caption {top:54%; left: 10%; width: 80%; height: 270px;}
    .carousel-inner .carousel-caption .banner-text{font-size: 48px; text-align:center; }
    .btn-primary {margin-top:15px;}
    .carousel-item .btn-outline-dark {margin-top:15px;}
    .carousel-item img {width:100%; height:50%;}
}

/* Smartphones (landscape) ---------- */
@media screen and (min-width: 321px){
    /* styles */
    
}

/* Smartphones (portrait) ---------- */
@media screen and (max-width: 320px){
    /* styles */
    .contact-bg h1{left:16%;top:40%;position:absolute;}
    
}


/* Smartphones (portrait and landscape) ---------- */
@media screen and (min-width: 320px) and (max-width: 480px){
    /* styles */
    .header-top {font-size: 11px; padding:10px 10px;  text-align:center;}
    .header-top span {margin:0 6px;}
    .navbar {padding:3px 15px!important;}
    .navbar-nav {height: 100vh !important; text-align: center; margin-top:25%;}
    .navbar-expand-lg .navbar-nav .nav-link  {padding-top:30px; padding-top:30px;}
    .slider_height{height:50%; background-size: cover;}
    .carousel-item {height:83vh;margin-top:122px;}
    .carousel-item img {width:100%; height:50%;}
    .carousel-inner .carousel-caption {top:50%; left: 0%; width: 100%; height: 270px; padding: 32px 20px; }
    .carousel-inner .carousel-caption .caption-list {display:block;}
    .carousel-inner .carousel-caption .banner-text{font-size: 26px; text-align: center; }
    .carousel-indicators {position: absolute; right:0; left:0; top: 90%; z-index: 15;list-style:none; align-items:center; -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);-ms-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);}
    .carousel-indicators li {width: 15px; height: 15px;}
    .carousel-indicators .active:before {width: 13px; height: 13px;}
    .btn-primary {padding:12px 5px; font-size:12px;}
    .carousel-item .btn-outline-dark {padding:12px 5px; font-size:12px;}
    .btn-group {display: block;}
    .stats-tab {display:block;width:100%;height:76vh; top: 0; padding: 30px}
    .stats-col {padding: 10px 0 15px 0; margin-left:0px; text-align: center;}
    .home-abt img {margin-bottom: 15px;}
    footer h4{padding-bottom:5px;}
    .footer-contact {text-align: center;}
    .footer-contact h2{padding-top:0px;}
    .footer-contact a{margin-top:20px;}
    .box h1 {text-align: center; margin: 20px 0 30px 0; font-size: 2rem;}
    .box {top: 40%;left: 50%; width: 80%; }
    .box .pagename{width: 40%;font-size: 16px;}
    .contact-btn{width:100%;}
    .contact-box{padding:40px 20px 20px 20px;}
    .contact-box .form-control{border-radius: 0rem!important; padding: .375rem .75rem;}
    .footer-details {background-image: none;}
    .footer-details [class*="col-"] {margin:10px 0;}
    .footer-bottom {text-align: center;}
    .footer-bottom [class*="col-"] {margin:5px 0;}
    .ImageBackground__holder {background-image: none; position: static;}
    .nav-tabs {overflow-x: scroll; width: auto!important;}
    .nav-tabs .nav-link {font-size: 12px!important; width: 80%!important;}
    .nav-tabs .nav-item {padding: 20px 50px;}
    #tabs.container {padding: 0;}
    .tab-content {padding-left: 15px; padding-right: 15px;}
    .btn {white-space: normal; text-align: left;}
    .nav-tabs img {}
    .shop-button .game span {font-size: 8px;  font-weight: 800;}
    .floatingbtns-chat li a {font-size: 8px;padding:7px;}
    .about-bg, .services-bg, .contact-bg, .cfs-bg{height:95vh;}
    .owl-theme .owl-dots .owl-dot span  {display: block;}
    #demos .owl-carousel .item {padding:0rem;}
}

@media (min-width: 540px) {
    .col-sm-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 720px) {
    .col-md-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 960px) {
    .col-lg-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 1140px) {
    .col-xl-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}



@media (max-width:1200px)
{
    .navbar-expand-lg .navbar-nav .nav-link 
    {
        font-weight: 700;
        padding-right: 20px;
        padding-left: 32px;
    }
    h2 
    {
        font-weight: 700;
        font-size: 30px;
    }
}

@media (max-width:1100px)
{
    .navbar-expand-lg .navbar-nav .nav-link {
        font-weight: 700;
        padding-right: 22px;
        padding-left: 22px;
    }
    h2 {
        font-weight: 700;
        font-size: 28px;
    }
    .footer-contact .btn-light {
        padding: 15px 25px;
        border-radius: 40px;
        letter-spacing: 2px;
        font-weight: 800;
        font-size: 15px;
    }
}

@media (max-width:1024px)
{
    .navbar-nav {
        height: auto !important;
        text-align: center !important;
        margin-top: 0 !important; 
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        font-weight: 700;
        padding-right: 18px;
        padding-left: 18px;
    }

    .box h1 {
        font-size: 25px;
    }

}

@media (max-width:991px)
{
    .container {
        width: 100%;
        max-width: 100%;
        padding: 0 50px;
    }

    .navbar-expand-lg .navbar-collapse {
        display: flex!important;
        flex-basis: auto;
        justify-content: flex-end;
        display: none !important;
    }
    .open-menu .navbar-collapse {
        display: block !important;
        position: absolute;
        top: 91px;
        background: #fff;
        width: 100%;
        left: 0;
        height: 100vh;
    }

    .navbar-nav {
        height: auto !important;
        text-align: left !important;
        margin-top: 0 !important;
        padding-left: 75px;
    }

    .open-menu .navbar-collapse ul li {
        padding-bottom: 10px;
    }

    .investors-box .col-md-6 {
        flex: 0 0 auto;
        width: 30%;
    }
    .investors-box-block {
        padding: 70px 0 0;
    }

    h2 {
        font-weight: 700;
        font-size: 25px;
    }
    h4 {
        font-size: 18px;
        font-weight: 800;
        line-height: 130%;
    }
    .footer-details .col-md-8 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (max-width:768px)
{
    .box .pagename {
        background-color: #F6A046;
        text-align: center;
        width: 50%;
        color: #ffffff;
        font-family: 'DINPro';
        font-weight: 600;
        font-size: 20px;
        text-transform: uppercase;
    }
    .investors-box .col-md-6 {
        flex: 0 0 auto;
        width: 40%;
    }
    h2 {
        font-weight: 700;
        font-size: 23px;
    }
    .investors-contact-box .row {
        gap: 10px 0;
    }
    .container {
        width: 100%;
        max-width: 100%;
        padding: 0 30px;
    }
    .navbar {
        padding: 8px 30px;
    }
    .box {
        position: absolute;
        height: 20px;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        text-align: center;
        width: 90%;
    }

    .navbar-nav {
        padding-left: 20px;
    }
    footer h4 {
        color: #3b3b3b;
        font-size: 16px;
        padding-bottom: 0;
    }
    footer p {
        color: #717070;
        font-weight: 400;
        font-size: 16px;
        margin-bottom: 0;
    }
    .footer-details ul li {
        margin: 12px 0 0;
        line-height: 130%;
    }
    .footer-details [class*="col-"] {
        margin: 10px 0;
    }
    .footer-contact {
        padding: 70px 0;
    }
    .footer-contact .btn-light {
        padding: 10px 15px;
    }
    .footer-bottom {
        text-align: center;
    }
    .floatingbtns-chat li {
        top: 46%;
    }
    .footer-contact h2 {
        font-size: 20px;
    }
    .investors-contact-box .col-md-6 {
        border-right: none !important;
    }
}

@media (max-width:640px)
{
    .investors-box-content img {
        width: 100%;
        max-width: 80px;
    }
    .investors-contact-block {
        padding: 30px 0;
    }
    .investors-box .col-md-6 {
        flex: 0 0 auto;
        width: 50%;
    }
    .box h1 {
        font-size: 22px;
    }
    h2 {
        font-size: 22px;
    }
    .investors-contact-box .row {
        margin: 0 -15px;
    }
    .investors-contact-box .col-md-6 {
        padding: 0 15px;
    }
}

@media (max-width:576px)
{
    .container {
        padding: 0 20px;
    }
    .investors-box .col-md-6 {
        flex: 0 0 auto;
        width: 100%;
    }

    h2 {
        font-size: 20px;
    }
    h4 {
        font-size: 17px;
    }
    .footer-contact h2 {
        font-size: 18px;
    }
    .about-bg, .services-bg, .contact-bg, .cfs-bg {
        height: 65vh;
    }
}

@media (max-width:480px)
{
    .box h1 {
        font-size: 20px;
    }
    h2 {
        font-size: 19px;
    }
    .footer-contact {
        padding: 40px 0;
    }
    .footer-contact h2 {
        font-size: 18px;
        line-height: normal;
    }
    .footer-contact .btn-light {
        padding: 8px 15px;
        letter-spacing: 1px;
        font-size: 14px;
    }

}