/*
* ----------------------------------------------------------------------------------------
Author       : DuezaThemes
Author URL   : https://themeforest.net/user/duezathemes
Template Name: Mister Perfect - Minimal CV/Resume/vCard Template
Version      : 1.0                                          
* ----------------------------------------------------------------------------------------
*/


/* Medium Layout: 1367px. */

@media only screen and (min-width: 1200px) and (max-width: 1367px) {
    /*home1*/
    .hero-content .box {
        margin-top: 50%;
    }
    /*home2*/
    .home2-hero-area {
        padding: 358px 0 194px;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        float: left;
        width: 68%;
    }
    .home3-hero-area {
        background-size: 70%;
    }
    .home3-hero-area .hero-content .box {
        margin-top: 64%;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-size: 95%;
        background-position: right top
    }
    /*error*/
    .error-area {
        padding: 200px 0 155px;
    }
}




/* Medium Layout: 1280px. */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    /*home1*/
    .hero-area {
        background-position: 10% 0px;
    }
    /*sticky*/
    .sticky-menu ul li a {
        padding: 10px 10px;
    }
    /*home2*/
    .home2-hero-area {
        padding: 200px 0;
    }
    .home2-menu ul li a {
        padding: 32px 4px;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        width: 60%;
    }
    .home3-hero-area {
        background-position: bottom left;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-size: 94%;
        background-position: top right;
    }
    .blog-menu ul li a {
        padding: 16px 6px;
    }
    .single-blog1 .sb1-content {
        padding: 0 14px 0 16px;
    }
    .blog-hero .title {
        margin-left: 40px;
    }
    /*blog2-column*/
    .single-blog2 .sb1-content .title {
        font-size: 16px;
        line-height: 22px;
        margin: 0 0 8px;
    }
    .single-blog2 .sb1-content .text {
        margin: 0 0 0;
    }
    .single-blog2 .sb1-content .more {
        margin: 3px 0 0;
    }
    /*coming*/
    .coming .timer-area .cdown .time-count {
        font-size: 46px;
        line-height: 50px;
    }
    .coming .timer-area .cdown {
        margin: 0 18px;
    }
    /*not-found*/
    .not-found-area {
        background-position: 64% 0;
    }
    /*error*/
    .error .title {
        font-size: 70px;
        line-height: 70px;
    }
}




/* Tablet Layout: 768px. */

@media only screen and (min-width: 768px) and (max-width: 991px) {
    /*home1*/
    .sticky-menu ul li a {
        font-size: 14px;
        padding: 8px 4px;
    }
    .hero-area {
        background-position: 30% 0px;
    }
    header {
        background: #fff;
        float: left;
        padding: 40px 30px 30px 30px;
        width: 280px;
    }
    .hero-content .box .intro {
        font-size: 26PX;
        line-height: 30px;
    }
    .hero-content .box .name {
        font-size: 42px;
        line-height: 46px;
    }
    .as-intro .as-intro-name .name {
        font-size: 18px;
        line-height: 22px;
    }
    .as-intro .as-intro-info .as-intro-info-box .title {
        font-size: 12px;
        line-height: 28px;
    }
    .as-intro .as-intro-info .as-intro-info-box .text {
        font-size: 12px;
        line-height: 30px;
    }
    .as-content {
        padding: 30px 20px 20px 0;
    }
    .as-content .text {
        margin: 0 0 43px;
    }
    .as-content .download-contact {
        margin: 0 0 20px;
    }
    .as-intro .available .button {
        font-size: 14px;
        padding: 12px 6px;
    }
    .skills-box .skills-progress .progressbar-title {
        margin: 0 0 26px;
    }
    .portfolio-menu .button {
        padding: 11px 16px;
        margin: 0 8px;
    }
    .single-blog {
        margin: 0 0 30px;
    }
    /*home2*/
    .home2-hero .intro {
        font-size: 22px;
        line-height: 26px;
        width: 60%;
    }
    .home2-hero .name {
        font-size: 32px;
        line-height: 36px;
    }
    .home2-hero .desg {
        font-size: 16px;
        line-height: 20px;
    }
    .home2-hero-area {
        padding: 100px 0;
    }
    .home2-menu-area {
        top: 0;
    }
    .home2-menu {
        margin: 16px 15px auto;
    }
    .home2-menu.mean-container .mean-bar {
        background: #000;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        width: 66%;
    }
    .home3-hero-area {
        background-position: left bottom;
    }
    .home3-hero-area .hero-content .box {
        margin-top: 100%;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-position: top;
        background-size: 100%;
    }
    .single-blog1 .sb1-content {
        -webkit-box-shadow: none;
        box-shadow: none;
        padding: 20px 12px 12px 20px;
    }
    /*blog2-column*/
    .single-blog2 .sb1-img {
        width: 100%;
    }
    /*blog-detials*/
    .blog-details .post-type-share .share {
        float: none;
        margin: 30px 0 27px;
    }
    .blog-details .comments ul li ul {
        margin-left: 40px;
    }
    /*coming*/
    .coming .timer-area .cdown .time-count {
        font-size: 46px;
        line-height: 50px;
    }
    .coming .timer-area .cdown {
        margin: 0 18px;
    }
    /*not-found*/
    .not-found-area {
        background-position: 66% 0;
    }
    /*error*/
    .error-area {
        padding: 200px 0 155px;
    }
    .error .title {
        font-size: 70px;
        line-height: 70px;
    }
}




