/* media query screen size */
/* extra small */
@media (max-width: 575.98px) {

    /* banner section */
    .banner {
        width: 100%;
        height: 472px;
    }

    .banner .title {
        width: 275px;
        top: 20%;
        left: 8%;
    }

    .banner .title h1 {
        font-size: 36px;
    }

    .banner .banner_slider {
        width: 100%;
    }

    .banner .indicators {
        width: 100%;
    }

    /* banner section */
    .common_title {
    & h2 {
        margin-bottom: 0;
        font-size: 25px;
    }
}
.common_section {
    padding: 50px 0 60px 0;
}
.common_btn {
    padding: 9px 15px;
    font-size: 16px;
}
/* Repotation section  */
.repotation .single_repo {
    margin-top: 25px;
}
/* Repotation section  */

/* About section */
    .about .about_part .about_text {
        width: 100%;
        height: 315px;
        padding: 8px 10px 6px 10px;
        position: absolute;
        top: 140%;
        right: 0;
    }
    .about_text h4 {
    font-size: 25px;
}
.about_text p {
    margin: 10px 0 12px 0;
}
.about_text .action_btn button {
    padding: 10px 15px;
    font-size: 16px;
}
/* About section */

/* Service section */
.service {
    margin-top: 120px;
}
.service .single_service {
    width: 230px;
    height: 160px;
    padding: 25px 38px;
    margin-top: 25px;
}
.experiment {
    width: 100%;
}
.experiment h2 {
    font-size: 25px;
}
.experiment p {
    width: 100%;
    margin: 5px 0;
    font-size: 16px;
}
/* Service section */

/* Consultation section */
.consultation {
    & h2 {
        font-size: 25px;
    }
}
.consultation .msg p {
    font-size: 16px;
}
.consultation .c_btn {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.consultation .c_btn button {
    padding: 9px 15px;
}
/* Consultation section */
/* Project section */
.project .p_title h3 {
    margin-bottom: 20px;
    font-size: 25px;
}
.project .p_title ul {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.project .p_title ul li {
    margin: 6px 0;
    padding-left: 10px;
    border-inline: 5px solid transparent;
    font-size: 16px;
}
.project .s_project .item {
    width: 100%;
    height: 300px;
    position: relative;
    animation: fadeIn 1s linear;
}
/* Project section */

/* Contact section */
.contact .c_h2_p p {
    padding: 10px 0px 0 0px;
}
/* Contact section */
/* Footer section */
.footer_section .leftSide .logo {
    /* margin: 0 0 20px; */
}
.footer_section p {
    font-size: 16px;
    margin-bottom: 5px;
}
/* Footer section */
}

/* small */
@media (min-width: 576px) and (max-width: 767.98px) {
    /* banner section */
    .banner {
        width: 100%;
        height: 472px;
    }

    .banner .title {
        width: 100%;
        padding: 0 30px;
        top: 30%;
        left: 0;
    }

    .banner .title h1 {
        font-size: 50px;
    }

    .banner .banner_slider {
        width: 100%;
    }

    .banner .indicators {
        width: 100%;
    }

    /* banner section */
    .common_title {
    & h2 {
        margin-bottom: 0;
        font-size: 30px;
    }
}
.common_section {
    padding: 60px 0 70px 0;
}
.common_btn {
    padding: 9px 15px;
    font-size: 16px;
}
/* Repotation section  */
.repotation .single_repo {
    margin-top: 25px;
}
/* Repotation section  */

/* About section */
    .about .about_part .about_text {
        width: 100%;
        height: 315px;
        padding: 8px 10px 6px 10px;
        position: absolute;
        top: 140%;
        right: 0;
    }
    .about_text h4 {
    font-size: 25px;
}
.about_text p {
    margin: 10px 0 12px 0;
}
.about_text .action_btn button {
    padding: 10px 15px;
    font-size: 16px;
}
/* About section */

/* Service section */
.service {
    margin-top: 120px;
}
.service .single_service {
    width: 290px;
    height: 180px;
    padding: 25px 38px;
    margin-top: 25px;
}
.service .single_service h5 {
    font-size: 22px;
}
.experiment {
    width: 100%;
}
.experiment h2 {
    font-size: 30px;
}
.experiment p {
    width: 100%;
    margin: 15px 0;
    font-size: 18px;
}
/* Service section */

/* Consultation section */
.consultation {
    & h2 {
        font-size: 30px;
    }
}
.consultation .msg p {
    font-size: 18px;
}
.consultation .c_btn {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.consultation .c_btn button {
    padding: 9px 15px;
}
/* Consultation section */
/* Project section */
.project .p_title h3 {
    margin-bottom: 20px;
    font-size: 30px;
}
.project .p_title ul {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.project .p_title ul li {
    margin: 6px 0;
    padding-left: 10px;
    border-inline: 5px solid transparent;
    font-size: 20px;
}
.project .s_project .item {
    width: 100%;
    height: 300px;
    position: relative;
    animation: fadeIn 1s linear;
}
/* Project section */

/* Contact section */
.contact .c_h2_p p {
    padding: 10px 0px 0 0px;
}
/* Contact section */
/* Footer section */
.footer_section p {
    font-size: 16px;
    margin-bottom: 5px;
}
/* Footer section */
}

/* medium */
@media (min-width: 768px) and (max-width: 991.98px) {
    /* Banner section */
    .banner .title {
    top: 35%;
}
    /* Banner section */

/* About section */
    .about .about_part .about_text {
        width: 350px;
        height: 360px;
        padding: 25px 15px 15px 15px;
        position: absolute;
        top: 50%;
        right: -53%;
        transform: translateY(-50%);
        background-color: var(--boxes-color);
        color: #ffffff;
    }
.about_text p {
    margin: 20px 0 30px 0;
}
/* About section */
/* Service section */
.service .single_service {
    width: 277px;
    height: 200px;
    padding: 40px 50px;
}
/* Service section */
/* Repotation section */
.achieveMent {
    width: 100%;
}
.achienve h3 {
    font-size: 50px;
}
.achieveMent .achienve:nth-child(1) {
    right: 20px;
}
.achieveMent .achienve:nth-child(3) {
    right: 20px;
}
.achieveMent .achienve:nth-child(2) {
    top: 0px;
    left: 20px;
}
.achieveMent .achienve:nth-child(4) {
    top: 270px;
    left: 20px;
}
.achieveMent .achienve:nth-child(1) .icon {
    width: 75px;
    height: 75px;
    top: -40px;
    right: -30px;
}
.achieveMent .achienve:nth-child(3) .icon {
    width: 75px;
    height: 75px;
    top: -40px;
    right: -30px;
}
.achieveMent .achienve:nth-child(2) .icon {
    width: 75px;
    height: 75px;
    top: -40px;
    left: -30px;
}
.achieveMent .achienve:nth-child(4) .icon {
    width: 75px;
    height: 75px;
    top: -40px;
    left: -30px;
}
.experiment h2 {
    font-size: 36px;
}
.experiment p {
    margin: 25px 0;
}
/* Repotation section */
/* Contact section */
.contact .c_h2_p p {
    padding: 20px 50px 0 50px;
}
/* Contact section */
/* Footer last */
.footer_last .copyRight {
    text-align: center;
}
/* Footer last */
}

/* large */
@media (min-width: 992px) and (max-width: 1199.98px) {
    /* Banner */
    .banner .title {
    top: 40%;
}
    /* Banner */
/* Achievement */
.achienve h3 {
    font-size: 60px;
}
.achieveMent .achienve:nth-child(1) .icon {
    width: 75px;
    height: 75px;
    top: -40px;
    right: -20px;
}
.achieveMent .achienve:nth-child(3) .icon {
    width: 75px;
    height: 75px;
    top: -40px;
    right: -20px;
}
.achieveMent .achienve:nth-child(2) .icon {
    width: 75px;
    height: 75px;
    top: -40px;
    left: -20px;
}
.achieveMent .achienve:nth-child(4) .icon {
    width: 75px;
    height: 75px;
    top: -40px;
    left: -20px;
}
.experiment h2 {
    font-size: 50px;
}
/* Achievement */
/* Contact */
.contact .c_h2_p p {
    padding: 20px 190px 0 190px;
}
/* Contact */
}

/* extra large */
@media (min-width: 1200px) and (max-width: 1399.98px) {}

/* extra extra large */
@media (min-width: 1400px) {}