/* CSS Document */

/* Design for a width of 960-1280 px*/
/* 960px <= width < 1280px */

@media only screen and (max-width: 1024px) {
    .wrapper {
        width: 991px;
        -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
        box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
    }

    .cart-item .civ-description {
        width: 36.28%;
        padding-right: 2.5%;
    }

    .cart-item.addon .civ-description {
        width: 36.08%;
        padding-right: 2.5%;
    }

    .cart-item .civ-remove {
        width: 8%;
    }
}

/* Tablet (Portrait) - design for a width of 768px*/
/* 768px <= width <= 960px */

@media only screen and (min-width: 0px) and (max-width: 960px) {
    .hide-below-960 {
        display: none;
    }

    .notifications-box {
        font-size: 15px;
    }

    body {
        background-color: white;
    }

    .wrapper {
        width: 960px;
    }

    .header .logo {
    }

    .header .hdr-items {
    }

    .header .hdr-links {
    }

    .navigation ul {
        padding: 0px;
    }

    .cart-item, .cart-item-addon-list {
        /*background-image:url(/images/bg-cart-items-grid-tablet-001.gif);*/
        background-image: none;
    }

    .page-heading .page-buttons {
        float: none;
        width: 100%;
    }

    .cart-grid-heading ul li.cgh-quantity {
        width: 15%;
    }

{
    width: 15%;
}

.civ-quantity {
    width: 17.67%;
}

.cart-grid-heading ul li.cgh-description {
    width: 33.38%;
    padding-left: 3.33%;
    padding-right: 2.5%;
}

.civ-description {
    width: 37.1%;
    padding-right: 2.5%;
}

.cart-item.addon .civ-description {
    width: 33.5%;
    padding-right: 2.5%;
}

.cart-grid-heading ul li.cgh-unit-price {
    padding-right: 0%;
    width: 8.8%;
}

.civ-unit-price, .addon .civ-unit-price, .civ-item-total, .addon .civ-item-total {
    width: 9.9%;
    padding-right: 2%
}

.civ-item-total {
    width: 10.6%
}

.civ-remove {
    width: 15%;
    padding-left: 2%;
}

.cart-grid-heading ul li {
    font-size: 15px;
}

.civ-description .citem-title a {
    font-size: 20px;
}

.civ-description .citem-text {
    font-size: 13px;
}

.cart-item .civ-unit-price, .cart-item .civ-item-total {
    font-size: 15px;
}

.cart-item .civ-quantity {
    width: 15%;
}

.ci-product-option-price {
    right: -80px;
}

.cart-item .civ-description {
    width: 33.38%;
    padding-right: 2.5%;
}

.cart-item.addon {
    background-position: 10% 26px;
}

body {
    background-image: none;
}

.navigation ul li a {
    font-size: 15px;
    padding: 0px 20px;
}

.secondary-branding {
    margin-top: 10px;
}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
    position: absolute;
    width: 100%;
}

.additional-items .section-wrapper .civ-description .citem-title a {
    font-size: 14px;
}

.bx-wrapper .bx-prev {
    left: -68px;
}

.bx-wrapper .bx-next {
    right: -68px;
}
}

/* Mobile (Landscape, iPhone 4 Portrait) - design for a width of 640px */
/* 640px <= width <= 768px */

