@charset "utf-8";
/* CSS Document */

@-ms-viewport {
    width: device-width;
}

@viewport {
    width: device-width;
}

@media (max-width: 4000px) {}

@media (max-width: 1500px) {}

@media (max-width: 1200px) {

    .slider-text h1 {
        font-size: 68px;
        line-height: 90px;
    }

    .title h2 {
        font-size: 64px;
        font-weight: 800;
    }

    .title p {
        font-size: 20px;
        color: #656565;
        font-weight: 500;
    }

    .project-boy img {
        position: absolute;
        width: 70%;
        top: -50%;
        left: 16%;
    }

    .title h3 {
        font-size: 54px;
    }

    #main-work ul li.nav-item {
        margin-right: 27px;
    }

    .single-service-content h3 {
        font-size: 38px;
    }

    .single-service-content p {
        font-size: 16px;
        line-height: 28px;
    }

    .single-service-content button {
        font-size: 14px;
    }

}

@media (min-width: 991px) {}

@media (max-width: 991px) {

    header .navbar-light .nav-item:nth-last-child(1) {
        border-bottom: 0;
        padding-left: 0;
    }

    header .navbar-light .nav-item.active .nav-link:after {
        display: none;
    }

    header .navbar-light .nav-item {
        border-bottom: 1px solid #eee;
    }

    header .collapse.navbar-collapse {
        display: block !important;
    }


    header .navbar-nav .nav-link {
        font-weight: 700;
        font-size: 15px;
        padding: 6px 12px;
        margin: 0 0;
        position: relative;
    }

    .request-btn {
        padding: 8px 5px;
        font-size: 14px;
        width: 100%;
        border-radius: 0;
    }

    .mobileNav .navbar-collapse {
        transform: translate(0, 0);
        transition: all 0.4s ease-in-out 0s;
        z-index: 101;
    }

    .header-services .card-body {
        border: 0;
    }

    .nav-item.header-services .collapse.show {
        border-bottom: 1px solid #eee;
    }

    header .navbar-collapse {
        position: fixed;
        top: 0;
        height: 100%;
        background: #fff;
        left: 0;
        width: 250px;
        transform: translate(-120%, 0);
        transition: all 0.4s ease-in-out 0s;
        overflow: auto;
    }

    body.mobileNav {
        overflow: hidden;
    }

    body.mobileNav .backdrop {
        display: block;
        background-color: #000;
        opacity: .7;
        transition: all 0.4s ease-in-out 0s;
        pointer-events: visible;
    }

    .backdrop {
        content: '';
        position: fixed;
        background: #0f326b;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 100;
        opacity: 0;
        display: none;
    }


    .slider-text h1 {
        font-size: 60px;
        line-height: 80px;
    }


    .main-slider:before {
        height: 100%;
    }

    .skating img {
        position: absolute;
        width: 60%;
        top: -21%;
        left: 11%;
    }

    .work-text {
        padding: 28px;
    }

    .work-text h4 {
        font-size: 26px;
        margin-bottom: 15px;
        font-weight: bold;
    }

    .work-text p {
        font-size: 15px;
        font-weight: 500;
        line-height: 26px;
        margin-bottom: 24px;
    }

    .btn-cls.btn-large {
        background: #7415ff;
        border-radius: 50px;
        font-weight: 500;
        color: #fff;
        font-size: 20px;
        padding: 8px 40px;
    }

    .title h2 {
        font-size: 60px;
        font-weight: 800;
    }

    .title h3 {
        font-size: 36px;
    }

    .title p {
        font-size: 18px;
    }

    .project-boy img {
        position: absolute;
        width: 100%;
        top: -48%;
        left: 0%;
    }

    .title h4 {
        font-size: 32px;
        font-weight: 800;
    }

    .social-media ul li {
        margin-right: 24px;
    }

    .social-media ul li a {
        background: #e2e2e2;
        height: 42px;
        width: 42px;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .social-media ul li a img {
        width: 20px;
    }

    .mail-address a {
        color: #1a1a1a;
        font-weight: 800;
        font-size: 16px;
    }

    footer {
        padding: 62px 0;
        position: relative;
    }

    .work-page .nav-pills .nav-link {
        padding: 7px 18px;
        font-size: 14px;
        min-width: 120px;
    }

    #main-work ul li.nav-item {
        margin-right: 14px;
    }

    .main-work-list ul li .work-text {
        padding: 0 0 28px 0;
    }

    .single-service-images {
        margin-bottom: 24px;
    }

    .team-text {
        padding: 0 0;
    }

    .team-text h2 {
        font-size: 30px;
    }

    .team-text h5 {
        font-weight: 500;
        line-height: 2;
        font-size: 16px;
    }

    .team-text p {
        font-size: 14px;
    }

    #about-images .item {
        position: relative;
        left: 0;
    }
    
         .work-content {
    margin-top:60px;
    }
    
    .work-section {
        padding:30px 0;
    }
    
    .work-page {
        padding:30px 0;
    }
    
   
}

