@media (min-width:767px) and (max-width:991px) {
    .section-about .title-info {
        width: 65px
    }

    .section-about .info, .section-about .title-info, .section-about .title-links, .section-about p {
        font-size: 16px
    }

    .section-skills .professional-skills {
        margin-bottom: 70px
    }

    .section-skills .chart-percentage {
        top: 60px
    }

    .section-skills .chart canvas {
        width: 150px;
        height: 150px
    }

    .section-education h3 {
        padding: 15px 30px
    }

    .section-education .education-icon {
        width: 17px
    }

    .section-experience .period-experience {
        left: 15px;
        width: 156px
    }

    .section-portfolio h3 {
        font-size: 20px
    }

    .section-contact-us .info-icon {
        width: 39px;
        height: 39px;
        padding-top: 6px
    }

    .section-contact-us .info-text {
        padding: 8px 10px;
        font-size: 16px
    }

        .section-contact-us .info-text::before {
            margin-top: 4px;
            margin-left: -26px
        }
}

@media (min-width:469px) and (max-width:767px) {
    .scroll-top {
        width: 40px;
        height: 40px;
        right: 15px;
        bottom: 25px;
        line-height: 40px
    }

    .section-about .photo-profile img {
        width: 80%;
        margin: 0 auto
    }

    .section-about .download-resume {
        width: 80%;
        margin: 0 auto 25px
    }

    .section-about .available {
        margin-bottom: 50px
    }

    .section-about h2 {
        font-size: 35px
    }

    .section-skills .professional-skills {
        margin-bottom: 70px
    }

    .section-skills .chart-percentage {
        top: 60px
    }

    .section-skills .chart canvas {
        width: 150px;
        height: 150px
    }

    .section-skills .other {
        text-align: center
    }

    .section-experience .period-experience {
        left: 15px;
        width: 156px
    }

    .section-portfolio .item-overlay .icon-plus, .section-portfolio .item-overlay .icon-search {
        font-size: 25px
    }

    .section-portfolio h3 {
        margin-top: 30px
    }

    .single-blog .row > div:nth-child(2) .first-div {
        margin-top: 30px
    }

    .section-contact-us .social-links li {
        margin: 20px 15px
    }

    .section-contact-us .info-content {
        min-height: 0
    }
}

@media (max-width:470px) {
    .section h2 {
        font-size: 35px
    }

    .theme-option .open-theme {
        width: 38px;
        height: 35px;
        left: -38px;
        padding-top: 4px;
        font-size: 16px
    }

    .scroll-top {
        width: 40px;
        height: 40px;
        right: 15px;
        bottom: 25px;
        font-size: 15px;
        line-height: 40px
    }

    .section-about .available {
        margin-bottom: 40px
    }

    .section-about h2 {
        font-size: 35px
    }

    .section-skills .professional-skills {
        margin-bottom: 70px
    }

    .section-skills .other {
        text-align: center
    }

    .section-education h3 {
        padding: 15px 25px
    }

    .section-experience .all-experience, .section-experience .icon-experience {
        margin-left: 0
    }

    .section-experience .period-experience {
        position: static;
        padding-top: 5px;
        padding-bottom: 5px;
        margin-bottom: 12px;
        width: 100%
    }

    .section-experience .experience-content::before {
        left: 11px;
        margin-top: 8px
    }

    .section-portfolio .item-overlay {
        padding: 20px
    }

        .section-portfolio .item-overlay .icon-plus, .section-portfolio .item-overlay .icon-search {
            font-size: 15px
        }

    .single-blog .row > div:nth-child(2) .first-div {
        margin-top: 30px
    }

    .section-blog .blog-detail {
        padding: 15px
    }

    .section-contact-us .form-content, .section-contact-us .info-content {
        padding: 25px 15px 30px
    }

    .section-contact-us .info-content {
        min-height: 0
    }

    .section-contact-us .info-icon {
        width: 39px;
        height: 39px;
        padding-top: 7px
    }

    .section-contact-us .info-text {
        padding: 8px 10px
    }

        .section-contact-us .info-text::before {
            margin-top: 4px;
            margin-left: -26px
        }

    .section-contact-us .social-links li {
        margin: 20px
    }
}