/* THIS IS A MINIFIED VERSION FOR DOMONSTRATION PURPOSE ONLY */

@media only screen and (max-width:1200px) {
    #page-content {
        min-width: 940px
    }

    .wrapper {
        width: 940px
    }

    .main-content {
        width: 640px
    }

    aside {
        width: 240px
    }

    .blog-content {
        width: 550px
    }

    .one-half {
        width: 450px
    }

    .one-third {
        width: 286px
    }

    .two-third {
        width: 612px
    }

    .one-fourth {
        width: 205px
    }

    .two-fourth {
        width: 450px
    }

    .three-fourth {
        width: 695px
    }

    .one-fifth {
        width: 156px
    }

    .two-fifth {
        width: 356px
    }

    .three-fifth {
        width: 554px
    }

    .four-fifth {
        width: 752px
    }

    .main-content .one-half {
        width: 300px
    }

    .main-content .one-third {
        width: 186px
    }

    .main-content .two-third {
        width: 412px
    }

    .main-content .one-fourth {
        width: 130px
    }

    .main-content .two-fourth {
        width: 300px
    }

    .main-content .three-fourth {
        width: 470px
    }

    .main-content .one-fifth {
        width: 98px
    }

    .main-content .two-fifth {
        width: 236px
    }

    .main-content .three-fifth {
        width: 334px
    }

    .main-content .four-fifth {
        width: 472px
    }

    .one-half .iconbox-content {
        width: 400px
    }

    .one-third .iconbox-content {
        width: 236px
    }

    .one-fourth .iconbox-content {
        width: 155px
    }
}

@media only screen and (max-width:1023px) {
    h1 {
        font-size: 80px;
        line-height: 100px
    }

    h2 {
        font-size: 36px;
        line-height: 54px
    }

    h3 {
        font-size: 28px;
        line-height: 42px
    }

    h4 {
        font-size: 20px;
        line-height: 30px
    }

    h5 {
        font-size: 18px;
        line-height: 26px
    }

    h6 {
        font-size: 16px;
        line-height: 22px
    }

    #page-content {
        min-width: 740px
    }

    .wrapper {
        width: 740px
    }

    .main-content {
        width: 100%;
        float: none
    }

    aside {
        width: 100%;
        float: none;
        margin-top: 100px
    }

    header #logo {
        padding: 10px 0;
        height: 40px;
        max-width: 350px
    }

    nav#main-nav>ul>li>a:first-child {
        line-height: 40px;
        padding: 10px 0
    }

    nav#menu-controls>ul>li {
        height: 40px;
        padding: 10px 0
    }

    nav#main-nav>ul>li>.sub-menu {
        top: 60px
    }

    nav#main-nav {
        display: none
    }

    .open-responsive-nav {
        display: block
    }

    #portfolio-single aside {
        margin-top: 0
    }

    .blog-content {
        width: 650px
    }

    .one-half {
        width: 350px
    }

    .one-third {
        width: 220px
    }

    .two-third {
        width: 480px
    }

    .one-fourth {
        width: 155px
    }

    .two-fourth {
        width: 350px
    }

    .three-fourth {
        width: 545px
    }

    .one-fifth {
        width: 116px
    }

    .two-fifth {
        width: 272px
    }

    .three-fifth {
        width: 428px
    }

    .four-fifth {
        width: 584px
    }

    .one-half .iconbox-content {
        width: 300px
    }

    .one-third .iconbox-content {
        width: 170px
    }

    .one-fourth .iconbox-content {
        width: 105px
    }
}

@media only screen and (max-width:760px) {
    h1 {
        font-size: 64px;
        line-height: 74px
    }

    h2 {
        font-size: 32px;
        line-height: 44px
    }

    h3 {
        font-size: 26px;
        line-height: 36px
    }

    h4 {
        font-size: 20px;
        line-height: 28px
    }

    h5 {
        font-size: 18px;
        line-height: 26px
    }

    h6 {
        font-size: 16px;
        line-height: 22px
    }

    #page-content {
        min-width: 300px
    }

    .wrapper {
        width: 300px
    }

    .main-content {
        width: 100%;
        float: none
    }

    aside {
        width: 100%;
        float: none;
        margin-top: 60px;
        padding-top: 60px;
        border-top: 1px solid #d9d9d9
    }

    #portfolio-single aside {
        border: 0;
        padding-top: 0
    }

    .blog-date {
        width: 50px
    }

    .blog-date .date-day {
        font-size: 40px;
        line-height: 30px
    }

    .blog-date .date-month {
        font-size: 10px;
        letter-spacing: .03em
    }

    .blog-content {
        width: 240px;
        float: right
    }

    .column {
        margin: 60px 0 0
    }

    div .column:first-child {
        margin: 0
    }

    .four-fifth,
    .one-fifth,
    .one-fourth,
    .one-half,
    .one-third,
    .three-fifth,
    .three-fourth,
    .two-fifth,
    .two-fourth,
    .two-third {
        width: 100%
    }

    .one-fourth .iconbox-content,
    .one-half .iconbox-content,
    .one-third .iconbox-content {
        width: 250px
    }

    .section-title {
        margin-top: -7px;
        margin-bottom: 60px
    }

    .section-inner {
        padding-top: 60px
    }

    .horizontalsection .horizontalinner {
        padding: 60px 0
    }

    #portfolio-single {
        padding-top: 60px
    }

    .ajax-section #portfolio-single {
        padding-bottom: 60px
    }

    #portfolio-single .portfolio-media {
        margin-top: 40px
    }

    #portfolio-single .portfolio-content {
        margin-top: 0;
        padding-top: 40px
    }

    .ajax-section {
        padding-bottom: 60px
    }

    #ajax-loader .loader-icon {
        top: 20px !important
    }

    .close-project {
        bottom: 70px
    }

    .spacer.spacer-mini {
        height: 15px
    }

    .spacer.spacer-small {
        height: 30px
    }

    .spacer.spacer-medium {
        height: 45px
    }

    .spacer.spacer-big {
        height: 60px
    }
}