/* Mobile Layout: 320px. */

@media only screen and (max-width: 767px) {}




/* Wide Mobile Layout: 480px. */

@media only screen and (min-width: 481px) and (max-width: 767px) {

    header {
        float: none;
        padding: 40px 30px 40px 20px;
        width: auto;
    }
    .sticky-menu-area.navbar-fixed-top {
        display: none;
    }
    .hero-area {
        background-position: 57% 687px;
    }
    .hero-content .box {
        margin-top: 30%;
        padding-left: 30px;
        width: 100%;
        padding-bottom: 40px;
        padding-right: 20px;
    }
    .hero-content .box .intro {
        font-size: 18PX;
        line-height: 22px;
    }
    .hero-content .box .intro:before {
        width: 90%;
    }
    .hero-content .box .name {
        font-size: 26px;
        line-height: 30px;
        margin: 0 0 20px;
    }
    .as-intro .as-intro-name {
        margin: 0 0 54px 126px;
    }
    .as-intro .as-intro-name .name {
        font-size: 20px;
        line-height: 24px;
    }
    .as-intro .as-intro-info {
        padding: 0 16px 0 16px;
    }
    .as-intro .available .button {
        font-size: 12px;
        padding: 12px 6px;
    }
    .as-intro .as-intro-img>img {
        width: 100%;
    }
    .as-content {
        padding: 36px 10px 20px 30px;
    }
    .as-content .social li {
        margin-right: 0px;
        margin-bottom: 8px;
    }
    .section-title h2 {
        min-width: 200px;
    }
    .skills-box .skills-progress .progressbar-title {
        margin: 0 0 24px;
    }
    .skills-box {
        margin: 28px 0 20px;
    }
    .service-box .title span {
        font-size: 16px;
        min-width: 200px;
    }
    .testimonial-box {
        padding: 20px;
    }
    .testimonial-box:before {
        display: none;
    }
    .single-princing {
        margin: auto auto 30px;
        width: 420px;
    }
    .single-blog {
        margin: 0 0 30px;
    }
    .footer-bottom .social li {
        margin-right: 2px;
    }
    .portfolio-box {
        width: 370px;
        margin: auto;
    }
    /*home2*/
    .home2-hero .intro {
        font-size: 22px;
        line-height: 26px;
        width: 60%;
    }
    .home2-hero .name {
        font-size: 32px;
        line-height: 36px;
    }
    .home2-hero .desg {
        font-size: 16px;
        line-height: 20px;
    }
    .home2-hero-area {
        padding: 100px 0;
    }
    .home2-menu-area {
        top: 0;
    }
    .home2-menu {
        margin: 16px 15px auto;
    }
    .home2-menu.mean-container .mean-bar {
        background: #000;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        width: 100%;
        float: none;
    }
    .home3-hero-area .hero-content .box {
        width: 100%;
        padding-left: 40px;
        margin-top: 20%;
    }
    .home3-hero-area header {
        float: none;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-size: cover;
        background-position: -65px -2px;
    }
    .single-blog1 .sb1-img {
        width: 100%;
    }
    .single-blog1 .sb1-content {
        padding: 30px 12px;
    }
    /*blog2-column*/
    .single-blog2 .sb1-img {
        width: 100%;
    }
    .single-blog2 .sb1-img img {
        width: 100%;
    }
    /*blog-column-sidebar*/
    .sidebar {
        margin: 60px auto auto;
        width: 360px;
    }
    /*blog-details*/
    .blog-details .title {
        font-size: 18px;
        line-height: 24px;
    }
    .blog-details .post-type-share .post-type {
        margin: 0 0 30px;
    }
    .blog-details .about-author .right {
        padding: 10px 20px 0px;
    }
    .comment-box .img {
        float: none;
    }
    .comment-box .content {
        display: block;
        padding: 14px 16px 30px 14px;
    }
    .blog-details .comments ul li ul {
        margin-left: 30px;
    }
    /*contact*/
    .contact-form-area {
        padding: 30px 30px 1px 30px;
    }
    .contact-form-area .cfa-input-box {
        width: 100%;
    }
    .contact-area .foot-info .list {
        margin: 0 0 30px;
    }
    /*coming*/
    .coming .title {
        font-size: 24px;
        line-height: 28px;
    }
    .coming .text {
        font-size: 20px;
        line-height: 24px;
    }
    .coming .timer-area .cdown .time-count {
        font-size: 36px;
        line-height: 40px;
    }
    .coming .timer-area .cdown {
        margin: 0 0 30px;
        min-width: 94px;
    }
    .coming .subscribe-area .input-box input[type="text"] {
        min-width: 150px;
    }
    .coming .subscribe-area .input-box input[type="submit"] {
        min-width: 130px;
    }
    /*not-found*/
    .not-found .input-box input[type="text"] {
        width: 100%;
    }
    .not-found .title {
        font-size: 34px;
        line-height: 38px;
    }
    /*error*/
    .error-area {
        padding: 100px 0 155px;
    }
    .error .title {
        font-size: 50px;
        line-height: 50px;
    }
}




