@media only screen and (max-width: 1400px) {
    .BlogSlider {
        width: 905px;
    }

    .sliderContainer {
        height: 450px;
    }

    .SliderSection {
        height: 630px;
    }
}

@media only screen and (max-width: 1200px) {
    .SliderSection {
        height: 520px;
    }

    .AboutSection,.ProjectSection,.ServicesSection,.StatisticSection,.TeamSection,.ArticleSection,.ProjectMetaAndSlider,.MainText,
    .SingleBanner .section {
        padding-inline: 20px;
    }

    .TeamSection{
        width:100%;
    }

    .CustomerSection .section{
        padding-inline: 40px;
    }

    .ContactFormAndInfo{
        flex-wrap: wrap;
    }

    .ContactForm{
        width:100%;
        padding-bottom: 40px;
    }

    .ContactInfo{
        width:100%;
    }
}

@media only screen and (max-width: 992px) {
    .BlogSlider {
        display: none;
    }

    .AboutSection,.ProjectSection,.ServicesSection,.StatisticSection,.ArticleSection  {
        margin-block: 50px;
    }

    .CustomerSection{
        margin-block: 80px;
    }

    .TeamSection{
        margin-block: 0px;
    }

    .SliderDetails h2 {
        font-size: 36px;
    }

    .TextWithLine .Line {
        width: 30px;
    }
    .AboutSection{
        flex-direction: column;
    }

    .AboutSection .column1,.AboutSection .column2{
        width:100%;
    }

    .AboutSection .column1{
        align-items: center;
    }

    .AboutSection span, .AboutSection h1,.AboutSection p,
    .TeamSection span,.TeamSection h1,.TeamSection p{
        text-align: center;
    }

    .AboutSection h1{
        margin-bottom: 5px;
    }

    .TeamSection h1{
        margin-bottom: 0px;
    }

    .Project{
        width:48%;
        margin:10px 1%;
        padding-top:35%;
    }

    .ProjectsArea,.ServicesArea{
        flex-wrap: wrap;
        gap:0px;
        margin-top:20px;
    }

    .ServiceItem{
        width:48%;
        margin:10px 1%;
    }

    .filterNavigations{
        margin-block: 20px 10px;
    }

    .NumberItem{
        height: 200px;
    }
    .TeamSection{
        flex-direction: column;
    }
    .TeamSection .column1,.TeamSection .column2{
        width:100%;
    }

    .TeamSection .column2{
        height: 300px;
    }

    .TeamTitle{
        width:300px;
    }

    .CustomerSection{
        padding-block: 40px;
    }

    .ProjectPages .ProjectsArea .Project,.ArticlaPage .ProjectsArea .Project{
        width:31.33%;
    }

    .ProjectMetaAndSlider{
        flex-direction: column-reverse;
    }

    .ProjectSlider,.ProjectMeta{
        width:100%;
    }

    .MetaItems{
        flex-direction: row;
        flex-wrap: wrap;
        column-gap:40px;
        row-gap: 20px;
    }

    .MetaItem{
        gap:5px;
        width:calc(50% - 20px);
    }

    .ProjectSliderItem{
        height: unset !important;
        padding-top: 4.2%;
    }
}


@media only screen and (max-width: 700px) {
    .menu {
        display: none;
    }

    .Header {
        justify-content: center;
    }
    .SliderDetails{
        align-items: center;
    }
    .SliderDetails h2 {
        text-align: center;
    }
    .TextWithLine span{
        text-align: center;
    }
    .TextWithLine {
        justify-content: center;
    }

    .TextWithLine .Line {
        display: none;
    }

    .SliderDetails .ActionButton{
        margin-right: 0px;
    }

    .Numbers{
        flex-wrap: wrap;
        gap:0px;
    }

    .NumberItem{
        width:48%;
        margin:10px 1%;
    }

    .PageBanner{
        height: 300px;
    }

    .ProjectPages .ProjectsArea .Project,.ArticlaPage .ProjectsArea .Project{
        width:48%;
        padding-top:60%;
    }

    .FormMain{
        flex-wrap: wrap;
    }
    
    .FormMain .leftContact, .FormMain .rightContact{
        width:100%;
    }

}

@media only screen and (max-width: 480px) {
    .SliderDetails h2{
        font-size: 24px;
    }

    .TextWithLine span{
        font-size: 14px;
    }

    .SliderDetails .ActionButton{
        height: 40px;
        font-size: 16px;
    }

    .AboutSection h1{
        font-size: 29px;
    }

    .Project{
        width:100%;
        margin:10px 0px;
        padding-top:80%;
    }

    .filterNavigations{
        gap:5px;
    }

    .ServiceItem{
        width:100%;
        margin:10px 0px;
    }

    .filterNavigations span{
        font-size: 12px;
        height: 33px;
        border-radius: 5px;
    }

    .ProjectPages .ProjectsArea .Project,.ArticlaPage .ProjectsArea .Project{
        width:100%;
        padding-top:110%;
    }

    .MetaItems{
        row-gap: 20px;
    }

    .MetaItem{
        width:100%;
    }

    .AboutSection,.ProjectSection,.ServicesSection,.StatisticSection,.TeamSection,.ArticleSection,.ProjectMetaAndSlider,.MainText,
    .SingleBanner .section {
        padding-inline: 10px;
    }

    .Header .logo img {
        height: 50px;
      }

      .HeaderBack{
        height: 51px;
      }

      .SliderSection {
        height: 420px;
      }

      .mobmenur-container{
        top:11px !important;
      }
}