@media only screen and (max-width:480px) {
    #main-header #logo img, #navbar {
        margin-left: 0 !important
    }

    #business h2, .mission-section-titile h2 {
        padding-bottom: 0 !important
    }

    .PrivacyPage span, .PrivacyPage-title {
        font-size: 2rem !important
    }

    #home-bg .video-container {
        height: 100vh !important;
        top: 0 !important
    }

    .about-section-bg {
        padding: 0 25px !important;
        margin-top: 0 !important;
        height: max-content !important;
        background-position: left !important
    }

    #navbar, .about-section-logo-imgs {
        margin-top: 1rem !important
    }

    .modal-message .custom-modal {
        width: 90% !important;
        max-width: 90% !important;
        height: 100% !important;
        margin: 1rem !important
    }

    #projects .owl-dots, .category-tabs, .project-desc .location_btn, .project-map {
        display: none !important
    }

    .modal-message .custom-modal .modal-body {
        margin-bottom: 100px
    }

    .aboust-section-pt, .design-btn-row {
        padding-top: 0 !important
    }

    #business .tab-buttons, #business .tab-content, .custom-padd, .tender-content {
        padding: 20px !important
    }

        .custom-padd .custom-heading-aboutus {
            font-size: 1.6em !important;
            font-weight: 100 !important
        }

        .custom-padd .custom-heading-cbd {
            font-size: 2em !important;
            margin-top: 10px !important;
            font-weight: 600 !important;
            padding-bottom: 0 !important
        }

        .custom-padd p {
            margin-top: 3px !important;
            font-size: 14px !important;
            letter-spacing: 0 !important
        }

    .about-us-logo1 {
        width: 100px !important;
        height: 150px !important
    }

    .about-us-logo2 {
        width: 125px !important;
        height: 120px !important
    }

    .about-us-logo2-wrapper {
        align-items: center;
        padding: 0 2rem 2rem !important
    }

    .about-us-logo1-wrapper {
        align-items: center;
        padding: 0 1rem 2rem !important
    }

    .about-us-info-wrapper {
        justify-content: center
    }

    #digi-investor h2, #our-partners h2, #team .heading h2, #why-invest h2, .core-value-section h2, .message-section h2, .story-section h2 {
        font-size: 2em !important
    }

    #business h2, #business h2 span {
        font-size: 28px !important
    }

    #design .design-buttons .design-button, #first-section .design-buttons .design-button, .message-section h4 {
        font-size: 14px !important
    }

    #message {
        padding: 50px 0 !important
    }

    .message-section h4 {
        margin-bottom: 3px !important
    }

    .content-pair .text-content, .message-section p {
        font-size: 13px !important
    }

    .message-section .desc {
        margin-top: 20px !important;
        color: #afafaf;
        font-family: Hind,Arial,"sans-serif";
        font-size: .9em !important;
        font-style: normal;
        font-weight: 300;
        line-height: 29px;
        letter-spacing: 0.5px !important;
    }

    #business h3, #business p, .project-info p {
        font-weight: 100 !important
    }

    #business .tabs {
        flex-direction: column !important
    }

    #main-header .slidedown, .businessbg {
        display: none
    }

    #business .tab-buttons {
        justify-content: center !important;
        width: 100% !important;
        flex-direction: row !important;
        column-gap: 30px;
        margin-bottom: 0 !important
    }

    #business .padding-tab, #projects h2, .footer-first-section {
        padding-left: 0 !important
    }

    #business p, #first-section .container-fluid {
        padding-top: 1rem !important
    }

    #business .tab-button {
        height: 54px !important;
        width: 54px !important
    }

    #home-bg .video-container, .live-work-play-content .live-work-play-left, .live-work-play-content .live-work-play-right, .search-bar, .team-carousel-section, .top-border-container {
        width: 100% !important
    }

    #business h3 {
        font-size: 26px !important
    }

    #business p, #design p {
        color: #828282;
        font-size: .9em !important
    }

    #design .design-buttons {
        padding-right: 0 !important
    }

    #design p {
        font-weight: 200
    }

    #projects h2 {
        font-size: 2em !important;
        padding-bottom: 1px !important;
        margin-top: 3rem !important
    }

        #cbd-organogram h2 span, #digi-investor h2 span, #our-partners h2 span, #projects h2 span, #team .heading h2 span, #why-invest h2 span, .benefits-section .header h2 span, .core-value-section h2 span, .media-events-container h2 span, .media-news-container h2 span, .mission-section-titile h2 span, .story-section h2 span, .tender-content h1 span {
            font-size: 1em !important
        }

    #home-bg .content {
        top: 42% !important;
        left: 0 !important;
        width: 330px !important
    }

    .content-pair .text-container, .content-pair .text-details {
        font-size: 12px !important
    }

    #active-image-designation, #active-image-text, .mission-section-subTitle h5 {
        font-size: .9em !important;
        line-height: 1.8em !important
    }

    #active-image-description, #events p, #first-section .tab-content .tab-pane p, #news p, .benefits-section .header p, .career-cards .card .content p, .introduction-section .section-text, .live-work-play-content .live-work-play-right p, .project-desc p, .team-head-desc, .team-head-designation {
        font-size: .9em !important
    }

    #main-header.header-scrolled {
        height: 80px !important
    }

    #logo {
        width: fit-content !important
    }

    .nav-row {
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    #navbar {
        margin-right: -14px
    }

    .nav-icon {
        width: unset !important
    }

    .navbar a i, .navbar a:focus i {
        margin-left: 0 !important;
        margin-right: 10px !important
    }

    .main-banner-section {
        height: 55vh !important
    }

        .main-banner-section .section-text {
            font-size: 25px !important
        }

        .main-banner-section .section-title, .team-video-container .video-heading {
            font-size: 26px !important
        }

    .introduction-section .section-title {
        font-size: 2em !important;
        padding-bottom: 5px !important
    }

    .about-us-section .section-text {
        font-size: .9em !important;
        line-height: 2.1 !important;
        font-weight: 100 !important
    }

    .about-us-section .section-title {
        font-size: 2em !important;
        font-weight: 500 !important;
        padding-bottom: 9px !important;
        margin-bottom: 5px !important
    }

    .about-us-section, .core-value-section, .introduction-section, .youtube-video-section {
        padding: 57px 0 !important
    }

    .expanding_panels .panel {
        height: 300px !important
    }

    .expanding_panels .new-content {
        margin-top: 20px !important;
        font-size: 9px !important;
        line-height: 20px
    }

    .video-container {
        height: 200px !important
    }

    .expanding_panels .panel:hover .content {
        transform: translateY(7%) !important
    }

    .expanding_panels .content {
        padding: 0 !important;
        margin-top: 20px !important;
        font-size: 19px !important
    }

    .core-value-card-title h2 {
        font-size: 18px !important
    }

    .core-value-icon img {
        width: 28% !important
    }

    .mission-section-titile h2 {
        font-size: 2em !important
    }

    .mission-section-container {
        padding: 57px 50px !important
    }

    .live-work-play-content .live-work-play-left .active, .live-work-play-content .live-work-play-left .item {
        font-size: 50px !important;
        line-height: 35px !important
    }

    .live-work-play-content {
        flex-direction: column !important;
        height: 60vh !important
    }

    .live-work-play {
        height: fit-content !important;
        animation: none !important;
        background-position: bottom !important
    }

    .team-head-content {
        display: flex !important;
        flex-wrap: wrap !important;
        padding: 0 42px !important
    }

    #cbd-organogram img {
        height: auto !important;
        max-width: 100% !important;
        vertical-align: top !important;
        padding: 0 23px 20px !important
    }

    #cbd-organogram h2, .benefits-section .header h2 {
        font-size: 2em !important;
        padding-bottom: 0 !important
    }

    .team-head-name {
        margin-top: 10px !important;
        text-align: left !important;
        font-size: 15px !important
    }

    .custom-padd-team, .get-in-touch {
        padding-top: 57px !important;
        padding-bottom: 57px !important
    }

    .imran-img, .mansoor-img {
        padding-left: 0 !important;
        width: 100% !important
    }

    .team-video-container {
        height: 30vh !important
    }

    .contact-video-container, .invest-video-container, .tender-video-container, .top-img, .topBanner, .topBanner video {
        height: 35vh !important
    }

        .topBanner h1 {
            font-size: 28px !important;
            margin-top: 24px !important;
            letter-spacing: 5px !important
        }

    .career-cards {
        padding: 0 25px !important;
        margin-top: 56px !important
    }

        .career-cards .card {
            width: 100% !important;
            padding: 22px 19px !important
        }

    .tender-content h1 {
        font-size: 2em !important;
        margin-bottom: 10px !important;
        padding-bottom: 0 !important
    }

    .tender-btn-group {
        flex-direction: column !important;
        align-items: center !important
    }

    .tender-table-container {
        width: 100% !important;
        padding: 0 !important
    }

    .tender-btn-group button {
        font-size: 15px !important
    }

    .tender-btn-group .active {
        font-weight: 700 !important
    }

    .tender-video-container .video-heading {
        font-size: 26px !important;
        top: 53% !important;
        left: 28% !important;
        letter-spacing: 5px !important
    }

    .career-cards .card .title {
        font-size: 24px !important;
        line-height: 35px !important
    }

    .career-cards .card .card-details p {
        font-size: .8em !important
    }

    .contact-video-container .video-heading {
        width: 100% !important;
        font-size: 26px !important;
        top: 51% !important;
        left: 1% !important;
        letter-spacing: 5px !important
    }

    .getinTouch-title {
        font-size: 2em !important;
        font-weight: 600 !important
    }

    .get-in-touch #dataisvalid {
        position: relative;
        top: 5% !important;
        right: 0 !important
    }

    .projects-padding {
        padding: 150px 0 100px !important
    }

    .category-ddl {
        display: flex !important;
        justify-content: center
    }

    .plot-section-banner-text h1 {
        line-height: 60px !important;
        letter-spacing: normal !important;
        font-size: 27px !important;
        margin-bottom: 0 !important;
        padding: 0 !important
    }

    .section-banner-description {
        padding: 30px !important
    }

    .project-desc {
        padding-left: 0 !important;
        margin-top: 50px
    }

    .project-info p {
        font-size: .9em !important
    }

    .plot-section-banner, .plot-section-banner-content {
        height: 40vh !important
    }

    .fields-width, .input-width {
        width: 100%
    }

    .faq-container {
        padding: 57px 30px !important
    }

    .top-img .text-overlay {
        width: 100%;
        font-size: 26px !important;
        letter-spacing: 6.05px
    }

    .media-news-container h2 {
        font-size: 2em !important;
        padding-left: 2rem !important;
        padding-bottom: 0 !important
    }

    .media-news-container {
        padding: 0 !important
    }

    .media-events-container {
        padding-left: 25px !important;
        padding-right: 25px !important
    }

        .media-events-container h2 {
            font-size: 2em !important;
            padding-left: 1rem !important;
            padding-bottom: 0 !important
        }

    .remove-padding {
        padding-left: 0 !important;
        padding-right: 0 !important
    }

    #events img {
        max-height: 200px !important
    }

    .updates .owl-carousel .owl-item img {
        height: 219px !important
    }

    .navbar-mobile {
        background: 0 0 !important
    }

        .navbar-mobile ul {
            background: #000 !important;
            width: 100%;
            left: 0 !important;
            right: 0 !important
        }

    #navbar ul li a {
        padding: 5px 15px !important
    }

    .invest-video-container .video-heading {
        top: 40% !important;
        left: 27% !important
    }

    .invest-video-container .video-heading-below {
        font-size: 26px !important;
        top: 57% !important;
        left: 25% !important;
        letter-spacing: 6.05px !important
    }

    #first-section h3 {
        letter-spacing: 1.89px !important;
        font-size: 27px !important;
        margin-top: 20px
    }

    #digi-investor, #why-invest {
        padding: 0 30px
    }

        #digi-investor .container {
            padding: 0 3px !important
        }

    .benefits-section .header {
        padding: 15px 20px !important
    }

    .hero p {
        padding: 0px !important;
    }

    .row-gap {
        row-gap: 10px !important;
    }

    .footer-content {
        margin-bottom: 40px
    }

    .footer#footer ul li, .footer-first-section h4 {
        text-align: center !important
    }

    .sub-footer-icons {
        margin-top: 20px !important;
        display: flex;
        justify-content: center !important
    }

    .footer-text {
        text-align: center;
        padding-left: 0 !important
    }

    .footer-first-section ul li a {
        justify-content: center !important
    }
}

