/********************************
RESPONSIVE CSS * MEDIA QUERIES
********************************/

@media screen and (max-width: 1920px)  {

}

@media screen and (max-width: 1360px)  {


}

/*iPad Landscape*/
@media screen and (max-width: 1024px), screen and (max-device-width: 1024px), screen and (max-width: 1200px)  {
    .container {
        margin: 0 20px;
        padding: 0 20px;
    }

    #portfolio .portfolio-item, .blog-post .blog-thumbnail, .portfolio-project .preview-project {
        height: auto;
    }

    #portfolio .portfolio-item .overlay .icon-portfolio {
        display: none;
    }
    .social-t li a {
        line-height: 40px;
    }
    .social-t li {
        width: 40px;
        height: 40px;
    }

}

/*iPad Portrait*/
@media handheld and (max-width: 767px), screen and (max-device-width: 767px), screen and (max-width: 960px)  {
    .container {
        margin: 0 20px;
        padding: 0 20px;
    }

    body{
        min-width: 306px;
    }
    
    .site-description{
        display: none !important;
    }
    
    .social-icons {
        float: left;
        margin: 0;
        width: 100%;
    }
    
        .social-icons ul{
            display: block;
            float: left;
            width: 100%;
            text-align: center;
            margin-bottom: 20px;
        }
        
        .social-icons li{
            display: inline-block;
            float: none;
        }
        
        .logo{
            display: block;
            padding: 20px 0;
            float: none;
            text-align: center;
        }
        
        .tinynav { display: none }
    
    .menu{
        padding: 10px 0;
        width: 100%;
    }
    .menu ul{display: none;}
    .tinynav{
        display: block;
        width: 90%;
        margin: 0 auto;
    }

    #portfolio .portfolio-item .overlay .icon-portfolio, #searchform {
        display: none;
    }

    #portfolio .portfolio-item .overlay h3, .service-cnt h4, .post-detail h5 {
        font-size: 18px;
    }

    #portfolio .portfolio-item, .blog-post .blog-thumbnail, .portfolio-project .preview-project {
        height: auto;
    }

    .page-header .page-title h2.on {
        margin-bottom: 30px;
    }

    .page-title h2, .footer-wrapper .widget-title, .blog-post .post-title, #sidebar .widget-title, 
    h2.page-title .on {
        font-size: 24px;
    }

    .welcome-text h1 {
        font-size: 32px;
    }

    .comment-form #commentform input, .comment-form #commentform textarea {
        width: 100%;
        padding: 10px 0;
    }

}

/*iPhone Landscape*/
@media screen and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 750px)  {
    #services .service-border .service {
        border: none;
    }
    .page-header .page-title, .page-header .btn {
        float: none;
        display: block;
    }
    #portfolio .pagination {
        margin-left: 13px;
    }
}

/*iPhone Portrait*/
@media screen and (max-width: 320px), screen and (max-device-width: 320px), screen and (max-width: 450px) {
    .container {
        margin: 0 20px;
        padding: 0 20px;
    }
    #services .service-border .service {
        border: none;
    }
    .copyright, .footer-bottom a.icon, .page-header .page-title, .page-header .btn, .comment-list .comment-avatar,
    .comment-form #commentform label {
        float: none;
        display: block;
    }
    #portfolio .portfolio-item, .portfolio-project .preview-project, .blog-post .blog-thumbnail {
        width: 100%;
        height: auto;
        overflow: hidden;
    }
    #portfolio .portfolio-item .overlay .icon-portfolio {
        display: none;
    }
    #portfolio .portfolio-item .overlay h3, .post-detail h5, .service-cnt h4 {
        font-size: 16px;
        font-weight: bold;
    }
    .comment-list .children-comment, .comment-list .comment-details {
        margin: 15px 0;
        padding: 0;
    }
    .footer-bottom a.icon, .footer-bottom .copyright {
        margin: 0 auto;
        text-align: center;
    }
    .footer-wrapper .widget-title, .page-header .page-title h2.on, .welcome-text h1, h2.page-title .on, 
    .blog-post .post-title {
        font-size: 24px;
    }
    .page-header .page-title h2.on {
        margin-bottom: 30px;
    }
    #services .service {
        padding: 0;
    }
    .social-t li a {
        line-height: 40px;
    }
    .social-t li {
        width: 40px;
        height: 40px;
    }
    .comment-list .comment-details .comment-meta {
        font-size: 14px;
    }
    .comment-form #commentform input, .comment-form #commentform textarea, #contactForm #contactName, 
    #contactForm #email, #contactForm textarea {
        width: 100%;
        padding: 8px 0;
    }
}