/* Extra Small Devices (portrait phones) */
@media only screen and (max-width: 320px) {
    .contact-area .contact-infos .contact-details li .right h4 {
        font-size: 14px;
    }

    .service-area .service-content-wrap .service-content-inner .service-item {
        padding: 15px 8px 15px 5px;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }

    .projects-area {
        padding-top: 28px;
    }

    .about-area {
        padding-top: 20px;
    }

    .contact-area {
        padding-top: 25px;
    }

    .project-item {
        width: 245px !important;
    }

    .aos-init {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .banner {
        width: 100%;
    }

    .elementor-widget-wrap {
        padding-right: 0px;
    }

    .info-box {
        width: 100%;
    }

    .d-grid {
        display: grid !important;
        justify-items: center;
    }

    .skill-item {
        text-align: center;
    }

    .contact-details > li {
        text-align: center;
    }

    .contact-infos > .social-links {
        display: flex !important;
        flex-direction: row;
        justify-content: center;
    }
}

/* Small Devices (landscape phones) */
@media only screen and (min-width: 321px) and (max-width: 480px) {
    .credential-area {
        padding-top: 15px;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }

    .container {
        padding: 0 10px;
    }

    .projects-area .project-item {
        width: 90%;
    }

    .aos-init {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .banner {
        width: 100%;
    }

    .elementor-widget-wrap {
        padding-right: 0px;
    }

    .info-box {
        width: 100%;
    }

    .d-grid {
        display: grid !important;
        justify-items: center;
    }

    .skill-item {
        text-align: center;
    }

    .contact-details > li {
        text-align: center;
    }

    .contact-infos > .social-links {
        display: flex !important;
        flex-direction: row;
        justify-content: center;
    }
}

/* Medium Devices (tablets - portrait) */
@media only screen and (min-width: 481px) and (max-width: 768px) {
    .credential-area > .container > .gx-row > .credential-sidebar-wrap {
        width: 350px;
        margin: auto;
    }

    .credential-area {
        padding-top: 12px;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }

    .d-grid {
        display: grid !important;
        justify-items: center;
    }
}

@media only screen and (max-width: 768px) {
    .contact-infos {
        width: 100% !important;
    }

    .container > .gx-row > .logo {
        margin-left: 20px;
    }

    .contact-area .contact-infos {
        width: 90% !important;
    }
}

@media only screen and (min-width: 586px) and (max-width: 768px) {
    .project-img > span {
        height: auto !important;
        width: auto !important;
    }

    .contact-area .contact-infos {
        width: 500px !important;
    }
}

@media only screen and (min-width: 600px) and (max-width: 768px) {
    .info-box > img {
        width: 43%;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }
}

/* Medium Devices (tablets - landscape) */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .margin-768 {
        margin-top: 32px;
    }
}
@media only screen and (min-width: 769px) and (max-width: 1024px) {
    .credential-area .credential-sidebar .shadow-box {
        padding: 12px 21px 12px 21px;
    }

    .credential-area .credential-sidebar .img-box {
        margin-bottom: 8px;
    }

    .credential-area .credential-sidebar p {
        margin-bottom: 3px;
    }

    .h2 {
        margin-bottom: 0rem;
    }

    .info-box.about-client-box {
        margin-bottom: 24px;
    }

    .info-box > img {
        width: 30%;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }

    .projects-area .project-item .project-info h1 {
        font-size: 19px;
    }

    .projects-area .project-item .project-info p {
        font-size: 12px;
    }
    .margin-768 {
        margin-top: 32px;
    }
}

@media only screen and (min-width: 921px) and (max-width: 1024px) {
    .infos h1 {
        font-size: 20px !important;
    }

    .info-box > img {
        width: 91%;
    }

    .infos1 {
        margin-top: 13px;
    }

    .about-area .about-me-box .infos .about-btn {
        bottom: 5px;
    }

    .info-box.about-contact-box {
        padding-top: 115px !important;
    }
    .about-me-box-921 {
        height: 327px;
        display: flex !important;
        align-items: center !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 920px) {
    .mt-26 {
        margin-top: 26px;
    }

    .info-box.about-contact-box {
        padding-top: 115px !important;
    }
}

@media only screen and (min-width: 975px) and (max-width: 1004px) {
    .about-area .about-me-box .infos {
        padding-bottom: 24px;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }
}

@media only screen and (min-width: 1005px) and (max-width: 1024px) {
    .about-area .about-me-box .infos h1 {
        font-size: 24px !important;
    }

    .about-area .about-me-box .img-box {
        margin-bottom: 32px;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }
}

@media only screen and (min-width: 1025px) and (max-width: 1091px) {
    .about-services-box-1 {
        height: 236px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .about-client-box1 {
        height: 243px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}

/* Large Devices (small desktops) */
@media only screen and (min-width: 1091px) and (max-width: 1154px) {
    .about-area .about-me-box .infos h4 {
        font-size: 11px;
    }

    .about-area .about-me-box .infos h1 {
        font-size: 25px;
    }

    .about-me-box {
        height: 337px !important;
        display: flex !important;
        align-items: center !important;
    }
}

@media only screen and (min-width: 1154px) and (max-width: 1366px) {
    .about-me-box {
        height: 337px !important;
        display: flex !important;
        align-items: center !important;
    }
}

@media only screen and (min-width: 1025px) and (max-width: 1366px) {
    .info-box.about-contact-box {
        padding-bottom: 29px;
        padding-top: 106px !important;
    }

    .spacing-1060 {
        margin-top: 26px;
    }

    .contact-area .contact-infos .contact-details li .right h4 {
        font-size: 14px;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }

    .info-box > div {
        margin-top: 27px;
    }

    .about-me-box {
        height: 328px;
        display: flex !important;
        align-items: center !important;
    }

    .info-box .inner-profile-icons {
        margin-bottom: 0px !important;
    }

    .info-box > div {
        margin-top: 7px;
    }
}

@media only screen and (min-width: 1025px) and (max-width: 1038px) {
    .about-area .about-me-box .infos h1 {
        font-size: 29px;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }
}

@media only screen and (min-width: 1100px) and (max-width: 1366px) {
    .info-box.about-contact-box {
        padding-bottom: 55px;
        padding-top: 90px !important;
    }

    .info-box .inner-profile-icons {
        margin-bottom: 21px;
    }

    .credential-area .skills-wrap .skill-item .name {
        width: 250px !important;
    }

    .section-heading {
        font-size: 70px;
    }

    .about-area .about-details .about-details-inner h1 {
        padding-bottom: 14px;
    }

    .project-img > span {
        height: auto !important;
        width: auto !important;
    }
}