/* Small Mobile Layout: 480px. */

@media only screen and (min-width: 240px) and (max-width: 480px) {
    /*home1*/
    header {
        float: none;
        padding: 40px 30px 40px 20px;
        width: auto;
    }
    .sticky-menu-area.navbar-fixed-top {
        display: none;
    }
    .hero-area {
        background-position: 57% 687px;
    }
    .hero-content .box {
        margin-top: 30%;
        padding-left: 30px;
        width: 100%;
        padding-bottom: 40px;
        padding-right: 20px;
    }
    .hero-content .box .intro {
        font-size: 18PX;
        line-height: 22px;
    }
    .hero-content .box .intro:before {
        width: 90%;
    }
    .hero-content .box .name {
        font-size: 26px;
        line-height: 30px;
        margin: 0 0 20px;
    }
    .as-intro .as-intro-name {
        margin: 0 0 54px 126px;
    }
    .as-intro .as-intro-name .name {
        font-size: 20px;
        line-height: 24px;
    }
    .as-intro .as-intro-info {
        padding: 0 16px 0 16px;
    }
    .as-intro .as-intro-info .as-intro-info-box .text {
        font-size: 12px;
        line-height: 30px;
    }
    .as-intro .as-intro-info .as-intro-info-box .title {
        font-size: 12px;
        line-height: 32px;
    }
    .as-intro .available .button {
        font-size: 12px;
        padding: 12px 6px;
    }
    .as-content {
        padding: 36px 10px 20px 30px;
    }
    .as-content .social li {
        margin-right: 0px;
        margin-bottom: 8px;
    }
    .section-title h2 {
        min-width: 200px;
    }
    .skills-box .skills-progress .progressbar-title {
        margin: 0 0 24px;
    }
    .skills-box {
        margin: 28px 0 20px;
    }
    .service-box .title span {
        font-size: 16px;
        min-width: 200px;
    }
    .portfolio-menu .button {
        font-size: 14px;
        padding: 10px 14px;
        margin: 0 5px;
    }
    .testimonial-box {
        padding: 20px;
    }
    .testimonial-box:before {
        display: none;
    }
    .single-princing {
        margin: 0 0 30px;
    }
    .single-blog {
        margin: 0 0 30px;
    }
    .footer-bottom .social li {
        margin-right: 2px;
    }
    .single-blog .sb-left {
        float: none;
        text-align: center;
        width: 100%;
    }
    /*home2*/
    .home2-hero .intro {
        font-size: 22px;
        line-height: 26px;
    }
    .home2-hero .name {
        font-size: 32px;
        line-height: 36px;
    }
    .home2-hero .desg {
        font-size: 16px;
        line-height: 20px;
    }
    .home2-hero-area {
        padding: 100px 0;
    }
    .home2-menu-area {
        top: 0;
    }
    .home2-menu {
        margin: 16px 15px auto;
    }
    .home2-menu.mean-container .mean-bar {
        background: #000;
    }
    /*home3*/
    .home3-hero-area .hero-content {
        width: 100%;
    }
    .home3-hero-area .hero-content .box {
        width: 100%;
        padding-left: 40px;
        margin-top: 20%;
    }
    /*blog1-column*/
    .blog-hero-area {
        background-size: cover;
    }
    .single-blog1 .sb1-img {
        width: 100%;
    }
    .single-blog1 .sb1-content {
        padding: 30px 12px;
    }
    /*blog2-column*/
    .single-blog2 .sb1-img {
        width: 100%;
    }
    /*blog-column-sidebar*/
    .sidebar {
        margin: 60px auto auto;
    }
    /*blog-details*/
    .blog-details .title {
        font-size: 18px;
        line-height: 24px;
    }
    .blog-details .post-type-share .post-type {
        margin: 0 0 30px;
    }
    .blog-details .about-author .left {
        width: 100%;
    }
    .blog-details .about-author .right {
        padding: 31px 26px 20px;
    }
    .comment-box .img {
        float: none;
    }
    .comment-box .content {
        display: block;
        padding: 14px 16px 30px 14px;
    }
    .blog-details .comments ul li ul {
        margin-left: 30px;
    }
    /*contact*/
    .contact-form-area {
        padding: 30px 30px 1px 30px;
    }
    .contact-form-area .cfa-input-box {
        width: 100%;
    }
    .contact-area .foot-info .list {
        margin: 0 0 30px;
    }
    /*coming*/
    .coming .title {
        font-size: 24px;
        line-height: 28px;
    }
    .coming .text {
        font-size: 20px;
        line-height: 24px;
    }
    .coming .timer-area .cdown .time-count {
        font-size: 36px;
        line-height: 40px;
    }
    .coming .timer-area .cdown {
        margin: 0 0 30px;
        min-width: 94px;
        width: 32%;
    }
    .coming .subscribe-area .input-box input[type="text"] {
        border-radius: 25px;
        min-width: 150px;
    }
    .coming .subscribe-area .input-box input[type="submit"] {
        border-radius: 25px;
        margin-left: 0;
        top: 14px;
    }
    /*not-found*/
    .not-found .input-box input[type="text"] {
        width: 100%;
    }
    .not-found .title {
        font-size: 34px;
        line-height: 38px;
    }
    /*error*/
    .error-area {
        padding: 100px 0 155px;
    }
    .error .title {
        font-size: 50px;
        line-height: 50px;
    }
}