/* blue key point */

@media only screen and (max-width: 839px) {
    /*#holderImage {
        background-color: blue;
    }*/

    header {
        width: 100%; }

    .page {
        width: 100%; }
        .page .content {
            padding: 0 10px; }
            .page .content .framer-desc {
                width: 355px; }
}

/* -- */

/* green key point (767px, 750px actually) */

@media only screen and (max-width: 774px /*749px*/) {
    /*#holderImage {
        background-color: green;
    }*/

    .page {
        width: 100%; }
        .page .content {
            padding: 0; }
            .page .content .framer {
                width: 100%;
                float: none; }
                .page .content .framer .framer-desc {
                    width: 50%;
                    padding: 0 5px;
                    min-width: 320px; }


            .page .content .options {
                width: 100%;
                float: none; }
                .page .content .options .options-content {
                    width: 400px; /*50%;*/
                    padding: 0 5px;
                    min-width: 320px; }


    .ktf-button.ktf-button-normal {
        width: 142px; }

    .ktf-cats label.item-right, .ktf-cats label.item-left {
        float: none; }

    #dvtogethermat .ktf-cats label {
        width: 140px;  }

    #aSample, #aSample-ad {
        line-height: 15px;
        font-size: 0.75em;
        padding: 8px 5px 7px; }

    #dvframe .list-wrapper {
        width: 100%;
        min-width: 310px; }

        #dvframe .list-wrapper .scroll-wrapper {
            width: 95%;
            min-width: 295px; }

        #dvframe .list-wrapper .external-scroll_y {
            right: 0; }

    #dvframe .ktf-cats label {
        width: 32%; }

    #ktf-report {
        text-align: justify; }

    #dvElements-ACCESSORY {
        width: 100%;
        min-width: 310px; }

    #dvreport .section {
        width: 100%; }
        #dvreport .section a {
            margin-right: 0; }

    #tabsHolder div {
        width: 50%;
        min-width: 320px;
        margin: auto; }
        #tabsHolder span {
            display: none; }
            #tabsHolder span.previous, #tabsHolder span.active, #tabsHolder span.next {
                display: inline-block; }

            #tabsHolder span.previous, #tabsHolder span.next {
                width: 29%; }
                #tabsHolder span.previous a, #tabsHolder span.next a {
                    font-size: 0.8em; }

            #tabsHolder span.previous {
                text-align: right; }
            #tabsHolder span.next {
                text-align: left; }
            #tabsHolder span.active {
                text-align: center;
                width: 38%; }
                #tabsHolder span.active a {
                    font-size: 1.2em; }

    .alertBox, .confirmBox {
        width: 310px;
        margin-left: -156px; }

    #image-sizes-stock input[type="text"] {
        width: 50px; }

    #framer-desc {
        display: none; }
    #aZoomer {
        display: none; }
    #framer-desc-ad {
        display: block; }

    #cart-qtty-ad {
        visibility: visible;
    }

    .page .content .framer-desc{
        width: 400px;
        margin: 0 auto; }

}

/* -- green key point (767px) */


/* intermediate key points */

@media only screen and (max-width: 645px) {
    #dvMatamounter .ktf-radio[for="imatamounter-2"] {
        margin-left: 24px; }
}

@media only screen and (max-width: 525px) {
    #custom-mat-borders {
        width: 320px; }
        #custom-mat-borders h1 {
            margin: 10px 15px 0px;
            width: 100%; }
        #custom-mat-borders table {
            padding-top: 25px;  }
        #custom-mat-borders .ktf-button {
            width: 60px; }
}

@media only screen and (max-width: 500px) {
  .framer-desc {
      display: none;
  }
}


@media only screen and (max-width: 360px) {
    #custom-mat-borders {
        width: auto; }
}

@media only screen and (max-width: 320px) {
    .page {
        width: 320px; }
        .page .content {
            padding: 0; }

}

/* -- */


/* red key point */

@media only screen and (max-width: 373px) {
    /*#holderImage {
        background-color: red;
    }*/
}