@media only screen and (min-width: 0px) and (max-width: 768px) {
    .hide-above-640 {
        display: block;
    }

    .hide-below-640 {
        display: none;
    }

    form input, form select {
        font-size: 16px;
    }

    .notifications-box {
        font-size: 18px;
    }

    .wrapper {
        max-width: 768px;
    }

    .secondary-branding {
        margin-top: 0px;
    }

    .split-column.page-container {
        background-image: none;
    }

    .int-column {
        width: 60%;
        padding-top: 40px;
    }

    .header {
        padding-bottom: 10px;
    }

        .header .logo {
            float: none;
            width: 100%;
            border-bottom: 1px solid #d9d9d9;
            padding-bottom: 10px;
        }

        .header .hdr-items {
            float: left;
            width: 100%;
            margin-top: 10px;
        }

        .header .hdr-links {
            float: left;
            width: 70%;
            font-size: 17px;
        }

            .header .hdr-links ul {
                float: left;
                padding: 0px;
            }

            .header .hdr-links ul {
                padding: 0px;
                margin-bottom: 5px;
            }

                .header .hdr-links ul li {
                }

                    .header .hdr-links ul li span {
                    }

    .secondary-branding {
        float: right;
        margin: auto;
        margin-top: 12px;
        width: 30%;
    }

        .secondary-branding img {
            width: 135px;
        }

    .navigation ul li a {
        font-size: 18px;
        padding: 0px 20px;
        text-align: center;
    }
    /* start BUTTONS */
    .page-buttons ul {
        float: none;
    }

        .page-buttons ul li {
            margin-bottom: 20px;
            margin-left: 0px;
            display: block;
            width: 100%;
        }

    .pb-top {
        margin: 30px 0px;
    }

    .page-buttons ul li a {
        background: black;
        width: 100%;
        height: 60px;
        display: block;
        color: white;
        font-size: 16px;
        font-weight: bold;
        text-decoration: none;
        text-align: center;
        -webkit-border-radius: 5px;
        border-radius: 5px;
    }

        .page-buttons ul li a span {
            padding-top: 17px;
        }

    .page-buttons ul li.keep-shopping a, .page-buttons ul li.go-back a {
        background-color: #4a4a4a;
    }

    .page-buttons ul li.empty-cart a {
        background-color: #c9c9c9;
    }

    .page-buttons ul li.checkout a, .page-buttons ul li.save-continue a {
        background-color: #64b636;
    }
    /* end BUTTONS */

    .page-heading h1 {
        width: 100%;
        float: none;
    }

    .cart-item, .cart-item-addon-list {
        background-image: none;
    }

    .civ-quantity-wrapper {
        width: 65%;
    }

    .cart-grid-heading ul li.cgh-description {
        width: 33.38%;
        padding-right: 2.5%;
    }
    /* MOBILE NAVIGATION */
    .navigation {
        width: 90%;
        margin: auto;
        background-image: none
    }

        .navigation ul.navigation-top {
            display: none;
        }

            .navigation ul.navigation-top li a {
                border-bottom: 1px solid #8a8a8a;
            }

            .navigation ul.navigation-top.show-mobile {
                display: block;
            }

                .navigation ul.navigation-top.show-mobile li {
                    float: none;
                }

    #mobile-nav {
        color: white;
        margin-top: 15px;
    }

        #mobile-nav ul {
            display: block;
            width: 100%;
            padding: 0px;
            margin: 0px;
        }

            #mobile-nav ul li {
                padding: 0px;
                margin: 0px;
            }

                #mobile-nav ul li a {
                    padding: 0px 10%;
                    text-align: left;
                }

            #mobile-nav ul #mnav-shopping-cart {
                width: 60%;
                background-image: url(/images/bg-navigation-green-001.gif);
                background-repeat: repeat-x;
                background-color: #8cce60;
            }

                #mobile-nav ul #mnav-shopping-cart a {
                    border-right: 3px solid white;
                    background-image: url(/images/icon-cart-white-001.gif);
                    background-repeat: no-repeat;
                    background-position: 90% 16px;
                }

            #mobile-nav ul #mnav-menu {
                cursor: pointer;
                width: 40%;
                background-image: url(/images/bg-navigation-001.gif);
                background-position: top center;
                background-repeat: repeat-x;
            }

                #mobile-nav ul #mnav-menu a {
                    border-right: 0px;
                    display: block;
                    background-image: url(/images/icon-mobile-menu-001.gif);
                    background-repeat: no-repeat;
                    background-position: 87% 18px;
                }

    .additional-items .section-wrapper {
        padding-bottom: 70px;
    }

    .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
        bottom: -45px !important;
    }

    .additional-items .section-wrapper .civ-description .citem-title a {
        font-size: 16px;
    }

    .int-column {
        float: none !important;
        margin: auto;
    }

        .int-column.col-right {
            padding-top: 30px;
            margin-top: 40px;
            border-top: 1px solid #dedede;
        }

    .page-buttons ul li.submit-order a span {
        padding-top: 15px;
    }

    .payment-information li {
        padding-left: 5%;
    }
    /* MODAL */
    .jqmWindow {
        margin: auto !important;
        margin-top: 10px !important;
        height: 93% !important;
    }

    #dialog form select.reg-select.sm {
        width: 24%;
    }
}

/* Mobile (Portrait) - design for a width of 320px*/
/* 320px <= width <= 480px */

@media only screen and (min-width: 0px) and (max-width: 480px) {
    .hide-above-480 {
        display: block;
    }

    .hide-below-480 {
        display: none;
    }

    .wrapper {
        min-width: 320px;
        width: 100%;
    }

    .page-heading h1 {
        margin-top: 10px;
    }

    .phone-number {
        margin-bottom: 10px;
    }

    .secondary-branding {
        margin-top: 16px;
    }

        .secondary-branding img {
            width: 100%;
        }

    .cart-grid-heading ul li.cgh-description {
        width: 65%;
    }

    .cart-item .civ-description {
        width: 59%;
        padding-right: 4%;
    }

    .cart-item.addon .civ-description {
        padding-left: 20%;
        width: 43%;
        padding-right: 4%;
    }

    .citem-unit-price {
        margin-top: 5px;
        color: #8f8f8f;
    }

    .cart-item.addon .civ-description .citem-title a {
        font-size: 15px;
        margin-top: 12px;
    }

    .civ-description .citem-text {
        font-size: 13px;
        line-height: 140%;
    }

    .additional-items .section-wrapper {
        width: 77%;
    }

    .additional-items h3 {
        font-size: 18px;
    }

    .bx-wrapper {
        margin-left: 3% !important;
    }

    .bxslider li {
        display: table-cell
    }

    .bx-wrapper .bx-controls-direction {
        display: none;
    }

    .bx-wrapper {
        width: 90% !important;
        margin: auto;
    }

    .bx-viewport {
    }

    .bxslider {
    }

    .navigation-bottom ul li {
        width: 100%;
        text-align: center;
    }

    .int-column {
        width: 100%;
    }

    .footer-bottom div {
        float: none;
        width: 100%;
        text-align: left;
    }

    .footer-bottom ul {
        float: none;
        margin-bottom: 30px;
    }

    .remember-me {
        margin-left: 32%;
        margin-top: 10px;
    }

        .remember-me label {
            font-size: 14px;
        }

    .form-dash {
        display: block;
        float: left;
        margin-top: 12px;
        font-size: 14px;
        padding: 0% 2.5%;
    }

    .ci-product-option-price {
        right: -75px;
    }
}

@media only screen and (min-width: 960px) {
    .jqmWindow {
        display: none;
        position: fixed;
        top: 0%;
        left: 45%;
        margin-left: -300px;
        width: 600px;
        background-color: white;
        color: #333;
        overflow-y: scroll;
        padding: 1% 5%;
        height: 87%;
    }

    .jqmOverlay {
        background-color: #000;
        display: block !important;
    }

    * iframe.jqm {
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        width: expression(this.parentNode.offsetWidth+'px');
        height: expression(this.parentNode.offsetHeight+'px');
    }

    * html .jqmWindow {
        position: absolute;
        top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
    }
}