/*===========================================
Tablet Layout: 768px.
============================================*/

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .main-menu .navbar-brand {
        padding: 10px 0px;
        width: 130px;
    }
    .main-menu .navbar-default .navbar-nav > li > a {
        padding: 22px 10px;
        font-size: 14px;
    }
    .main-menu .navbar-brand {
        padding: 10px 0;
        width: 165px;
    }
    .main-menu .navbar-brand img {
        height: 60px;
    }
    .is-sticky .main-menu .navbar-brand img {
        height: 50px;
    }
    .is-sticky .header-area .navbar-brand {
        padding: 0px 15px 7px;
    }
    .is-sticky .header-area .navbar-default .navbar-nav > li > a {
        padding: 15px 10px;
    }
    .portfolio-area .modal-dialog {
        margin: 150px auto 30px;
        width: 90%;
    }
    .portfolio-area .grid-item .modal-body img {
        min-height: 410px;
    }
    .about-social > ul > li {
        padding-right: 10px;
    }
    .about-area .section-title::after {
        left: 20%;
        top: 55px;
    }
    .single-certificate {
        padding: 20px;
    }
    .single-certificate h4 {
        font-size: 20px;
        letter-spacing: 0;
    }
    .right .single-certificate::after {
        left: -27px;
    }
    .certificate-collum.right::after {
        left: -6.2px;
    }
    .single-certificate::after {
        right: -27px;
    }
    .progress-circular {
        padding-left: 10px;
    }
    .progress-circular > span {
        font-size: 18px;
    }
    .single-desc > p {
        font-size: 15px;
    }
    .portfolio-menu ul li a {
        padding: 10px 10px;
    }
    .portfolio-menu ul li {
        padding-right: 10px;
    }
    .single-fun {
        padding: 40px 20px;
    }
    .single-fun > p {
        letter-spacing: 1px;
    }
    .qoute-thumb {
        width: 30%;
    }
    .qoute-details {
        width: 62%;
    }
    .blog-details {
        padding: 10px;
    }
    .review-area .section-title::after {
        left: 12%;
    }
    .review-area .owl-theme .owl-controls {
        bottom: -25px;
        left: 47%;
    }
    .qoute-details > p {
        font-size: 16px;
        line-height: 32px;
    }
    .about-intro{
        padding-left: 70px;
    }
    .persional-info .info{
        margin-left: 120px;
    }
}
/*=======================================
Mobile Layout: 320px.
=========================================*/

@media only screen and (max-width: 767px) {
    .element {
        font-size: 50px;
        margin-bottom: 50px
    }
    .about-social > ul > li {
        padding-right: 10px;
    }
    .about-thumb {
        width: 95%;
    }
    .about-intro {
        border: none;
        padding-left: 0px;
        padding-top: 40px;
    }
    .about-intro::after,
    .about-intro::before,
    .certificate-collum.right::after,
    .right .single-certificate::after,
    .single-certificate::after,
    .qoute-thumb::after {
        display: none;
    }
    .persional-info .info {
        margin-left: 130px;
    }
    .section-title {
        font-size: 30px;
    }
    .about-area .section-title::after {
        left: 18%;
    }
    .single-certificate {
        padding: 20px;
        margin-left: 0;
        max-width: 100%;
    }
    .single-certificate h4 {
        font-size: 18px;
        letter-spacing: 0;
    }
    .single-certificate > p {
        font-size: 16px;
    }
    .experience {
        margin-top: 60px;
    }
    .right .single-certificate {
        margin-left: 0;
    }
    .progress-circular {
        padding-left: 5px;
    }
    .skill-area .col-xs-12.col-sm-6.col-md-6 {
        padding: 0;
    }
    .progress-circular > span {
        font-size: 17px;
    }
    .portfolio-menu ul li {
        padding-right: 10px;
        margin-bottom: 30px;
    }
    .portfolio-menu ul li a {
        padding: 10px;
    }
    .portfolio-area button.close {
        right: 15px;
        top: 15px;
    }
    .accordion-wrap,
    .contact-form {
        margin-top: 30px;
    }
    .single-fun {
        width: 100%;
    }
    .qoute-thumb {
        float: none;
        margin-right: auto;
    }
    .qoute-details {
        width: 100%;
        margin-top: 30px;
    }
    .review-area .section-title::after {
        left: 18%;
        top: 55px;
    }
    .fun-area.clearfix {
        height: 1260px;
    }
    .single-brand {
        width: 96%;
    }
    .review-area .owl-theme .owl-controls {
        bottom: -35px;
        left: 23%;
    }
    .main-menu .navbar-brand {
        padding: 7px 5px;
    }
    .is-sticky .main-menu .navbar-brand {
        padding: 0 5px;
    }
    .is-sticky .main-menu .navbar-toggle {
        margin-top: 10px;
    }
    .main-menu .navbar-brand img {
        height: 55px;
    }
}
/*================================
Wide Mobile Layout: 480px.
==================================*/

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .about-area .section-title::after {
        left: 11%;
    }
}