@media only screen and (min-width:481px) and (max-width:768px) {

    .hero p {
        padding: 0px !important;
    }

    .row-gap {
        row-gap: 10px !important;
    }

    .aboust-section-pt .custom-padd {
        padding-left: 2rem !important
    }

    .about-us-logo1-wrapper, .about-us-logo2-wrapper {
        padding: 1rem !important
    }

    .about-section-logo-imgs, .message-section .mt-5 {
        margin-top: 0 !important
    }

    .aboust-section-pt {
        padding-top: 2rem !important
    }

    .about-section-bg {
        height: max-content !important
    }

    #home-bg .video-container, .tender-table-container {
        width: 100% !important
    }

    #home-bg .content {
        left: 5% !important
    }

    .modal-message .custom-modal {
        width: 100% !important;
        max-width: 90% !important;
        height: 100% !important;
        margin: 1rem !important
    }

    .design-btn-row {
        padding-top: 4rem !important
    }

    #design .design-buttons .design-button, #first-section .design-buttons .design-button, .why-invest-card-title h2 {
        font-size: 15px !important
    }

    .custom-card-padd {
        padding: 10px !important
    }

    .card-body::after, .card-body::before, .projects-padding {
        padding: 0 !important
    }

    #projects .card-text {
        font-size: 17px !important
    }

    .background-content {
        left: 40% !important
    }

        .background-content a {
            font-size: 12px !important;
            padding: 0 4px !important
        }

    #design .progress-bar .progress-text {
        top: 38% !important
    }

    .team-head-content {
        margin-bottom: 40px !important
    }

    .main-banner-section .section-title {
        line-height: 70px !important
    }

    .navbar {
        margin-top: 1rem !important;
        justify-content: flex-end !important
    }

    .live-work-play-content {
        height: 73vh !important;
        animation: none !important
    }

    .live-work-play {
        height: 71vh !important;
        animation: none !important
    }

    .live-work-play-content .live-work-play-left .active, .live-work-play-content .live-work-play-left .item {
        font-size: 70px !important
    }

    .invest-video-container .video-heading {
        left: 34% !important
    }

    .invest-video-container .video-heading-below {
        left: 17% !important
    }

    #digi-investor h2, #digi-investor h2 span, #why-invest .head, #why-invest .head-2, .benefits-section h2, .benefits-section h2 span, .tender-content h1, .tender-content h1 span {
        font-size: 2rem !important
    }

    .why-invest-card-description p {
        font-size: 14px !important
    }

    #digi-investor .ebook-item span, .tender-btn-group button {
        font-size: 13px !important
    }

    #digi-investor .container h4 {
        font-size: 22px !important
    }

    .tender-video-container .video-heading {
        top: 52% !important;
        left: 25% !important
    }

    .tender-content {
        padding: 57px !important
    }

    .tender-btn-group button {
        width: fit-content !important
    }

    .contact-video-container .video-heading {
        top: 56% !important;
        left: 16% !important
    }

    .faq-video-container .video-heading {
        op: 55% !important;
        left: 50% !important
    }

    .faq-container {
        padding: 67px 27px !important
    }

    #faq .general h4, #faq .pre-sale h4 {
        font-size: 24px !important
    }

    .card .card-body img {
        max-height: 180px !important;
        min-height: 180px !important
    }

    #search-bar {
        width: 55% !important;
        margin-top: 5rem !important
    }

    #pills-tab {
        display: none !important
    }

    .category-ddl {
        margin: 1rem 0 !important;
        display: flex !important;
        justify-content: center !important
    }

    .navbar-mobile {
        background: 0 0 !important;
        margin-left: 0 !important
    }

        .navbar-mobile ul {
            width: 100%;
            left: 0 !important;
            right: 0 !important;
            margin-top: 3rem !important;
            background-color: #000 !important
        }

    #navbar ul li a {
        padding: 5px 15px !important
    }

    .navbar-mobile .mobile-nav-toggle {
        top: 57px !important
    }
}