@media (max-width: 767px) {
    .mini-header {
        margin-bottom: 50px;
    }

    .main-header {
        padding: 24px 0;
    }

    .main-slider:before {
        top: 8%;
    }

    .main-work .title {
        padding: 0;
    }


    .work-text h4 {
        font-size: 32px;
        margin-bottom: 15px;
        font-weight: bold;
    }

    .pb-5 {
        padding-bottom: 0;

    }

    .pt-5 {
        padding-top: 0;
    }

    .main-work {
        padding: 20px 0;
    }

    .single-item {
        margin: 20px 22px;
        padding: 0 10px 10px;

    }

    .work-list ul li:nth-child(2) .single-work,
    .work-list ul li:nth-child(4) .single-work,
    .work-list ul li:nth-child(6) .single-work,
    .work-list ul li:nth-child(8) .single-work,
    .work-list ul li:nth-child(10) .single-work {
        margin-top: 0px;
    }



    .work-img img {
        width: 100%;
        height: 350px;
        object-fit: cover;
    }

    footer:before {
        position: absolute;
        right: 0;
        width: 100%;
        top: 50%;
        border-radius: 0;
        height: 50%;
        background: #f9f6ff;
        content: '';
        z-index: -1;
    }

    footer:after {
        position: absolute;
        left: 0;
        width: 100%;
        top: 0;
        border-radius: 50px 50px 0 0;
        height: 50%;
        background: #fffcf6;
        content: '';
        z-index: -1;
    }

    .col-footer-contact {
        margin-bottom: 80px;
    }

    .col-footer-contact,
    .col-footer-follow {
        text-align: center;
    }

    footer {
        padding: 50px 0;
        position: relative;
    }

    .social-media {
        text-align: center;
        display: flex;
    }

    .social-media ul {
        margin: auto;
    }

    .main-project {
        padding: 60px 0;
    }

    .our-connect {
        overflow: hidden;
        padding-top: 50px;
    }

    .work-page .nav-pills li .nav-link.active {
        display: block;
        transition: all 0.4s ease-in-out 0s;
    }

    .work-page .nav-pills li .nav-link {
        display: none;
        transition: all 0.4s ease-in-out 0s;
    }

    .work-page .nav-pills.active li:nth-last-child(1) .nav-link {
        transition: all 0.4s ease-in-out 0s;
        border-bottom: 0;
    }

    .work-page .nav-pills.active li .nav-link {
        display: block;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid #707070;
        transition: all 0.4s ease-in-out 0s;
    }

    .work-page .nav-pills .nav-link.active,
    .work-page .nav-pills .show>.nav-link {
        border-radius: 0;
        background-color: #7415ff;
        transition: all 0.4s ease-in-out 0s;
    }

    #main-work .slider {
        display: none !important;
    }

    #main-work ul li.nav-item {
        margin: 0;
    }

    .work-page .nav-pills {
        margin: 70px 0;
        display: inherit;
        border-radius: 20px;
        border: 1px solid #707070;
        overflow: hidden;
        transition: all 0.4s ease-in-out 0s;
    }

    .coun-list,
    .coun-list p {
        text-align: center;
    }

    .coun-list {
        margin-bottom: 24px;
    }

    .header-info {
        margin-top: 32px;
    }
    
       .work-content {
    margin-top:50px;
    }
    
    
 .about-section {
        padding-bottom:20px;
    }
    
    .our-services {
        padding-bottom:0;
    }
    
    .about-crousel {
         padding-top:20px;
    }
    
    .our-story {
        padding-top:50px;
    }
    
       .mission-section {
    padding: 60px 0 100px 0;
}

.counters-section {
    margin:30px 0;
}

.mission-image img {
    width: 80%;
    margin-left: 10%;
}

.team-text p {
    font-size: 16px;
}


.main-services .service-icon img {
    width:80%;
    margin-left:10%;
}

    
    
}

