/*------------------------------------------------------------------
[Responsive Stylesheet]

[Table of contents]

1. Responsive Max_319px
2. Responsive Min_320px Max_479px
3. Responsive Max_479px
4. Responsive Min_480px Max_767px
5. Responsive Max_767px
6. Responsive Min_768px
7. Responsive Max_960px
8. Responsive Max_1024px
9. Responsive Min_1024px
10. Responsive Min_1367px
11. Responsive Min_768px and Max_1023px
12. Responsive Max_600px
13. Responsive Min_600px
14. Responsive Min_480px Max_1200px
15. Responsive Min_480px Max_680px
16. Responsive Min_990px Max_1100px
17. Responsive Max_990px
18. Responsive Min_480px Max_990px
19. Responsive Min_1439px

-------------------------------------------------------------------*/

/*--- 1. Responsive Max_319px ---*/
@media only screen and (max-width: 319px) {
   

    /* Add new rules for this interval below */
}



/*--- 2. Responsive Min_320px Max_479px ---*/
@media only screen and (min-width: 320px) and (max-width: 479px) {


    /* Add new rules for this interval below */
}


/*--- 3. Responsive Max_479px ---*/
@media only screen and (max-width: 480px) {
    .index-home .grid figure.small, 
    .index-category .grid figure.small {
        width: 100%;
    }
    body .st-menu {
        width: 250px;
    }
    body .st-menu ul.sub-menu {
        box-shadow: none !important;
        max-width: 100%;
    }
    body .st-menu {
        overflow-x: scroll;
    }
    body .st-container .logo > a {
        font-size: 25px;
        margin: 0 auto;
        max-width: 120px;
    }
    body .st-menu ul.sub-menu {
        left: 0;
        opacity: 1;
        position: relative;
        top: 0;
        visibility: visible !important;
    }



    /* Add new rules for this interval below */
}


/*--- 4. Responsive Min_480px Max_767px ---*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .index-home .grid figure.small, 
    .index-category .grid figure.small {
        width: 50%;
    }

    /* Add new rules for this interval below */
}


/*--- 5. Responsive Max_767px ---*/
@media only screen and (max-width: 767px) {

    .mtphotography-search{
        right: 15px !important;
    }
    body .cd-primary-nav-trigger, body .sound{
        left: 20px !important;
    }
    body h2.site-description, body .intro-effect-grid .header h1, body .title h1 {
        font-size: 40px;
        line-height: normal;
    }
    .mtphotography_comments .comment_author > img {
        max-width: 50px;
        margin-bottom: 8px;
    }
    .mtphotography_comments .author_name {
        margin-bottom: 8px;
        text-align: left;
    }
    .comment .children {
        padding-left: 0;
    }
    
    /* Add new rules for this interval below */
}


/*--- 6. Responsive Min_768px ---*/
@media only screen and (min-width: 768px) and (max-width: 1023px) {


    /* Add new rules for this interval below */
}



/*--- 7. Responsive Max_960px ---*/
@media screen and (max-width: 1000px) {


    /* Add new rules for this interval below */
}


/*--- 8. Responsive Max_1024px ---*/
@media only screen and (max-width: 1024px) {


    /* Add new rules for this interval below */
}


/*--- 9. Responsive Min_1024px ---*/
@media only screen and (min-width: 1024px) and (max-width: 1366px) {


    /* Add new rules for this interval below */
}


/*--- 10. Responsive Min_1367px ---*/
@media only screen and (min-width: 1367px) {


    /* Add new rules for this interval below */
}


/*--- 11. Responsive Min_768px and Max_1023px ---*/
@media only screen and (min-width: 768px) and (min-width: 1023px){


    /* Add new rules for this interval below */
}


/*--- 12. Responsive Max_600px ---*/
@media only screen and (max-width: 600px) {


    /* Add new rules for this interval below */
}


/*--- 13. Responsive Min_600px ---*/
@media only screen and (min-width: 600px) {


    /* Add new rules for this interval below */
}


/*--- 14. Responsive Min_480px Max_1200px ---*/
@media only screen and (min-width: 681px) and (max-width: 1200px) {


    /* Add new rules for this interval below */
}

/*--- 15. Responsive Min_480px Max_680px ---*/
@media only screen and (min-width: 480px) and (max-width: 680px) {


    /* Add new rules for this interval below */
}

/*--- 16. Responsive Min_990px Max_1100pxw ---*/
@media only screen and (min-width: 990px) and (max-width: 1100px) {


    /* Add new rules for this interval below */
}

/*--- 17. Responsive Max_990px ---*/
@media only screen and (max-width: 990px) {


    /* Add new rules for this interval below */
}

/*--- 18. Responsive Min_480px Max_990px ---*/
@media only screen and (min-width: 480px) and (max-width: 990px) {


    /* Add new rules for this interval below */
}