@media only screen and (min-width:1025px) and (max-width:1500px) {
    .about-section-bg {
        height: max-content !important
    }

    .aboust-section-pt {
        padding-top: 2rem !important
    }

    #why-invest h2 .head, #why-invest h2 span {
        font-size: 50px !important
    }

    .why-invest-card-title h2 {
        font-size: 24px !important
    }

    .background-video .text-overlay {
        left: 49% !important
    }

    .contact-video-container .video-heading {
        top: 54% !important;
        left: 28% !important
    }

    .navbar {
        margin-left: 3rem !important
    }

    #updates img {
        height: 290px !important
    }
}

@media only screen and (min-width:1501px) {
    .about-section-bg {
        height: max-content !important
    }

    #particles-js {
        height: 100vh !important
    }

    .particles-js-career {
        height: 107vh !important
    }

    #updates img {
        height: 350px !important
    }

    .top-img .text-overlay {
        left: 50% !important
    }

    #navbar {
        margin-left: 5rem !important
    }

    .navbar a, .navbar a:focus{
        font-size: 12.5px !important;
    }
}

@media only screen and (width:375px) and (height:667px) and (-webkit-device-pixel-ratio:2) {
    .live-work-play-content {
        height: 74vh !important
    }

    .main-banner-section {
        height: 73vh !important
    }
}

@media only screen and (width:390px) and (height:844px) and (-webkit-device-pixel-ratio:3) {
    #particles-js .particles-js-canvas-el {
        height: 110vh !important
    }

    .about-section-bg {
        height: max-content !important
    }
}

@media only screen and (device-width :414px) and (device-height :896px) and (-webkit-device-pixel-ratio :2) {
    #particles-js .particles-js-canvas-el {
        height: 100vh !important
    }

    .about-section-bg {
        height: max-content !important
    }
}

@media only screen and (device-width:430px) and (device-height:932px) and (-webkit-device-pixel-ratio:3) {
    #particles-js .particles-js-canvas-el {
        height: 98vh !important
    }

    .about-section-bg {
        height: max-content !important
    }
}