@media (max-width: 575px) {

    .main-header {
        transition: all 0.6s ease-in-out 0s;
    }

    .header-active .main-header {
        transition: all 0.6s ease-in-out 0s;
    }


    .am-01 {
        transition: all 0.6s ease-in-out 0s;
    }

    .header-active .am-01 {
        transition: all 0.4s ease-in-out 0s;
    }

    .am-02 {
        transition: all 0.5s ease-in-out 0s;
    }

    .header-active .am-02 {
        transition: all 0.4s ease-in-out 0s;
    }

    .am-03 {
        transition: all 0.5s ease-in-out 0s;
    }

    .header-active .am-03 {
        transition: all 0.5s ease-in-out 0s;
    }

    .am-04 {
        transition: all 0.4s ease-in-out 0s;
    }

    .header-active .am-04 {
        transition: all 0.5s ease-in-out 0s;
    }

    .am-05 {
        transition: all 0.3s ease-in-out 0s;
    }

    .header-active .am-05 {
        transition: all 0.6s ease-in-out 0s;
    }

    .am-06 {
        transition: all 0.3s ease-in-out 0s;
    }

    .header-active .am-06 {
        transition: all 0.6s ease-in-out 0s;
    }

    .am-07 {
        transition: all 0.3s ease-in-out 0s;
    }

    .header-active .am-07 {
        transition: all 0.7s ease-in-out 0s;
    }

    .am-08 {
        transition: all 0.3s ease-in-out 0s;
    }

    .header-active .am-08 {
        transition: all 0.7s ease-in-out 0s;
    }


    .btn-cls.btn-large {
        font-size: 18px;
        padding: 8px 32px;
    }

    .single-service-content h3 {
        font-size: 32px;
    }

    .single-service-content p {
        font-size: 16px;
        line-height: 24px;
        font-weight:400;
    }
    
    .work-text p {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
   
}

    .single-service-content button {
        font-size: 14px;
        font-weight:500;
        background: #eee;
        color: #1a1a1a;
    }

    .process-single h6 {
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 24px;
    }

    .process-single p {
        color: #656565;
        font-size: 16px;
        line-height: 30px;
    }

    .main-header-menus ul li a.nav-link {
        font-size: 38px;
        font-weight: 700;
        display: inline-block;
        color: #000;
        margin: 18px 0 0;
        line-height: 48px;
        padding: 0;
        position: relative;
    }
    
    
    .header-head {
        margin-bottom:4px;
    }

    .work-list ul li .single-work {
        height: 100%;
    }


    .social-media {
        margin: 18px 0;
    }

    .header-info ul li a.info {
        color: #797979;
        font-size: 20px;
    }

    .bar-logo {
        margin-left: 0;
    }

    
      .work-section {
       padding-bottom:30px;
    }
    
    
    .service-section {
       padding-bottom:30px;
    }

    .our-services {
       padding:30px 0;
    }
    
    .main-service-list li {
         margin: 40px 0;
    
    }


.mission-image img {
    width: 60%;
    margin-left: 20%;
}

.main-services .service-icon img {
    width:60%;
    margin-left:20%;
}

  .single-item h5 {
        font-size:24px;
    }

}

@media (max-width: 480px) {

    
    .slider-text h1 {
        font-size: 50px;
        line-height: 66px;
    }

    .title p {
        font-size: 16px;
    }

    .title h2 {
        font-size: 50px;
        font-weight: 800;
    }

    .title h3 {
        font-size: 28px;
    }

    .form-grp h6 {
        font-size: 20px;
        font-weight: normal;
        line-height: 2;
        letter-spacing: -0.14px;
        color: #c8c8c8;
    }

    .myform label {
        color: #1a1a1a;
        font-size: 14px;
        border: 1px solid rgb(112 112 112 / 50%);
        font-weight: 500;
        padding: 8px 16px;
    }

    .form-grp .project-input {
        width: 100%;
        font-size: 16px;
        border: none;
        border-bottom: 1px solid #c8c8c8;
        color: #1a1a1a;
        line-height: 2.2;
    }

    .btn-cls.btn-large {
        font-size: 16px;
        padding: 8px 28px;
    }

    .social-media li a {
        background: #ededed;
        height: 42px;
        width: 42px;
    }

    .social-media li a img {
        height: 18px;
    }


    .work-list ul li {
        width: 100%;
        margin-top: 30px;
    }

    
    .work-page {
        padding:20px 0;
    }
  
}


@media (max-width: 360px) {

    .main-header-menus ul li a.nav-link {
        font-size: 32px;
        font-weight: 700;
        display: inline-block;
        color: #000;
        margin: 10px 0 0;
    }


    .single-service-images {
        transition: transform 0.6s;
    }

    .single-service-images:hover {
        transform: scale(0.9);
        -webkit-transform: scale(0.9);
        -moz-transform: scale(0.9);
        -ms-transform: scale(0.9);
        -o-transform: scale(0.9);
    }

     .work-content {
    margin-top:40px;
    }
    
}
