body {
    font-size: 14px;
    margin: 0;
    position: relative;
    background: #fff;
    font-family: "open sans";
    overflow-x: hidden;
    color: #333;
}

h1, h2, h3, h4, h5 {
    font-family: "Cabin";
    width: 100%;
    text-align: center
}

a {
    color: #0657A8;
    text-decoration: none;
}

    a:hover, a:focus {
        color: #23527c
    }

    a:focus {
        outline: 5px auto #c9e9d6
    }

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    margin: 0 auto
}

hr {
    margin-top: 14px;
    margin-bottom: 14px;
    border: 0;
    border-top: 1px solid #ddd
}

h1, h2, h3, h4, h5, h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
}

h4, h5, h6 {
    margin-top: 10px;
    margin-bottom: 10px
}

h1 {
    font-size: 38px;
    font-weight: 600;
}

@media (max-width: 900px) {
    h1 {
        font-size: 28px;
    }
}

h2 {
    font-size: 30px
}

@media (max-width: 900px) {
    h2 {
        font-size: 25px;
        padding: 0 10px
    }
}

h3 {
    font-size: 24px
}

@media (max-width: 900px) {
    h3 {
        font-size: 20px
    }
}

h4 {
    font-size: 18px
}

h5 {
    font-size: 14px
}

h6 {
    font-size: 12px
}

p {
    margin: 0 0 10px;
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td, th {
    padding: 0
}

.with-bullets ul {
    list-style-type: disc;
    padding: 0;
    margin: 0
}

ul:not(.artwork-checklist) {
    list-style-type: none;
    padding: 0;
    margin: 0
}

label {
    margin: 0;
    font-weight: normal;
    cursor: pointer
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    opacity: 0.8
}

input {
    border-radius: 3px;
    border: 1px solid #ccc;
    height: 35px;
    padding-left: 10px;
    background: #fff;
}

    input:focus, input[type="file"]:focus, select:focus, textarea:focus {
        outline: #c9e9d6 solid 1px;
        background: #fff;
        box-shadow: none
    }

    input[type="submit"]:focus {
        color: #0657A8;
        border-color: #0657A8
    }

    input[type="radio"]:focus, input[type="checkbox"]:focus {
        box-shadow: 0px 0px 1px 3px #c9e9d6;
        outline: 0;
        background: white
    }

    input[type="radio"], input[type="checkbox"] {
        height: 13px
    }


select {
    background: white;
    border-radius: 3px;
    border: 1px solid #ccc;
    height: 35px;
}


form a.form-link:hover {
    cursor: pointer;
}

.no-b {
    border: 0 !important
}

    .no-b:after {
        display: none
    }

.no-m {
    margin: 0 !important
}

.no-p {
    padding: 0 !important
}

.no-s {
    overflow: hidden !important;
    position: relative;
    height: calc(100% - 45px)
}

@media (max-width: 1000px) {
    .no-mob {
        display: none
    }
}

.btn2 {
    background: #6c757d;
    border: 2px solid #6c757d;
    color: #FFF;
    font-size: 14px;
    font-weight: bold;
    border-radius: 3px;
    margin: 0px 0 5px;
    padding: 5px 12px;
    text-transform: capitalize;
}

    .btn2:hover {
        background: #FFF;
        border: 2px solid #545b62;
        color: #545b62;
    }

.btn1 {
    background: #0657A8;
    border: 2px solid #0657A8;
    color: #FFF;
    font-size: 14px;
    font-weight: bold;
    border-radius: 3px;
    margin: 0px 0 5px;
    padding: 5px 12px;
    text-transform: capitalize;
}

    .btn1:hover {
        background: #FFF;
        border: 2px solid #0657A8;
        color: #0657A8;
    }

.btn {
    background: #0657A8;
    border: 1px solid #0657A8;
    color: #FFF;
    font-size: 16px;
    border-radius: 3px;
    margin: 0px 0 5px;
    padding: 5px 12px 6px;
    text-transform: capitalize;
    white-space: initial
}

    .btn:hover {
        background: #044b91;
        color: #fff;
        outline: 0;
    }

    .btn:focus {
        background: #044b91;
        color: #fff;
        outline: 0;
        box-shadow: none;
    }

    .btn.secondary {
        background: #fff;
        color: #0657A8
    }

        .btn.secondary:hover {
            background: #0657A8;
            color: #FFF
        }

        .btn.secondary:focus {
            background: #0657A8;
            color: white;
            outline: 0
        }

    .btn.grey {
        background: #eee;
        color: #333;
        border-color: #ccc
    }

        .btn.grey:hover {
            background: white;
            color: #333
        }

        .btn.grey:focus {
            background: white;
            color: #333;
            outline: 0
        }

    .btn.gray {
        background: #a6a6a6;
        color: #fff;
    }

        .btn.gray:hover {
            background: #858585;
            color: #FFF
        }

        .btn.gray:focus {
            background: #858585;
            color: #fff;
            outline: 0
        }

a.btn.green {
    background: #26A65B;
    border-color: #26A65B;
    color: #FFF;
}

.btn.green {
    background: #26A65B;
    border-color: #26A65B;
    color: #FFF;
}

    .btn.green:hover {
        background: white;
        color: #26A65B
    }

    .btn.green:focus {
        background: white;
        border: 1px solid #26A65B;
        color: #333;
        outline: 0
    }

.btn.registration {
    height: initial;
    margin-top: 10px;
    padding: 10px;
    width: 50%
}

.btn.small {
    font-size: 13px;
    padding: 5px 10px
}

.btn.large {
    padding: 15px 20px
}

.btn.full-w {
    width: 100%;
    margin: 10px 0 0;
    padding: 10px 15px;
    border-radius: 0 0 3px 3px;
    font-size: 14px;
    text-transform: uppercase
}

.btn.feedback {
    background: #26A65B;
    border-color: #26A65B;
    border-radius: 3px;
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.7);
    position: fixed;
    bottom: -10px;
    right: 10px;
    z-index: 99999
}

    .btn.feedback:hover {
        color: white
    }

    .btn.feedback:focus {
        background: #26A65B;
        color: white;
        outline: 0
    }

.btn .fa {
    margin-right: 5px
}


.btn.disabled, .btn.disabled:hover {
    cursor: not-allowed;
    pointer-events: none !important;
    background: #ccc !important;
    color: white;
    border: none;
}
/* Bootstrap Toggle v2.2.2 corrections for Bootsrtap 4*/
.toggle.off.btn, label.toggle-off.btn {
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    color: #a7a7a7 !important;
    background-color: #f6f6f6 !important;
    border-color: rgba(0, 0, 0, .25);
}

    label.toggle-off.btn:hover, .toggle.off.btn:hover {
        background-color: #f6f6f6;
    }

.toggle.btn:hover, label.btn.toggle-on:hover {
    background: #0657A8;
    border: 1px solid #0657A8;
    color: #FFF;
}

label.btn.toggle-on:hover, label.btn.toggle-off:hover {
    border: none;
}



.toggle-handle {
    background-color: white;
    border: thin rgba(0, 0, 0, .25) solid;
}



.alert-message {
    border: 1px solid #ef2028;
    background: rgba(199,45,35,0.1);
    border-radius: 2px;
    border-left: 4px solid #ef2028;
    color: #ef2028;
    padding: 7px 15px 5px;
    margin-bottom: 15px;
}

    .alert-message a {
        color: #ef2028;
        text-decoration: underline;
    }

.measurement-container {
    background: #fff;
    border-top: 1px solid #ddd;
    border-radius: 2px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin-bottom: 10px;
    padding: 0px;
    max-width: 1600px;
}

    .measurement-container .measurement-header-container {
        max-height: 36px;
        height: 36px;
        width: 100%;
        overflow: hidden;
    }

        .measurement-container .measurement-header-container .measurement-header-item, body.calculators .measurement-body-container .measurement-body-item {
            height: 36px;
            float: left;
            margin-right: 10px;
            margin-left: 10px;
            margin-bottom: -1px;
            border-bottom: 1px solid #ccc;
        }

            .measurement-container .measurement-header-container .measurement-header-item div, body.calculators .measurement-body-container .measurement-body-item div {
                text-align: center;
                vertical-align: middle;
                display: inline-block;
                line-height: 35px;
            }

            .measurement-container .measurement-header-container .measurement-header-item div {
                font-weight: bold;
            }

        .measurement-container .measurement-header-container .measurement-header-item {
            background-color: lightgray;
        }

        .measurement-container .measurement-header-container .measurement-header-item {
            background-color: lightgray;
        }

            .measurement-container .measurement-header-container .measurement-header-item .first-col, body.calculators .measurement-body-container .measurement-body-item .first-col {
                color: #0657A8;
                font-weight: 600;
                width: 90px;
                border-right: 1px solid #ccc;
                border-left: 1px solid #ccc;
            }

            .measurement-container .measurement-header-container .measurement-header-item .second-col, body.calculators .measurement-body-container .measurement-body-item .second-col {
                color: #0657A8;
                font-weight: 600;
                width: 90px;
                border-right: 1px solid #ccc;
            }

            .measurement-container .measurement-header-container .measurement-header-item .last-col, body.calculators .measurement-body-container .measurement-body-item .last-col {
                width: 80px;
                border-right: 1px solid #ccc;
            }

    .measurement-container .measurement-body-container .measurement-body-item a {
        text-align: center;
        width: 170px;
        display: block;
        line-height: 34px;
    }

.search-box-container {
    width: 100%;
    margin: 10px 0px;
}

#SearchText {
    width: 88%;
    height: 40px;
    font-size: 13pt;
}

.search-box-container > form input[type="submit"] {
    background: #cfcfcf;
    color: white;
    padding: 2px;
    width: 11%;
    height: 40px;
}


    .search-box-container > form input[type="submit"]:hover, .search-box-container > form input[type="submit"]:focus {
        background: #bababa;
    }

.search-box-container > form input:focus {
    background: white;
}

.number-pagination {
    font-size: 16px;
    text-align: center;
}

    .number-pagination .page, .number-pagination .gap {
        padding: 0 8px;
        display: inline-block;
    }

        .number-pagination .page:not(.current) {
            cursor: pointer;
        }

            .number-pagination .page:not(.current):not(.PagedList-skipToFirst):not(.PagedList-skipToPrevious):not(.PagedList-skipToNext):not(.PagedList-skipToLast):not(.gap) a {
                color: #333;
            }

            .number-pagination .page:not(.current):not(.PagedList-skipToFirst):not(.PagedList-skipToPrevious):not(.PagedList-skipToNext):not(.PagedList-skipToLast):not(.gap):hover {
                text-decoration: underline;
            }

        .number-pagination .page.current {
            background: #0657A8;
            border-radius: 50%;
            color: white;
            padding: 5px 12px;
        }

    .number-pagination .first, .number-pagination .prev, .number-pagination .next, .number-pagination .last {
        border: none;
        border-radius: 3px;
        margin: 0;
        padding: 0;
        color: #0657A8;
        font-size: 0;
    }

    .number-pagination .PagedList-skipToFirst a, .number-pagination .PagedList-skipToPrevious a, .number-pagination .PagedList-skipToNext a, .number-pagination .PagedList-skipToLast a {
        border: none;
        border-radius: 3px;
        margin: 0;
        padding: 0;
        color: #0657A8;
        font-size: 0;
    }

        .number-pagination .first:after,
        .number-pagination .prev:after,
        .number-pagination .next:after,
        .number-pagination .last:after,
        .number-pagination .PagedList-skipToFirst a:after,
        .number-pagination .PagedList-skipToPrevious a:after,
        .number-pagination .PagedList-skipToNext a:after,
        .number-pagination .PagedList-skipToLast a:after {
            background: white;
            font-size: 20px;
            border: solid 1px #ccc;
            border-radius: 50%;
            text-decoration: none;
        }

    .number-pagination .PagedList-skipToFirst,
    .number-pagination .PagedList-skipToPrevious,
    .number-pagination .PagedList-skipToNext,
    .number-pagination .PagedList-skipToLast {
        padding: 0 3px;
        text-decoration: none;
    }


        .number-pagination .first:hover:after,
        .number-pagination .prev:hover:after,
        .number-pagination .next:hover:after,
        .number-pagination .last:hover:after,
        .number-pagination .PagedList-skipToFirst a:hover:after,
        .number-pagination .PagedList-skipToPrevious a:hover:after,
        .number-pagination .PagedList-skipToNext a:hover:after,
        .number-pagination .PagedList-skipToLast a:hover:after {
            background-color: #0657A8;
            border-color: #0657A8;
            color: white;
        }

        .number-pagination .first:after, .number-pagination .PagedList-skipToFirst a:after {
            content: "\00ab";
            padding: 0px 10px 3px;
        }

        .number-pagination .prev:after, .number-pagination .PagedList-skipToPrevious a:after {
            content: "\2039";
            padding: 0px 12px 3px;
        }

        .number-pagination .last:after, .number-pagination .PagedList-skipToLast a:after {
            content: "\00bb";
            padding: 0px 10px 3px;
        }

        .number-pagination .next:after, .number-pagination .PagedList-skipToNext a:after {
            content: "\203A";
            padding: 0px 12px 3px;
        }

.related-links .image-link {
    min-width: 200px;
    max-width: 20%;
}

@media (min-width: 576px) {
    .card-deck {
        margin-right: 0;
        margin-left: 0;
    }
}

@media (max-width: 576px) {
    .card-deck.justify-content-center {
        flex-flow: row wrap;
    }
}

.form-actions input[type="text"] {
    color: #555;
}

.form-actions input:focus, .form-actions input[type="file"]:focus, .form-actions select:focus, .form-actions textarea:focus {
    outline: #c9e9d6 solid 1px;
    background: rgba(238,238,238,0.26);
    box-shadow: none
}

.required-explanation {
    color: #0657A8;
    font-weight: bold;
    margin: 10px 0 10px;
}

.field-validation-error {
    background: rgba(199,45,35,0.1);
    color: #ef2028;
}


.loading-image:before {
    content: "";
    background: rgba(255,255,255,0.7);
    height: 100%;
    width: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999
}

.loading-image:after {
    font-family: "fontAwesome";
    content: "\f110";
    color: #333;
    font-size: 40px;
    width: 100%;
    text-align: center;
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
    position: absolute;
    top: 5%;
    left: 0;
    z-index: 99999
}




.texture-grey {
    background: #fff url(../png/texture-grey.png) repeat;
}

#menu-backdrop {
    display: none
}

    #menu-backdrop.active {
        display: block;
        position: absolute;
        height: 100%;
        top: 50px;
        width: 100%;
        background: rgba(0,0,0,0.6);
        z-index: 9999;
        left: 0
    }

.nav-tabs {
    margin: 5px;
    border-bottom: none;
}

    .nav-tabs a.btn {
        margin: 5px;
    }

        .nav-tabs a.btn.active {
            background: #fff;
            color: #26A65B;
        }

        .nav-tabs a.btn:focus {
            background: #fff;
            color: #26A65B;
            border: 1px solid #26A65B;
        }

.single-image-link img {
    display: block;
}

.tee-shirt-background {
    background: url("../png/tee-shirt.png") no-repeat center;
    background-size: cover;
}


.ordering-not-available div {
    padding: 10px 10px 10px 5px;
    margin: 10px 5px;
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    border-radius: 2px;
    border-left: 4px solid #f6db6f;
    display: inline-block;
}

    .ordering-not-available div .fa {
        color: #f6db6f;
    }

    .ordering-not-available div a {
        font-weight: bold;
        text-decoration: underline;
    }

/*---------------------  Header Section -----------------------------*/
header {
    background-color: #fff;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    width: 100%;
    z-index: 99997;
    box-shadow: 0 3px 5px 0 rgba(0,0,0,0.1);
}

    header .header-container {
        margin: 0 auto;
        max-width: 1240px;
        min-height: 36px;
    }

    header .top-header {
        background: #0657A8;
        color: white;
        width: 100%;
        font-size: 13px;
    }

@media (max-width: 1000px) {
    header .top-header {
        display: none
    }
}

header .navbar-toggler {
    padding: 0;
    font-size: inherit;
    line-height: normal;
    border: none;
    border-radius: 0;
    height: 100%;
}

header .user-account {
    float: right;
    display: inline-block;
    position: relative;
    height: 35px;
    max-height: 35px;
    padding-left: 16px;
}

    header .user-account.user-logged-off a {
        color: #fff;
        text-overflow: ellipsis;
        max-width: 190px;
        height: 36px;
        white-space: nowrap;
        overflow: hidden;
        vertical-align: bottom;
        display: inline-block;
        line-height: 36px;
        font-size: 13px;
    }

    header .user-account span {
        color: #fff;
        text-overflow: ellipsis;
        max-width: 190px;
        height: 36px;
        white-space: nowrap;
        overflow: hidden;
        vertical-align: middle;
        display: inline-block;
        text-decoration: none;
        line-height: 36px;
        font-size: 13px;
        position: relative;
        top: -6px;
        padding-right: 10px;
    }

    header .user-account i.fa:before {
        color: #fff;
        line-height: 36px;
    }

    header .user-account .fa-user-circle-o {
        padding: 0 8px;
    }

    header .user-account .fa-caret-down {
        position: relative;
        top: -4px;
    }

i.fa.user-logged-in-icon {
    margin-top: 1%;
}

i.fa.user-logged-off-icon {
    margin-top: 1%;
}

header .user-account i.fa.user-logged-in-icon:before {
    color: rgb(38, 166, 91);
}

header .user-account:after {
    content: "";
    background-color: #ddd;
    display: block;
    height: 24px;
    position: absolute;
    left: 0;
    top: 6px;
    width: 1px;
}

header #dealer-nav-menu-content {
    border-top: 1px #ccc solid;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    height: auto;
    max-height: 900px;
    position: relative;
    left: -10px;
    overflow: hidden;
    z-index: 99999;
    background: #fff;
}

    header #dealer-nav-menu-content li:hover {
        background: #f1f1f1
    }

    header #dealer-nav-menu-content li a {
        border-bottom: 1px solid #eee;
        color: initial;
        display: block;
        padding: 6px 12px;
        width: 100%;
    }

        header #dealer-nav-menu-content li a:before {
            font-family: FontAwesome;
            content: "\f105";
            color: #0657A8;
            margin-right: 10px;
        }

        header #dealer-nav-menu-content li a:hover {
            text-decoration: none
        }

header nav.nav-mobile {
    background: #0657A8;
    color: #FFF;
    cursor: auto;
    display: none;
    font-size: 18px;
    list-style-type: none;
    margin: 0;
    padding: 0;
    z-index: 99997;
}

@media (max-width: 1000px) {
    header {
        position: sticky;
        top: 0;
    }

        header nav.nav-mobile {
            display: block;
        }

        header #mobile-nav-content {
            width: 65vw;
        }
}

@media(min-width: 1001px) {
    header #mobile-nav-content {
        display: none;
    }
}

@media (max-width: 600px) {
    header #mobile-nav-content {
        width: 80vw;
    }
}

@media (max-width: 400px) {
    header #mobile-nav-content {
        width: 95vw;
    }
}

header nav.nav-mobile .nav-header {
    font-family: Oswald;
    text-transform: uppercase;
    font-size: 24px;
}

    header nav.nav-mobile .nav-header > a {
        color: #fff;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        margin: 5px auto;
        left: 50%;
        margin-left: -86.545px;
        position: absolute;
    }

    header nav.nav-mobile .nav-header > button {
        color: #fff;
        height: 45px;
        width: 75px;
        background-color: transparent;
        cursor: pointer;
        border: none;
    }

        header nav.nav-mobile .nav-header > button:focus {
            outline: none;
        }

        header nav.nav-mobile .nav-header > button.collapsed i.fa-bars {
            display: inline-block;
        }

        header nav.nav-mobile .nav-header > button.collapsed i.fa-times {
            display: none;
        }

        header nav.nav-mobile .nav-header > button i.fa-bars {
            display: none;
        }

        header nav.nav-mobile .nav-header > button i.fa-times {
            display: inline-block;
        }

header #mobile-nav-content {
    box-shadow: 5px 0 5px -5px #333;
    bottom: 0;
    background: white;
    color: #333;
    position: fixed;
    overflow: hidden;
    top: 45px;
    z-index: 2;
    list-style-type: none;
    padding: 0;
    max-width: 400px;
}

    header #mobile-nav-content a {
        display: block;
        color: #333;
        width: 100%;
        height: 100%;
        text-decoration: none;
    }

    header #mobile-nav-content li {
        height: 50px;
        line-height: 50px;
        font-size: 16px;
        text-align: left;
        border-bottom: 1px solid rgba(0,0,0,0.1);
        padding-left: 15px
    }

        header #mobile-nav-content li:hover {
            background: #eee
        }

        header #mobile-nav-content li.nav-mobile-search {
            padding-left: 0px;
            border: none;
        }

        /*Still need to set up chat stuff*/
        header #mobile-nav-content li a.chat-disabled {
            pointer-events: none;
            color: #999
        }

            header #mobile-nav-content li a.chat-disabled:after {
                content: "";
                position: absolute;
                width: 4px;
                left: 0;
                top: 0px;
                bottom: 0;
                background-color: #ef2028;
                opacity: 0.8
            }

        header #mobile-nav-content li a.chat-enabled:after {
            content: "";
            position: absolute;
            width: 4px;
            left: 0;
            top: 0;
            opacity: 0.8;
            bottom: 0;
            background-color: #26A65B
        }

        header #mobile-nav-content li.logged {
            border-bottom: 2px solid #0657A8
        }

    header #mobile-nav-content .submenu-content {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        overflow: hidden;
        background: white;
        z-index: 2;
        border-left: 1px solid #ccc;
    }

    header #mobile-nav-content li .submenu-label {
        cursor: pointer;
        width: 100%;
        height: 100%;
        display: block
    }

        header #mobile-nav-content li .submenu-label:after {
            font-family: FontAwesome;
            content: "\f105";
            float: right;
            font-size: 1.5em;
            margin-right: 20px;
        }

    header #mobile-nav-content .label-back {
        cursor: pointer;
        width: 100%;
        height: 100%;
        display: block
    }

        header #mobile-nav-content .label-back:before {
            font-family: FontAwesome;
            content: "\f104";
            position: relative;
            top: 2px;
            font-size: 1.5em;
            margin-right: 15px;
        }

    header #mobile-nav-content .search-input span.field-validation-error {
        top: 20px;
    }

header .search-input {
    margin-top: 8px;
}

    header .search-input .fa {
        color: #555;
        font-size: 20px;
        left: 10px;
        line-height: 34px;
        opacity: 0.2;
        position: absolute;
        z-index: 1;
    }

    header .search-input span.field-validation-error {
        position: absolute;
        left: 0;
        bottom: -3px;
        background: none;
        font-size: 75%;
        z-index: 1;
    }

    header .search-input input[type=text] {
        background: #fff;
        border-radius: 2px;
        box-shadow: none;
        font-family: "open sans";
        font-size: 14px;
        padding-left: 40px;
        width: 86%
    }



    header .search-input input[type="submit"] {
        background: #cfcfcf;
        border-radius: 2px;
        padding: 0px !important;
        border: 0px solid #ccc;
        color: white;
        font-size: 15px;
        position: absolute;
        width: 12%;
        text-align: center;
        margin-left: 6px;
    }

        header .search-input input[type="submit"]:hover {
            background: #bababa;
        }

        header .search-input input[type="submit"]:focus {
            background: #bababa;
        }


@media (max-width: 1000px) {
    header .search-input {
        margin-top: 0;
    }

        header .search-input input {
            height: 50px;
            padding-left: 40px;
            width: 100%;
            border-radius: 0;
        }

        header .search-input .fa {
            top: 6px;
        }
}

@media (max-width: 400px) {
    header .search-input input[type=submit] {
        margin-top: 2px;
    }
}

header .alerts-container {
    background-color: #ff2137;
    color: white;
    padding: 4px;
    text-align: center;
    margin-top: 12px;
    width: 100%;
    font-size: 14px;
    /*background: repeating-linear-gradient( -45deg, #d6b108, #d6b108 10px, #dcbc2c 10px, #dcbc2c 20px );*/
}

    header .alerts-container a {
        color: #183180;
        font-weight: bold;
    }

    header .alerts-container p {
        margin: 0;
    }

    header .alerts-container span {
        margin-right: 15px;
    }

@media (max-width: 1000px) {
    header .alerts-container {
        margin-top: 0px;
        font-size: 12px;
    }
}


/*----------------------- End Header Section ------------------------*/


/*------------------------------Display Templates && Partials ----------------------------------------------*/
/*---------------Formating for rich text-----------------*/
.text-rich {
    padding: 0 10px;
    font-size: 16px;
}


    .text-rich h1, .text-rich h2, .text-rich h3, .text-rich h4, .text-rich h5, .text-rich h6 {
        padding: 0px;
        text-align: left;
        margin-right: 0;
        margin-left: 0;
    }

    .text-rich h1, .text-rich h2 {
        margin-top: 1em;
        margin-bottom: .5em;
    }

    .text-rich h3, .text-rich h4, .text-rich h5, .text-rich h6 {
        margin-top: .5em;
        margin-bottom: .25em;
    }

    .text-rich p {
        margin: 8px 0px;
    }

    .text-rich ul, .text-rich ol {
        margin-top: .25em;
        margin-right: 2em;
        margin-bottom: .5em;
    }

    .text-rich li {
        margin-top: 0;
        margin-right: 0;
        margin-bottom: 0;
    }

    .text-rich ul {
        padding-left: 1.2em;
        margin-left: .75em;
    }

        .text-rich ul li {
            position: relative;
            margin-left: 1em;
        }

            .text-rich ul li:before {
                font-family: FontAwesome;
                content: "\f105";
                color: #0657A8;
                position: absolute;
                left: -1em;
            }

    .text-rich .video-wrapper {
        padding-left: 20%;
        padding-right: 20%;
    }

    .text-rich table {
        display: block;
        overflow-x: auto;
    }

        .text-rich table td {
            border: 1px solid #ccc;
            padding: 2px 5px;
            font-size: 13px;
        }

        .text-rich table tr:first-child td {
            background: #0e558d;
            color: #fff;
            text-align: center;
            font-size: 16px;
        }

        .text-rich table tr:not(:first-child) td:nth-child(1) {
            font-size: 14px;
        }

        .text-rich table tr:nth-child(odd) {
            background: #efefef;
        }

        .text-rich table tr:hover {
            background: #ceeafd !important;
        }

@media(max-width: 1024px) {
    .text-rich {
        padding: 0 5px;
    }

    .text-rich {
        font-size: 13px;
    }

        .text-rich ul, .text-rich ol {
            margin-right: 2%;
            padding-left: 0;
        }
}

@media (max-width: 600px) {
    .text-rich h1 {
        font-size: 36px;
    }

    .text-rich ul, .text-rich ol {
        margin-right: 0;
        margin-left: 0;
    }

    .text-rich .video-wrapper {
        padding-left: 5%;
        padding-right: 5%;
    }

    .text-rich {
        font-size: 10px;
    }
}


/*----------------------      Formating for rich text column templates--------------*/
.text-columns {
    padding: 0 5%
}

    .text-columns .row {
        margin-top: 15px;
    }

    .text-columns .text-rich ul, .text-columns .text-rich ol {
        margin-right: 2%;
        padding-left: 0;
    }

    .text-columns .text-rich p {
        margin-right: .5em;
    }

/*-------------------  Info link template ----------------------*/
.info-link-section > div {
    width: 50%;
    margin: 10px 0px;
}

@media (max-width: 1000px) {
    .info-link-section > div {
        width: 100%;
        float: none;
    }
}

.info-link-section .text-content {
    padding: 15px;
    background: #fff;
    border: 2px solid #ddd;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .info-link-section .text-content {
        border: solid 1px #ddd;
    }
}

.info-link-section .text-content .icon {
    max-width: 110px;
    height: 75px;
    display: block;
    margin: 1px 8px 1px 1px;
    align-content: center;
}

@media (max-width: 650px) {
    .info-link-section .text-content .icon {
        display: none
    }
}

.info-link-section .text-content .title {
    font-weight: 600;
}

.info-link-section .text-content p {
    font-size: 16px;
    display: block;
    margin: 0;
    line-height: 26px;
}

@media (max-width: 650px) {
    .info-link-section .text-content p {
        width: 100%
    }
}

.info-link-section .link-content .more-contain {
    width: 33.33333%;
    float: left
}

@media (max-width: 600px) {
    .info-link-section .link-content .more-contain {
        margin-left: 0px
    }
}

.info-link-section .link-content .main-icons {
    text-align: center
}

    .info-link-section .link-content .main-icons .main-single {
        width: auto;
        display: inline-block;
        margin: 0px 0 20px;
        vertical-align: top
    }

        .info-link-section .link-content .main-icons .main-single a:hover {
            text-decoration: none
        }

@media (max-width: 600px) {
    .info-link-section .link-content .main-icons .main-single {
        width: 100%
    }
}

.info-link-section .link-content .main-icons .main-single .svg-container {
    border: solid 10px #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    color: #0657A8;
    cursor: pointer;
    display: table;
    -webkit-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    width: 132px;
    height: 132px;
    margin: 0 auto;
    border-radius: 50%;
    position: relative;
    background: #fff;
}

@media (max-width: 450px) {
    .info-link-section .link-content .main-icons .main-single .svg-container {
        width: 100px;
        height: 100px
    }
}

.info-link-section .link-content .main-icons .main-single .svg-container:hover {
    background: #0657A8;
    border-color: #0657A8;
    box-shadow: 0px 3px 3px 0 rgba(0,0,0,0.5);
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease
}

    .info-link-section .link-content .main-icons .main-single .svg-container:hover span, .info-link-section .link-content .main-icons .main-single .svg-container:hover a {
        color: white;
        text-decoration: none
    }

.info-link-section .link-content .main-icons .main-single .svg-container .main-single-title {
    color: #333;
    display: table-cell;
    font-family: "raleway";
    font-size: 18px;
    font-weight: 700;
    line-height: 20px;
    text-transform: uppercase;
    vertical-align: middle;
    width: 100px
}

@media (max-width: 450px) {
    .info-link-section .link-content .main-icons .main-single .svg-container .main-single-title {
        padding-top: 13px;
        font-size: 16px;
        width: initial
    }
}

.info-link-section .link-content .main-icons .main-single .main-single-title {
    margin: 10px auto
}

.info-link-section .link-content > div:nth-child(1) > ul > li:after {
    content: "";
    height: 6px;
    width: 100vw;
    max-width: 350px;
    background: #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    display: block;
    position: absolute;
    top: 65px;
    left: 100%;
    z-index: -1
}

@media (max-width: 1150px) {
    .info-link-section .link-content > div:nth-child(1) > ul > li:after {
        max-width: 275px;
    }
}

@media (max-width: 1000px) {
    .info-link-section .link-content > div:nth-child(1) > ul > li:after {
        max-width: 50vw;
    }
}

.info-link-section .link-content > div > ul > li {
    position: relative;
    z-index: 0
}

@media (max-width: 600px) {
    .info-link-section .link-content {
        display: none
    }
}

/*-----------------------  Stlye Option template  --------------------------- */
.product-style {
    min-height: 245px;
    min-width: 15%;
    max-width: 20%;
    background: #FFF;
    border-radius: 2px;
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    display: inline-block;
    margin: 0.5%;
    vertical-align: top;
    margin: 30px 0 10px;
}

@media (max-width: 1000px) {
    .product-style {
        min-width: 32%;
        max-width: 50%;
        margin: 10px 5px;
    }
}

@media (max-width: 600px) {
    .product-style {
        min-width: 98%;
    }

        .product-style img {
            display: block;
        }
}

.product-style img {
    padding: 0;
    margin-bottom: 15px;
    margin-top: 20px;
    width: 95%;
    margin-right: auto;
    margin-left: auto;
}

.product-style .card-title {
    margin: 0;
    padding: 0 5px 5px;
    text-align: center;
}

.product-style .text-rich {
    padding: 0 5px;
    text-align: left;
}

    .product-style .text-rich ul {
        padding: 0 5px;
        margin-left: 0;
        margin-right: 0;
    }


/*-----------------------  Color Swatch template  --------------------------- */
.color-swatch-container {
    width: 100px;
    max-width: 100px;
    min-width: 100px;
    margin-bottom: 5px !important;
    margin-right: 15px;
    margin-left: 15px;
}

    .color-swatch-container .color {
        height: 96px;
        width: 96%;
        border-radius: 3px;
        margin: 1px auto;
        padding: 0;
    }

    .color-swatch-container .read-toggle {
        color: #0657A8;
        font-size: 12px;
        cursor: pointer;
        text-align: center;
    }

    .color-swatch-container .text-rich {
        padding: 0 5px 5px;
    }

        .color-swatch-container .text-rich * {
            margin: 0;
            padding: 0;
            font-size: 95%;
        }

        .color-swatch-container .text-rich li:before {
            content: none;
            position: relative;
        }

/*--------------------------  Product Image Link template  -------------------------*/
.image-link {
    min-width: 320px;
    max-width: 320px;
    border-radius: 2px;
    margin: 1%;
    padding: 0px;
    vertical-align: top;
    background: #fff;
    border: solid 2px #ddd;
}

    .image-link:hover {
        text-decoration: none;
        border: solid 2px #bbb;
    }

    .image-link .title {
        background: #fff;
        font-size: 20px;
        text-align: left;
        text-transform: uppercase;
        display: flex;
        width: 100%;
        margin: 4px 0px;
        align-items: center;
        font-weight: 500;
        text-decoration: none;
    }

.apparelCategory {
    background: #23527c;
    color: #fff;
    font-size: 20px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    padding: 4px 0px;
}


.image-link .subtext {
    font-size: 15px;
    text-align: left;
    margin: 0;
    color: #444;
}

.image-link img {
    padding: 0px;
    width: 100%;
}

/*--------------------------  Descriptive Image Link template  -------------------------*/
.descriptive-image-link {
    min-width: 300px;
    max-width: 330px;
    border-radius: 2px;
    margin: 1%;
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    padding: 0px;
    vertical-align: top;
    background: #fff;
    text-decoration: none;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .descriptive-image-link {
        border: solid 1px #ddd
    }
}

.descriptive-image-link:hover {
    border-top: 1px solid #bbb;
    color: #333;
    text-decoration: none;
}

.descriptive-image-link .title {
    background: #fff;
    font-size: 18px;
    text-align: center;
    border-bottom: 1px solid #ddd;
    padding: 5px 10px;
    text-transform: uppercase;
    /*position: relative;
    display: table;*/
    width: 100%;
    /*vertical-align: middle;
    height: 52px*/
}

.descriptive-image-link .sub-title {
    font-size: 16px;
    margin: 0;
    padding: 0 10px 5px;
    color: #333;
}

.descriptive-image-link > img {
    width: 95%;
    max-height: 400px;
    padding: 0;
    margin: 1% auto;
}

.descriptive-image-link .text-rich {
    padding: 0 10px 5px;
}

    .descriptive-image-link .text-rich * {
        margin: 0;
        padding: 0
    }


    .descriptive-image-link .text-rich li:before {
        content: none;
        position: relative;
    }

/*--------------------------  Video Image Link template  -------------------------*/
.video-image-link {
    min-width: 310px;
    max-width: 310px;
    line-height: 20px;
    border: none;
    margin: 10px 10px 20px 10px !important;
    font-size: 14px;
    font-weight: 700;
    vertical-align: top;
    text-decoration: none;
    color: #333;
}

@media(max-width: 400px) {
    .video-image-link {
        min-width: 270px;
        max-width: 270px;
        margin: 5px 2px 10px 2px !important;
    }
}

.video-image-link:hover {
    text-decoration: none;
    color: #333;
}

.video-image-link .title {
    display: block;
    margin-top: 5px;
}

.video-image-link .sub-title {
    display: block;
}

.video-image-link > img {
    width: 100%;
    max-height: 165px;
    padding: 0;
    margin: 0;
}

/*-----------------YoutubeVideo template----------------------------*/
.video-wrapper {
    padding-left: 3%;
    padding-right: 3%;
}

@media (max-width: 600px) {
    .video-wrapper {
        padding-left: 1%;
        padding-right: 1%;
    }
}

/*----------------  Event template-------------------------------------*/
.event {
    min-width: 25%;
    max-width: 50%;
    height: 240px;
    padding: 10px 5px;
    margin: 10px 10px;
    background: #fff;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    font-size: 16px;
    text-align: center;
    border-radius: 0;
}

@media (max-width: 768px) {
    .event {
        min-width: 40%;
    }
}

@media (max-width: 600px) {
    .event {
        min-width: 95%;
        max-width: 95%;
        margin: 10px auto;
    }
}

.event .date {
    width: 100%;
    text-align: center;
    padding-top: 10px;
    padding-top: 10px
}

.event .fa {
    opacity: 0.4;
    margin: 5px;
}

.event .location {
    font-style: italic;
    font-weight: bold;
    margin-bottom: 0;
}

    .event .location .fa {
        font-size: 25px;
    }

.event .title {
    text-align: center;
    font-size: 20px;
    margin-bottom: 0;
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    padding-top: 10px;
    padding-bottom: 10px;
}

.event .site {
    margin: 0
}

    .event .site * {
        display: inline-block;
        opacity: 1;
    }

/*------------------------- Testimonials Template  -------------------------*/
.testimonial {
    min-width: 45%;
    max-width: 50%;
    border-top: 1px solid rgba(0,0,0,0.1);
    border-left: 1px solid rgba(0,0,0,0.1);
    margin: 20px 10px;
    margin-bottom: 40px;
    padding: 30px 40px;
}

@media(max-width:900px) {
    .testimonial {
        min-width: 95%;
        max-width: 95%;
    }
}

.testimonial .quote-short {
    color: #0657A8;
    font-size: 18px;
    font-style: italic;
}

.testimonial .quote-long {
    font-size: 16px;
}

    .testimonial .quote-long * {
        margin: 0;
    }

.testimonial .read-toggle {
    margin: 0;
    color: #0657A8;
    font-size: 14px;
    cursor: pointer;
}

.testimonial .quote-from {
    font-style: italic;
}

.nav-item-text {
    margin: 1px 2.5px;
}

/*------------------------- NavItem Button Template --------------------------*/
.nav-item-button {
    background: #0657A8;
    border: 1px solid #0657A8;
    color: #FFF;
    font-size: 16px;
    border-radius: 3px;
    margin: 5px;
    padding: 5px 12px 6px;
    text-decoration: none;
    display: inline-block;
}

    .nav-item-button:hover {
        background: #FFF;
        border: 1px solid #0657A8;
        color: #0657A8;
        -webkit-transition: all 0.5s ease;
        transition: all 0.5s ease;
        outline: 0;
    }

/*------------------------- NavItem Download Template ---------------------------*/
.nav-item-download {
    display: inline-block;
    margin: 1px 2.5px;
}

    .nav-item-download p {
        margin: 0;
        padding: 0;
        font-family: "open sans";
    }

    .nav-item-download a {
        font-family: "open sans";
    }

    .nav-item-download .fa {
        display: inline-flex;
    }

        .nav-item-download .fa:before {
            margin-right: 2px;
        }

/*------------------- Awards Template --------------------------------------*/
.award-container .award-content {
    width: 80%;
    margin: 2% 10%;
    background: #fff;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    font-size: 16px;
    padding: 30px 40px 30px 90px;
    position: relative;
}

    .award-container .award-content .text-columns > div:first-of-type {
        border-right: 2px solid #eee;
    }

    .award-container .award-content > .fa {
        color: #f6db6f;
        font-size: 50px;
        position: absolute;
        top: -5px;
        left: 25px;
    }

    .award-container .award-content > h2 {
        color: #5c5c5c;
        text-shadow: 1px 1px 1px #ccc;
        text-align: left;
    }


@media (max-width:768px) {
    .award-container {
        margin: 0 auto 0;
        padding: 0px;
    }

        .award-container .award-content {
            padding: 1% 2%;
        }

            .award-container .award-content > .fa {
                font-size: 35px;
            }

            .award-container .award-content .text-columns > div:first-of-type {
                border-right: none;
            }
}

/*--------------------------------- iFrame Template -------------------------------------*/
.iframe-container > h2 {
    color: white;
    text-shadow: 1px 1px 1px #024282;
}

.iframe-container .iframe-content {
    width: 80%;
    margin: 2% 10%;
    background: #fff;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    padding: 30px 40px;
    overflow: hidden;
}

    .iframe-container .iframe-content iframe {
        min-height: 75vh !important;
    }

@media (max-width:768px) {
    .iframe-container {
        margin: 0 auto 0;
        padding: 0px;
    }

        .iframe-container .iframe-content {
            padding: 1% 2%;
            margin-left: auto;
            margin-right: auto;
            width: 95%;
        }
}

/*------------------- Text And Image Templates  ---------------------*/
.text-and-image .title {
    font-weight: bold;
    color: #0657A8;
}


/*------------------- Application Short Template  ---------------------*/
.tips-short {
    display: block;
    margin: 5px 10px;
    min-height: 65px;
}

    .tips-short img {
        width: 65px;
        height: 65px;
        float: left;
        margin-right: 10px;
    }

    .tips-short div {
        padding-top: 10px;
    }

        .tips-short div h5 {
            text-align: left;
            color: #0657A8;
            font-size: 16px;
            font-weight: 700;
            margin: 0;
        }

        .tips-short div p {
            font-size: 15px;
            margin: 0;
        }

/*------------------- Dealer side nav menu -------------------------*/
.menu-side-dealer {
    background: #fff;
    border-top: 1px solid #ddd;
    border-radius: 2px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin-bottom: 10px;
    margin-right: 15px;
    margin-top: 5px;
    padding: 0px 15px 10px;
}

    .menu-side-dealer h2 {
        font-size: 26px;
        margin: 15px 0;
    }

    .menu-side-dealer li {
        border-top: 1px solid #ddd;
        padding: 10px;
    }

        .menu-side-dealer li:hover {
            background: #f1f1f1
        }

    .menu-side-dealer a {
        display: inline-block;
        width: 100%;
        height: 100%;
    }

    .menu-side-dealer li a:hover {
        text-decoration: none;
    }

    .menu-side-dealer li a:before {
        font-family: FontAwesome;
        content: "\f105";
        color: #0657A8;
        margin-right: 10%;
    }

@media(max-width:992px) {
    .menu-side-dealer {
        margin: 10px 5px;
    }
}


/*------------------- Dealer Action Links -------------------------*/

.dealer-action-links {
    margin-bottom: 20px;
}

    .dealer-action-links .action-container {
        height: 85px;
        min-width: 235px;
    }

    .dealer-action-links .w-100 {
        height: 10px;
    }

    .dealer-action-links .action-container a {
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        border-radius: 3px;
        display: block;
        width: 100%;
        height: 100%;
        color: #fff;
        position: relative;
    }

        .dealer-action-links .action-container a:hover {
            text-decoration: none;
        }

    .dealer-action-links .action-container .icon {
    }

    .dealer-action-links .action-container span.icon {
        font-size: 9px;
        transform: scale(8,8);
        transform-origin: bottom right;
        position: absolute;
        bottom: 0px;
        right: 10px;
    }

    .dealer-action-links .action-container span.icon-left {
        font-size: 9px;
        transform: scale(8,8);
        transform-origin: bottom left;
        position: absolute;
        bottom: 0px;
        left: 10px;
    }

        .dealer-action-links .action-container span.icon.fa:before, .dealer-action-links .action-container span.icon-left.fa:before {
            opacity: .25;
        }

    .dealer-action-links .action-container a:hover > span.icon.fa:before, .dealer-action-links .action-container a:hover > span.icon-left.fa:before {
        opacity: 1;
    }

    .dealer-action-links .action-container .text-description {
        min-height: 85px;
        padding: 15px 5px 10px 15px;
    }

        .dealer-action-links .action-container .text-description h2 {
            text-align: left;
            font-family: "cabin";
            font-size: 28px;
            margin-bottom: 2px;
            white-space: nowrap;
        }

        .dealer-action-links .action-container .text-description p {
            font-size: 16px;
            white-space: nowrap;
        }


@media (max-width:992px) {
    .dealer-action-links .action-container {
        margin-top: 10px;
    }

    .dealer-action-links {
        margin-top: 0;
        margin-left: 0px;
    }
}




/*------------------------------End Display Templates ----------------------------------------------*/
/*-----------------------------Content containers used on all pages--------------------------- */
.main-content-container {
}

@media (max-width: 1000px) {
    .main-content-container {
        /*padding-top: 40px;*/
    }
}

@media (max-width: 350px) {
    .main-content-container {
        /* padding-top: 80px;*/
    }
}

.content-wrap {
    background: #fff;
}

    .content-wrap.overlayed {
        position: relative
    }

        .content-wrap.overlayed:after {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,0.5);
            display: block;
            z-index: 0
        }

.content-grey-wrapper {
    background: #f6f6f6;
    border-top: 1px solid #eee;
}

.content-container {
    margin: 0 auto;
    max-width: 1440px;
    padding: 15px;
}

    .content-container:after {
        content: "";
        clear: both;
        display: table
    }

.content-container-less {
    margin: 0 auto;
    max-width: 1240px;
    padding: 15px;
}

    .content-container-less:after {
        content: "";
        clear: both;
        display: table
    }

.blue-container {
    background: #0657A8 url(../png/texture-bluebg.png) repeat;
    border-top: 1px solid #05427e;
    padding: 30px 0;
    border-bottom: 1px solid #05427e;
}

.content-wrap-grey {
    border-top: solid 1px #ddd;
    background: #f6f6f6;
}

.content-wrap-white {
    border-top: solid 1px #ddd;
    background: #fff;
}

.white-container {
    background: white;
    border-radius: 6px;
    border: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    width: 75%;
    margin: 2% auto 8%;
}
/*------------------------End Content containers----------------------------------*/


/*-------------------------Home Page ---------------------------------------------*/
body.home .content-wrap {
    text-align: center;
    padding: 50px 0;
}

    body.home .content-wrap.overlayed {
        background-size: cover !important;
        padding: 120px 0;
    }

@media (max-width: 767px) {
    body.home .content-wrap.overlayed {
        background-attachment: inherit;
        padding: 50px 0
    }
}

body.home .content-wrap.overlayed * {
    position: relative;
    z-index: 3;
    color: #fff
}

@media (max-width: 767px) {
    body.home .content-wrap.overlayed * {
        line-height: 1.3em
    }
}

body.home .content-wrap.overlayed p, .content-wrap.overlayed q {
    font-size: 18px;
    font-family: Raleway,sans-serif;
    font-weight: 100;
    line-height: 1.5em
}

@media (max-width: 1000px) {
    body.home .content-wrap.overlayed p, .content-wrap.overlayed q {
        font-size: 15px
    }
}

body.home .main-title {
    margin-top: 10px;
    padding: 0 20px;
    font-family: Raleway,sans-serif;
    font-size: 42px;
    font-weight: 400;
    color: #5c5c5c;
    z-index: 2;
    position: relative;
    text-shadow: none
}

@media (max-width: 600px) {
    body.home .main-title {
        margin-bottom: 30px
    }
}

@media (max-width: 450px) {
    body.home .main-title {
        font-size: 28px;
        margin-top: 0
    }
}

body.home .main-subtitle {
    padding-bottom: 30px;
    padding-top: 10px;
    font-family: Raleway,sans-serif;
    font-size: 18px;
    color: #808080;
    z-index: 2;
    position: relative;
    text-shadow: none;
    text-align: center
}

@media (max-width: 450px) {
    body.home .main-subtitle {
        margin-bottom: 20px
    }
}

@media (max-width: 1000px) {
    body.home .main-subtitle {
        line-height: 1.5;
        padding-right: 8px;
        padding-left: 8px
    }
}

body.home .sides-wrapper {
    overflow: hidden;
    margin: 0 auto;
    display: block;
    position: relative;
    padding: 50px 0
}

@media (max-width: 1000px) {
    body.home .sides-wrapper {
        padding: 0px
    }
}

@media (min-width: 768px) and (max-width: 1000px) {
    body.home .sides-wrapper {
        padding-bottom: 80px
    }
}

body.home .finger-side {
    width: 40%;
    float: left
}

@media (max-width: 1000px) {
    body.home .finger-side {
        float: none;
        width: 100%
    }
}

body.home .finger-side ul {
    margin-left: 25%;
    margin-top: 5%;
    margin-bottom: 10%
}

@media (max-width: 767px) {
    body.home .finger-side ul {
        margin: 0px auto;
        text-align: center
    }
}

@media (min-width: 768px) and (max-width: 1000px) {
    body.home .finger-side ul {
        margin: 0 auto;
        display: table
    }
}

body.home .finger-side ul li {
    margin-bottom: 5%
}

@media (min-width: 768px) and (max-width: 1000px) {
    body.home .finger-side ul li {
        display: table-cell
    }
}

body.home .finger-side ul li p {
    font-family: Raleway,sans-serif;
    display: inline-block;
    padding-left: 10px;
    padding-top: 10px;
    font-size: 18px
}

body.home .finger-side ul li:nth-child(1) > p {
    color: #2bbb76
}

body.home .finger-side ul li:nth-child(2) > p {
    color: #00b1ff
}

body.home .finger-side ul li:nth-child(3) > p {
    color: #EA9212
}

body.home .finger-side img {
    width: 84px;
    height: 84px;
    opacity: 0.7
}

@media (max-width: 768px) {
    body.home .finger-side ul > li:nth-child(1) > img {
        position: relative;
        left: 12px
    }
}

@media (min-width: 768px) and (max-width: 1000px) {
    body.home .finger-side > a {
        position: absolute;
        bottom: 8px;
        display: block;
        width: 30%;
        margin: 0 auto;
        padding: 9px 0px;
        left: 34%
    }
}

body.home .video-side {
    width: 60%;
    float: right;
    position: relative;
    padding-top: 45px;
    padding-bottom: 30.5%;
    height: 0
}

@media (max-width: 1000px) {
    body.home .video-side {
        float: none;
        display: block;
        margin: 36px auto 8px;
        width: 68%
    }
}

body.home .video-side video {
    box-sizing: border-box;
    background-size: 100% 100%;
    padding: 2.3% 13.9% 5% 14.5%;
    position: absolute;
    top: 0;
    left: 0;
    width: 97.5%;
    height: 87.8%
}

@media (max-width: 1500px) {
    body.home .video-side video {
        height: 87.3%
    }
}

@media (max-width: 1250px) {
    body.home .video-side video {
        height: 86%
    }
}

@media (max-width: 1100px) {
    body.home .video-side video {
        height: 85%
    }
}

@media (max-width: 1000px) {
    body.home .video-side video {
        height: 95%
    }
}

@media (max-width: 830px) {
    .video-side video {
        height: 93%
    }
}

body.home .quotes {
    display: none;
    padding: 1% 20%;
    min-height: 180px;
    margin-bottom: 35px;
    font-style: italic;
}

@media (max-width: 767px) {
    body.home .quotes {
        padding: 0% 5%
    }
}

body.home .content-wrap.artwork {
    position: relative;
    max-height: 800px;
    height: 100%;
}

.card-color {
    margin-left: 5px;
    border-style: solid;
    border-color: black;
}

.color_name_desc {
}

body.home .content-wrap.artwork a {
    z-index: 9999;
    background: transparent;
    border: 1px solid #fff;
    padding: 10px 60px;
    color: #fff;
    text-align: center;
    outline: none;
    display: block;
    margin: 0 auto;
    width: 40%;
    margin: 0 auto
}

    body.home .content-wrap.artwork a:hover {
        -webkit-transform: scale(1.01);
        transform: scale(1.01);
        -webkit-transition: all 500ms linear;
        transition: all 500ms linear;
        text-decoration: none
    }

@media (max-width: 1200px) {
    body.home .content-wrap.artwork a {
        width: 60%
    }
}

body.home .content-wrap.artwork > img {
    display: block;
    margin: 0 auto;
    max-height: 675px;
}

body.home .content-wrap.artwork {
    text-align: center;
    color: #fff;
    max-width: 2000px;
    margin: 0 auto;
}

body.home .artwork-inside {
    display: inline-block;
    margin: 0;
    position: relative;
    max-width: 50%;
}

body.home .artwork-text {
    position: absolute;
    top: 3vh;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 999;
}

    body.home .artwork-text h2 {
        font-weight: 600;
        font-size: 3vw;
        margin-top: 1vw;
        font-family: Raleway,sans-serif;
    }

    body.home .artwork-text p {
        font-weight: 600;
        font-size: 1.5vw;
        padding: 0 10%;
    }

    body.home .artwork-text .link-content {
        position: absolute;
        bottom: 15%;
        left: 0;
        right: 0;
    }

body.home .content-wrap.artwork a:hover {
    transition: all 200ms linear;
    background-color: #fff;
    color: #00a1ff;
    text-decoration: none !important;
    outline: none;
}

@media (min-width:2200px) {
    body.home .artwork-text h2 {
        font-size: 2vw;
        margin-top: 1.5vw;
    }

    body.home .artwork-text p {
        font-weight: 600;
        font-size: 1vw;
        padding: 0 10%;
    }
}

@media (min-width:3100px) {
    body.home .artwork-text h2 {
        font-size: 1.4vw;
        margin-top: 1.5vw;
    }

    body.home .artwork-text p {
        font-weight: 600;
        font-size: .7vw;
        padding: 0 10%;
    }

}
@media (max-width:768px) {
    body.home .content-wrap.artwork {
        max-height: none;
    }

    body.home .artwork-inside {
        max-width: 100%;
    }

    body.home .artwork-text h2 {
        font-size: 4vw;
        margin-top: 1.5vw;
    }

    body.home .artwork-text p {
        font-size: 2.5vw;
    }

    body.home .content-wrap.artwork a {
        padding: 5px 60px;
    }
}

body.home .business-box img {
    display: block;
}
/*-------------------------- End Home Page ----------------------------------------*/


/*------------------------Product category page ---------------------------------------*/
body.product-category .content-wrap {
    background: #f6f6f6;
}

@media (max-width: 450px) {
    body.product-category .thumb-landing {
        margin-top: 0
    }
}

body.product-category .thumb-landing h1 {
    margin: 15px 0 10px;
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    padding-top: 10px;
    padding-bottom: 10px;
}

@media (max-width: 650px) {
    body.product-category .thumb-landing h1 {
        margin: 30px 0 0
    }
}

@media (max-width: 450px) {
    body.product-category .thumb-landing h1 {
        margin: 0
    }
}


/*-------------------------- End Product category Page ----------------------------------------*/


/*-------------------------- Product Page ----------------------------------------*/

body.product-details .product-detail-container {
    background: #f6f6f6;
    padding-bottom: 10px;
}

body.product-details .product-detail {
    padding: 20px 0px;
    margin: 0 auto;
    max-width: 1440px;
}

.content-container.product-detail {
    padding: 40px 1%
}

@media (max-width: 400px) {
    body.product-details .product-detail {
        padding: 0px
    }
}

body.product-details .breadcrumb {
    background: transparent;
    padding: 0
}

body.product-details .breadcrumb {
    margin-bottom: 8px;
    list-style: none;
    border-radius: 4px;
}

    body.product-details .breadcrumb > li {
        display: inline-block
    }

        body.product-details .breadcrumb > li + li:before {
            content: " / ";
            padding: 0 5px;
            color: #ccc
        }

    body.product-details .breadcrumb > .active {
        color: #777777
    }

@media (max-width: 400px) {
    body.product-details .breadcrumb {
        padding-top: 10px;
        padding-left: 5px
    }
}

body.product-details .breadcrumb ul li {
    display: inline-block
}

body.product-details .product-detail .image-container {
    border: 1px solid #ddd;
    float: left;
    width: 35%;
    background: #fff;
    position: relative;
    margin-top: 0;
}

body.product-details .product-detail .certification-container {
    border-top: 1px solid #eee;
    float: left;
    width: 100%;
    background: #fff;
    position: relative;
    text-align: center;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    body.product-details .product-detail .image-container {
        border: solid 1px #ddd
    }
}


body.product-details .product-detail .image-container > img {
    max-width: 100%;
    position: relative;
    padding: 10px;
}

body.product-details .thumb-container {
    border-top: #eee solid 1px;
    margin-top: 0px;
    padding: 10px;
}

    body.product-details .thumb-container img {
        border: 1px solid #ccc;
        border-radius: 2px;
        cursor: pointer;
        display: inline-block;
        width: 93px;
        height: 93px;
    }


body.product-details .thumb-container-certification img {
    border: 1px solid #ccc;
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
    width: 50px;
    height: 50px;
}

body.product-details .thumb-container .selected {
    border: solid 2px #0071e3;
}

body.product-details .product-detail .product-container {
    float: right;
    width: 62%;
    border: 1px solid #ddd;
    border-radius: 3px;
    position: relative;
    background: #fff
}

.product-slider-section {
    /*padding: 30px 0;*/
    max-width: 82%;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #ddd;
    float: left;
    width: 45%;
    background: #fff;
    position: relative;
    text-align: center;
}

    .product-slider-section .carousel-inner {
        cursor: crosshair;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .product-slider-section .carousel-indicators {
    }

        .product-slider-section .carousel-indicators li {
            cursor: pointer;
            float: left;
            display: flex;
            height: auto;
            text-align: center;
            text-indent: unset;
            width: 185px;
            border-left: 1px solid #e6e6e6;
            border-top: 2px solid #fff;
        }

            .product-slider-section .carousel-indicators li:first-child {
                border-left: none;
            }



.indicator {
    text-align: center;
    align-items: center;
    justify-content: center;
}

.product-slider-section .carousel-indicators li.active {
    border-top: 2px solid #659ff0;
}

.product-slider-section .carousel-indicators li .data-slide-image {
    width: 100px;
    margin: 0 auto;
}

@media (max-width: 1000px) {
    body.product-details .product-detail .product-container {
        width: 100%
    }

    body.product-details .product-detail .image-container {
        width: 100%;
    }
}

@media (max-width: 1000px) {
    body.product-details .product-detail .product-container:after {
        content: '';
        display: block;
        position: absolute;
        top: 24px;
        left: -40px;
        width: 0;
        height: 0;
        border-color: transparent #fff transparent transparent;
        border-style: solid;
        border-width: 20px
    }
}

body.product-details .product-detail .product-container:before {
    content: '';
    display: block;
    position: absolute;
    top: 23px;
    left: -42px;
    width: 0;
    height: 0;
    border-color: transparent #ddd transparent transparent;
    border-style: solid;
    border-width: 21px
}

@media (max-width: 1000px) {
    body.product-details .product-detail .product-container:before {
        border-color: transparent transparent #ddd transparent;
        top: -42px;
        left: 47.5%;
    }
}

@media (max-width: 768px) {
    body.product-details .product-detail .product-container:before {
        left: 47%;
    }
}

@media (max-width: 450px) {
    body.product-details .product-detail .product-container:before {
        left: 44%;
    }
}

body.product-details .product-detail .product-container .product-subcontainer {
    padding: 10px 20px 10px 30px;
}

@media (max-width: 1100px) {
    body.product-details .product-detail .product-container .product-subcontainer {
        padding: 20px 20px 10px 30px;
    }
}

@media (max-width: 767px) {
    body.product-details .product-detail .product-container .product-subcontainer {
        padding: 15px;
    }
}


body.product-details .product-detail .product-container .product-title {
    font-family: Cabin;
    font-size: 24px
}

@media (max-width: 600px) {
    body.product-details .product-detail .product-container .product-title {
        padding-right: 50px
    }
}

body.product-details .product-detail .product-container .product-title h1 {
    font-size: 30px;
    margin: 0;
    text-align: left;
    text-transform: uppercase;
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    padding-top: 10px;
    padding-bottom: 10px;
}

@media (max-width: 900px) {
    body.product-details .product-detail .product-container .product-title h1 {
        padding-left: 0
    }
}

body.product-details .product-detail .product-container .product-title h3 {
    color: #0657A8;
    margin: 0;
    text-align: left;
    font-family: Cabin;
}


body.product-details .product-detail .product-container .product-description {
    margin: 10px 0;
    overflow: hidden;
    padding-right: 5px
}


body.product-details .cart select {
    background: #FFF;
    border: 1px solid #0657A8;
    height: 35px;
    font-size: 12px;
    margin: 10px 0;
    max-width: 290px;
    width: initial
}

@media (max-width: 750px) {
    body.product-details .cart select {
        max-width: calc(100% - 20px);
        width: calc(100% - 20px);
        margin: 10px
    }
}

body.product-details .cart .option {
    margin: 5px 0 10px 0;
}

    body.product-details .cart .option input {
        margin-left: 10px;
    }

body.product-details .cart .quantity input {
    width: 60px;
    margin-right: 5px
}

body.product-details .cta-links {
    margin: 10px 0;
}

body.product-details .cta-links {
    padding: 5px;
}

    body.product-details .cta-links h5 {
        font-weight: bold;
        margin-top: 25px;
        text-align: left;
        text-transform: uppercase;
    }

body.product-details .type-inner {
    border-top: 1px solid #eee;
    padding-bottom: 30px;
    background: #fff;
}

    body.product-details .type-inner:nth-child(even) {
        background: #f6f6f6;
    }

    body.product-details .type-inner > div:first-child {
        margin: 0 auto;
        max-width: 1440px;
        padding-top: 15px;
        padding-bottom: 15px;
    }

body.product-details .tips .col-md {
    margin-top: 55px;
}

body.product-details .tips .tips-icon {
    border-right: solid 2px #eee;
    margin-bottom: 20px;
}

    body.product-details .tips .tips-icon ul li {
        background: url(../png/icon-lightbulb.png) left no-repeat;
        padding: 10px 0 10px 75px;
        margin-left: 5%;
        min-height: 75px;
        width: 90%
    }

@media (max-width: 768px) {
    body.product-details .tips .tips-icon {
        border: none;
    }
}

body.product-details .tips .application {
    margin-top: 25px;
    padding: 10px 35px;
}

@media (max-width: 768px) {
    body.product-details .tips .application {
        border-left: 0;
        padding: 0 35px 10px 40px;
        margin-top: 0
    }
}

body.product-details .tips .application h3 {
    color: #0657A8;
    text-align: left
}

@media (max-width: 768px) {
    body.product-details .tips .application h3 {
        margin: 0;
    }
}

body.product-details .tips-shorts ul li {
    width: 100%;
    display: inline-block;
    margin: 0px 0 20px;
    vertical-align: top;
}

@media (max-width: 768px) {
    body.product-details .tips-shorts ul li {
        margin: 0px;
    }
}

body.product-details .tips-shorts ul li div {
    padding: 0 10%;
}

    body.product-details .tips-shorts ul li div img {
        width: 65px;
        height: 65px;
        float: left;
        margin-right: 20px;
    }

    body.product-details .tips-shorts ul li div h5 {
        text-align: left;
        color: #0657A8;
        font-size: 16px;
        font-weight: 700;
        margin: 0;
        padding-top: 15px;
    }

    body.product-details .tips-shorts ul li div p {
        font-size: 15px;
    }

body.product-details .faqs {
    padding: 20px
}

@media (max-width: 600px) {
    body.product-details .faqs {
        padding: 0
    }
}

body.product-details .faqs .faq {
    max-height: 320px;
    overflow: auto
}

@media (max-width: 900px) {
    body.product-details .faqs .faq {
        display: block;
        margin-bottom: 15px;
        padding-right: 0
    }
}

body.product-details .faqs > div {
    padding: 25px 10px
}

body.product-details .faqs h2 {
    margin-bottom: 0px;
    color: #0657A8;
    font-weight: 600;
    text-shadow: 1px 1px 1px #fff;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: left;
    font-size: 38px;
    padding-left: 8px;
    letter-spacing: -1px
}

body.product-details .faqs div.answer {
    border-left: 1px solid #eee;
    padding-left: 15px;
    font-size: 14px;
    line-height: 22px;
    margin: 8px 20px 30px 38px
}

@media (max-width: 600px) {
    body.product-details .faqs div.answer {
        border-left: none
    }
}

body.product-details .faqs div.question {
    background: #ececec;
    border-radius: 3px;
    border-bottom: 1px solid #ddd;
    color: black;
    font-size: 15px;
    margin-top: 8px;
    position: relative;
    padding: 5px 10px 5px 45px;
    margin-left: 8px
}

    body.product-details .faqs div.question:before {
        content: "Q:";
        background: white;
        border: 4px solid #ececec;
        border-radius: 50%;
        color: #0657A8;
        font-weight: bold;
        font-size: 16px;
        padding: 8px 12px;
        position: absolute;
        left: -7px;
        top: -7px
    }

body.product-details .faqs .faq .question *, body.product-details .faqs .faq .answer * {
    margin: 0;
    padding: 0;
}

body.product-details .faqs .blog-button {
    padding-left: 2%;
    width: 40%
}

    body.product-details .faqs .blog-button h4 {
        text-align: left;
    }

@media (min-width: 901px) {
    body.product-details .faqs .blog-button {
        padding-left: 26px
    }
}

@media (max-width: 900px) {
    body.product-details .faqs .blog-button {
        display: block;
        width: 100%;
        border-left: 0
    }
}

body.product-details .category-list {
    font-size: 0;
    text-align: center;
    margin-bottom: 50px
}

bodyproduct-details .category-list:after {
    content: "";
    display: table;
    clear: both
}

body.product-details .category-list > li {
    width: 10%;
    border-radius: 2px;
    display: inline-block;
    margin: 1%;
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    padding: 0px;
    vertical-align: top;
    background: #fff
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    body.product-details .category-list > li {
        border: solid 1px #ddd
    }
}

@media (max-width: 600px) {
    body.product-details .category-list > li {
        width: 95%;
        max-width: 400px
    }
}

.Label-title-Artwork-Upload {
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    width: 100%
}

.form-min-height {
    min-height: 540px;
}


body.product-details .category-list > li:hover {
    border-top: 1px solid #bbb;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.8)
}

body.product-details .category-list > li a {
    text-decoration: none
}

    body.product-details .category-list > li a:hover {
        color: #333;
        text-decoration: none
    }

body.product-details .category-list > li .category-title {
    background: #fff;
    font-size: 18px;
    text-align: center;
    border-bottom: 1px solid #ddd;
    padding: 5px 10px;
    text-transform: uppercase;
    position: relative;
    display: table;
    width: 100%
}

    body.product-details .category-list > li .category-title a {
        display: table-cell;
        vertical-align: middle;
        height: 52px
    }

    body.product-details .category-list > li .category-title:before {
        content: "";
        height: 5px;
        width: 25px;
        background: #fff;
        position: absolute;
        right: 0;
        bottom: -1px
    }

    body.product-details .category-list > li .category-title:after {
        content: "";
        height: 5px;
        width: 25px;
        background: #fff;
        position: absolute;
        left: 0;
        bottom: -1px
    }

body.product-details .category-list > li .category-subtext {
    font-size: 15px;
    text-align: left;
    margin: 0;
    min-height: 60px;
    padding: 0 15px 15px
}

body.product-details .category-list > li img {
    width: 100%;
    max-height: 400px;
    padding: 15px
}

body.product-details .you-tube .iframe-container {
    width: 100%;
    padding: 5px 20vw;
    height: 40vh;
}

@media(max-width: 600px) {
    body.product-details .you-tube .iframe-container {
        padding: 5px 5vw;
        height: 40vh;
    }
}

body.product-details .you-tube .iframe-container iframe {
    width: 100%;
    height: 100%;
}

body.product-details .product-form-container {
    max-width: 1440px;
    margin: 0 auto 5px;
}

@media(max-width: 1200px) {

    body.product-details .product-form-container {
        width: 100%;
        margin: 0 auto 5px;
    }
}
/*-------------------------- End Product Page ----------------------------------------*/


/*--------------------------Stock Product Forms   ----------------------------------------*/
.product-form-container .product-form-options {
    background: #FFF;
    border-radius: 2px;
    border: 1px solid #ddd;
    border-top: none;
    padding: 20px 30px 30px;
}

@media (max-width: 400px) {
    .product-form-container .product-form-options {
        padding: 20px 10px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .product-form-container .product-form-options {
        border-right: solid 1px #ddd
    }
}

.product-form-container .product-form-options .product-option {
    margin-bottom: 32px;
}

    .product-form-container .product-form-options .product-option .title {
        color: #333333;
        font-weight: bold;
        padding-bottom: 14px;
        font-size: 20px;
        text-align: left;
        margin: 0;
    }

    .product-form-container .product-form-options .product-option input[type="radio"] {
        width: 0;
        opacity: 0;
        height: 0;
    }

    .product-form-container .product-form-options .product-option input[type="number"] {
        margin-right: 10px;
        margin-left: 5px;
        border-radius: 3px;
        border: 1px solid #ccc;
        height: 35px;
        background: #fff;
        font-size: 24px;
        text-align: center;
        width: 60px;
        padding-left: 5px !important;
    }

    .product-form-container .product-form-options .product-option .option {
        float: left;
    }

        .product-form-container .product-form-options .product-option .option label {
            width: 100%;
            height: 100%;
            padding: 4px;
        }

    .product-form-container .product-form-options .product-option .block-select {
        min-height: 35px;
        /*line-height: 35px;*/
        margin-right: 4px;
        margin-bottom: 10px;
        /*border-left: 3px solid transparent;*/
        border: 2px solid #e2ebf6;
        border-radius: 2px;
        text-align: center;
        cursor: pointer;
    }

        .product-form-container .product-form-options .product-option .block-select:hover {
            border: 2px solid #c4d1e1;
        }

        .product-form-container .product-form-options .product-option .block-select.active {
            border: 2px solid #0071e3;
        }

    .product-form-container .product-form-options .product-option .option-style {
        padding: 6px;
    }

        .product-form-container .product-form-options .product-option .option-style img {
            height: 28px;
        }

        .product-form-container .product-form-options .product-option .option-style span {
            display: block;
        }

    .product-form-container .product-form-options .product-option .option-style-notext {
        width: 200px;
    }

        .product-form-container .product-form-options .product-option .option-style-notext img {
            padding: 5px 0;
        }

    /*        .product-form-container .product-form-options .product-option .option-size {
            width: 130px;
        }*/

    .product-form-container .product-form-options .product-option .option-color {
        color: white;
        height: 74px;
        width: 74px;
        border-radius: 3px;
        margin: 0px 4px 4px 0px;
        cursor: pointer;
        position: relative;
        font-size: 11px;
        border: 2px solid #e2ebf6;
    }

        .product-form-container .product-form-options .product-option .option-color:hover {
            border: 2px solid #c4d1e1;
        }

        .product-form-container .product-form-options .product-option .option-color.active {
            border: 2px solid #0071e3;
        }


    .product-form-container .product-form-options .product-option .check-select.active label:after {
        content: "\f00c";
        font-family: FontAwesome;
        position: absolute;
        right: 0;
        top: 0px;
        text-align: center;
        left: 0;
        line-height: 58px;
        color: #fff;
        font-size: 26px;
        text-shadow: -1px 0 #555, 0 1px #555, 1px 0 #555, 0 -1px #555;
    }

    .product-form-container .product-form-options .product-option .option-color span {
        display: inline-block;
        position: absolute;
        background: rgba(255,255,255,0.9);
        color: #333;
        text-align: center;
        padding: 1px 0 1px;
        left: 3px;
        right: 3px;
        bottom: 3px;
        border-radius: 2px;
    }

    .product-form-container .product-form-options .product-option .option-quantity {
        float: none;
        display: inline-block;
    }

        .product-form-container .product-form-options .product-option .option-quantity label {
            width: auto;
            display: inline-block;
            font-size: 13pt;
            margin-bottom: 10px;
        }

@media(max-width: 360px ) {
    .product-form-container .product-form-options .product-option .option-quantity label {
        width: 60px;
        text-align: right;
    }
}

.product-form-container .product-form-options .product-option .form-calculate.disabled {
    cursor: not-allowed;
    pointer-events: none !important;
    background: #ccc !important;
    color: white;
    border: none;
}

.product-option .form-requirements {
    padding: 12px 12px 12px 15px;
    border: 1px solid #ddd;
    border-radius: 2px;
    margin-left: 20px;
    display: inline-block;
    vertical-align: middle;
    width: 100%;
}

    .product-option .form-requirements li .field-validation-error {
        background: inherit;
        color: inherit;
    }

.product-form-quote .terms-use {
    background: #fff;
    border-top: 1px solid #ddd;
    border-radius: 2px;
    margin-bottom: 10px;
    padding: 0px 15px 10px
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .terms-use {
        border-left: solid 1px #ddd
    }
}

.product-form-quote .terms-use hr {
    margin: 10px 0
}

.product-form-quote .terms-use h2 {
    font-size: 26px;
    text-align: center;
    margin-top: 15px;
    margin-bottom: 15px
}

.product-form-quote .terms-use .summary-item span {
    float: right;
}

.product-form-quote .terms-use .summary-item.summary-item-total span {
    font-weight: 700;
    float: right;
}


.product-form-quote .terms-use .summary-item.summary-item-total .summary-item-title.border-bottomed {
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    padding-top: 10px;
    margin: 10px 0
}

.product-form-quote button {
    width: 100%;
    border: none;
    background: #26A65B;
    color: white;
    transition: background 0.2s ease-in;
    text-transform: uppercase;
    border-radius: 4px;
    height: 54px;
    font-size: 16px;
    font-weight: 600;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin-bottom: 10px;
}

    .product-form-quote button:hover {
        background: #043e77;
        -webkit-transition: background 0.2s ease-in;
        transition: background 0.2s ease-in
    }

.product-form-quote .terms-use.summary-details {
    padding: 12px 12px 12px 15px;
    border-left: 3px solid #f6db6f;
}

    .product-form-quote .terms-use.summary-details .summary-description span {
        padding: 0 .1em;
    }

    .product-form-quote .terms-use.summary-details .summary-item-title span {
        margin-left: 10px;
        font-weight: 700;
    }
/*--------------------------End Stock Product Forms  ----------------------------------------*/
/*-------------------------- Content Page ----------------------------------------*/
@media(max-width: 1460px ) {
    body .content-page .content-container {
        padding-right: 1%;
        padding-left: 1%;
    }
}
/*-------------------------- End Content Page ----------------------------------------*/


/*-------------------------- Content Page Title ----------------------------------------*/
body .content-page-title .content-header {
    margin-bottom: 5px;
}

    body.content-page-title .content-header h1 {
        color: #5c5c5c;
        font-weight: 400;
        font-family: Raleway, sans-serif;
        font-size: 2em;
        padding-top: 10px;
        padding-bottom: 10px;
        margin: .67em auto 5px;
    }

    body.content-page-title .content-header h2 {
        color: #5c5c5c;
        font-family: Raleway, sans-serif;
        font-size: 1.75em;
        margin-top: 0;
        padding-top: 0;
    }

    body.content-page-title .content-header .text-rich {
        text-align: center;
        width: 80%;
        margin: 0 auto;
    }
/*--------------------------End Content Page Title ----------------------------------------*/


/*-------------------------- Login Page ----------------------------------------*/
body.login .login-form {
    background: white;
    border-radius: 6px;
    border: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    width: 75%;
    margin: 2% auto 8%;
}

    body.login .login-form h1 {
        font-size: 34px;
        color: #5c5c5c;
        font-weight: 400;
        font-family: Raleway,sans-serif;
        padding-bottom: 0
    }

    body.login .login-form form {
        width: 70%;
        margin: 0 auto 50px;
    }

    body.login .login-form input {
        margin-top: 5px;
        margin-bottom: 15px;
        border-color: #c0cdd4;
        width: 100%;
    }

        body.login .login-form input[type="text"], body.login .login-form input[type="password"] {
            padding-left: 45px;
        }

    body.login .login-form .form-actions a {
        font-size: 14px;
    }

    body.login .login-form .user-id, body.login .login-form .user-password {
        position: relative;
    }

        body.login .login-form .user-id:before, body.login .login-form .user-password:before {
            font-size: 20px;
            color: rgba(0,0,0,0.2);
            position: absolute;
            bottom: 18px;
            left: 15px
        }

        body.login .login-form .user-id:before {
            content: "\f007";
            font-family: "FontAwesome";
        }

        body.login .login-form .user-password:before {
            content: "\f023";
            font-family: "FontAwesome";
        }

body.login .content-side {
    margin-top: 15px;
}

    body.login .content-side .single-image-link {
        width: 60%;
        margin: 0 auto;
    }

@media (max-width: 1000px) {
    body.login .login-form, body.login .login-form form {
        width: 90%;
    }
}
/*-------------------------- End Login Page ----------------------------------------*/


/*-------------------------- Reset Password & change Password ages ----------------------------------------*/

body.reset-password h1, body.change-password h1 {
    font-size: 34px;
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    padding-bottom: 0
}

body.reset-password form, body.change-password form {
    width: 90%;
    margin: 0 auto 25px;
}

body.reset-password input, body.change-password input {
    margin: 12px 0px;
    display: block;
    border-color: #c0cdd4;
    width: 75%
}

body.reset-password .message-container {
    margin: 0 auto;
    display: block;
}


body.change-password label {
    margin-left: 12.5%;
}




@media (max-width: 768px) {
    body .reset-password .white-container, body .change-password .white-container {
        width: 100%;
    }

    body.reset-password form, body.change-password form {
        width: 100%;
    }

    body.reset-password input, body.reset-password .message-container, body.change-password input {
        width: 90%;
    }

    body.change-password label {
        margin-left: 5%;
    }
}

/*-------------------------- End Reset Password Page ----------------------------------------*/



/*-------------------------- Callus Layout Page ----------------------------------------*/

body.call-us-layout .content-container {
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin: 0px auto 40px;
    background: #fff;
    padding-top: 0;
}

body.call-us-layout .content-header {
    position: relative;
    border-bottom: 1px solid #ddd;
    margin: 0;
}

    body.call-us-layout .content-header h1 {
        border-right: 1px solid #ddd;
        font-size: 36px;
        margin: 0;
        padding: 20px 0 20px 20px;
        width: calc(100% - 200px);
        text-align: left;
        color: #5c5c5c;
        font-weight: 400;
        font-family: Raleway,sans-serif;
    }

    body.call-us-layout .content-header .call-us {
        width: 200px;
        position: absolute;
        top: 0;
        right: 0;
        padding: 20px 0 20px 50px;
    }

        body.call-us-layout .content-header .call-us .fa {
            position: absolute;
            left: 15px;
            top: 25px;
            font-size: 32px;
            color: #888
        }

body.call-us-layout .content-main {
    padding: 10px 35px 40px;
}

    body.call-us-layout .content-main .text-rich {
        max-width: 900px;
        margin: 0 auto;
    }


@media (max-width: 900px) {
    body.call-us-layout .content-header .call-us {
        width: 100%;
        position: relative;
        border-left: 0;
        border-top: 1px solid #ddd;
        margin-bottom: 0;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    body.call-us-layout .content-header h1 {
        width: 100%;
        border-right: 0
    }

    body.call-us-layout .content-header .call-us .fa {
        top: 15px;
    }

    body.call-us-layout .content-main {
        padding: 20px;
    }
}
/*-------------------------- End  Callus Layout Page ----------------------------------------*/



/*-------------------------- Bookmark Layout Page ----------------------------------------*/
body.bookmark-layout .content-header h1 {
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    font-size: 42px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 15px 0 10px;
}

body.bookmark-layout .texture-grey {
    border-top: solid 1px #ddd;
    border-bottom: solid 1px #ddd;
}

body.bookmark-layout .bookmark-container {
    width: 80%;
    margin: 2% 10%;
    background: #fff;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    font-size: 16px;
    padding: 30px 40px 30px 90px;
    position: relative;
    overflow: hidden;
}

    body.bookmark-layout .bookmark-container .fa {
        color: #f6db6f;
        font-size: 50px;
        position: absolute;
        top: -5px;
        left: 25px;
    }

body.bookmark-layout .content-main {
    padding: 10px 35px 40px;
}

@media(max-width: 900px) {
    body.bookmark-layout .content-main {
        padding: 20px;
    }
}

@media (max-width: 650px) {
    .content-container.thumb-landing h1 {
        margin: 30px 0 0;
    }

    body.bookmark-layout .bookmark-container {
        padding: 30px 10px 10px;
        width: 96%;
        margin-left: 2%;
    }

        body.bookmark-layout .bookmark-container .fa {
            font-size: 35px;
        }
}
/*-------------------------- End  Bookmark Layout Page ----------------------------------------*/

/*-------------------------- Contact Us Page ----------------------------------------*/
body.contact-us .content-container {
    padding-left: 10px;
    padding-right: 10px;
}

body.contact-us h1.title {
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    font-size: 42px;
    padding-top: 10px;
    padding-bottom: 10px;
}

body.contact-us .contact-detail {
    display: inline-block;
    width: calc(33.333333% - 10px);
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    font-size: 14px;
    background: #fff;
    min-height: 70px;
    float: left;
    vertical-align: top;
    margin: 0 5px 10px;
    padding: 8px 20px 8px 10px;
    position: relative;
    border-radius: 2px;
}

body.contact-us .contact-detail-66 {
    display: inline-block;
    width: calc(66.666666% - 10px);
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    font-size: 14px;
    background: #fff;
    min-height: 70px;
    float: left;
    vertical-align: top;
    margin: 0 5px 10px;
    padding: 8px 20px 8px 10px;
    position: relative;
    border-radius: 2px;
}

body.contact-us .contact-detail-100 {
    display: inline-block;
    width: calc(100% - 10px);
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    font-size: 14px;
    background: #fff;
    min-height: 70px;
    float: left;
    vertical-align: top;
    margin: 0 5px 10px;
    padding: 8px 20px 8px 10px;
    position: relative;
    border-radius: 2px;
}

    body.contact-us .contact-detail i.fa, body.contact-us .contact-detail-66 i.fa, body.contact-us .contact-detail-100 i.fa {
        position: absolute;
        top: 8px;
        right: 8px;
        color: #888;
        font-size: 18px;
    }

    body.contact-us .contact-detail h4, body.contact-us .contact-detail-66 h4, body.contact-us .contact-detail-100 h4 {
        font-size: 18px;
        text-align: left;
        margin: 0 0 5px;
        font-weight: 700;
    }

body.contact-us .text-rich *:not(ul):not(ol) {
    padding: 0;
    margin: 0;
}

body.contact-us .text-rich ul, body.contact-us .text-rich ol {
    margin: 0;
}

@media (max-width: 1024px) {
    body.contact-us .text-rich ul, body.contact-us .text-rich ol {
        padding-left: 1.2em;
    }
}

body.contact-us .contact-form {
    margin: 0 5px 10px;
    clear: both;
}

    body.contact-us .contact-form label {
        margin-top: 10px;
        margin-bottom: 3px;
    }

    body.contact-us .contact-form input:not([type="submit"]) {
        width: 100%;
    }

    body.contact-us .contact-form textarea {
        width: 100%;
        height: 108px;
    }

    body.contact-us .contact-form input[type="submit"] {
        float: right;
        margin-top: 10px;
        margin-bottom: 3px;
    }

/*-------------------------- End  Contact Us Page ----------------------------------------*/


/*-------------------------- Dealer Pages ----------------------------------------*/
.double-col-list-container p {
    font-weight: 600;
}

.double-col-list-container ul, .double-col-list-container ol {
    display: inline-block;
    width: 49%;
    list-style-type: initial;
    vertical-align: top;
    margin-bottom: 10px;
    padding-left: 39px;
}

body.dealer .white-container {
    border-bottom: none;
    border-right: none;
    border-left: none;
    padding: 0px 30px 20px;
    margin: 5px 5px 40px 15px;
    border-radius: 0;
    width: 100%;
}

    body.dealer .white-container h1 {
        font-size: 30px;
        text-align: left;
        margin-bottom: 20px;
        text-transform: uppercase;
        color: #0657A8;
        letter-spacing: -1px;
        font-weight: 600;
    }


body.dealer .form-container .form-group {
    width: 48%;
    display: inline-block;
}

    body.dealer .form-container .form-group input[type="text"], body.dealer .form-container .form-group input[type="password"], body.dealer .form-container .form-group select {
        width: 95%;
    }

    .big-checkbox {
        transform: scale(1.5);
        transform-origin: top left;
        margin-left: 12px;
    }

    .pack-checkbox-label {
        font-size:17px;
        margin-left:40px;
        margin-top:2px;
    }

    body.dealer .form-container .form-group label {
        margin-bottom: 5px;
    }


@media (min-width: 768px) {
    .modal-xl {
        width: 70%;
        max-width: 865px;
    }
}

@media (min-width: 768px) {
    .modal-xl-address {
        width: 60%;
        max-width: 865px;
    }
}


@media(max-width:992px) {
    body .dealer .white-container {
        margin: 10px -15px 10px 15px;
        padding-top: 5px;
    }
}

@media(max-width:768px) {
    body.dealer .form-container .form-group, body.dealer .form-container .form-group.w-25, body.dealer .form-container .terms-message {
        width: 100% !important;
    }
}

body.dealer .modal-body .form-container {
}

/*-------------------------- Dealer User Settings Page ----------------------------------------*/
body.dealer #ContactsContainer {
    margin-top: 20px;
}

    body.dealer #ContactsContainer label {
        font-weight: 900;
        margin-right: 10px;
    }
/*-------------------------- End Dealer User Settings Page ----------------------------------------*/

/*-------------------------- Dashboard Page -------------------------------------------------------*/

.no-p {
    padding: 0 !important
}


.user-id-dashboard {
    font-family: arial, helvetica, sans-serif
}

.register-inputs {
    border-top: 1px solid #ddd;
    float: left;
    overflow: auto;
    padding: 0px 30px 20px;
    margin-bottom: 40px;
    width: 72%
}

@media (max-width: 900px) {
    .register-inputs {
        min-height: auto;
        width: 100%;
        margin-bottom: 20px
    }
}

@media (max-width: 600px) {
    .register-inputs {
        padding: 0px 5px 20px
    }
}

.register-inputs.dashboard {
    min-height: 550px
}

@media (max-width: 900px) {
    .register-inputs.dashboard {
        min-height: auto
    }
}

.register-inputs .names-list {
    display: block;
}

@media (max-width: 800px) {
    .register-inputs .names-list {
        width: 100%
    }
}

.register-inputs .names-list .btn.grey {
    float: left;
    margin-left: 12px
}

.register-inputs .names-list .modal-container {
    float: left;
    position: relative
}

    .register-inputs .names-list .modal-container .btn {
        min-width: 22%;
        margin-left: 88px;
        -webkit-transition: background 0.3s ease-in;
        transition: background 0.3s ease-in
    }

        .register-inputs .names-list .modal-container .btn.cancel {
            background: #ccc;
            border-color: #aaa;
            color: #333
        }

    .register-inputs .names-list .modal-container .modal-content, .register-inputs .names-list .modal-container .modal-backdrop {
        cursor: pointer;
        height: 0;
        width: 0;
        opacity: 0;
        overflow: hidden;
        -webkit-transition: opacity 0.2s ease-in;
        transition: opacity 0.2s ease-in;
        visibility: hidden
    }

    .register-inputs .names-list .modal-container .modal-close {
        background: #fff;
        color: #aaa;
        cursor: pointer;
        font-size: 16px;
        font-weight: bold;
        padding-top: 3px;
        position: absolute;
        right: 5px;
        top: 5px;
        height: 25px;
        text-align: center;
        width: 25px
    }

        .register-inputs .names-list .modal-container .modal-close:hover {
            color: #333
        }

    .register-inputs .names-list .modal-container #modal-toggle {
        display: none
    }

        .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-backdrop, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-backdrop {
            background-color: rgba(0,0,0,0.6);
            width: 100vw;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            opacity: 1;
            -webkit-transition: opacity 0.2s ease-in;
            transition: opacity 0.2s ease-in;
            visibility: visible;
            z-index: 9999999
        }

        .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content {
            background: #fff;
            border-radius: 4px;
            box-shadow: 0 3px 7px rgba(0,0,0,0.6);
            cursor: auto;
            max-width: 520px;
            height: 530px;
            padding: 10px 30px;
            padding: 20px 30px;
            position: fixed;
            left: calc(50% - 260px);
            top: 5%;
            opacity: 1;
            overflow: auto;
            pointer-events: auto;
            visibility: visible;
            width: 100%;
            z-index: 9999999;
            max-height: calc(100vh - 6%)
        }

@media (max-width: 530px) {
    .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content {
        margin: 0 2px;
        top: 45px;
        left: 0;
        height: calc(100% - 60px);
        width: calc(100% - 4px)
    }
}

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content input, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
    width: 50%
}

@media (max-width: 600px) {
    .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content input, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
        width: 100%
    }
}

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content h4, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content h4 {
    font-size: 15px;
    margin: 15px 0
}

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list {
    overflow: hidden
}

    .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border-top: 1px solid #ccc;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.6);
        border-radius: 2px;
        float: left;
        line-height: 34px;
        margin: 0 10px 5px 1px;
        min-height: 41px;
        min-width: 100px;
        text-align: center;
        padding: 3px 5px
    }

@media (max-width: 400px) {
    .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        width: 115px
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border: solid 1px #ddd
    }

        .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color {
            border: none !important
        }
}

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.top-pad, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.top-pad {
    padding-top: 8px
}

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color span, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color span {
    background: rgba(255,255,255,0.6);
    border-radius: 2px;
    padding: 1px 3px
}

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li#vertical img, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li#vertical img {
    max-height: 46px
}

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list label, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list label {
    display: block
}

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names {
    display: inline-block;
    margin-left: 25px;
    width: 100%
}

    .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li {
        color: #26A65B;
        float: left;
        list-style-type: decimal;
        margin-right: 2%;
        width: 30%
    }

        .register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li span, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li span {
            color: initial
        }

.register-inputs .names-list .modal-container #modal-toggle.active ~ .modal-content .btn, .register-inputs .names-list .modal-container #modal-toggle:checked ~ .modal-content .btn {
    float: right;
    margin-left: 10px;
    min-width: 12%
}

.register-inputs #more-names, .register-inputs #more-names-5 {
    border: none;
    background: #26A65B;
    color: white;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in;
    border-radius: 20px;
    height: 28px;
    font-size: 18px;
    font-weight: 600;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    position: absolute;
    bottom: 12px;
    left: 13px;
    width: 28px;
    z-index: 1
}

@media (max-width: 768px) {
    .register-inputs #more-names, .register-inputs #more-names-5 {
        font-size: 0px
    }
}

.register-inputs #more-names span, .register-inputs #more-names-5 span {
    font-size: 18px
}

.register-inputs #more-names:hover, .register-inputs #more-names-5:hover {
    background: #043e77;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in
}

.register-inputs #more-names-5 {
    left: 50px;
    padding-top: 1px
}

    .register-inputs #more-names-5 span {
        font-size: 14px
    }

.register-inputs.shopping-cart {
    border: 0;
    padding: 0 0 0 2px;
    overflow: visible
}

    .register-inputs.shopping-cart h1 {
        color: #0657A8;
        font-size: 26px;
        font-weight: 600;
        letter-spacing: -1px;
        margin: 10px 0 10px;
        padding-left: 30px;
        text-align: left;
        text-transform: uppercase
    }

    .register-inputs.shopping-cart h2 {
        font-size: 26px;
        margin-bottom: 40px;
        padding-left: 30px
    }

@media (max-width: 500px) {
    .register-inputs.shopping-cart h2 {
        padding-left: 5px
    }
}

@media (max-width: 600px) {
    .register-inputs.shopping-cart h2.filter {
        margin-bottom: 40px
    }
}

@media (max-width: 450px) {
    .register-inputs.shopping-cart h4 {
        padding-left: 5px
    }
}

.register-inputs.shopping-cart .additional-products {
    margin-bottom: 40px
}

@media (max-width: 600px) {
    .register-inputs.shopping-cart .additional-products {
        display: none
    }
}

.register-inputs.shopping-cart .additional-products .category-list {
    text-align: left
}

    .register-inputs.shopping-cart .additional-products .category-list li {
        min-height: 215px;
        position: relative;
        margin: 0 0.8% 0.8% 0;
        min-width: 19%;
        text-align: center
    }

        .register-inputs.shopping-cart .additional-products .category-list li:first-child {
            margin-left: 0
        }

.register-inputs.shopping-cart .additional-products .btn.full-w {
    display: none
}

.register-inputs.shopping-cart .additional-products img {
    max-height: 150px;
    width: auto;
    padding-bottom: 0
}

.register-inputs.shopping-cart .additional-products a {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0
}

.register-inputs.shopping-cart .additional-products p {
    pointer-events: none;
    margin-bottom: 0 !important;
    min-height: auto !important;
    padding-bottom: 0;
    text-align: left;
    padding: 0 40px 0 15px;
    max-height: 40px;
    overflow: hidden
}

.register-inputs.shopping-cart .additional-products .category-title {
    position: absolute;
    bottom: 0;
    pointer-events: none;
    font-size: 14px;
    margin-bottom: 0;
    min-height: 52px;
    border: 0;
    padding: 5px;
    padding-bottom: 0;
    text-transform: none
}

    .register-inputs.shopping-cart .additional-products .category-title:before, .register-inputs.shopping-cart .additional-products .category-title:after {
        display: none
    }

.register-inputs.shopping-cart .checkout-table h4 {
    padding-left: 0;
    margin-bottom: 10px
}

.register-inputs.shopping-cart .size {
    color: #bbb;
    font-size: 14px;
    font-weight: normal
}

.register-inputs.shopping-cart .banner-promo {
    background: #FFF;
    border: 1px dotted #ccc;
    border-radius: 3px;
    color: #000;
    display: block;
    font-weight: bold;
    padding: 5px 10px;
    margin: 5px 0;
    margin-right: 8%
}

    .register-inputs.shopping-cart .banner-promo img {
        display: inline-block;
        padding: 0;
        vertical-align: top;
        width: 25%
    }

    .register-inputs.shopping-cart .banner-promo p {
        display: inline-block;
        font-size: 13px;
        line-height: 15px;
        margin-left: 3%;
        margin-bottom: 0;
        text-align: center;
        width: 68%
    }

        .register-inputs.shopping-cart .banner-promo p .promo-price {
            background: #0657A8;
            border-radius: 3px;
            color: #FFF;
            display: inline-block;
            font-size: 12px;
            margin-top: 2px;
            padding: 2px;
            width: 90%
        }

.register-inputs.upload-artwork {
    background: #fff;
    border-radius: 3px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    border: 1px solid #ddd;
    border-left: 4px solid rgba(38,166,91,0.7);
    margin-bottom: 20px
}

    .register-inputs.upload-artwork:after {
        content: "";
        display: table;
        clear: both
    }

    .register-inputs.upload-artwork .upload-instruction-text {
        float: left;
        font-size: 16px;
        line-height: 24px;
        padding-left: 20px;
        padding-right: 20px;
        width: 50%
    }

@media (max-width: 600px) {
    .register-inputs.upload-artwork .upload-instruction-text {
        width: 100%;
        padding-left: 0
    }
}

.register-inputs.upload-artwork .upload-instruction-text.bordered {
    border-right: 1px dotted #ccc;
    padding-left: 0
}

@media (max-width: 600px) {
    .register-inputs.upload-artwork .upload-instruction-text.bordered {
        border: 0
    }
}

.register-inputs.upload-artwork h1 {
    color: #0657A8;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -1px;
    margin: 10px 0 0;
    text-align: left;
    text-transform: uppercase
}

.register-inputs.upload-artwork-step, .register-inputs.new-resolution {
    background: #fff;
    border-radius: 3px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin-bottom: 20px;
    border-left: 1px solid #ddd;
    position: relative;
    min-height: 220px
}

@media (max-width: 400px) {
    .register-inputs.upload-artwork-step, .register-inputs.new-resolution {
        min-height: 275px
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .register-inputs.upload-artwork-step, .register-inputs.new-resolution {
        border-right: solid 1px #ddd
    }
}

.register-inputs.video-inputs {
    background: #fff;
    border-radius: 3px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    padding: 0;
    border-left: 1px solid #ddd
}

@media (max-width: 400px) {
    .register-inputs.video-inputs {
        overflow: hidden
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .register-inputs.video-inputs {
        border-right: solid 1px rgba(0,0,0,0.1)
    }
}

.register-inputs.video-inputs h3 {
    color: #0657A8;
    text-align: center;
    margin-top: 30px
}

.register-inputs.video-inputs .video-info {
    border-top: 1px solid #ddd;
    float: left;
    font-size: 15px;
    padding: 15px;
    width: 80%;
    white-space: pre-line
}

@media (max-width: 600px) {
    .register-inputs.video-inputs .video-info {
        width: 60%;
        padding: 15px 0 15px 15px
    }
}

.register-inputs.video-inputs .video-tool {
    cursor: pointer;
    float: right;
    font-size: 14px;
    height: 75px;
    text-align: center;
    padding: 15px;
    width: 10%
}

@media (max-width: 600px) {
    .register-inputs.video-inputs .video-tool {
        width: 20%;
        padding: 15px 5px
    }
}

.register-inputs.video-inputs .video-tool .fa {
    color: rgba(0,0,0,0.6);
    display: block;
    font-size: 22px;
    padding-bottom: 5px
}

.register-inputs.video-inputs .video-tool-no-cursor {
    float: right;
    width: 10%;
    height: 75px;
    text-align: center;
    padding: 15px;
    font-size: 14px
}

@media (max-width: 600px) {
    .register-inputs.video-inputs .video-tool-no-cursor {
        width: 20%;
        padding: 15px 5px
    }
}

.register-inputs.video-inputs .video-tool-no-cursor .fa {
    color: rgba(0,0,0,0.6);
    display: block;
    font-size: 22px;
    padding-bottom: 5px
}

.register-inputs.video-inputs .video-feature {
    height: 0;
    padding: 0;
    position: relative;
    padding-bottom: 53%;
    padding-top: 30px;
    overflow: hidden
}

    .register-inputs.video-inputs .video-feature iframe {
        max-height: 542px;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

.register-inputs h1, .register-inputs h2 {
    font-size: 30px;
    text-align: left;
    margin-bottom: 20px;
    text-transform: uppercase;
    color: #0657A8;
    letter-spacing: -1px;
    font-weight: 600
}

.register-inputs h3 {
    text-align: left;
    font-size: 26px
}

@media (max-width: 600px) {
    .register-inputs h3 {
        font-size: 20px;
        text-indent: -2em;
        padding-left: 2em
    }
}

.register-inputs h3 span {
    display: inline-block;
    background: transparent;
    color: #0657A8;
    width: 36px;
    line-height: 28px;
    border: 2px solid #0657A8;
    text-align: center;
    border-radius: 65%;
    padding: 1px 0 3px;
    position: relative;
    top: 0px;
    margin-right: 5px
}

@media (max-width: 600px) {
    .register-inputs h3 span {
        width: 30px;
        height: 30px;
        text-indent: 0;
        line-height: 24px;
        margin-left: 5px
    }
}

.register-inputs h4 {
    color: #0657A8;
    font-weight: bold;
    text-align: left;
    margin-bottom: 5px;
    display: inline-block;
}

.register-inputs table {
    background: #fff;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin-bottom: 0px
}

    .register-inputs table tr.no-img img {
        display: none
    }

    .register-inputs table tr.no-img td:nth-child(1) {
        background: url(http://d1rr21ussi0sgo.cloudfront.net/assets/tx-logo-7e82637209a5cab3f4994d217f262af4f81b4d96193e8de1a4cb6ef43777d1e8.svg) no-repeat;
        background-size: 50px;
        background-position: 35px;
        opacity: 0.5
    }

    .register-inputs table.cart-press {
        border-left: 4px solid rgba(6,87,168,0.6)
    }

@media (max-width: 450px) {
    .register-inputs table.cart-press {
        border-left: 0
    }
}

.register-inputs table.cart-transfer {
    border-left: 4px solid rgba(38,166,91,0.6)
}

.register-inputs table.cart-apparel {
    border-left: 4px solid rgba(199,45,35,0.6)
}

.register-inputs table td span {
    display: block;
    font-weight: bold;
    text-transform: capitalize
}

.register-inputs table td img {
    width: 80px;
    padding: 5px 5px 10px 0;
    margin: 0
}

.register-inputs table thead {
    background: #fff;
    border-left: 4px solid #666;
    color: #0657A8;
    font-size: 15px
}

@media (max-width: 450px) {
    .register-inputs table thead {
        border-left: 0
    }
}

.register-inputs table td:nth-child(2) {
    width: 24%;
    text-align: left;
    padding-bottom: 5px
}

@media (max-width: 700px) {
    .register-inputs table td:nth-child(2) {
        width: 18%
    }
}

@media (max-width: 500px) {
    .register-inputs table td:nth-child(2) {
        padding-left: 10px;
        width: 25%
    }
}

.register-inputs table td:nth-child(2) a {
    cursor: pointer;
    text-decoration: none;
    color: #0657A8
}

    .register-inputs table td:nth-child(2) a:hover {
        text-decoration: underline;
        color: #23527c
    }

@media (max-width: 600px) {
    .register-inputs table td:nth-child(3), .register-inputs table th:nth-child(3) {
        display: none
    }
}

@media (max-width: 450px) {
    .register-inputs table td:nth-child(4), .register-inputs table th:nth-child(4) {
        display: none
    }
}

.register-inputs table th:nth-child(2) {
    text-align: left
}

@media (max-width: 700px) {
    .register-inputs table th:nth-child(2) {
        width: 18%
    }
}

@media (max-width: 500px) {
    .register-inputs table th:nth-child(2) {
        padding-left: 10px
    }
}

.register-inputs table th:nth-child(1) {
    text-align: left;
    padding-left: 30px
}

@media (max-width: 500px) {
    .register-inputs table th:nth-child(1) {
        display: none
    }
}

.register-inputs table td:nth-child(1) {
    width: 15%;
    padding-left: 30px;
    padding-top: 20px;
    text-align: left
}

@media (max-width: 700px) {
    .register-inputs table td:nth-child(1) {
        padding-left: 15px;
        width: 110px
    }
}

@media (max-width: 500px) {
    .register-inputs table td:nth-child(1) {
        display: none
    }
}

@media (max-width: 450px) {
    .register-inputs table td:nth-child(2) {
        font-size: 14px;
        padding-left: 10px
    }
}

.register-inputs table th, .register-inputs table td {
    text-align: center
}

.register-inputs table tr {
    border-bottom: 1px solid #ddd
}

    .register-inputs table tr.no-stock {
        border-left: 4px solid #f6db6f;
        background: rgba(246,219,111,0.15);
        position: relative;
        opacity: 0.9
    }

        .register-inputs table tr.no-stock .qty-input {
            border: 1px solid #ef2028
        }

    .register-inputs table tr.not-available {
        border-left: 4px solid #ef2028;
        background: rgba(199,45,35,0.1);
        position: relative;
        opacity: 0.9
    }

        .register-inputs table tr.not-available .qty-input {
            background: #ccc;
            pointer-events: none
        }

        .register-inputs table tr.not-available .inactive-edit a, .register-inputs table tr.not-available td:nth-child(7) a {
            color: transparent;
            pointer-events: none
        }

.register-inputs table td {
    font-size: 15px;
    /*        vertical-align: top;
        padding-top: 30px;*/
    padding-bottom: 10px
}

@media (max-width: 450px) {
    .register-inputs table td {
        padding-top: 20px;
        font-size: 14px;
        padding-left: 5px
    }
}

.register-inputs table th {
    height: 40px;
    line-height: 40px
}

@media (max-width: 320px) {
    .register-inputs table th {
        line-height: normal
    }
}

.register-inputs table .actions {
    /*padding: 32px 2px 0*/
}

@media (max-width: 450px) {
    .register-inputs table .actions {
        font-size: 18px;
        padding: 20px 4px 0
    }
}

@media (max-width: 450px) and (max-width: 320px) {
    .register-inputs table .actions {
        display: inline-block;
        width: 40px;
        padding: 3px 0
    }
}

.register-inputs table .actions .fa-times {
    color: #ef2028
}

    .register-inputs table .actions .fa-times:hover {
        color: #a31a12
    }

.register-inputs table .actions:last-child {
    padding-right: 5px
}

.register-inputs table #numbers-order-tab {
    display: none
}

    .register-inputs table #numbers-order-tab.active {
        display: block
    }

    .register-inputs table #numbers-order-tab table.numberstable {
        box-shadow: none;
        margin-top: 5px
    }

        .register-inputs table #numbers-order-tab table.numberstable thead {
            background: #eee;
            border: initial;
            color: #333
        }

            .register-inputs table #numbers-order-tab table.numberstable thead th {
                border: 1px solid #ddd;
                height: initial;
                line-height: initial;
                padding: 0 5px
            }

        .register-inputs table #numbers-order-tab table.numberstable td {
            border: 1px solid #ddd;
            padding: 0 5px;
            width: initial
        }

.register-inputs table .subtotal {
    border-left: 4px solid #666
}

    .register-inputs table .subtotal td {
        padding: 10px;
        text-align: right
    }

        .register-inputs table .subtotal td.unit-price-disclaimer {
            font-size: 11px;
            width: 38%;
            text-align: left;
            padding-left: 3%
        }

    .register-inputs table .subtotal .fa {
        color: rgba(0,0,0,0.6)
    }

.order-table, .declined-cc-table {
    background: #fff;
    margin-left: 1px;
    position: relative;
    margin-bottom: 10px;
}

    .order-table h4.filter-calendar, .declined-cc-table h4.filter-calendar {
        color: inherit;
        /*IE fallback for initial*/
        color: initial;
        font-size: 15px;
        position: absolute;
        top: 3%;
        right: 1%;
        text-align: right;
    }

@media (max-width: 600px) {
    .order-table h4.filter-calendar, .declined-cc-table h4.filter-calendar {
        position: absolute;
        top: 13%;
        left: 0;
        text-align: left;
    }
}

.order-table h4.filter-calendar label, .declined-cc-table h4.filter-calendar label {
    font-weight: bold;
}

.order-table h4.filter-calendar input, .declined-cc-table h4.filter-calendar input {
    width: 105px;
    height: 28px;
}

@media (max-width: 450px) {
    .order-table h4.filter-calendar input, .declined-cc-table h4.filter-calendar input {
        width: 80px;
    }
}

.order-table h4.filter-calendar input:focus, .declined-cc-table h4.filter-calendar input:focus {
    background: #e9f6ef;
    outline: none;
}

.order-table.uploads, .declined-cc-table.uploads {
    padding-left: 15px;
    padding-right: 10px;
}

.order-table .order-item, .declined-cc-table .order-item {
    border-bottom: 1px solid #eee;
    text-align: center;
    height: 75px;
    display: table;
    table-layout: fixed;
    width: 100%;
}

@media (max-width: 600px) {
    .order-table .order-item, .declined-cc-table .order-item {
        width: 100%;
        height: 80px;
    }
}

.order-table .order-item.no-img img, .declined-cc-table .order-item.no-img img {
    display: none;
}

.order-table .order-item.no-img li.thumb a.reordering-btn, .declined-cc-table .order-item.no-img li.thumb a.reordering-btn {
    background: #0657A8;
}

.order-table .order-item.titles, .declined-cc-table .order-item.titles {
    height: 30px;
    line-height: 30px;
    font-weight: bold;
}

    .order-table .order-item.titles li, .declined-cc-table .order-item.titles li {
        line-height: 1;
        display: table-cell;
        vertical-align: middle;
        height: 30px;
        font-size: 14px;
        vertical-align: bottom;
        padding-bottom: 10px;
    }

@media (max-width: 768px) {
    .order-table .order-item.titles li, .declined-cc-table .order-item.titles li {
        font-size: 13px;
    }
}

.order-table .order-item.titles li.date, .order-table .order-item.titles li.reference, .order-table .order-item.titles li.status, .declined-cc-table .order-item.titles li.date, .declined-cc-table .order-item.titles li.reference, .declined-cc-table .order-item.titles li.status {
    font-size: 14px;
}

@media (max-width: 768px) {
    .order-table .order-item.titles li.date, .order-table .order-item.titles li.reference, .order-table .order-item.titles li.status, .declined-cc-table .order-item.titles li.date, .declined-cc-table .order-item.titles li.reference, .declined-cc-table .order-item.titles li.status {
        font-size: 13px;
    }
}

.order-table .order-item.titles li.status select, .declined-cc-table .order-item.titles li.status select {
    border: 0;
    width: 80%;
}

.order-table .order-item li, .declined-cc-table .order-item li {
    width: 9%;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
    height: 75px;
    padding-top: 5px;
}

@media (max-width: 768px) {
    .order-table .order-item li.po-number, .declined-cc-table .order-item li.po-number {
        display: none;
    }
}

@media (max-width: 768px) {
    .order-table .order-item li, .declined-cc-table .order-item li {
        font-size: 13px;
    }
}

@media (max-width: 600px) {
    .order-table .order-item li, .declined-cc-table .order-item li {
        width: 12%;
        font-size: 11px;
    }
}

.order-table .order-item li p, .declined-cc-table .order-item li p {
    margin-bottom: 0px;
}

.order-table .order-item li:last-child, .declined-cc-table .order-item li:last-child {
    margin-right: 0;
}

.order-table .order-item li.credit-card, .declined-cc-table .order-item li.credit-card {
    width: 146px;
}

.order-table .order-item li.orders, .declined-cc-table .order-item li.orders {
    min-width: 89px;
}

.order-table .order-item li.amount, .declined-cc-table .order-item li.amount {
    width: 7%;
}

.order-table .order-item li.last-four, .declined-cc-table .order-item li.last-four {
    width: 66px;
}

.order-table .order-item li.date, .declined-cc-table .order-item li.date {
    font-size: 13px;
    width: 12%;
    padding-right: 1%;
}

@media (max-width: 650px) {
    .order-table .order-item li.date, .declined-cc-table .order-item li.date {
        display: none;
    }
}

.order-table .order-item li.ship-date, .declined-cc-table .order-item li.ship-date {
    font-size: 13px;
    width: 8%;
    padding-right: 1%;
}

@media (max-width: 650px) {
    .order-table .order-item li.ship-date, .declined-cc-table .order-item li.ship-date {
        font-size: 11px;
        width: 11%;
        padding-right: .5%;
    }
}

.order-table .order-item li.Tracking {
    width: 7%;
}

.order-table .order-item li.description, .declined-cc-table .order-item li.description {
    width: 22%;
    text-align: left;
    padding-left: 1%;
    line-height: 1.2;
    text-transform: capitalize;
}

    .order-table .order-item li.description.resolution, .declined-cc-table .order-item li.description.resolution {
        width: 25%;
    }

@media (max-width: 600px) {
    .order-table .order-item li.description.resolution, .declined-cc-table .order-item li.description.resolution {
        padding-left: 5px;
        width: 15%;
        line-height: 1;
    }
}

@media (max-width: 600px) {
    .order-table .order-item li.description, .declined-cc-table .order-item li.description {
        padding-left: 4px;
        width: 16%;
        line-height: 1;
    }
}

.order-table .order-item li.filename, .declined-cc-table .order-item li.filename {
    width: 20%;
    text-align: left;
    padding-left: 2%;
    word-break: break-all;
}

@media (max-width: 600px) {
    .order-table .order-item li.filename, .declined-cc-table .order-item li.filename {
        display: none;
    }
}

.order-table .order-item li.thumb, .declined-cc-table .order-item li.thumb {
    position: relative;
}

    .order-table .order-item li.thumb a.reordering-btn, .declined-cc-table .order-item li.thumb a.reordering-btn {
        background: rgba(6, 87, 168, 0.7);
        color: white;
        font-size: 12px;
        position: absolute;
        bottom: 0;
        right: 0;
        width: 100%;
    }

        .order-table .order-item li.thumb a.reordering-btn:hover, .declined-cc-table .order-item li.thumb a.reordering-btn:hover {
            background: #0657A8;
            text-decoration: none;
        }

@media (max-width: 600px) {
    .order-table .order-item li.po-number, .declined-cc-table .order-item li.po-number {
        display: none;
    }
}

.order-table .order-item li.reference, .declined-cc-table .order-item li.reference {
    font-size: 13px;
}

@media (max-width: 700px) {
    .order-table .order-item li.reference, .declined-cc-table .order-item li.reference {
        display: none;
    }
}

@media (max-width: 700px) {
    .order-table .order-item li.invoice-number, .declined-cc-table .order-item li.invoice-number {
        text-align: left;
    }
}

.order-table .order-item li.invoice-number .mobileorder, .declined-cc-table .order-item li.invoice-number .mobileorder {
    display: none;
}

@media (max-width: 700px) {
    .order-table .order-item li.invoice-number .mobileorder, .declined-cc-table .order-item li.invoice-number .mobileorder {
        display: block;
    }
}

.order-table .order-item li.actions .fa, .declined-cc-table .order-item li.actions .fa {
    font-size: 18px;
    margin: 0 3px;
    color: #666;
    cursor: pointer;
}

.order-table .order-item li.actions a.edit:hover .fa, .declined-cc-table .order-item li.actions a.edit:hover .fa {
    color: #26A65B;
}

.order-table .order-item li.actions a.cancel:hover .fa, .declined-cc-table .order-item li.actions a.cancel:hover .fa {
    color: #ef2028;
}

.order-table .order-item li.status, .declined-cc-table .order-item li.status {
    font-size: 13px;
    width: 10%;
}

    .order-table .order-item li.status.resolution, .declined-cc-table .order-item li.status.resolution {
        width: 8%;
    }

    .order-table .order-item li.status br, .declined-cc-table .order-item li.status br {
        display: none;
    }

@media (max-width: 600px) {
    .order-table .order-item li.status, .declined-cc-table .order-item li.status {
        width: 10%;
        font-size: 10px;
    }
}

.order-table .order-item li.status .fa, .declined-cc-table .order-item li.status .fa {
    color: rgba(0, 0, 0, 0.6);
    margin-top: 0px;
}

.order-table .order-item li.status.waiting, .declined-cc-table .order-item li.status.waiting {
    border-left: 4px solid #f6db6f;
}

    .order-table .order-item li.status.waiting:before, .declined-cc-table .order-item li.status.waiting:before {
        color: rgba(0, 0, 0, 0.6);
        content: "\f017";
        font-family: FontAwesome;
        font-size: 16px;
        line-height: 18px;
    }

    .order-table .order-item li.status.waiting br, .declined-cc-table .order-item li.status.waiting br {
        display: block;
    }

.order-table .order-item li.status.on-time, .declined-cc-table .order-item li.status.on-time {
    border-left: 4px solid rgba(45, 219, 203, 0.6);
}

    .order-table .order-item li.status.on-time:before, .declined-cc-table .order-item li.status.on-time:before {
        color: rgba(0, 0, 0, 0.6);
        content: "\f013";
        font-family: FontAwesome;
        font-size: 16px;
        line-height: 18px;
    }

    .order-table .order-item li.status.on-time br, .declined-cc-table .order-item li.status.on-time br {
        display: block;
    }

.order-table .order-item li.status.completed, .declined-cc-table .order-item li.status.completed {
    border-left: 4px solid rgba(38, 166, 91, 0.6);
}

    .order-table .order-item li.status.completed:before, .declined-cc-table .order-item li.status.completed:before {
        color: rgba(0, 0, 0, 0.6);
        content: "\f00c";
        font-family: FontAwesome;
        font-size: 16px;
        line-height: 18px;
    }

    .order-table .order-item li.status.completed br, .declined-cc-table .order-item li.status.completed br {
        display: block;
    }

.order-table .order-item li.status.deleted, .declined-cc-table .order-item li.status.deleted {
    border-left: 4px solid rgba(199, 45, 35, 0.6);
}

    .order-table .order-item li.status.deleted:before, .declined-cc-table .order-item li.status.deleted:before {
        color: rgba(0, 0, 0, 0.6);
        content: "\f1f8";
        font-family: FontAwesome;
        font-size: 16px;
        line-height: 18px;
    }

    .order-table .order-item li.status.deleted br, .declined-cc-table .order-item li.status.deleted br {
        display: block;
    }

.order-table .order-item li.status.cancelled, .declined-cc-table .order-item li.status.cancelled {
    border-left: 4px solid rgba(199, 45, 35, 0.6);
}

    .order-table .order-item li.status.cancelled:before, .declined-cc-table .order-item li.status.cancelled:before {
        color: rgba(0, 0, 0, 0.6);
        content: "\f05e";
        font-family: FontAwesome;
        font-size: 16px;
        line-height: 18px;
    }

    .order-table .order-item li.status.cancelled br, .declined-cc-table .order-item li.status.cancelled br {
        display: block;
    }

    .order-table .order-item li.status.waiting:before, .order-table .order-item li.status.completed:before, .order-table .order-item li.status.cancelled:before, .order-table .order-item li.status.deleted:before, .order-table .order-item li.status.on-time:before, .declined-cc-table .order-item li.status.waiting:before, .declined-cc-table .order-item li.status.completed:before, .declined-cc-table .order-item li.status.cancelled:before, .declined-cc-table .order-item li.status.deleted:before, .declined-cc-table .order-item li.status.on-time:before {
        display: inline-block;
        line-height: 0;
        margin-top: -10px;
    }

.order-table .order-item li img, .declined-cc-table .order-item li img {
    max-height: 75px;
}

.order-table .order-item li .preview-image-upload .modal-content img, .declined-cc-table .order-item li .preview-image-upload .modal-content img {
    max-height: calc(100vh - 30px);
}

.order-table.proof .order-item li, .declined-cc-table.proof .order-item li {
    width: 10%;
    margin-right: 0.5%;
}

@media (max-width: 768px) {
    .order-table.proof .order-item li, .declined-cc-table.proof .order-item li {
        font-size: 13px;
    }
}

@media (max-width: 600px) {
    .order-table.proof .order-item li, .declined-cc-table.proof .order-item li {
        width: 20%;
        font-size: 12px;
    }
}

.order-table.proof .order-item li:last-child, .declined-cc-table.proof .order-item li:last-child {
    margin-right: 0;
}

.order-table.proof .order-item li.description, .declined-cc-table.proof .order-item li.description {
    width: 30%;
}

@media (max-width: 700px) {
    .order-table.proof .order-item li.description, .declined-cc-table.proof .order-item li.description {
        width: 38%;
    }
}

@media (max-width: 650px) {
    .order-table.proof .order-item li.description, .declined-cc-table.proof .order-item li.description {
        width: 60%;
    }
}

@media (max-width: 600px) {
    .order-table.proof .order-item li.description, .declined-cc-table.proof .order-item li.description {
        width: 30%;
        text-transform: lowercase;
    }
}

@media (max-width: 600px) {
    .order-table.proof .order-item li.thumb, .declined-cc-table.proof .order-item li.thumb {
        width: 15%;
    }
}

.order-table.proof .order-item.titles, .declined-cc-table.proof .order-item.titles {
    height: 50px;
}

@media (max-width: 600px) {
    .order-table.proof .order-item.titles .description, .declined-cc-table.proof .order-item.titles .description {
        text-transform: capitalize;
    }
}

@media (max-width: 600px) {
    .order-table.uploads .order-item li, .declined-cc-table.uploads .order-item li {
        width: 24%;
    }
}

.order-table.uploads .order-item li.reference, .declined-cc-table.uploads .order-item li.reference {
    width: 16%;
    text-align: left;
}

@media (max-width: 600px) {
    .order-table.uploads .order-item li.reference, .declined-cc-table.uploads .order-item li.reference {
        font-size: 13px;
    }
}

@media (max-width: 600px) {
    .order-table.uploads .order-item li.description, .declined-cc-table.uploads .order-item li.description {
        padding-left: 20px;
        width: 30%;
    }
}

.order-table.invoices .order-item li.number, .declined-cc-table.invoices .order-item li.number {
    width: 6%;
}

.order-table .credit-card-contain, .declined-cc-table .credit-card-contain {
    text-align: right;
    margin: 15px 16px 0px 16px;
}

.order-table .declined-cc-row, .declined-cc-table .declined-cc-row {
    margin-bottom: 0px;
}

.new-modal-container {
    padding-top: 0px
}

    .new-modal-container .modal-btn {
        display: block;
        border: 0;
        cursor: pointer
    }

    .new-modal-container .modal-btn-clipart {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        cursor: pointer
    }

    .new-modal-container .modal-content, .new-modal-container .modal-backdrop {
        height: 0;
        width: 0;
        opacity: 0;
        visibility: hidden;
        overflow: hidden;
        cursor: pointer;
        -webkit-transition: opacity 0.2s ease-in;
        transition: opacity 0.2s ease-in
    }

    .new-modal-container .modal-close {
        color: #aaa;
        cursor: pointer;
        font-size: 16px;
        position: absolute;
        right: 5px;
        top: 5px;
        padding-top: 3px;
        width: 25px;
        height: 25px;
        font-weight: bold;
        text-align: center;
        z-index: 999
    }

        .new-modal-container .modal-close:hover {
            color: #333
        }

    .new-modal-container .modal-content-btn {
        background: #0657A8;
        color: #fff;
        font-weight: normal;
        font-size: 14px;
        position: absolute;
        text-align: center;
        cursor: pointer;
        bottom: 20px;
        right: 30px;
        width: 50px;
        border-radius: 2px;
        height: 32px;
        padding-top: 6px
    }

        .new-modal-container .modal-content-btn:hover {
            color: #fff;
            background: #365690
        }

        .new-modal-container .modal-content-btn.save-address, .new-modal-container .modal-content-btn#save-new-credit-card, .new-modal-container .modal-content-btn#save-edit-credit-card {
            border-radius: 3px
        }

@media (max-width: 600px) {
    .new-modal-container .modal-content-btn.save-address, .new-modal-container .modal-content-btn#save-new-credit-card, .new-modal-container .modal-content-btn#save-edit-credit-card {
        position: relative;
        left: 0;
        bottom: 0;
        font-size: 20px;
        height: 50px;
        line-height: 2;
        text-transform: uppercase;
        width: 100% !important
    }
}

.new-modal-container .modal-btn-contain {
    position: relative;
    height: 33px;
    width: 100%
}

    .new-modal-container .modal-btn-contain .modal-content-btn {
        top: 0;
        right: 10px
    }

.new-modal-container > input[type='checkbox'] {
    display: none
}

    .new-modal-container > input[type='checkbox'].active ~ .modal-backdrop, .new-modal-container > input[type='checkbox']:checked ~ .modal-backdrop {
        background-color: rgba(0,0,0,0.6);
        width: 100vw;
        height: 100vh;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 999999;
        visibility: visible;
        opacity: 1;
        -webkit-transition: opacity 0.2s ease-in;
        transition: opacity 0.2s ease-in
    }

    .new-modal-container > input[type='checkbox'].active ~ .modal-content, .new-modal-container > input[type='checkbox']:checked ~ .modal-content {
        text-align: center;
        opacity: 1;
        background-color: #fff;
        max-width: 400px;
        width: 400px;
        height: 400px;
        padding: 10px 30px;
        position: fixed;
        left: calc(50% - 200px);
        top: 0;
        border-radius: 4px;
        z-index: 999999;
        pointer-events: auto;
        cursor: auto;
        visibility: visible;
        max-height: calc(100vh);
        overflow: auto;
        box-shadow: 0 3px 7px rgba(0,0,0,0.6)
    }

@media (min-width: 375px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content, .new-modal-container > input[type='checkbox']:checked ~ .modal-content {
        padding: 10px 14px
    }
}

@media (max-width: 356px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content, .new-modal-container > input[type='checkbox']:checked ~ .modal-content {
        left: 0;
        width: 100%;
        height: 56%;
        padding: 8px;
        overflow: auto
    }
}

@media (max-width: 356px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content, .new-modal-container > input[type='checkbox']:checked ~ .modal-content {
        height: 61.5%
    }
}

@media (max-width: 347px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content, .new-modal-container > input[type='checkbox']:checked ~ .modal-content {
        height: 66.5%
    }
}

@media (max-width: 600px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content, .new-modal-container > input[type='checkbox']:checked ~ .modal-content {
        top: 5%;
        padding-bottom: 40px
    }
}

.new-modal-container > input[type='checkbox'].active ~ .modal-content.credit-card, .new-modal-container > input[type='checkbox']:checked ~ .modal-content.credit-card {
    max-width: 800px;
    width: 800px;
    height: auto;
    left: calc(50% - 400px);
    overflow: auto;
    background: #fff;
    text-align: left
}

@media (max-width: 768px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content.credit-card, .new-modal-container > input[type='checkbox']:checked ~ .modal-content.credit-card {
        top: 45px;
        overflow: auto;
        max-height: calc(100vh - 60px);
        width: calc(100vw - 4px);
        left: 0;
        margin: 0 2px
    }
}

@media (max-width: 600px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content.credit-card, .new-modal-container > input[type='checkbox']:checked ~ .modal-content.credit-card {
        padding-bottom: 20px;
        height: calc(100vh - 105px)
    }
}

.new-modal-container > input[type='checkbox'].active ~ .modal-content .inside-form p.required, .new-modal-container > input[type='checkbox']:checked ~ .modal-content .inside-form p.required {
    margin-top: 20px
}

.new-modal-container > input[type='checkbox'].active ~ .modal-content .inside-form div, .new-modal-container > input[type='checkbox']:checked ~ .modal-content .inside-form div {
    margin-top: 5px
}

    .new-modal-container > input[type='checkbox'].active ~ .modal-content .inside-form div:after, .new-modal-container > input[type='checkbox']:checked ~ .modal-content .inside-form div:after {
        content: "";
        display: table;
        clear: both
    }

.new-modal-container > input[type='checkbox'].active ~ .modal-content .inside-form label, .new-modal-container > input[type='checkbox']:checked ~ .modal-content .inside-form label {
    font-weight: normal;
    float: left;
    width: 140px
}

.new-modal-container > input[type='checkbox'].active ~ .modal-content .inside-form input[type="text"], .new-modal-container > input[type='checkbox'].active ~ .modal-content .inside-form select, .new-modal-container > input[type='checkbox']:checked ~ .modal-content .inside-form input[type="text"], .new-modal-container > input[type='checkbox']:checked ~ .modal-content .inside-form select {
    width: calc(100% - 140px);
    float: left
}

@media (max-width: 400px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content .inside-form input[type="text"], .new-modal-container > input[type='checkbox'].active ~ .modal-content .inside-form select, .new-modal-container > input[type='checkbox']:checked ~ .modal-content .inside-form input[type="text"], .new-modal-container > input[type='checkbox']:checked ~ .modal-content .inside-form select {
        width: 100%
    }
}

.new-modal-container > input[type='checkbox'].active ~ .modal-content #new-credit-card-exp-month, .new-modal-container > input[type='checkbox'].active ~ .modal-content#new-credit-card-exp-year, .new-modal-container > input[type='checkbox']:checked ~ .modal-content #new-credit-card-exp-month, .new-modal-container > input[type='checkbox']:checked ~ .modal-content#new-credit-card-exp-year {
    width: 20%
}

@media (max-width: 400px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content #new-credit-card-exp-month, .new-modal-container > input[type='checkbox'].active ~ .modal-content#new-credit-card-exp-year, .new-modal-container > input[type='checkbox']:checked ~ .modal-content #new-credit-card-exp-month, .new-modal-container > input[type='checkbox']:checked ~ .modal-content#new-credit-card-exp-year {
        width: 100%
    }
}

.new-modal-container > input[type='checkbox'].active ~ .modal-content.address, .new-modal-container > input[type='checkbox']:checked ~ .modal-content.address {
    max-width: 800px;
    width: 768px;
    height: auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    text-align: left
}

@media (max-width: 768px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content.address, .new-modal-container > input[type='checkbox']:checked ~ .modal-content.address {
        overflow: auto;
        max-height: calc(100vh - 60px)
    }
}

@media (max-width: 600px) {
    .new-modal-container > input[type='checkbox'].active ~ .modal-content.address, .new-modal-container > input[type='checkbox']:checked ~ .modal-content.address {
        margin: 0 2px;
        width: calc(100% - 4px);
        padding-bottom: 20px;
        height: calc(100vh - 105px)
    }
}

.new-modal-container.preview-image-upload > input[type='checkbox']:checked ~ .modal-content {
    background-color: transparent;
    box-shadow: none;
    border: 0;
    overflow: visible;
    left: 10%;
    top: 2%;
    width: 80%;
    max-width: 80%;
    z-index: 9999999
}

.new-modal-container.preview-image-upload .modal-close {
    background: white;
    border: 2px solid #999;
    border-radius: 50%;
    padding: 0
}

.modal-container {
    position: relative
}

    .modal-container button {
        background: #fff;
        border: solid 10px #ddd;
        border-radius: 50%;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        color: #333;
        display: block;
        font-family: 'raleway';
        font-size: 20px;
        font-weight: 700;
        line-height: 20px;
        margin: 0 auto;
        padding-top: 10px;
        text-transform: uppercase;
        -webkit-transition: 0.1s ease-in;
        transition: 0.1s ease-in;
        width: 132px;
        height: 132px
    }

@media (max-width: 450px) {
    .modal-container button {
        padding-top: 10px;
        font-size: 18px;
        height: 100px;
        width: 100px
    }
}

@media (max-width: 450px) {
    .modal-container button.vid-button {
        font-size: 0;
        padding-top: 13px
    }
}

.modal-container button.vid-button span {
    font-size: 18px
}

@media (max-width: 450px) {
    .modal-container button.vid-button span {
        font-size: 16px
    }
}

.modal-container .modal-backdrop {
    height: 0;
    width: 0;
    opacity: 0;
    overflow: hidden;
    -webkit-transition: opacity 0.2s ease-in;
    transition: opacity 0.2s ease-in
}

.modal-container #modal-toggle {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer
}

    .modal-container #modal-toggle:hover ~ button {
        background: #0657A8;
        color: #FFF;
        border: #0657A8
    }

    .modal-container #modal-toggle:checked {
        width: 100vw;
        height: 100vh;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 9;
        opacity: 0
    }

        .modal-container #modal-toggle:checked ~ .modal-backdrop {
            background-color: rgba(0,0,0,0.85);
            width: 100vw;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            z-index: 99999999;
            opacity: 1
        }

            .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content {
                background-color: #fff;
                left: calc(50% - 400px);
                top: 5%;
                max-width: 800px;
                border-radius: 4px;
                z-index: 999999;
                pointer-events: auto;
                cursor: auto;
                box-shadow: 0 3px 7px rgba(0,0,0,0.6);
                margin-bottom: 40px
            }

@media (max-width: 768px) {
    .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content {
        top: 10%;
        width: 96%;
        margin: 0 auto 40px auto
    }
}

@media (max-width: 450px) {
    .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content {
        top: 25%
    }
}

@media (max-width: 1000px) {
    .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content {
        left: 0
    }
}

.modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content .modal-close {
    color: #666;
    position: absolute;
    right: 2px;
    top: 0;
    padding-top: 7px;
    background: #fff;
    font-size: 16px;
    width: 25px;
    height: 28px;
    font-weight: bold;
    text-align: center;
    cursor: pointer
}

    .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content .modal-close:hover {
        color: #333
    }

@media (max-width: 450px) {
    .new-modal-container.preview-image-upload > input[type='checkbox']:checked ~ .modal-content {
        width: 100%;
        max-width: 100%;
        left: 0
    }
}

.new-modal-container.preview-image-upload > input[type='checkbox']:checked ~ .modal-content .modal-close {
    background: transparent;
    border: 0;
    width: auto;
    text-align: center;
    margin: 0 auto;
    display: inline-block;
    position: relative
}

    .new-modal-container.preview-image-upload > input[type='checkbox']:checked ~ .modal-content .modal-close span {
        background: white;
        border: 2px solid #666;
        border-radius: 50%;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        padding: 0 5px;
        position: absolute;
        top: -5px;
        right: -5px;
        z-index: 9
    }

.terms-use {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 3px;
    margin-bottom: 10px;
    padding: 0px 15px 10px;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .terms-use {
        border-left: solid 1px #ddd
    }
}

@media (max-width: 1170px) {
    .terms-use {
        width: 100%
    }
}

.terms-use hr {
    margin: 10px 0
}

.terms-use h2 {
    font-size: 26px;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 15px
}

.terms-use.single {
    padding: 12px 12px 12px 15px;
    border-left: 3px solid #f6db6f
}

    .terms-use.single.calculator-numbers-button-background {
        border-left: 0;
        border-top: 0;
        margin-top: -12px;
        padding: 0px 12px 12px 15px;
        clear: both
    }

@media (max-width: 768px) {
    .terms-use.single:last-child {
        margin-bottom: 20px
    }
}

.terms-use.single p {
    margin: 0
}

.terms-use.single ul {
    list-style-type: disc;
    padding-left: 20px;
    padding-right: 0
}

.terms-use.single h5 {
    font-size: 16px;
    text-align: left;
    font-weight: bold;
    margin: 0 0 10px
}

.terms-use.upload-instruction-single {
    padding: 20px 35px 20px 20px;
    position: relative;
    margin-bottom: 10px;
    float: right;
    width: 27%;
    margin-left: 1%
}

@media (max-width: 900px) {
    .terms-use.upload-instruction-single {
        margin-bottom: 20px;
        width: 48%;
        margin-right: 1%;
        margin-left: 1%;
        min-height: 130px
    }
}

@media (max-width: 600px) {
    .terms-use.upload-instruction-single {
        margin-bottom: 20px;
        width: 98%;
        margin-right: 1%;
        margin-left: 1%;
        min-height: initial
    }
}

.terms-use.upload-instruction-single p {
    margin: 0
}

.terms-use.upload-instruction-single strong {
    font-size: 16px;
    display: block;
    padding-bottom: 5px
}

.terms-use.upload-instruction-single.phone {
    padding: 12px 35px 12px 60px;
    margin-left: 0%;
    float: left
}

    .terms-use.upload-instruction-single.phone .fa {
        position: absolute;
        left: 0;
        top: 20px;
        text-align: center;
        width: 60px;
        font-size: 34px;
        color: rgba(0,0,0,0.5)
    }

.terms-use.terms-videos, .terms-use.terms-blogs {
    width: 23.5%;
    float: right;
    min-height: 613.4px
}

@media (max-width: 900px) {
    .terms-use.terms-videos, .terms-use.terms-blogs {
        width: 100%;
        margin-bottom: 20px;
        min-height: initial
    }
}

.terms-use.terms-videos .summary-video-load, .terms-use.terms-blogs .summary-video-load {
    border-top: 1px solid #ddd;
    text-align: center;
    padding-top: 8px;
    font-size: 12px;
    text-transform: uppercase
}

.terms-use.terms-videos .summary-video, .terms-use.terms-videos .summary-blog, .terms-use.terms-blogs .summary-video, .terms-use.terms-blogs .summary-blog {
    font-size: 12px;
    margin-top: 6px;
    cursor: pointer
}

@media (max-width: 900px) {
    .terms-use.terms-videos .summary-video, .terms-use.terms-videos .summary-blog, .terms-use.terms-blogs .summary-video, .terms-use.terms-blogs .summary-blog {
        width: 30%;
        display: inline-block;
        margin: 0 1%
    }
}

@media (max-width: 768px) {
    .terms-use.terms-videos .summary-video, .terms-use.terms-videos .summary-blog, .terms-use.terms-blogs .summary-video, .terms-use.terms-blogs .summary-blog {
        width: 47%
    }
}

@media (max-width: 450px) {
    .terms-use.terms-videos .summary-video, .terms-use.terms-videos .summary-blog, .terms-use.terms-blogs .summary-video, .terms-use.terms-blogs .summary-blog {
        width: 98%
    }
}

.terms-use.terms-videos .summary-video:after, .terms-use.terms-videos .summary-blog:after, .terms-use.terms-blogs .summary-video:after, .terms-use.terms-blogs .summary-blog:after {
    content: "";
    display: table;
    clear: both
}

.terms-use.terms-videos .summary-video .thumb-wrap, .terms-use.terms-videos .summary-blog .thumb-wrap, .terms-use.terms-blogs .summary-video .thumb-wrap, .terms-use.terms-blogs .summary-blog .thumb-wrap {
    border: solid 1px #eee;
    float: left;
    width: 120px;
    height: 68px;
    overflow: hidden;
    position: relative
}

    .terms-use.terms-videos .summary-video .thumb-wrap div, .terms-use.terms-videos .summary-blog .thumb-wrap div, .terms-use.terms-blogs .summary-video .thumb-wrap div, .terms-use.terms-blogs .summary-blog .thumb-wrap div {
        position: relative;
        top: 0;
        height: 70px
    }

.terms-use.terms-videos .summary-video .video-title, .terms-use.terms-videos .summary-video .video-date, .terms-use.terms-videos .summary-video .video-views, .terms-use.terms-videos .summary-video .article-title, .terms-use.terms-videos .summary-video .article-date, .terms-use.terms-videos .summary-video .article-blog-title, .terms-use.terms-videos .summary-blog .video-title, .terms-use.terms-videos .summary-blog .video-date, .terms-use.terms-videos .summary-blog .video-views, .terms-use.terms-videos .summary-blog .article-title, .terms-use.terms-videos .summary-blog .article-date, .terms-use.terms-videos .summary-blog .article-blog-title, .terms-use.terms-blogs .summary-video .video-title, .terms-use.terms-blogs .summary-video .video-date, .terms-use.terms-blogs .summary-video .video-views, .terms-use.terms-blogs .summary-video .article-title, .terms-use.terms-blogs .summary-video .article-date, .terms-use.terms-blogs .summary-video .article-blog-title, .terms-use.terms-blogs .summary-blog .video-title, .terms-use.terms-blogs .summary-blog .video-date, .terms-use.terms-blogs .summary-blog .video-views, .terms-use.terms-blogs .summary-blog .article-title, .terms-use.terms-blogs .summary-blog .article-date, .terms-use.terms-blogs .summary-blog .article-blog-title {
    padding-left: 10px;
    float: left;
    font-size: 10px;
    width: calc(100% - 120px)
}

.terms-use.terms-videos .summary-video .video-title, .terms-use.terms-videos .summary-video .article-title, .terms-use.terms-videos .summary-video .article-blog-title, .terms-use.terms-videos .summary-blog .video-title, .terms-use.terms-videos .summary-blog .article-title, .terms-use.terms-videos .summary-blog .article-blog-title, .terms-use.terms-blogs .summary-video .video-title, .terms-use.terms-blogs .summary-video .article-title, .terms-use.terms-blogs .summary-video .article-blog-title, .terms-use.terms-blogs .summary-blog .video-title, .terms-use.terms-blogs .summary-blog .article-title, .terms-use.terms-blogs .summary-blog .article-blog-title {
    font-weight: bold;
    font-size: 12px
}

.terms-use.terms-videos .summary-video .video-time, .terms-use.terms-videos .summary-blog .video-time, .terms-use.terms-blogs .summary-video .video-time, .terms-use.terms-blogs .summary-blog .video-time {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 999;
    background: rgba(0,0,0,0.7);
    color: white;
    padding: 1px 4px
}

.terms-use.terms-blogs h2 {
    color: #ef2028
}

.register-input-container {
    width: 50%;
    float: left;
    margin-bottom: 10px
}

    .register-input-container label {
        display: block
    }

    .register-input-container.radios {
        float: none;
        width: 100%
    }

@media (max-width: 750px) {
    .register-input-container.radios {
        width: 90%
    }
}

.register-input-container.radios input[type=radio] {
    display: inline-block
}

.register-input-container.radios .input-label {
    display: inline-block
}

    .register-input-container.radios .input-label.upload-4 {
        margin-left: 5px
    }

.register-input-container.third {
    width: 33.33333%;
    margin-bottom: 30px
}

@media (max-width: 450px) {
    .register-input-container.third {
        width: 100%
    }

        .register-input-container.third select {
            font-size: 13px
        }
}

.register-input-container.third.fabric-type {
    clear: left
}

    .register-input-container.third.fabric-type select {
        width: 90%
    }

@media (max-width: 450px) {
    .register-input-container.third.fabric-type select {
        width: 90%
    }
}

.register-input-container.full-color {
    width: calc(100% + 30px);
    overflow: auto;
    padding-top: 0px;
    margin-bottom: -20px;
    padding-bottom: 20px
}

    .register-input-container.full-color .input-label {
        font-size: 20px;
        margin-bottom: 15px
    }

    .register-input-container.full-color hr {
        margin-right: 30px
    }

.register-input-container.full {
    width: 100%;
    position: relative
}

.register-input-container.filetypes {
    position: relative;
    background: #f6f6f6;
    border: 1px solid #ddd;
    border-radius: 2px;
    margin: 25px 0 0 2%;
    padding: 15px 15px 15px 50px;
    position: relative;
    width: 48%;
    float: right;
    clear: right
}

    .register-input-container.filetypes img {
        position: absolute;
        left: 1px;
        top: 22px;
        opacity: .9
    }

@media (max-width: 664px) {
    .register-input-container.filetypes {
        width: 100%;
        margin: 20px 0 10px 0
    }
}

.register-input-container.filetypes .fa {
    color: #999;
    font-size: 40px;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    position: absolute;
    top: 22px;
    left: 10px
}

.register-input-container#artwork-notes-contain, .register-input-container#artwork-desc-contain {
    padding-bottom: 10px;
    float: left;
    clear: left
}

    .register-input-container#artwork-notes-contain input, .register-input-container#artwork-notes-contain textarea, .register-input-container#artwork-desc-contain input, .register-input-container#artwork-desc-contain textarea {
        width: 100%
    }

    .register-input-container#artwork-notes-contain textarea, .register-input-container#artwork-desc-contain textarea {
        width: 100%;
        height: 100px;
        padding-top: 10px
    }

@media (max-width: 664px) {
    .register-input-container#artwork-notes-contain, .register-input-container#artwork-desc-contain {
        margin-top: 10px
    }
}

.register-input-container#artwork-notes-contain {
    width: 100%
}

.register-input-container#artwork-checklist-contain ul {
    margin-left: 9px
}

    .register-input-container#artwork-checklist-contain ul li {
        position: relative
    }

        .register-input-container#artwork-checklist-contain ul li::before {
            content: "";
            background: black;
            height: 3px;
            width: 3px;
            position: absolute;
            left: -8px;
            top: 9px;
            border-radius: 5px;
            overflow: hidden
        }

.register-input-container .step-explainer {
    width: 100%;
    background-color: #f6f6f6;
    position: relative;
    padding: 10px 15px 12px;
    border-radius: 2px;
    border: 1px solid #ddd;
    padding-left: 70px
}

    .register-input-container .step-explainer.explainer-yes {
        background-color: #b7ffd4
    }

    .register-input-container .step-explainer.explainer-no {
        background-color: #ffb5bc
    }

@media (max-width: 750px) {
    .register-input-container .step-explainer {
        width: 90%;
        display: block;
        position: relative;
        top: 12px;
        right: 0;
        padding: 8px 10px 13px 39px
    }
}

.register-input-container .step-explainer .fa {
    position: absolute;
    font-size: 36px;
    color: #999;
    left: 5px;
    width: 60px;
    text-align: center;
    top: 13px
}

@media (max-width: 750px) {
    .register-input-container .step-explainer .fa {
        font-size: 24px;
        width: initial;
        top: 10px
    }
}

@media (max-width: 500px) {
    .register-input-container .step-explainer .fa {
        font-size: 16px;
        width: initial;
        top: 10px
    }
}

@media (min-width: 1428px) {
    .register-input-container .step-explainer .fa {
        top: 5px
    }
}

.register-input-container input[type="text"], .register-input-container input[type="password"], .register-input-container select, .register-input-container textarea {
    width: 90%;
    margin-top: 2px;
    border-radius: 3px;
    border: 1px solid #ccc;
    height: 35px;
    padding-left: 10px
}

.register-input-container textarea {
    min-height: 40px;
    padding-top: 5px
}

.register-input-container select:disabled {
    background: #dedede;
    opacity: 0.5
}

.register-input-container select::-ms-value {
    background: transparent
}

.register-input-container.half {
    width: 25%
}

    .register-input-container.half input {
        width: 80%
    }

@media (max-width: 600px) {
    .register-input-container.half input {
        width: 90%
    }
}

@media (max-width: 600px) {
    .register-input-container.half {
        width: 100%
    }
}

.register-input-container.full-half {
    width: 100%
}

    .register-input-container.full-half input, .register-input-container.full-half textarea {
        width: 50%
    }

@media (max-width: 768px) {
    .register-input-container.full-half input, .register-input-container.full-half textarea {
        width: 100%
    }
}

.register-input-container.full-half textarea {
    resize: none;
    height: 100px;
    padding-top: 10px;
    padding-right: 20px
}

@media (max-width: 768px) {
    .register-input-container.full-half textarea {
        height: 200px;
        resize: none
    }
}

.register-input-container.half-width {
    width: 50%
}

.terms-use .register-input-container {
    width: 100%;
    position: relative
}

    .terms-use .register-input-container:after {
        content: "";
        display: table;
        clear: both
    }

    .terms-use .register-input-container input[type=text] {
        width: 100%;
        margin-bottom: 10px
    }

    .terms-use .register-input-container input[type=checkbox] {
        position: relative;
        top: 2px;
        margin-right: 4px
    }

.terms-use.update {
    height: 54px;
    border: 0;
    position: relative;
    margin-top: 10px
}

    .terms-use.update button, .terms-use.update a {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        border: none;
        background: #26A65B;
        color: white;
        -webkit-transition: background 0.2s ease-in;
        transition: background 0.2s ease-in;
        border-radius: 4px;
        font-size: 18px;
        padding-top: 6px;
    }

        .terms-use.update button.blue, .terms-use.update a.blue {
            background: #0657A8;
            padding-bottom: 0
        }

            .terms-use.update button.blue:hover, .terms-use.update a.blue:hover {
                background: #0c4782
            }

        .terms-use.update button a, .terms-use.update a a {
            color: #fff
        }

            .terms-use.update button a:hover, .terms-use.update a a:hover {
                text-decoration: none
            }

        .terms-use.update button:hover, .terms-use.update a:hover {
            background: #1d7d44;
            -webkit-transition: background 0.2s ease-in;
            transition: background 0.2s ease-in
        }

        .terms-use.update button.not-allow-click, .terms-use.update a.not-allow-click {
            background: #ccc;
            cursor: not-allowed
        }

@media (max-width: 900px) {
    .terms-use.update.desktop {
        display: none
    }
}

@media (min-width: 901px) {
    .terms-use.update.mobile {
        display: none
    }
}

.terms-use.update.cart {
    margin-top: 0px
}

.terms-use.sidebar li {
    border-top: 1px solid #ddd;
    padding: 10px
}

    .terms-use.sidebar li a {
        background: none;
        color: #0657A8;
        text-transform: none;
        border: 0;
        box-shadow: none;
        font-size: 14px;
        font-weight: normal
    }

        .terms-use.sidebar li a:hover {
            color: #333
        }

.terms-use-wrapper {
    width: 23.5%;
    float: right;
}

@media (max-width: 900px) {
    .terms-use-wrapper {
        width: 100%
    }
}

.terms-use-wrapper.calculator-numbers-button-width {
    width: 100%
}

.terms-use-wrapper > div {
    width: 100%
}

.terms-use-wrapper.top-margin {
    margin-top: 25px
}

.terms-use-wrapper:after {
    content: "";
    display: table;
    clear: both
}

.terms-use-wrapper .terms-use {
    float: left;
    width: 100%
}

    .terms-use-wrapper .terms-use.total.checkout {
        padding: 15px
    }

        .terms-use-wrapper .terms-use.total.checkout .sumary-item-title {
            font-size: 20px
        }

        .terms-use-wrapper .terms-use.total.checkout .sumary-item-info {
            font-size: 13px
        }

    .terms-use-wrapper .terms-use.search {
        padding-top: 15px
    }

        .terms-use-wrapper .terms-use.search .ID-input {
            position: relative
        }

            .terms-use-wrapper .terms-use.search .ID-input .fa {
                color: #999;
                position: absolute;
                left: 12px;
                top: 12px
            }

            .terms-use-wrapper .terms-use.search .ID-input input {
                padding-left: 30px
            }

        .terms-use-wrapper .terms-use.search input[type="submit"] {
            background: #0657A8;
            border-color: #0657A8;
            color: white;
            height: 35px;
            margin-top: 5px;
            text-transform: uppercase;
            width: 100%
        }

        .terms-use-wrapper .terms-use.search select {
            margin-top: 5px;
            margin-bottom: 10px;
            width: 100%
        }

        .terms-use-wrapper .terms-use.search .half {
            display: inline-block;
            vertical-align: top;
            width: 48%
        }

@media (max-width: 900px) {
    .terms-use-wrapper .terms-use.search .half {
        float: right
    }
}

.terms-use-wrapper .terms-use.search .half.first {
    margin-right: 2%
}

@media (max-width: 900px) {
    .terms-use-wrapper .terms-use.search .half.first {
        float: left
    }
}

.terms-use-wrapper button, .terms-use-wrapper a {
    width: 100%;
    border: none;
    background: #26A65B;
    color: white;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in;
    border-radius: 4px;
    height: 54px;
    font-size: 18px;
    font-weight: 600;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin-bottom: 10px
}

@media (min-width: 900px) and (max-width: 1170px) {
    .terms-use-wrapper button.long-link, .terms-use-wrapper a.long-link {
        padding-top: 3px
    }
}

.terms-use-wrapper button:hover, .terms-use-wrapper a:hover {
    background: #043e77;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in
}

.terms-use-wrapper button.not-allow-click, .terms-use-wrapper a.not-allow-click {
    background: #ccc;
    cursor: not-allowed
}

.terms-use-wrapper button.disabled, .terms-use-wrapper a.disabled {
    pointer-events: none;
    cursor: not-allowed;
    opacity: 0.6
}

.terms-use-wrapper a {
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    padding: 15px;
}

.summary-video a {
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    padding: 0px;
}

.terms-use-wrapper a.simplelink {
    background: none;
    border: 0;
    box-shadow: none;
    color: #26A65B;
    font-size: 14px;
    text-decoration: underline;
    text-transform: none;
    padding: 0
}

    .terms-use-wrapper a.simplelink:hover {
        color: #1d7d44;
        -webkit-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in
    }

/*#declined-credit-cards .declined-cards-table-container{
    max-width: 570px
}*/

#declined-credit-cards .declined-cards-table-container h1 {
    margin-bottom: 15px
}

#declined-credit-cards .declined-cards-table-container ul {
    margin-bottom: 10px;
    box-shadow: none;
    border-top: 0px;
    border-bottom: 0px;
}

    #declined-credit-cards .declined-cards-table-container ul li {
        vertical-align: top;
        border-top: 0px;
        text-align: left;
        padding: 5px
    }

        #declined-credit-cards .declined-cards-table-container ul li:last-child {
            width: 94px
        }

@media (max-width: 415px) {
    #declined-credit-cards .declined-cards-table-container ul li {
        word-break: break-all
    }
}

#declined-credit-cards .declined-cards-table-container ul li.orders {
    width: 30%
}

#declined-credit-cards .declined-cards-table-container ul li.amount {
    width: 10%
}

#declined-credit-cards .declined-cards-table-container ul li.last-four {
    width: 10%
}

@media (max-width: 570px) {
    #declined-credit-cards .declined-cards-table-container ul li.last-four {
        display: none
    }
}

#declined-credit-cards .declined-cards-table-container ul li.ship-group {
    width: 8%
}

#declined-credit-cards .declined-cards-table-container ul li.date {
    width: 15%
}

#declined-credit-cards .declined-cards-table-container ul li.credit-card {
    position: relative;
    padding-left: 0px;
    width: 158px
}

    #declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown {
        position: relative;
        width: 100%;
        margin-left: 0px;
        padding-left: 0px;
        padding-top: 0px;
        margin-top: -3px;
        z-index: unset
    }

        #declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown #active-cc {
            height: auto;
            width: calc(100% - 30px);
            z-index: 99;
            float: left;
            margin-bottom: 5px
        }

        #declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown #checkout-cc-select {
            position: absolute;
            top: 22px;
            height: 163px;
            width: 200px;
            display: inline-block;
            overflow-y: auto;
            -webkit-transition: none;
            transition: none;
            width: calc(100% + 4px);
            box-shadow: 1px 1px 3px grey
        }

            #declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown #checkout-cc-select li {
                vertical-align: top;
                height: auto;
                border-bottom: 1px solid #e7e7e7;
                border-top: 1px solid #e7e7e7;
                padding: 11px 10px 6px 10px;
                width: 100%;
                display: inline-block
            }

@media (max-width: 740px) {
    #declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown #checkout-cc-select {
        left: -35px;
        width: calc(100% + 1px)
    }
}

@media (max-width: 540px) {
    #declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown #checkout-cc-select {
        left: -21px
    }
}

#declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown label::after {
    right: 0px;
    top: -16px;
    font-weight: 400;
    top: -3px
}

#declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown button {
    width: 100%;
    background: #26a65b;
    color: white;
    font-weight: 400;
    height: 34px;
    border-radius: 3px;
    border: 0
}

#declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown img {
    padding-left: 0px
}

@media (max-width: 600px) {
    #declined-credit-cards .declined-cards-table-container ul li.credit-card .cc-dropdown {
        top: 0
    }
}

#declined-credit-cards .declined-cards-table-container ul ul.checkout-items {
    border-top: 0px;
    box-shadow: none;
    margin-bottom: 0px
}

    #declined-credit-cards .declined-cards-table-container ul ul.checkout-items li {
        border-top: 0px
    }

@media (max-width: 600px) {
    #declined-credit-cards .declined-cards-table-container ul .credit-card {
        height: unset
    }
}

#declined-credit-cards .declined-cards-table-container ul .declined-cc-table .order-item {
    border-bottom: 0px
}

#declined-credit-cards .declined-cards-table-container ul:first-child .credit-card {
    color: #0657A8
}

@media (max-width: 740px) {
    #declined-credit-cards .declined-cards-table-container ul {
        margin-left: 20px;
        margin-right: 20px
    }
}

@media (max-width: 540px) {
    #declined-credit-cards .declined-cards-table-container ul {
        width: 100%;
        margin-left: 5px;
        margin-right: 5px
    }
}

#declined-credit-cards .declined-cards-table-container ul.titles {
    margin-bottom: 0px
}

    #declined-credit-cards .declined-cards-table-container ul.titles li {
        padding-bottom: 0px
    }

@media (max-width: 540px) {
    #declined-credit-cards .declined-cards-table-container ul.titles li {
        word-break: break-word
    }
}

.dropdown-form {
    background: #fff;
    padding: 15px;
    display: none
}

    .dropdown-form.active {
        display: block
    }

    .dropdown-form input {
        border-radius: 3px;
        padding: 5px 0 5px 5px;
        border: 1px solid #ddd;
        margin-bottom: 5px;
        vertical-align: middle;
        min-width: 209px
    }

@media (max-width: 770px) {
    .dropdown-form input[type="text"] {
        width: 100%;
        padding: 10px;
        margin-bottom: 15px
    }
}

@media (min-width: 900px) and (max-width: 1000px) {
    .dropdown-form input[type="text"] {
        width: 100%
    }
}

.dropdown-form input[type="checkbox"] {
    margin: 10px 10px 10px 0;
    min-width: 50px
}

.dropdown-form label {
    min-width: 150px
}

@media (max-width: 1200px) {
    .dropdown-form label {
        min-width: 125px
    }
}

.dropdown-form select {
    padding: 5px 0 5px 5px;
    margin: 5px 10px 5px 0;
    height: 35px;
    min-width: 209px
}

@media (max-width: 770px) {
    .dropdown-form select {
        width: 100%;
        margin-bottom: 15px
    }
}

@media (min-width: 900px) and (max-width: 1000px) {
    .dropdown-form select {
        width: 100%;
        margin-bottom: 15px
    }
}

.dropdown-form select#new-address-country-code {
    margin-top: 0px
}

.dropdown-form select:nth-child(3) {
    min-width: 70px
}

.dropdown-form-left {
    display: inline-block;
    vertical-align: top;
    width: 49%
}

@media (max-width: 770px) {
    .dropdown-form-left {
        width: 100%
    }
}

@media (min-width: 900px) and (max-width: 1000px) {
    .dropdown-form-left {
        width: 100%
    }
}

.dropdown-form-right {
    display: inline-block;
    vertical-align: top;
    width: 49%
}

@media (max-width: 770px) {
    .dropdown-form-right {
        width: 100%
    }
}

@media (min-width: 900px) and (max-width: 1000px) {
    .dropdown-form-right {
        width: 100%
    }
}

#change-creditcard-form {
    display: none;
    padding: 20px
}

.change-address-shipping, .change-address-billing {
    cursor: pointer
}

.errormessages {
    margin: 10px 0;
    float: left;
    width: 100%
}

    .errormessages .error {
        border: 1px solid #ef2028;
        background: rgba(199,45,35,0.1);
        border-radius: 2px;
        border-left: 3px solid #ef2028;
        color: #ef2028;
        padding: 7px 7px 7px 30px
    }

        .errormessages .error li {
            list-style-type: disc
        }

.errordiv, .errors, .error ul:not(#dealer-nav-menu-content):not(.nav-container):not(.footer-links):not(.footer-cards):not(.internal-menu) > li {
    border: 1px solid #ef2028;
    background: rgba(199,45,35,0.1);
    border-radius: 2px;
    border-left: 3px solid #ef2028;
    color: #ef2028;
    font-size: 14px;
    margin-bottom: 10px;
    padding: 7px;
    padding-left: 20px
}

    .errordiv p, .errors p, .error ul > li p {
        margin: 0
    }

    .errordiv input[type="checkbox"], .errors input[type="checkbox"], .error ul > li input[type="checkbox"] {
        margin: 5px 0
    }

    .errordiv label, .errors label, .error ul > li label {
        min-width: 80px
    }


.successdiv {
    background-color: #e9f6ef;
    border: 1px solid #26A65B;
    border-radius: 2px;
    border-left: 3px solid #26A65B;
    color: #26A65B;
    font-size: 14px;
    padding: 7px;
    margin-bottom: 10px
}

.success-div-2 {
    background-color: #e9f6ef;
    border: #26A65b solid 1px;
    border-radius: 2px;
    border-left: 3px solid #26A65B;
    color: #26A65B;
    padding: 7px 7px 7px 30px;
    position: relative;
    height: auto;
    display: inline-block;
    width: 100%
}

    .success-div-2 i {
        position: absolute;
        left: 8px;
        top: 10px
    }

.required {
    color: #0657A8;
    font-weight: bold;
    margin: 10px 0 10px
}

.ModalAddressInnerTitle {
    color: #0657A8;
    font-weight: bold;
    font-size: 15px;
}

.blue-font {
    color: #0657A8
}

.checkout-table {
    margin-bottom: 20px
}

@media (max-width: 450px) {
    .checkout-table {
        margin-left: 0;
        margin-bottom: 20px
    }
}

.checkout-table h4 {
    text-align: left
}

.checkout-table .shipping-address-container {
    background: white;
    border: 1px solid #eee;
}

    .checkout-table .shipping-address-container .shipping-address {
        background: #fff;
        border: 1px solid white;
        margin-bottom: 5px;
        border-radius: 3px;
    }


@media (max-width: 600px) {
    .checkout-table .shipping-address-container .shipping-address {
        width: 100%
    }
}

.checkout-table .shipping-address-container .shipping-address .action-links {
    position: absolute;
    bottom: 10px
}

    .checkout-table .shipping-address-container .shipping-address .action-links .select-address-default {
        cursor: pointer
    }

.checkout-table .shipping-address-container.li {
    cursor: pointer
}

.checkout-table .shipping-address-container .new-shipping-address.add-address {
    clear: both;
    cursor: pointer;
}

.checkout-table .shipping-address-container .add-address {
    border-left: 4px solid transparent;
    padding: 15px
}

    .checkout-table .shipping-address-container .add-address.active button.plus {
        background: #26A65B
    }

.checkout-table .checkout-items {
    background: #fff;
    border: 1px solid white;
    margin-bottom: 5px;
    border-radius: 3px;
}

    .checkout-table .checkout-items h5 {
        color: #0657A8;
        font-size: 16px;
        font-weight: bold;
        text-align: left
    }

    .checkout-table .checkout-items .mobile-right {
        display: inline
    }

@media (max-width: 450px) {
    .checkout-table .checkout-items .mobile-right {
        width: 48%;
        float: left
    }
}

.checkout-table .checkout-items li {
    border-top: 1px solid #eee;
    padding: 15px;
    position: relative;
    border-left: 4px solid transparent;
    cursor: pointer
}

@media (max-width: 450px) {
    .checkout-table .checkout-items li {
        width: 100%
    }
}

.checkout-table .checkout-items li input.select-payment-method ~ label .fa-usd {
    color: #ff0000
}

.checkout-table .checkout-items li input.select-payment-method:checked ~ label .fa {
    color: #26A65B
}

.checkout-table .checkout-items li input.select-payment-method:checked ~ label .fa-usd {
    color: #ff0000
}

.checkout-table .checkout-items li.active button.plus {
    background: #26A65B
}

.checkout-table .checkout-items li .fa {
    color: #0657A8;
    font-size: 22px;
    margin-left: 5px;
    vertical-align: middle
}

    .checkout-table .checkout-items li .fa.fa-caret-right {
        color: #fff;
        font-size: 16px
    }

@media (max-width: 450px) {
    .checkout-table .checkout-items li.preview {
        width: 48%;
        float: left
    }
}

.checkout-table .checkout-items li.credit-card {
    position: relative
}

@media (max-width: 600px) {
    .checkout-table .checkout-items li.credit-card {
        height: 95px
    }
}

.checkout-table .checkout-items li.credit-card .cc-dropdown {
    padding: 10px;
    position: absolute;
    right: 0;
    top: 0;
    width: 330px;
    z-index: 999
}

@media (max-width: 600px) {
    .checkout-table .checkout-items li.credit-card .cc-dropdown {
        left: 0;
        top: 40px
    }
}

.checkout-table .checkout-items li.credit-card .cc-dropdown img {
    width: 40px;
    float: left;
    margin-right: 10px;
    margin-top: -4px
}

.checkout-table .checkout-items li.credit-card .cc-dropdown a {
    color: initial
}

.checkout-table .checkout-items li.credit-card .cc-dropdown label {
    height: 35px;
    width: auto;
    cursor: pointer;
    padding-top: 6px;
    display: inline-block
}

    .checkout-table .checkout-items li.credit-card .cc-dropdown label:hover:after {
        color: #333
    }

    .checkout-table .checkout-items li.credit-card .cc-dropdown label:after {
        content: "\203A";
        position: absolute;
        width: 40px;
        font-size: 45px;
        right: 20px;
        top: 7px;
        color: #999;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

.checkout-table .checkout-items li.credit-card .cc-dropdown .checkout-cc-backdrop {
    position: fixed;
    height: 0;
    width: 0;
    left: 0;
    top: 0
}

.checkout-table .checkout-items li.credit-card .cc-dropdown input[type="checkbox"] {
    display: none
}

.checkout-table .checkout-items li.credit-card .cc-dropdown .cc-drop ~ .content {
    background: white;
    height: 0;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 1s ease-in;
    transition: max-height 1s ease-in;
    width: auto;
    display: inline-block;
    max-width: 500px;
    overflow-x: auto;
    box-shadow: 1px 1px 1px #ddd
}

    .checkout-table .checkout-items li.credit-card .cc-dropdown .cc-drop ~ .content li:hover {
        background-color: #e9f6ef
    }

.checkout-table .checkout-items li.credit-card .cc-dropdown .cc-drop:checked ~ .content {
    border: 1px solid #ddd;
    border-top: 0;
    height: auto;
    max-height: 900px;
    margin-top: 10px;
    z-index: 99
}

.checkout-table .checkout-items li.credit-card .cc-dropdown .cc-drop:checked ~ .checkout-cc-backdrop {
    height: calc(100vh + 30px);
    width: 100vw;
    z-index: -1;
    top: -30px
}

.checkout-table .checkout-items li:first-child {
    border-top: 0
}

.checkout-table .checkout-items.shipping-address, .checkout-table .checkout-items.billing-address {
    background-color: #ececec;
    Border: 1px solid rgb(107 195 144 / 0.31);
    padding: 10px;
    margin-right: 1%;
    width: 100%;
    cursor: pointer;
}

@media (max-width: 768px) {
    .checkout-table .checkout-items.shipping-address, .checkout-table .checkout-items.billing-address {
        width: 95%
    }
}

.checkout-table .shipping-address-container .shipping-address.active {
    width: 100%;
    height: 100%;
    border-style: solid;
    border-color: rgb(107 195 144 / 0.31);
    border-width: thin;
    border-radius: 5px;
    background-color: #ececec;
    color: black;
    margin-bottom: 3px;
}

.checkout-table .checkout-items.shipping-address:last-child, .checkout-table .checkout-items.billing-address:last-child {
    margin-right: 0
}

.checkout-table .checkout-items.shipping-address > p, .checkout-table .checkout-items.billing-address > p {
    margin: 0 0 5px
}

.checkout-table .checkout-items.shipping-address input[type="radio"], .checkout-table .checkout-items.billing-address input[type="radio"] {
    margin-right: 5px
}

.checkout-table .checkout-items.shipping-address, .checkout-table .checkout-items.address-contact {
    background-color: #ececec;
    Border: 1px solid rgb(107 195 144 / 0.31);
    display: inline-block;
    padding: 10px;
    margin-right: 1%;
    width: 100%;
    cursor: pointer;
}

@media (max-width: 768px) {
    .checkout-table .checkout-items.shipping-address, .checkout-table .checkout-items.address-contact {
        width: 95%
    }
}

.checkout-table .checkout-items.shipping-address:last-child, .checkout-table .checkout-items.address-contact:last-child {
    margin-right: 0
}

.checkout-table .checkout-items.shipping-address > p, .checkout-table .checkout-items.address-contact > p {
    margin: 0 0 5px
}

.checkout-table .checkout-items.shipping-address input[type="radio"], .checkout-table .checkout-items.address-contact input[type="radio"] {
    margin-right: 5px
}

    .checkout-table .checkout-items.review {
        padding: 15px
    }

@media (max-width: 600px) {
    .checkout-table .checkout-items.review {
        padding: 10px 5px
    }
}

.checkout-table .checkout-items.review li {
    border: 0;
    padding: 5px
}

@media (max-width: 450px) {
    .checkout-table .checkout-items.review li.type {
        display: none
    }
}

.checkout-table .checkout-items .shipping-options {
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
    color: #0657A8;
    margin-top: 2px;
    padding: 20px 0
}

    .checkout-table .checkout-items .shipping-options h5 {
        margin-bottom: 15px
    }

        .checkout-table .checkout-items .shipping-options h5.title-with-link {
            display: inline
        }

    .checkout-table .checkout-items .shipping-options li {
        color: initial;
        display: inline-block;
    }

@media (max-width: 650px) {
    .checkout-table .checkout-items .shipping-options li {
        min-width: 48%
    }
}

@media (max-width: 450px) {
    .checkout-table .checkout-items .shipping-options li {
        min-width: 98%
    }
}

.checkout-table .checkout-items .shipping-options li.active {
    background: initial
}

.checkout-table .checkout-items .shipping-options li.apparel-price {
    font-size: 13px;
    display: block
}

.checkout-table .checkout-items .shipping-options li input[type="radio"]:not(old) {
    width: 15px;
    margin: 0;
    padding: 0;
    font-size: 15px;
    opacity: 0;
    cursor: pointer;
    position: absolute;
    top: -9999px;
    left: -99999px
}

    .checkout-table .checkout-items .shipping-options li input[type="radio"]:not(old) + label {
        display: inline-block;
        margin-left: 5px;
        line-height: 1.5
    }

        .checkout-table .checkout-items .shipping-options li input[type="radio"]:not(old) + label > span {
            display: inline-block;
            width: 17px;
            height: 17px;
            margin: 0px 8px 2px 0px;
            border: 1px solid silver;
            border-radius: 3px;
            background: #eee;
            vertical-align: bottom
        }

    .checkout-table .checkout-items .shipping-options li input[type="radio"]:not(old):checked + label > span {
        background: #eee;
        border: 1px solid #26A65B
    }

        .checkout-table .checkout-items .shipping-options li input[type="radio"]:not(old):checked + label > span > span {
            background: #26A65B;
            border-radius: 3px;
            display: block;
            width: 13px;
            height: 13px;
            margin: 1px
        }

.checkout-table .checkout-items .shipping-options a {
    margin-left: 15px;
    font-size: 13px;
    text-decoration: underline;
    cursor: pointer
}

.current-card {
    padding-right: 10%;
    float: right
}

    .current-card img {
        height: 12px;
        display: inline-block
    }

@media (max-width: 600px) {
    .current-card {
        display: block;
        padding-left: 7%;
        margin-top: 10px
    }
}

.checkout-product .preview {
    width: 8%
}

@media (max-width: 600px) {
    .checkout-product .preview {
        width: 20%
    }
}

@media (max-width: 450px) {
    .checkout-product .preview img {
        max-width: 100%;
        margin-bottom: 10px
    }
}

.checkout-product .qty {
    width: 10%
}

@media (max-width: 600px) {
    .checkout-product .qty {
        width: 15%
    }
}

.checkout-product .description {
    width: 30%
}

@media (max-width: 450px) {
    .checkout-product .description {
        width: 38%
    }
}

.checkout-product .description p {
    font-weight: bold
}

    .checkout-product .description p span {
        display: block;
        font-weight: normal
    }

        .checkout-product .description p span.size {
            color: #bbb;
            font-size: 14px
        }

.checkout-product .type {
    width: 10%
}

@media (max-width: 450px) {
    .checkout-product .type {
        display: none
    }
}

.checkout-product .buysimilar {
    float: right
}

@media (max-width: 750px) {
    .checkout-product .buysimilar {
        float: none;
        width: 100%
    }
}

.checkout-product .buysimilar a.btn {
    font-size: 13px;
    min-width: 120px
}

@media (max-width: 600px) {
    .checkout-product .buysimilar a.btn {
        padding: 5px;
        width: 100%;
        height: 45px;
        line-height: 30px
    }
}

.checkout-product.titles li {
    display: inline-block;
    font-weight: bold;
    margin-right: 10px
}

@media (max-width: 450px) {
    .checkout-product.titles li {
        display: none
    }
}

.checkout-product.item {
    padding: 5px 0;
    overflow: hidden
}

    .checkout-product.item li {
        display: inline-block;
        margin-right: 10px;
        vertical-align: top
    }

@media (max-width: 450px) {
    .checkout-product.item li {
        margin-right: 0
    }
}

@media (max-width: 530px) {
    .checkout-product.item li.checkout-price {
        margin-right: 0
    }
}

.checkout-product.item input {
    border-radius: 3px;
    width: 45px;
    padding: 5px 0 5px 5px;
    border: 1px solid #ddd
}

.checkout-table-form {
    background: white;
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    border-radius: 2px;
    padding: 20px;
    margin: 30px 0;
    overflow: hidden
}

    .checkout-table-form.inactive {
        display: none
    }

tr.inactive {
    opacity: 0.3
}

#content-cart-unique-container.inactive {
    pointer-events: none
}

    #content-cart-unique-container.inactive .terms-use.update a {
        background: #888
    }

    #content-cart-unique-container.inactive .actions {
        position: relative
    }

        #content-cart-unique-container.inactive .actions:before {
            content: "";
            background: rgba(255,255,255,0.6);
            height: 100%;
            width: 100%;
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 999
        }

.inactive-delete-resolution, .inactive-edit {
    opacity: 0.3;
    pointer-events: none !important
}


.guest-checkout-step2 {
    height: 0;
    opacity: 0;
    -webkit-transition: visibility 0s, opacity 0.5s linear;
    transition: visibility 0s, opacity 0.5s linear;
    visibility: hidden
}

    .guest-checkout-step2.active {
        height: auto;
        opacity: 1;
        visibility: visible
    }

.alert-box {
    border: 1px solid #ddd;
    background: white;
    padding: 15px 15px 5px;
    border-radius: 3px;
    margin-bottom: 15px;
    border-left: 4px solid #f6db6f;
    overflow: hidden;
    position: relative
}

    .alert-box a {
        font-weight: bold;
        display: inline-block;
        margin-bottom: 10px;
        text-decoration: underline
    }

    .alert-box .fa {
        color: #f6db6f;
        margin-right: 5px
    }

    .alert-box.ok {
        border-left: 4px solid #26A65B
    }

        .alert-box.ok .fa {
            color: #26A65B;
            font-size: 18px
        }

    .alert-box.purchase {
        margin-bottom: 30px
    }

        .alert-box.purchase span {
            font-weight: bold;
            margin-right: 10px
        }

.disableddiv {
    pointer-events: none;
    opacity: 0.4;
}

.visiblediv {
    display: block
}

.hiddendiv {
    display: none
}

@media (max-width: 450px) {
    .alert-box.purchase input {
        width: 100%;
        margin-top: 10px;
        height: 45px
    }
}

.alert-box.purchase p {
    float: left;
    margin-right: 2%
}

@media (max-width: 450px) {
    .alert-box.purchase p {
        float: none
    }
}

.alert-box.ok-shipping {
    border-left: 4px solid #26A65B;
    background: #e9f6ef
}

    .alert-box.ok-shipping .fa {
        color: #26A65B;
        font-size: 18px
    }

.alert-box.pricing-notavailable {
    padding: 10px 10px 0;
    margin: 10px 5px
}

.alert-box ul {
    list-style-type: disc;
    padding-left: 20px;
    padding-right: 0
}

.error-box {
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    background: rgba(255,0,0,0.3);
    padding: 15px 15px 5px;
    border-radius: 2px;
    margin-bottom: 15px;
    border-left: 4px solid #f60000;
    overflow: hidden;
    position: relative
}

    .error-box ul {
        list-style-type: disc;
        padding-left: 20px;
        padding-right: 0
    }


ul.no-order-links {
    padding: 10px;
    overflow: auto
}

    ul.no-order-links li {
        display: block;
        margin: 20px 0;
        overflow: auto
    }

.fa.fa-angle-double-right {
    margin-right: 10px;
    color: #6dca92;
    font-weight: 800
}

.link-title {
    display: inline-block;
    font-family: Raleway,sans-serif;
    color: #3A4750;
    font-size: 22px;
    margin-left: 23px
}

@media (max-width: 500px) {
    .link-title {
        font-size: 19px
    }
}

.link-description {
    color: #54595f;
    font-size: 15px;
    padding-left: 23px;
    padding-top: 6px
}

a.no-order-link {
    margin-left: 25px;
    padding: 10px;
    display: block;
    background-color: #26A65B;
    width: 28%;
    text-align: center;
    margin-bottom: 20PX;
    color: white;
    border-radius: 5px;
    border: 1px solid #9fdeb8
}

@media (max-width: 700px) {
    a.no-order-link {
        width: 40%
    }
}

@media (max-width: 500px) {
    a.no-order-link {
        width: 53%
    }
}

a.no-order-link:hover {
    opacity: 0.5;
    color: #000;
    text-decoration: none;
    -webkit-transition: all 500ms linear;
    transition: all 500ms linear
}

.image-container {
    float: left;
}

@media (max-width: 500px) {
    .image-container {
        width: 100%;
        display: block;
        text-align: left
    }
}

.image-container img {
    max-width: 100%;
    position: relative
}

.text-container {
    float: left;
    width: 80%
}

@media (max-width: 500px) {
    .text-container {
        width: 100%;
        padding-right: 20px
    }
}

.custom-clipart {
    border: 1px solid #ddd;
    border-radius: 2px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    display: inline-block;
    text-align: center;
    margin: 0.5%;
    margin-bottom: 10px;
    vertical-align: top;
    width: 18%
}

@media (max-width: 980px) {
    .custom-clipart {
        width: 22%
    }
}

@media (max-width: 600px) {
    .custom-clipart {
        width: 48%
    }
}

.custom-clipart li {
    min-height: 150px
}

    .custom-clipart li img {
        padding: 10px 15px
    }

    .custom-clipart li.clipart-name {
        background: #f6f6f6;
        border-top: 1px solid #ddd;
        color: #333;
        padding: 4px 2px 2px;
        min-height: 50px
    }

/*-------------------------- End Dashboard Page ---------------------------------------------------*/

/*-------------------------- Start Settings Page --------------------------------------------------*/

.dealer-ID {
    position: absolute;
    top: 25px;
    right: 25px;
    border-radius: 2px
}

@media (max-width: 700px) {
    .dealer-ID {
        right: 5%
    }
}

@media (max-width: 500px) {
    .dealer-ID {
        right: initial;
        top: 20px;
        left: 5px
    }
}

.dealer-ID p {
    color: #0657A8;
    border: 2px solid #ef2028;
    font-size: 22px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 10px 15px
}

.dash-container {
    padding: 0px;
    margin-top: 0px;
    width: 100%
}

    .dash-container h1 {
        margin-bottom: 30px
    }

    .dash-container .register-inputs {
        background: #fff;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        position: relative
    }

@media (max-width: 500px) {
    .dash-container.settings h2 {
        margin-top: 90px
    }
}

.dash-container.settings .register-input-container.fullw {
    width: 100%
}

    .dash-container.settings .register-input-container.fullw input {
        width: 45%
    }

@media (max-width: 700px) {
    .dash-container.settings .register-input-container.fullw input {
        width: 90%
    }
}

.dash-container.settings .register-input-container.fullw input[type="radio"] {
    width: initial;
    margin-right: 5px;
    margin-bottom: 12px;
    top: 2px;
    position: relative
}

.dash-container.settings .register-input-container.fullw select {
    width: 50%;
    margin-left: 5px
}

.dash-container.settings .register-input-container p {
    margin-top: 17px;
    margin-bottom: 0
}

@media (max-width: 450px) {
    .dash-container.settings .register-input-container p {
        margin-top: 0px
    }
}

.dash-container.settings .register-input-container p.business-name {
    background: #f6f6f6;
    color: #0657A8;
    font-weight: bold;
    border: solid 1px #ddd;
    border-radius: 3px;
    height: 35px;
    margin-top: 0px;
    padding: 7px 10px 5px;
    width: 90%
}

.dash-container .checkout-table {
    margin-left: 0;
    margin-bottom: 0;
    /*        margin-top: 10px*/
}

    .dash-container .checkout-table .checkout-items.shipping-address, .dash-container .checkout-table .checkout-items.billing-address {
        width: 100%;
        position: relative;
        margin: -1px -3px 0;
        box-shadow: none;
        border: 1px solid #eee;
        vertical-align: top;
    }

@media (max-width: 768px) {
    .dash-container .checkout-table .checkout-items.shipping-address, .dash-container .checkout-table .checkout-items.billing-address {
        width: 100%;
        left: 3px
    }
}

.dash-container .checkout-table .checkout-items.shipping-address .action-links, .dash-container .checkout-table .checkout-items.billing-address .action-links {
    position: absolute;
    bottom: 5px
}

    .dash-container .checkout-table .checkout-items.shipping-address .action-links .select-address-default, .dash-container .checkout-table .checkout-items.billing-address .action-links .select-address-default {
        cursor: pointer
    }

    .dash-container .checkout-table .checkout-items.shipping-address .action-links .select-address-checkout, .dash-container .checkout-table .checkout-items.billing-address .action-links .select-address-checkout {
        cursor: pointer
    }

.dash-container .checkout-table .checkout-items.shipping-address.default-address {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    color: black;
    margin-bottom: 3px;
}

.checkout-table .checkout-items.billing-address.default-address:before {
    content: "PRIMARY";
    font-weight: 700;
    display: flex;
    float: right;
}

.checkout-table .checkout-items.address-contact.primary-contact:before {
    content: "PRIMARY";
    font-weight: 700;
    display: flex;
    float: right;
}

.dash-container .checkout-table .checkout-items.shipping-address.default-address, .checkout-table .checkout-items.billing-address.default-address,
.checkout-table .checkout-items.shipping-address.cart-address.default-address, .checkout-table .checkout-items.address-contact.primary-contact {
    background-color: #d6ded5;
    Border: 1px solid rgb(107 195 144 / 0.31);
    width: 100%;
    height: 100%;
    border-style: solid;
    border-color: rgb(107 195 144 / 0.31);
    border-width: thin;
    border-radius: 5px;
    color: black;
    margin-bottom: 3px;
}

    .dash-container .checkout-table .checkout-items.shipping-address.default-address:before, .checkout-table .checkout-items.billing-address.default-address:before {
        content: "PRIMARY";
        font-weight: 700;
        display: flex;
        float: right;
    }

.address-contact-line.default-contact {
    width: 100%;
    height: 100%;
    background-color: lightgray;
    color: #0657A8;
}

.address-item {
    cursor: pointer;
    display: contents;
}

.checkout-table .checkout-items.shipping-address .delete-address-button:hover, .checkout-table .checkout-items.billing-address .delete-address-button:hover {
    color: #ED1C24
}

.checkout-table .checkout-items.shipping-address a, .checkout-table .checkout-items.billing-address a {
    cursor: pointer;
    color: #0657A8;
    text-decoration: underline;
}

.checkout-table .checkout-items.shipping-address.default-address .delete-address-button, .checkout-table .checkout-items.billing-address.default-address .delete-address-button {
    cursor: not-allowed
}

.checkout-table .checkout-items.shipping-address.active .delete-address-button {
    cursor: not-allowed
}

.checkout-table .checkout-items.shipping-address.default-address:before {
    content: "PRIMARY";
    font-weight: 700;
    display: flex;
    float: right;
}

/*-------------------------- End Settings Page --------------------------------------------------*/
/*-------------------------- Start Invoice Detail Page ---------------------------------------------------*/
.invoice-top {
    margin: 20px 10% 0;
    overflow: hidden
}

@media (max-width: 950px) {
    .invoice-top {
        margin: 1% 1% 0
    }
}

.invoice-top .breadcrumb {
    border-bottom: 1px solid #eee;
    padding-bottom: 10px
}

.invoice-top .proof-form h3 {
    float: none
}

.invoice-top p {
    float: left;
    width: 100%
}

.invoice-top h3 {
    float: left;
    margin-top: 0;
    text-align: left;
    width: 50%
}

@media (max-width: 700px) {
    .invoice-top h3 {
        width: 100%
    }
}

.invoice-top hr {
    clear: both;
    display: block;
    margin: 30px 0 5px
}

@media (max-width: 950px) {
    .invoice-top hr {
        margin: 30px 0 0
    }
}

@media (max-width: 450px) {
    .invoice-top hr {
        margin: 10px 0 0
    }
}

.invoice-top ul {
    float: right;
    padding-top: 5px;
    margin-bottom: 30px
}

@media (max-width: 600px) {
    .invoice-top ul {
        float: left
    }
}

.invoice-top ul li {
    float: left;
    margin-left: 30px
}

@media (max-width: 600px) {
    .invoice-top ul li {
        margin: 0 30px 0 0
    }
}

@media (max-width: 450px) {
    .invoice-top ul li {
        width: 100%;
        margin: 10px 0
    }
}

#show-invoice {
    position: absolute;
    bottom: 15px;
    left: 20px
}

#show-invoice-div {
    height: 0;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: visibility 0s, opacity 0.5s linear;
    transition: visibility 0s, opacity 0.5s linear
}

    #show-invoice-div.active {
        height: auto;
        visibility: visible;
        opacity: 1
    }

.invoice {
    background: white;
    border-top: 1px solid #ddd;
    border-radius: 3px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin: 40px 10%;
    padding: 40px;
    position: relative
}

@media (max-width: 950px) {
    .invoice {
        margin: 5% 1%
    }
}

@media (max-width: 600px) {
    .invoice {
        padding: 20px 5px
    }
}

.invoice .printer {
    position: absolute;
    left: 34%;
    top: -25px
}

@media (max-width: 600px) {
    .invoice .printer {
        left: 0;
        font-size: 12px
    }
}

.invoice hr {
    clear: both;
    display: block;
    margin: 42px 0 35px
}

@media (max-width: 600px) {
    .invoice hr {
        margin: 30px 0
    }
}

.invoice .id-info, .invoice .total-info {
    border: 1px dashed #ddd;
    float: right;
    text-align: right;
    padding: 10px 15px 0;
    width: 35%
}

.invoice .invoice-header {
    overflow: hidden
}

    .invoice .invoice-header img {
        float: left
    }

    .invoice .invoice-header .invoice-date-number {
        float: right;
        text-align: right
    }

        .invoice .invoice-header .invoice-date-number p:first-child {
            margin-top: 22px
        }

        .invoice .invoice-header .invoice-date-number p {
            margin-bottom: 0px
        }

        .invoice .invoice-header .invoice-date-number strong {
            text-transform: uppercase
        }

        .invoice .invoice-header .invoice-date-number span {
            display: inline-block;
            min-width: 90px
        }

.invoice .invoice-addresses {
    overflow: hidden
}

    .invoice .invoice-addresses li {
        display: inline-block;
        vertical-align: top;
        width: 30%
    }

@media (max-width: 600px) {
    .invoice .invoice-addresses li {
        width: 100%;
        margin: 10px 0
    }
}

.invoice .invoice-addresses h5 {
    color: #0657A8;
    font-weight: bold;
    text-align: left;
    text-transform: uppercase
}

.invoice .invoice-addresses .id-info h5 {
    text-align: right
}

.invoice .invoice-details h4 {
    color: #0657A8;
    font-weight: bold;
    margin-bottom: 30px;
    text-align: left;
    text-transform: uppercase
}

.invoice .invoice-details h5 {
    margin-top: 40px;
    text-align: left
}

@media (max-width: 450px) {
    .invoice .invoice-details h5 {
        margin-top: 10px
    }
}

.invoice .invoice-details table {
    border: 1px solid #ddd;
    font-size: 15px;
    margin-bottom: 40px;
    width: 100%;
    table-layout: fixed
}

    .invoice .invoice-details table td:nth-child(1) {
        width: 20%
    }

    .invoice .invoice-details table td:nth-child(2) {
        width: 50%
    }

    .invoice .invoice-details table td:nth-child(3) {
        width: 8%
    }

    .invoice .invoice-details table td:nth-child(4) {
        width: 12%
    }

    .invoice .invoice-details table td:nth-child(5) {
        width: 10%
    }

@media (max-width: 600px) {
    .invoice .invoice-details table {
        font-size: 12px;
        table-layout: auto
    }
}

.invoice .invoice-details table.subtotals {
    margin-top: 40px;
    text-align: right
}

.invoice .invoice-details table.extra-items {
    border-top: 3px solid #0657A8;
    margin-top: 0
}

.invoice .invoice-details table img {
    max-width: 80px
}

@media (max-width: 450px) {
    .invoice .invoice-details table img {
        max-width: 40px
    }
}

.invoice .invoice-details thead {
    background: #0657A8;
    color: white
}

.invoice .invoice-details tr.invoice-total {
    border-top: 3px solid #eee
}

.invoice .invoice-details tr.paid {
    background: #f6f6f6
}

.invoice .invoice-details td {
    padding: 10px;
    text-align: left
}

@media (max-width: 600px) {
    .invoice .invoice-details td {
        padding: 3px
    }
}

.invoice .invoice-details td:last-child {
    text-align: left
}

.invoice .invoice-details td.layout {
    text-align: center
}

.invoice .invoice-details hr {
    border-style: dashed;
    margin: 0
}

.invoice .invoice-details .preview-img-zoom img {
    max-width: 280px
}

.invoice .invoice-advice {
    overflow: hidden
}

    .invoice .invoice-advice h4 {
        color: #0657A8;
        font-weight: bold;
        margin-bottom: 30px
    }

    .invoice .invoice-advice li {
        display: inline-block;
        vertical-align: top;
        width: 30%
    }

@media (max-width: 600px) {
    .invoice .invoice-advice li {
        width: 100%;
        margin-bottom: 10px 0
    }
}

.invoice .invoice-advice li.total-info {
    margin-top: 35px
}

    .invoice .invoice-advice li.total-info span {
        display: inline-block;
        min-width: 90px
    }

.invoice .invoice-advice .remit {
    color: #0657A8;
    font-size: 12px;
    line-height: 20px;
    font-weight: bold
}

.invoice .invoice-contacto-info p {
    font-size: 13px;
    text-align: center
}

.invoice .invoice-terms h4 {
    color: #0657A8;
    font-weight: bold;
    margin-bottom: 30px;
    text-align: left;
    text-transform: uppercase
}

.invoice .invoice-attachments {
    overflow: hidden
}

    .invoice .invoice-attachments h4 {
        color: #0657A8;
        font-weight: bold;
        margin-bottom: 30px;
        text-align: left;
        text-transform: uppercase
    }

    .invoice .invoice-attachments li {
        border: solid 1px #eee;
        float: left;
        margin-right: 5px;
        width: 180px
    }

@media (max-width: 600px) {
    .invoice .invoice-attachments li {
        width: 100px
    }
}

.breadcrumb {
    padding: 8px 15px;
    margin-bottom: 20px;
    list-style: none;
    background-color: #f5f5f5;
    border-radius: 4px
}

    .breadcrumb > li {
        display: inline-block
    }

        .breadcrumb > li + li:before {
            padding: 0 5px;
            color: #ccc;
            content: "/ "
        }

    .breadcrumb > .active {
        color: #777777
    }

a {
    color: #337ab7;
    text-decoration: none
}

    a:hover, a:focus {
        color: #23527c;
        text-decoration: underline
    }


/*-------------------------- End Invoice Detail Page ---------------------------------------------------*/

/*-------------------------- Dealer Settings Page ----------------------------------------*/
body.dealer #addresses-container, body.dealer #creditcards-container {
    margin-top: 20px;
}

    body.dealer #addresses-container .dealer-address {
        margin: 1px;
        box-shadow: none;
        border: 1px solid #eee;
        background: #fff;
        border-radius: 0px;
        padding: 15px 25px 15px 15px;
        min-width: 190px;
        max-width: 310px;
    }

        body.dealer #addresses-container .dealer-address.primary, body.dealer #creditcards-container .credit-card.primary {
            border-left: 4px solid #26A65B;
            background-color: rgba(38,166,91,0.1);
        }

body.dealer .dealer-settings h4 {
    color: #0657A8;
    font-weight: bold;
    text-align: left;
    margin-bottom: 20px;
}

body.dealer #addresses-container .dealer-address p {
    margin-bottom: 0;
}

body.dealer #addresses-container .dealer-address button.edit-address {
    margin-top: 10px;
}

body.dealer #addresses-container .dealer-address a.remove-address {
    position: absolute;
    top: 0;
    right: 5px;
    color: #ccc;
}

    body.dealer #addresses-container .dealer-address a.remove-address:hover {
        cursor: pointer;
    }

body.dealer #creditcards-container .dealer-credit-cards {
    font-weight: bold;
    margin-bottom: 20px;
}

body.dealer #creditcards-container .credit-card {
    border-bottom: 1px solid #eee;
    line-height: 28px;
    padding: 12px 10px 10px;
}

    body.dealer #creditcards-container .credit-card img {
        margin-right: 2%;
        vertical-align: middle;
        width: 7%;
        max-width: 45px;
        min-width: 26px;
    }

    body.dealer #creditcards-container .credit-card .number {
        margin-left: 4%;
    }

    body.dealer #creditcards-container .credit-card .exp-date {
        margin-left: 4%;
    }

    body.dealer #creditcards-container .credit-card .links {
        text-align: right;
    }

        body.dealer #creditcards-container .credit-card .links button {
            border: none;
            background: none;
            padding: 0;
            font-weight: 400;
            cursor: pointer;
        }

@media(max-width:800px) {
    body.dealer #creditcards-container .credit-card .primary {
        font-size: 10px;
    }
}

/*-------------------------- End Dealer Settings Page ----------------------------------------*/
/*-------------------------- Dealer Registration Page ----------------------------------------*/
body .dealer-register .form-container .form-group.terms {
    width: 70%;
}

body.dealer-register .form-container .terms-message {
    float: right;
    display: none;
    border: 1px solid #ef2028;
    border-radius: 3px;
    padding: 10px 12px;
    width: 65%;
}

body.dealer-register .form-container .terms-check:checked ~ .terms-message {
    display: inline-block;
}



body.dealer-register #select-verified-address-modal .modal-body label input[type=radio] {
    vertical-align: middle;
    margin: 5px;
}
/*-------------------------- End  Dealer Registration Page ----------------------------------------*/
/*-------------------------- Error Page ----------------------------------------*/
body.error .error-container {
    width: 95%;
    margin: auto 0;
}

    body.error .error-container .title {
        text-transform: uppercase;
        font-size: 42px;
        color: #0657A8;
        font-weight: 900;
        font-family: Raleway,sans-serif;
        margin: 0;
        margin-bottom: -22px;
        padding: 10px 0;
    }

    body.error .error-container .sub-title {
        font-size: 25px;
        color: #5c5c5c;
        font-weight: 400;
        font-family: Raleway,sans-serif;
        margin: 0;
        margin-bottom: -22px;
        padding: 10px 0;
    }

    body.error .error-container h1 {
        font-size: 200px;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
        font-weight: 700;
        margin: 0 0 25px 0;
        color: rgb(153, 153, 153);
        opacity: 0.5;
        height: 256px;
    }

        body.error .error-container h1 svg {
            display: inline-block;
            height: 155px;
            width: 165px;
        }


@media screen and (max-width: 767px) {
    body.error .error-container h1 {
        font-size: 110px;
        height: 105px;
        margin-bottom: 30px;
    }

        body.error .error-container h1 svg {
            height: 85px;
            width: 85px;
        }
}

@media screen and (max-width: 400px) {
    body.error .error-container h1 {
        font-size: 60px;
        height: 65px;
        margin-bottom: 30px;
    }

        body.error .error-container h1 svg {
            height: 45px;
            width: 45px;
        }
}
/*-------------------------- End Error Page ----------------------------------------*/



/*-------------------------- Site Search results Page ----------------------------------------*/

body.site-search-results h1 {
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    font-size: 42px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 15px 0 10px;
    text-align: center;
}

body.site-search-results .content-container .row {
    margin-left: 0;
    margin-right: 0;
}


body.site-search-results h2 {
    border-bottom: 1px solid #eee;
    font-size: 24px;
    margin-top: 15px;
    padding-left: 15px;
    padding-bottom: 10px;
    text-align: left;
    color: #333;
}

    body.site-search-results h2 span {
        min-width: 30px;
        font-size: 16px;
        padding-left: 8px;
        color: #888;
        position: relative;
        top: 0px;
    }

body.site-search-results .results-container {
    background: white;
    border: 1px solid #ddd;
    margin-bottom: 20px;
    border-radius: 3px;
    padding: 0 10px 20px;
    font-size: 0;
    position: relative;
}

    body.site-search-results .results-container.site, body.site-search-results .results-container.clipart, body.site-search-results .results-container.layout, body.site-search-results .results-container.apparel {
        min-width: 150px;
    }

    body.site-search-results .results-container.site {
        border-left: 4px solid rgba(6,87,168,0.7);
    }


    body.site-search-results .results-container.apparel {
        border-left: 4px solid rgba(255,152,0,0.3);
    }

    body.site-search-results .results-container.clipart, body.site-search-results .results-container.layout {
        border-left: 4px solid #a8dbbd;
    }


    body.site-search-results .results-container a.result-item {
        display: block;
        margin: 20px auto;
        padding: 15px 15px 5px;
        border: 1px solid #eee;
        border-radius: 2px;
        font-size: 14px;
        text-decoration: none;
    }

        body.site-search-results .results-container a.result-item:hover {
            box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
            text-decoration: none;
        }

    body.site-search-results .results-container .result-item .title {
        color: #0657A8;
        font-weight: bold;
        margin: 0;
    }

        body.site-search-results .results-container .result-item .title:before {
            content: "\f0DA";
            color: #0657A8;
            font-family: fontAwesome;
            font-size: 10px;
            padding-right: 5px;
            vertical-align: middle;
        }

    body.site-search-results .results-container .result-item .content-url {
        color: #006621;
        padding: 0 75px 0 10px;
        word-wrap: break-word;
        margin-bottom: 5px;
    }

    body.site-search-results .results-container .result-item .description {
        color: #333;
        padding: 0 75px 0 10px;
        margin-bottom: 10px;
    }

body.site-search-results .side-results .results-container .view-all {
    display: block;
    margin: 10px auto;
    text-align: center;
}

    body.site-search-results .side-results .results-container .view-all a {
        background: transparent;
        border: solid 10px #ddd;
        border-radius: 50%;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        color: #333;
        cursor: pointer;
        display: block;
        font-family: "raleway";
        font-size: 18px;
        margin: 0 auto;
        opacity: 0.8;
        padding: 0;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in;
        text-align: center;
        width: 110px;
        line-height: 85px;
    }

    body.site-search-results .side-results .results-container .view-all form input {
        background: transparent;
        border: solid 10px #ddd;
        border-radius: 50%;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        color: #333;
        cursor: pointer;
        display: block;
        font-family: "raleway";
        font-size: 18px;
        margin: 0 auto;
        opacity: 0.8;
        padding: 0;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in;
        text-align: center;
        width: 110px;
        height: 110px;
    }

        body.site-search-results .side-results .results-container .view-all form input:hover {
            text-decoration: underline;
        }

body.site-search-results .side-results .results-container .result-item .image-container {
    height: 150px;
    width: 100%;
    position: relative;
}

    body.site-search-results .side-results .results-container .result-item .image-container img {
        height: 150px;
        width: 150px;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
    }

body.site-search-results .side-results .results-container .result-item .description {
    text-align: center;
    padding: 0;
}

@media screen and (max-width: 992px) {

    body.site-search-results .results-container {
        margin-right: 5%;
        margin-left: 5%;
    }

        body.site-search-results .results-container .result-item .description, body.site-search-results .results-container .result-item .content-url {
            padding-right: 10px;
        }

    body.site-search-results .side-results .results-container .result-item {
        width: 45%;
        display: inline-block;
        margin: 1%;
    }
}

@media screen and (max-width: 458px) {
    body.site-search-results .side-results .results-container .result-item {
        width: 100%;
    }
}


/*-------------------------- End  Site Search results Page ----------------------------------------*/


/*-------------------------- Artwork Search results Page  ----------------------------------------*/

body.artwork-search-results .categories-section {
    margin-top: 42px;
    margin-left: 20px;
}

    body.artwork-search-results .categories-section .main-category-title {
        color: #5c5c5c;
        font-family: Raleway,sans-serif;
        padding-bottom: 28px;
        padding-left: 20px;
        padding-top: 10px;
        text-align: left;
        font-size: 24px;
    }

    body.artwork-search-results .categories-section form input[type=text] {
        width: 79%;
    }

    body.artwork-search-results .categories-section form input[type=submit] {
        background: #cfcfcf;
        color: white;
        padding: 1px 10px;
        width: 20%;
    }

    body.artwork-search-results .categories-section form input[type=radio] {
        display: none;
    }

    body.artwork-search-results .categories-section .category-container {
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        border-top: 1px solid #ddd;
        border-left: 1px solid #ddd;
        background: #fff;
        margin-top: 10px;
    }

        body.artwork-search-results .categories-section .category-container .category {
            background: #eee;
            font-family: "cabin";
            font-size: 18px;
            color: #333;
            padding-left: 20px;
            position: relative;
            border-bottom: solid 1px #ddd;
            line-height: 40px;
        }

            body.artwork-search-results .categories-section .category-container .category .fa {
                position: absolute;
                top: 15px;
                right: 15px;
                font-size: 14px;
                color: #0657A8;
            }

            body.artwork-search-results .categories-section .category-container .category .fa-plus {
                display: none;
            }

            body.artwork-search-results .categories-section .category-container .category.collapsed:hover .fa-plus {
                display: block;
            }

            body.artwork-search-results .categories-section .category-container .category.collapsed .fa-chevron-down {
                display: none;
            }

        body.artwork-search-results .categories-section .category-container ul {
            padding: 0px 20px 10px 20px;
            border-bottom: 1px solid #ddd;
        }

        body.artwork-search-results .categories-section .category-container li {
            margin-top: 10px;
            position: relative;
        }

            body.artwork-search-results .categories-section .category-container li .subcategory-item {
                padding: 3px 8px;
                color: #0657A8;
            }

                body.artwork-search-results .categories-section .category-container li .subcategory-item:hover {
                    background-color: rgba(6,87,168,0.8);
                    color: #fff;
                    border-radius: 4px;
                }

                body.artwork-search-results .categories-section .category-container li .subcategory-item.active {
                    background-color: rgba(6,87,168,0.8);
                    color: #fff;
                    border-radius: 4px;
                }

body.artwork-search-results .category-results .category-title {
    font-size: 42px;
    margin: .67em 0 0;
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    padding-top: 10px;
    padding-bottom: 10px;
}

body.artwork-search-results .category-results .subcategory-title {
    color: #999;
    min-height: 25px;
    text-transform: capitalize;
}

body.artwork-search-results .category-results .view-artwork {
    background: white;
    border-top: 1px solid #ddd;
    border-radius: 3px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    cursor: pointer;
    margin: 5px;
    text-align: center;
    min-width: 180px;
    max-width: 200px;
}

    body.artwork-search-results .category-results .view-artwork .image-container {
        padding: 5px;
    }

    body.artwork-search-results .category-results .view-artwork .apparel-item-title {
        border-top: 1px solid #ddd;
        font-family: cabin;
        font-size: 15px;
        padding: 5px 8px;
    }

body.artwork-search-results #view-artwork-modal .modal-dialog {
    max-width: 400px;
    max-height: 400px;
    padding: 10px 30px;
    top: 15%;
}

body.artwork-search-results #view-artwork-modal button.close {
    z-index: 9999;
}

    body.artwork-search-results #view-artwork-modal button.close span {
        text-align: right;
        display: block;
        padding-right: 5px;
    }

body.artwork-search-results #view-artwork-modal .modal-content {
    border-radius: 4px;
    background-color: white;
    width: 400px;
    height: 400px;
}


body.artwork-search-results #view-artwork-modal #modal-artwork-image {
    width: 200px;
    height: 185px;
    margin: 20px auto 0;
}

body.artwork-search-results #view-artwork-modal .clipart-swatches {
    display: block;
    position: relative;
    width: 100%;
    left: 2px;
    z-index: 9999;
    margin-top: 35px;
}

    body.artwork-search-results #view-artwork-modal .clipart-swatches li {
        height: 31px;
        width: 31px;
        display: block;
        margin: 1px;
        float: left;
        cursor: pointer;
        opacity: 0.8;
        border-radius: 2px;
    }

body.artwork-search-results #view-artwork-modal #tee-shirt-button {
    border: 1px solid #446CB3;
    color: #0657A8;
    border-radius: 2px;
    width: 38.2%;
    margin-top: 15px;
    margin-bottom: 5px;
    background: #fff;
    text-align: center;
    cursor: pointer;
    line-height: 26px;
    display: inline-block;
}

    body.artwork-search-results #view-artwork-modal #tee-shirt-button:hover {
        background: #0657A8;
        color: #fff;
    }

body.artwork-search-results #view-artwork-modal #easy-view-form {
    display: inline;
}

body.artwork-search-results #view-artwork-modal a.easy-button {
    border: 1px solid #12824c;
    border-radius: 2px;
    width: 59.2%;
    margin-top: 15px;
    margin-bottom: 5px;
    background: #fff;
    color: #12824c;
    line-height: 26px;
    display: inline-block;
    text-align: center;
}

    body.artwork-search-results #view-artwork-modal a.easy-button:hover {
        background-color: #12824c;
        color: #fff;
        text-decoration: none;
    }


@media screen and (max-width: 576px) {
    body.artwork-search-results .categories-section {
        width: 80%;
        margin-top: 5px;
        margin-right: auto;
        margin-left: auto;
    }

        body.artwork-search-results .categories-section .main-category-title {
            padding-bottom: 0;
        }

    body.artwork-search-results .category-results .view-artwork {
        margin: 2px;
    }

    body.artwork-search-results .categories-section .category-container .category {
        line-height: 35px;
    }

    body.artwork-search-results .categories-section .category-container li .subcategory-item {
        padding-top: 0;
        padding-bottom: 0;
    }
}
/*-------------------------- End Artwork Search results Page ----------------------------------------*/


/*-------------------------- Apparel Search results Page  ----------------------------------------*/


body.apparel-search-results .categories-section .main-category-title {
    color: #5c5c5c;
    font-family: Raleway,sans-serif;
    padding-bottom: 28px;
    padding-left: 20px;
    padding-top: 10px;
    text-align: left;
    font-size: 24px;
}

body.apparel-search-results .categories-section form input[type=text] {
    width: 79%;
}

body.apparel-search-results .categories-section form input[type=submit] {
    background: #7a7a7a;
    color: white;
    padding: 1px 10px;
}

    body.apparel-search-results .categories-section form input[type=submit]:hover {
        background: #707070;
    }

body.apparel-search-results .categories-section form input[type=radio] {
    display: none;
}

body.apparel-search-results .categories-section .category-container {
    border: 1px solid #ddd;
    background: #fff;
}

    body.apparel-search-results .categories-section .category-container .category {
        font-family: "cabin";
        background-color: #fff;
        font-size: 18px;
        color: #333;
        padding-left: 20px;
        position: relative;
        border-bottom: solid 1px #ddd;
        line-height: 40px;
        cursor: pointer;
    }

        body.apparel-search-results .categories-section .category-container .category .fa {
            position: absolute;
            top: 15px;
            right: 15px;
            font-size: 14px;
            color: rgba(6,87,168,0.8);
        }

        body.apparel-search-results .categories-section .category-container .category .fa-plus {
            display: none;
        }

        body.apparel-search-results .categories-section .category-container .category.collapsed:hover .fa-plus {
            display: block;
        }

        body.apparel-search-results .categories-section .category-container .category.collapsed .fa-chevron-down {
            display: none;
        }

    body.apparel-search-results .categories-section .category-container ul {
        padding: 0px 20px 10px 20px;
        border-bottom: 1px solid #ddd;
    }

    body.apparel-search-results .categories-section .category-container li {
        margin-top: 7px;
        position: relative;
    }

        body.apparel-search-results .categories-section .category-container li .subcategory-item {
            padding: 3px 8px;
            color: #0657A8;
            text-decoration: none;
            font-size: 16px;
        }

            body.apparel-search-results .categories-section .category-container li .subcategory-item:hover {
                background-color: #0657A8;
                color: #fff;
                border-radius: 4px;
                text-decoration: none;
            }

            body.apparel-search-results .categories-section .category-container li .subcategory-item.active {
                background-color: #0657A8;
                color: #fff;
                border-radius: 4px;
            }

body.apparel-search-results .apparel-results .title {
    font-size: 42px;
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    padding-top: 10px;
    padding-bottom: 10px;
}

body.apparel-search-results .apparel-results .sub-title {
    color: #999;
    min-height: 25px;
    text-transform: capitalize;
}

body.apparel-search-results .apparel-results .apparel-item {
    background: white;
    border-color: #ddd;
    border-radius: 3px;
    cursor: pointer;
    margin: 5px;
    width: 192px;
    min-width: 192px;
    max-width: 192px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
}

    body.apparel-search-results .apparel-results .apparel-item:hover {
        border: 1px solid #eee;
        border-top: 1px solid #bbb;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.8)
    }

    body.apparel-search-results .apparel-results .apparel-item .image-container {
        padding: 5px;
        max-height: 250px;
        min-height: 250px;
        height: 250px;
    }

        body.apparel-search-results .apparel-results .apparel-item .image-container img {
            max-height: 100%;
            margin: 0 auto;
            display: block;
        }

    body.apparel-search-results .apparel-results .apparel-item .flex-column {
        height: 100%;
    }

    body.apparel-search-results .apparel-results .apparel-item .title {
        line-height: 20px;
        border-top: 1px solid #ddd;
        font-family: cabin;
        font-size: 14px;
        padding: 5px;
        color: #333;
    }

    body.apparel-search-results .apparel-results .apparel-item .description {
        font-size: 12px;
        background: #f6f6f6;
        border-top: 1px solid #eee;
        padding: 5px 8px;
    }

        body.apparel-search-results .apparel-results .apparel-item .description .price span {
            font-size: 14px;
            color: green;
            font-weight: bold;
            line-height: 20px;
        }

@media screen and (max-width: 576px) {
    body.apparel-search-results .categories-section {
        width: 80%;
        margin-top: 5px;
        margin-right: auto;
        margin-left: auto;
    }

        body.apparel-search-results .categories-section .main-category-title {
            padding-bottom: 0;
        }

    body.apparel-search-results .apparel-results .apparel-item {
        margin: 2px;
    }

    body.apparel-search-results .categories-section .category-container .category {
        line-height: 35px;
    }

    body.apparel-search-results .categories-section .category-container li .subcategory-item {
        padding-top: 0;
        padding-bottom: 0;
    }
}
/*-------------------------- End Artwork Search results Page ----------------------------------------*/



/*-------------------------- Apparel Details Page  ----------------------------------------*/
body.apparel-details .image-container .product-image {
    display: none;
    max-height: 705px;
    max-width: 82%;
}

    body.apparel-details .image-container .product-image.active {
        display: block;
    }








body.apparel-details .product-container {
    padding: 20px 70px 20px 30px;
}

    body.apparel-details .product-container .product-title {
        font-family: Cabin;
        font-size: 24px;
    }

    body.apparel-details .product-container .product-description {
        line-height: 22px;
        margin: 10px 0;
        padding-right: 15px;
    }

    body.apparel-details .product-container .colors-container {
        margin: 15px 0px;
        font-size: 0;
        position: relative;
        padding: 0;
    }

        body.apparel-details .product-container .colors-container .color-selector {
            display: inline-block;
            margin-right: 5px;
            margin-bottom: 5px;
            width: 40px;
            height: 40px;
            vertical-align: top;
            position: relative;
        }

            body.apparel-details .product-container .colors-container .color-selector img {
                margin: 0 auto;
                width: 100%;
                border-radius: 50%;
                cursor: pointer;
                border: 1px solid #ddd;
            }

                body.apparel-details .product-container .colors-container .color-selector img + i {
                    display: inline-block;
                    position: absolute;
                    color: #fff;
                    z-index: 999;
                    width: 40px;
                    line-height: 43px;
                    font-size: 25px;
                    pointer-events: none;
                    text-align: center;
                    top: 0;
                    left: 0;
                    opacity: 0;
                    text-shadow: -1px 0 #555, 0 1px #555, 1px 0 #555, 0 -1px #555;
                }

            body.apparel-details .product-container .colors-container .color-selector.active img + i {
                opacity: 1;
            }

            body.apparel-details .product-container .colors-container .color-selector:hover img + i {
                opacity: 1;
                -webkit-transition: opacity .25s ease-in;
                transition: opacity .25s ease-in;
            }

            body.apparel-details .product-container .colors-container .color-selector:hover img {
                opacity: .75;
                -webkit-transition: opacity .25s ease-in;
                transition: opacity .25s ease-in;
            }

    body.apparel-details .product-container .apparel-options {
        margin-bottom: 5px;
    }

        body.apparel-details .product-container .apparel-options a.btn {
            width: calc(32% - 20px);
            margin: 5px;
        }

        body.apparel-details .product-container .apparel-options .pricing-not-available, .pricing-not-available {
            padding: 10px 10px 10px 5px;
            margin: 10px 5px;
            border-top: 1px solid #ddd;
            box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
            background: white;
            border-radius: 2px;
            border-left: 4px solid #f6db6f;
            width: calc(100% - 20px);
        }

            body.apparel-details .product-container .apparel-options .pricing-not-available .fa, .pricing-not-available .fa {
                color: #f6db6f;
                margin-left: 5px;
                margin-right: 10px;
            }

            body.apparel-details .product-container .apparel-options .pricing-not-available a, .pricing-not-available a {
                font-weight: bold;
                text-decoration: underline;
            }



    body.apparel-details .product-container .product-price-container {
        overflow-x: auto;
    }

    body.apparel-details .product-container .price-table {
        display: none;
        width: 100%;
        margin: 10px 0;
        border: 1px solid #cfcfcf;
        min-width: 360px;
        border-radius: 6px;

    }

        body.apparel-details .product-container .price-table.active {
            display: table;
        }

        body.apparel-details .product-container .price-table th {
            padding-left: 5px;
            background-color: #eee;
            padding-top: 5px;
            padding-bottom: 5px;
            font-weight: bold;
            border: 1px solid #cfcfcf;
        }

        body.apparel-details .product-container .price-table td {
            min-width: 60px;
        }

        body.apparel-details .product-container .price-table .size-row td.qty {
            padding-left: 0;
            width: 12%
        }

            body.apparel-details .product-container .price-table .size-row td.qty input {
                border: none;
                width: 100%;
            }

                body.apparel-details .product-container .price-table .size-row td.qty input::-webkit-inner-spin-button, body.apparel-details .product-container .price-table .size-row td.qty input::-webkit-outer-spin-button {
                    -webkit-appearance: none;
                    margin: 0;
                }

        body.apparel-details .product-container .price-table .size-row .price-cell.active {
            background-color: rgba(201,233,214,0.49);
        }

        body.apparel-details .product-container .price-table .size-row .error {
            background: red;
        }

        body.apparel-details .product-container .price-table tr.aggregation-row {
            background-color: #eee;
        }

    body.apparel-details .product-container #over400 {
        background: #0657A8;
        width: 80px;
        height: 80px;
        position: absolute;
        text-align: center;
        bottom: 28px;
        left: -62px;
    }

        body.apparel-details .product-container #over400 > p {
            z-index: 9000;
            color: #c9e9d6;
            position: absolute;
            line-height: 17px;
            padding-top: 6px;
        }

            body.apparel-details .product-container #over400 > p span {
                color: white;
                font-weight: 800;
                text-transform: uppercase;
            }

        body.apparel-details .product-container #over400:before, body.apparel-details .product-container #over400:after {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            height: 80px;
            width: 80px;
            background: #0657A8;
        }

        body.apparel-details .product-container #over400:before {
            transform: rotate(30deg);
        }

        body.apparel-details .product-container #over400:after {
            transform: rotate(60deg);
        }

@media (max-width: 1000px) {
    body.apparel-details .product-container {
        padding: 20px;
    }

        body.apparel-details .product-container #over400 {
            bottom: 16px;
            left: 16px;
        }

        body.apparel-details .product-container .price-table {
            margin-bottom: 85px;
        }

    body.apparel-details .image-container .product-image {
        max-height: 60vh;
    }
}

@media (max-width: 498px) {
    body.apparel-details .product-container .apparel-options a.btn {
        width: 100%;
    }

    body.apparel-details .image-container .product-image {
        /*max-height: 500px;*/
    }
}
/*-------------------------- End Apparel Details Page  ----------------------------------------*/

/*-------------------------- Upload Artwork Page  ----------------------------------------*/
.artwork-upload h1 {
    font-family: "Raleway, sans-serif";
    font-size: 42px;
    font-weight: 400;
    color: #5c5c5c;
}

.artwork-upload .white-container h3 {
    text-align: left;
    font-size: 26px;
    margin-top: 20px;
    margin-bottom: 10px;
}

    .artwork-upload .white-container h3 span {
        display: inline-block;
        background: transparent;
        color: #0657A8;
        width: 36px;
        line-height: 28px;
        border: 2px solid #0657A8;
        text-align: center;
        border-radius: 65%;
        padding: 1px 0 3px;
        position: relative;
        top: 0px;
        margin-right: 0px;
    }

.artwork-upload .filetypes {
    background: #f6f6f6;
    border: 1px solid #ddd;
    border-radius: 2px;
    padding: 14px;
    margin-top: 30px;
    min-height: 150px;
}

.artwork-upload .artworkChecklist {
    background: #f6f6f6;
    border: 1px solid #ddd;
    border-radius: 2px;
    margin: 16px;
    padding: 14px;
}

.artwork-upload .filetypes .fa {
    color: #999;
    font-size: 40px;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
    position: absolute;
    top: 22px;
    left: 10px;
}

.dropzone .dz-preview .dz-error-message {
    top: 80px !important;
    left: 100px !important;
}



.artwork-upload #uploadartworkdropzone {
    border: 2px dashed #888;
    border-radius: 5px;
    background: white;
    position: relative;
    -webkit-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    min-height: 294px;
}

    .artwork-upload #uploadartworkdropzone:hover {
        background: #e9f6ef;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in
    }


        .artwork-upload #uploadartworkdropzone:hover .dz-message {
            color: #333
        }

            .artwork-upload #uploadartworkdropzone:hover .dz-message:before {
                color: #333
            }

    .artwork-upload #uploadartworkdropzone .dz-message {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        pointer-events: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        padding-top: 42px;
        text-align: center;
    }

        .artwork-upload #uploadartworkdropzone .dz-message:before {
            font-family: "fontAwesome";
            content: "\f0ee";
            font-size: 80px;
            color: #666;
            display: block
        }


    .artwork-upload #uploadartworkdropzone .dz-preview.dz-image-preview {
        border: 2px dashed #c8c8c8;
        border-radius: 5px;
        padding: 10px;
    }

        .artwork-upload #uploadartworkdropzone .dz-preview.dz-image-preview.dz-warning {
            border: 2px dashed #f6db6f;
            border-radius: 5px;
            padding: 10px;
            background: ivory;
        }

    .artwork-upload #uploadartworkdropzone .dz-preview .dz-image.dz-txp-image {
        height: 100px;
        width: 100px;
        border-radius: 5px;
        margin: 8px 8px 20px 8px;
    }

    .artwork-upload #uploadartworkdropzone .dz-preview .dz-image [data-dz-thumbnail] {
        margin-bottom: 10px;
    }

    .artwork-upload #uploadartworkdropzone .dz-preview.dz-txp-complete .dz-txp-progress {
        opacity: 0;
        -webkit-transition: opacity 0.4s ease-in;
        transition: opacity 0.4s ease-in;
    }

    .artwork-upload #uploadartworkdropzone .dz-preview .dz-txp-progress {
        opacity: 1;
        z-index: 1000;
        pointer-events: none;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 78%;
        -webkit-transform: scale(1);
        transform: scale(1);
        border-radius: 8px;
        overflow: hidden;
        background-color: rgba(255,255,255,0.8);
    }

        .artwork-upload #uploadartworkdropzone .dz-preview .dz-txp-progress .fa.fa-spinner.fa-pulse.fa-3x.fa-fw {
            color: #828282;
            margin-top: 30%;
            margin-left: 30%;
        }

    .artwork-upload #uploadartworkdropzone .dz-preview.dz-warning .dz-txp-warning-message {
        display: block;
    }

    .artwork-upload #uploadartworkdropzone .dz-preview .dz-txp-warning-message {
        pointer-events: none;
        z-index: 1000;
        position: absolute;
        display: none;
        opacity: 0;
        -webkit-transition: opacity 0.3s ease;
        transition: opacity 0.3s ease;
        border-radius: 8px;
        font-size: 13px;
        bottom: 150px;
        left: 35px;
        min-width: 180px;
        background: #be2626;
        background: -webkit-linear-gradient(top, #f6db6f, #f6db6f);
        background: linear-gradient(to bottom, #f6db6f, #f6db6f);
        padding: 0.5em 1.2em;
        color: black;
    }

        .artwork-upload #uploadartworkdropzone .dz-preview .dz-txp-warning-message:after {
            content: '';
            position: absolute;
            bottom: -6px;
            left: 30px;
            width: 0;
            height: 0;
            border-left: 6px solid transparent;
            border-right: 6px solid transparent;
            border-top: 6px solid #f6db6f;
        }

    .artwork-upload #uploadartworkdropzone .dz-preview.dz-warning .fa.fa-warning {
        display: block;
        position: absolute;
        top: 5px;
        right: 5px;
        color: #f6db6f;
    }

    .artwork-upload #uploadartworkdropzone .dz-preview .dz-image.dz-txp-image {
        height: 100px;
        width: 100px;
        border-radius: 5px;
        margin: 8px 8px 20px 8px;
    }

    .artwork-upload #uploadartworkdropzone .dz-preview .dz-image [data-dz-thumbnail] {
        margin-bottom: 10px;
    }

.artwork-upload .form-group.artwork-details {
    width: 100% !important;
}

    .artwork-upload .form-group.artwork-details textarea {
        border-style: solid;
        border-color: lightgray;
    }

.artwork-upload form h4 {
    text-align: left;
}

.artwork-upload form .color-group {
    display: none;
    height: 100%;
    vertical-align: middle;
    padding-top: 8px;
}

.artwork-upload form .color-group-name {
    display: none;
    height: 100%;
    vertical-align: middle;
    padding-top: 5px;
    padding-bottom: 0px;
    font-size: 12px;
}

.artwork-upload form .color-group .option-color {
    color: white;
    height: 80px;
    width: 80px;
    border: 1px solid rgb(221, 221, 221);
    border-radius: 3px;
    display: none;
    vertical-align: middle;
    margin: 2px 5px 5px 0px;
    cursor: pointer;
    position: relative;
    font-size: 0px;
    text-align: center;
    padding: 4px 4px;
    min-width: 80px;
}

    .artwork-upload form .color-group .option-color.active {
        display: inline-block;
    }



    .artwork-upload form .color-group .option-color label {
        width: 100%;
        height: 100%;
    }

.artwork-upload form .color-group .check-select.active label:after {
    content: "\f00c";
    font-family: FontAwesome;
    position: absolute;
    right: 0;
    top: 0px;
    text-align: center;
    left: 0;
    line-height: 58px;
    color: #fff;
    font-size: 26px;
    text-shadow: -1px 0 #555, 0 1px #555, 1px 0 #555, 0 -1px #555;
}

.artwork-upload form .color-group .option-color input[type="checkbox"] {
    width: 0;
    opacity: 0;
    height: 0;
}

.artwork-upload form .color-group .option-color span {
    display: inline-block;
    position: absolute;
    background: rgba(255,255,255,0.9);
    color: #333;
    text-align: center;
    padding: 1px 0 1px;
    left: 3px;
    right: 3px;
    bottom: 3px;
    border-radius: 2px;
    font-size: 12px;
    line-height: 15px;
}

.artwork-upload form .artwork-promo {
    padding: 0 20px 0 0;
    border-radius: 2px;
    height: 50px;
    width: 250px;
    display: inline-block;
}


.artwork-upload .active {
    display: block;
}

.artwork-upload .inactive {
    display: none;
}

.artwork-upload label input[type=radio] {
    vertical-align: middle;
    margin: 5px;
}

.artwork-upload label input[type=checkbox] {
    vertical-align: middle;
    margin: 5px;
}

.artwork-upload .artwork-promo-image {
    width: 250px;
}

    .artwork-upload .artwork-promo-image.active {
        position: fixed;
        background: rgba(0,0,0,0.6);
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        display: block;
        z-index: 99999;
    }

        .artwork-upload .artwork-promo-image.active img {
            max-width: 60%;
            max-height: 60%;
            margin: 25vh 25vw 0 25vw;
        }

        .artwork-upload .artwork-promo-image.active p {
            display: none;
        }

@media (max-width:600px) {
    .artwork-upload .artwork-promo-image.active img {
        max-width: 75%;
        max-height: 75%;
        margin: 15vh 15vw 0 15vw;
    }
}

.artwork-upload .artwork-promo-image img.inactive {
    display: none;
}

.artwork-upload .artwork-promo-image p {
}
/*-------------------------- End Upload Artwork Page  ----------------------------------------*/

/*-------------------------- Begin Calculators Page  ----------------------------------------*/
body.calculators ol {
    margin-bottom: 10px;
    padding-left: 0px;
    counter-reset: item;
}

    body.calculators ol li {
        display: block;
    }


        body.calculators ol li:before {
            content: counter(item) ". ";
            counter-increment: item;
            font-weight: bold;
        }

body.calculators h3 {
    color: #0657A8;
    text-align: left;
}

body.calculators h4 {
    font-weight: 700;
    margin: 5px 0;
    text-align: left;
}

body.calculators label input[type=radio] {
    vertical-align: middle;
    margin: 5px;
    height: 25px;
}

body.calculators .product-form-options .product-option .form-calculate {
    height: 54px;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    margin-left: 20px;
    margin-top: 5px;
    padding: 2px 5% 2px 5%;
}

body.calculators .alert-message-container {
    margin: 15px 5px;
    position: relative;
}

body.calculators .custom-message {
    background: #fff;
    border-top: 1px solid #ddd;
    border-radius: 2px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin-bottom: 10px;
    padding: 12px 12px 12px 15px;
    border-left: 3px solid #f6db6f;
}

body.calculators .alert-message-container .field-validation-error {
    display: block;
    border-left: 4px solid #ef2028;
    border-right: 1px solid #ef2028;
    background: rgba(199,45,35,0.1);
    color: #ef2028;
    padding: 2px 15px;
}

    body.calculators .alert-message-container .field-validation-error:before {
        content: " ";
        position: absolute;
        top: -1px;
        right: 0;
        left: 0;
        border-top: 1px solid #ef2028;
        border-top-right-radius: 2px;
        border-top-left-radius: 2px;
    }

    body.calculators .alert-message-container .field-validation-error:after {
        content: " ";
        position: absolute;
        bottom: -1px;
        right: 0;
        left: 0;
        border-bottom: 1px solid #ef2028;
        border-bottom-right-radius: 2px;
        border-bottom-left-radius: 2px;
    }

body.calculators .gang-results, body.calculators .resize-results {
    border: 1px solid rgba(6,87,168,0.6);
    display: inline-block;
    padding: 10px;
    border-radius: 2px;
    margin-bottom: 10px;
    position: relative;
}

    body.calculators .gang-results .title, body.calculators .resize-results .title {
        font-weight: bold;
        min-width: 250px;
        display: inline-block;
    }



/*-------------------------- End Calculators Page  ----------------------------------------*/
/*-------------------------- Begin Calculator Results Page  ----------------------------------------*/
body.calculator-results h1 {
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    font-size: 42px;
}

body.calculator-results .calc-search-items {
    text-align: center;
    margin-bottom: 15px;
}

    body.calculator-results .calc-search-items p {
        display: inline-block;
        margin: 0 20px;
    }

        body.calculator-results .calc-search-items p span {
            font-weight: bold;
            margin-right: 5px;
        }

body.calculator-results .calc-search-items {
    text-align: center;
}

body.calculator-results table {
    background: #FFF;
    border-top: 2px solid #0657A8;
    border-right: 1px solid #0657A8;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    text-align: center;
    margin-bottom: 30px;
    width: 100%;
    display: block;
    overflow: auto;
}

body.calculator-results td {
    border: 1px solid #ddd;
}

body.calculator-results tbody td {
    padding: 15px 10px;
}

body.calculator-results thead th, body.calculator-results tfoot th {
    padding: 8px 10px;
    background: #eee;
    font-weight: normal;
    border: 1px solid #ddd;
}

body.calculator-results thead tr:first-child th:not(:first-child) {
    color: #0657A8;
    font-weight: bold;
    border-right: 1px solid #043c75;
}

body.calculator-results td:first-child, body.calculator-results th:first-child {
    background: #0657A8 !important;
    color: #ddd !important;
    width: 1%;
    border: 0;
    border-bottom: 1px solid #043c75;
}

body.calculator-results td:nth-child(4), body.calculator-results td:nth-child(6), body.calculator-results td:last-child,
body.calculator-results th:nth-child(4), body.calculator-results th:nth-child(6), body.calculator-results th:last-child {
    border-right: 1px solid #043c75;
}

body.calculator-results .product-items-container {
    width: 80%;
    margin: 10px auto;
}

    body.calculator-results .product-items-container .pack-result {
        background: #FFF;
        border-top: 1px solid #ddd;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        margin: 10px;
        padding: 0px 20px 0px;
        vertical-align: top;
        width: 30%;
        min-width: 200px;
        display: inline-block;
        position: relative;
    }

        body.calculator-results .product-items-container .pack-result h3 {
            color: #0657A8;
            margin-top: 15px;
            font-size: 18px;
            text-transform: uppercase;
        }


        body.calculator-results .product-items-container .pack-result img {
            width: 100%;
            max-width: 300px;
            display: block;
        }

        body.calculator-results .product-items-container .pack-result .qoutes {
            display: flex;
            flex-flow: row wrap;
            justify-content: space-around;
        }

            body.calculator-results .product-items-container .pack-result .qoutes div {
                text-align: center;
                margin-top: 8px;
                font-size: 14px;
                min-width: 45%;
                white-space: nowrap;
            }

        body.calculator-results .product-items-container .pack-result .add-to-cart-container {
            margin: 5px -20px 0;
        }

            body.calculator-results .product-items-container .pack-result .add-to-cart-container button {
                cursor: pointer;
                background: #26A65B;
                color: #fff;
                width: 100%;
                text-transform: uppercase;
                font-size: 14px;
                line-height: 34px;
                border: none;
            }

    body.calculator-results .product-items-container .legal-container {
        width: 95%;
        font-size: 14px;
        border-left: 3px solid #0657A8;
        color: #333;
        margin: 10px 0 20px .5%;
        padding: 10px 20px;
        background: #FFF;
        border-top: 1px solid #ddd;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    }

        body.calculator-results .product-items-container .legal-container p {
            margin: 0px;
        }

    body.calculator-results .product-items-container a.back-page {
        background: #0657A8;
        color: #fff;
        display: inline-block;
        padding: 10px 15px;
        border-radius: 2px;
        text-decoration: none;
        line-height: 14px;
    }

        body.calculator-results .product-items-container a.back-page .fa {
            margin-right: 5px;
        }

@media(max-width:992px) {
    body.calculator-results .product-items-container {
        width: 100%;
        margin: 5px 0;
    }

        body.calculator-results .product-items-container .legal-container {
            margin: .5% .5% .5% 1.5%
        }

        body.calculator-results .product-items-container a.back-page {
            margin: .5% .5% .5% 1.5%
        }
}

@media(max-width:600px) {
    body.calculator-results .product-items-container .pack-result {
        display: block;
        width: 95%;
        margin: 10px auto;
    }
}

/*-------------------------- End Calculator Results Page  ----------------------------------------*/

.product-form-options .names-list .modal-container {
    float: left;
    position: relative;
}

    .product-form-options .names-list .modal-container .btn {
        min-width: 22%;
        margin-left: 10px;
        transition: background 0.3s ease-in;
    }

        .product-form-options .names-list .modal-container .btn.cancel {
            background: #ccc;
            border-color: #aaa;
            color: #333;
        }

    .product-form-options .names-list .modal-container .modal-content,
    .product-form-options .names-list .modal-container .modal-backdrop {
        cursor: pointer;
        height: 0;
        width: 0;
        opacity: 0;
        overflow: hidden;
        transition: opacity 0.2s ease-in;
        visibility: hidden;
    }

    .product-form-options .names-list .modal-container .modal-close {
        background: #fff;
        color: #aaa;
        cursor: pointer;
        font-size: 16px;
        font-weight: bold;
        padding-top: 3px;
        position: absolute;
        right: 5px;
        top: 5px;
        height: 25px;
        text-align: center;
        width: 25px;
    }

        .product-form-options .names-list .modal-container .modal-close:hover {
            color: #333;
        }

    .product-form-options .names-list .modal-container #modal-toggle {
        display: none;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-backdrop,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-backdrop {
            background-color: rgba(0, 0, 0, 0.6);
            width: 100vw;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            opacity: 1;
            transition: opacity 0.2s ease-in;
            visibility: visible;
            z-index: 9999999;
        }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content {
            background: #fff;
            border-radius: 4px;
            box-shadow: 0 3px 7px rgba(0, 0, 0, 0.6);
            cursor: auto;
            max-width: 520px;
            height: 530px;
            padding: 10px 30px;
            padding: 20px 30px;
            position: fixed;
            left: calc(50% - 260px);
            top: 5%;
            opacity: 1;
            overflow: auto;
            pointer-events: auto;
            visibility: visible;
            width: 100%;
            z-index: 9999999;
            max-height: calc(100vh - 6%);
        }

@media (max-width: 530px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content {
        margin: 0 2px;
        top: 45px;
        left: 0;
        height: calc(100% - 60px);
        width: calc(100% - 4px);
    }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content input,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
    width: 50%;
}

@media (max-width: 600px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content input,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
        width: 100%;
    }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content h4,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content h4 {
    font-size: 15px;
    margin: 15px 0;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list {
    overflow: hidden;
}

    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border-top: 1px solid #ccc;
        box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.6);
        border-radius: 2px;
        float: left;
        line-height: 34px;
        margin: 0 10px 5px 1px;
        min-height: 41px;
        min-width: 100px;
        text-align: center;
        padding: 3px 5px;
    }

@media (max-width: 400px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        width: 115px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border: solid 1px #ddd;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color {
            border: none !important;
        }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.top-pad,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.top-pad {
    padding-top: 8px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color span,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color span {
    background: rgba(255, 255, 255, 0.6);
    border-radius: 2px;
    padding: 1px 3px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li#vertical img,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li#vertical img {
    max-height: 46px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list label,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list label {
    display: block;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names {
    display: inline-block;
    margin-left: 25px;
    width: 100%;
}

    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li {
        color: #26A65B;
        float: left;
        list-style-type: decimal;
        margin-right: 2%;
        width: 30%;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li span,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li span {
            color: initial;
        }

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content .btn,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content .btn {
    float: right;
    margin-left: 10px;
    min-width: 12%;
}

.product-form-options #more-names, .product-form-options #more-names-5 {
    border: none;
    background: #26A65B;
    color: white;
    transition: background 0.2s ease-in;
    border-radius: 20px;
    height: 28px;
    font-size: 18px;
    font-weight: 600;
    box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.3);
    position: relative;
    float: left;
    top: 5px;
    width: 28px;
    z-index: 1;
    margin-left: 10px;
}

@media (max-width: 768px) {
    .product-form-options #more-names, .product-form-options #more-names-5 {
        font-size: 0px;
    }
}

.product-form-options #more-names span, .product-form-options #more-names-5 span {
    font-size: 18px;
}

.product-form-options #more-names:hover, .product-form-options #more-names-5:hover {
    background: #043e77;
    transition: background 0.2s ease-in;
}

.product-form-options #more-names-5 {
    left: 5px;
    padding-top: 1px;
}

    .product-form-options #more-names-5 span {
        font-size: 14px;
    }

.product-form-options .names-list .modal-container {
    float: left;
    position: relative;
}

    .product-form-options .names-list .modal-container .btn {
        min-width: 22%;
        margin-left: 10px;
        transition: background 0.3s ease-in;
    }

        .product-form-options .names-list .modal-container .btn.cancel {
            background: #ccc;
            border-color: #aaa;
            color: #333;
        }

    .product-form-options .names-list .modal-container .modal-content,
    .product-form-options .names-list .modal-container .modal-backdrop {
        cursor: pointer;
        height: 0;
        width: 0;
        opacity: 0;
        overflow: hidden;
        transition: opacity 0.2s ease-in;
        visibility: hidden;
    }

    .product-form-options .names-list .modal-container .modal-close {
        background: #fff;
        color: #aaa;
        cursor: pointer;
        font-size: 16px;
        font-weight: bold;
        padding-top: 3px;
        position: absolute;
        right: 5px;
        top: 5px;
        height: 25px;
        text-align: center;
        width: 25px;
    }

        .product-form-options .names-list .modal-container .modal-close:hover {
            color: #333;
        }

    .product-form-options .names-list .modal-container #modal-toggle {
        display: none;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-backdrop,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-backdrop {
            background-color: rgba(0, 0, 0, 0.6);
            width: 100vw;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            opacity: 1;
            transition: opacity 0.2s ease-in;
            visibility: visible;
            z-index: 9999999;
        }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content {
            background: #fff;
            border-radius: 4px;
            box-shadow: 0 3px 7px rgba(0, 0, 0, 0.6);
            cursor: auto;
            max-width: 520px;
            height: 530px;
            padding: 10px 30px;
            padding: 20px 30px;
            position: fixed;
            left: calc(50% - 260px);
            top: 5%;
            opacity: 1;
            overflow: auto;
            pointer-events: auto;
            visibility: visible;
            width: 100%;
            z-index: 9999999;
            max-height: calc(100vh - 6%);
        }

@media (max-width: 530px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content {
        margin: 0 2px;
        top: 45px;
        left: 0;
        height: calc(100% - 60px);
        width: calc(100% - 4px);
    }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content input,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
    width: 50%;
}

@media (max-width: 600px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content input,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
        width: 100%;
    }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content h4,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content h4 {
    font-size: 15px;
    margin: 15px 0;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list {
    overflow: hidden;
}

    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border-top: 1px solid #ccc;
        box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.6);
        border-radius: 2px;
        float: left;
        line-height: 34px;
        margin: 0 10px 5px 1px;
        min-height: 41px;
        min-width: 100px;
        text-align: center;
        padding: 3px 5px;
    }

@media (max-width: 400px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        width: 115px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border: solid 1px #ddd;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color {
            border: none !important;
        }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.top-pad,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.top-pad {
    padding-top: 8px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color span,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color span {
    background: rgba(255, 255, 255, 0.6);
    border-radius: 2px;
    padding: 1px 3px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li#vertical img,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li#vertical img {
    max-height: 46px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list label,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list label {
    display: block;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names {
    display: inline-block;
    margin-left: 25px;
    width: 100%;
}

    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li {
        color: #26A65B;
        float: left;
        list-style-type: decimal;
        margin-right: 2%;
        width: 30%;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li span,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li span {
            color: initial;
        }

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content .btn,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content .btn {
    float: right;
    margin-left: 10px;
    min-width: 12%;
}

.product-form-options #more-names, .product-form-options #more-names-5 {
    border: none;
    background: #26A65B;
    color: white;
    transition: background 0.2s ease-in;
    border-radius: 20px;
    height: 28px;
    font-size: 18px;
    font-weight: 600;
    box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.3);
    position: relative;
    float: left;
    top: 5px;
    width: 28px;
    z-index: 1;
}

@media (max-width: 768px) {
    .product-form-options #more-names, .product-form-options #more-names-5 {
        font-size: 0px;
    }
}

.product-form-options #more-names span, .product-form-options #more-names-5 span {
    font-size: 18px;
}

.product-form-options #more-names:hover, .product-form-options #more-names-5:hover {
    background: #043e77;
    transition: background 0.2s ease-in;
}

.product-form-options #more-names-5 {
    left: 5px;
    padding-top: 1px;
}

    .product-form-options #more-names-5 span {
        font-size: 14px;
    }

.product-form-options .names-list .modal-container {
    float: left;
    position: relative;
}

    .product-form-options .names-list .modal-container .btn {
        min-width: 22%;
        margin-left: 10px;
        transition: background 0.3s ease-in;
    }

        .product-form-options .names-list .modal-container .btn.cancel {
            background: #ccc;
            border-color: #aaa;
            color: #333;
        }

    .product-form-options .names-list .modal-container .modal-content,
    .product-form-options .names-list .modal-container .modal-backdrop {
        cursor: pointer;
        height: 0;
        width: 0;
        opacity: 0;
        overflow: hidden;
        transition: opacity 0.2s ease-in;
        visibility: hidden;
    }

    .product-form-options .names-list .modal-container .modal-close {
        background: #fff;
        color: #aaa;
        cursor: pointer;
        font-size: 16px;
        font-weight: bold;
        padding-top: 3px;
        position: absolute;
        right: 5px;
        top: 5px;
        height: 25px;
        text-align: center;
        width: 25px;
    }

        .product-form-options .names-list .modal-container .modal-close:hover {
            color: #333;
        }

    .product-form-options .names-list .modal-container #modal-toggle {
        display: none;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-backdrop,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-backdrop {
            background-color: rgba(0, 0, 0, 0.6);
            width: 100vw;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            opacity: 1;
            transition: opacity 0.2s ease-in;
            visibility: visible;
            z-index: 9999999;
        }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content {
            background: #fff;
            border-radius: 4px;
            box-shadow: 0 3px 7px rgba(0, 0, 0, 0.6);
            cursor: auto;
            max-width: 520px;
            height: 530px;
            padding: 10px 30px;
            padding: 20px 30px;
            position: fixed;
            left: calc(50% - 260px);
            top: 5%;
            opacity: 1;
            overflow: auto;
            pointer-events: auto;
            visibility: visible;
            width: 100%;
            z-index: 9999999;
            max-height: calc(100vh - 6%);
        }

@media (max-width: 530px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content {
        margin: 0 2px;
        top: 45px;
        left: 0;
        height: calc(100% - 60px);
        width: calc(100% - 4px);
    }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content input,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
    width: 50%;
}

@media (max-width: 600px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content input,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
        width: 100%;
    }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content h4,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content h4 {
    font-size: 15px;
    margin: 15px 0;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list {
    overflow: hidden;
}

    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border-top: 1px solid #ccc;
        box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.6);
        border-radius: 2px;
        float: left;
        line-height: 34px;
        margin: 0 10px 5px 1px;
        min-height: 41px;
        min-width: 100px;
        text-align: center;
        padding: 3px 5px;
    }

@media (max-width: 400px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        width: 115px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border: solid 1px #ddd;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color {
            border: none !important;
        }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.top-pad,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.top-pad {
    padding-top: 8px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color span,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color span {
    background: rgba(255, 255, 255, 0.6);
    border-radius: 2px;
    padding: 1px 3px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li#vertical img,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li#vertical img {
    max-height: 46px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list label,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list label {
    display: block;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names {
    display: inline-block;
    margin-left: 25px;
    width: 100%;
}

    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li {
        color: #26A65B;
        float: left;
        list-style-type: decimal;
        margin-right: 2%;
        width: 30%;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li span,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li span {
            color: initial;
        }

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content .btn,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content .btn {
    float: right;
    margin-left: 10px;
    min-width: 12%;
}

.product-form-options #more-names, .product-form-options #more-names-5 {
    border: none;
    background: #26A65B;
    color: white;
    transition: background 0.2s ease-in;
    border-radius: 20px;
    height: 28px;
    font-size: 18px;
    font-weight: 600;
    box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.3);
    position: relative;
    float: left;
    top: 5px;
    width: 28px;
    z-index: 1;
}

@media (max-width: 768px) {
    .product-form-options #more-names, .product-form-options #more-names-5 {
        font-size: 0px;
    }
}

.product-form-options #more-names span, .product-form-options #more-names-5 span {
    font-size: 18px;
}

.product-form-options #more-names:hover, .product-form-options #more-names-5:hover {
    background: #043e77;
    transition: background 0.2s ease-in;
}

.product-form-options #more-names-5 {
    left: 5px;
    padding-top: 1px;
}

    .product-form-options #more-names-5 span {
        font-size: 14px;
    }

.product-form-options .names-list .modal-container {
    float: left;
    position: relative;
}

    .product-form-options .names-list .modal-container .btn {
        min-width: 22%;
        margin-left: 16px;
        transition: background 0.3s ease-in;
    }

        .product-form-options .names-list .modal-container .btn.cancel {
            background: #ccc;
            border-color: #aaa;
            color: #333;
        }

    .product-form-options .names-list .modal-container .modal-content,
    .product-form-options .names-list .modal-container .modal-backdrop {
        cursor: pointer;
        height: 0;
        width: 0;
        opacity: 0;
        overflow: hidden;
        transition: opacity 0.2s ease-in;
        visibility: hidden;
    }

    .product-form-options .names-list .modal-container .modal-close {
        background: #fff;
        color: #aaa;
        cursor: pointer;
        font-size: 16px;
        font-weight: bold;
        padding-top: 3px;
        position: absolute;
        right: 5px;
        top: 5px;
        height: 25px;
        text-align: center;
        width: 25px;
    }

        .product-form-options .names-list .modal-container .modal-close:hover {
            color: #333;
        }

    .product-form-options .names-list .modal-container #modal-toggle {
        display: none;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-backdrop,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-backdrop {
            background-color: rgba(0, 0, 0, 0.6);
            width: 100vw;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            opacity: 1;
            transition: opacity 0.2s ease-in;
            visibility: visible;
            z-index: 9999999;
        }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content {
            background: #fff;
            border-radius: 4px;
            box-shadow: 0 3px 7px rgba(0, 0, 0, 0.6);
            cursor: auto;
            max-width: 520px;
            height: 530px;
            padding: 10px 30px;
            padding: 20px 30px;
            position: fixed;
            left: calc(50% - 260px);
            top: 5%;
            opacity: 1;
            overflow: auto;
            pointer-events: auto;
            visibility: visible;
            width: 100%;
            z-index: 9999999;
            max-height: calc(100vh - 6%);
        }

@media (max-width: 530px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content {
        margin: 0 2px;
        top: 45px;
        left: 0;
        height: calc(100% - 60px);
        width: calc(100% - 4px);
    }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content input,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
    width: 50%;
}

@media (max-width: 600px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content input,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content input {
        width: 100%;
    }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content h4,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content h4 {
    font-size: 15px;
    margin: 15px 0;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list {
    overflow: hidden;
}

    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border-top: 1px solid #ccc;
        box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.6);
        border-radius: 2px;
        float: left;
        line-height: 34px;
        margin: 0 10px 5px 1px;
        min-height: 41px;
        min-width: 100px;
        text-align: center;
        padding: 3px 5px;
    }

@media (max-width: 400px) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        width: 115px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li {
        border: solid 1px #ddd;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color {
            border: none !important;
        }
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.top-pad,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.top-pad {
    padding-top: 8px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li.upload-color span,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li.upload-color span {
    background: rgba(255, 255, 255, 0.6);
    border-radius: 2px;
    padding: 1px 3px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list li#vertical img,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list li#vertical img {
    max-height: 46px;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-list label,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-list label {
    display: block;
}

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names {
    display: inline-block;
    margin-left: 25px;
    width: 100%;
}

    .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li,
    .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li {
        color: #26A65B;
        float: left;
        list-style-type: decimal;
        margin-right: 2%;
        width: 30%;
    }

        .product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content ul.print-names li span,
        .product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content ul.print-names li span {
            color: initial;
        }

.product-form-options .names-list .modal-container #modal-toggle.active ~ .modal-content .btn,
.product-form-options .names-list .modal-container #modal-toggle:checked ~ .modal-content .btn {
    float: right;
    margin-left: 10px;
    min-width: 12%;
}

.product-form-options #more-names, .product-form-options #more-names-5 {
    border: none;
    background: #26A65B;
    color: white;
    transition: background 0.2s ease-in;
    border-radius: 20px;
    height: 28px;
    font-size: 18px;
    font-weight: 600;
    box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.3);
    position: relative;
    float: left;
    top: 5px;
    width: 28px;
    z-index: 1;
}

@media (max-width: 768px) {
    .product-form-options #more-names, .product-form-options #more-names-5 {
        font-size: 0px;
    }
}

.product-form-options #more-names span, .product-form-options #more-names-5 span {
    font-size: 20px;
}

.product-form-options #more-names:hover, .product-form-options #more-names-5:hover {
    background: #043e77;
    transition: background 0.2s ease-in;
}

.product-form-options #more-names-5 {
    left: 5px;
    padding-top: 1px;
}

    .product-form-options #more-names-5 span {
        font-size: 14px;
    }

.modal-container {
    position: relative;
}

    .modal-container button {
        background: #fff;
        border: solid 10px #ddd;
        border-radius: 50%;
        box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.3);
        color: #333;
        display: block;
        font-family: 'raleway';
        font-size: 20px;
        font-weight: 700;
        line-height: 20px;
        margin: 0 auto;
        padding-top: 10px;
        text-transform: uppercase;
        transition: 0.1s ease-in;
        width: 132px;
        height: 132px;
/*        safari extra padding bug;*/
    }

@media (max-width: 450px) {
    .modal-container button {
        padding-top: 10px;
        font-size: 18px;
        height: 100px;
        width: 100px;
    }
}

@media (max-width: 450px) {
    .modal-container button.vid-button {
        font-size: 0;
        padding-top: 13px;
    }
}

.modal-container button.vid-button span {
    font-size: 18px;
}

@media (max-width: 450px) {
    .modal-container button.vid-button span {
        font-size: 16px;
    }
}

.modal-container .modal-backdrop {
    height: 0;
    width: 0;
    opacity: 0;
    overflow: hidden;
    transition: opacity 0.2s ease-in;
}

.modal-container #modal-toggle {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

    .modal-container #modal-toggle:hover ~ button {
        background: #0657A8;
        color: #FFF;
        border: #0657A8;
    }

    .modal-container #modal-toggle:checked {
        width: 100vw;
        height: 100vh;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 9;
        opacity: 0;
    }

        .modal-container #modal-toggle:checked ~ .modal-backdrop {
            background-color: rgba(0, 0, 0, 0.85);
            width: 100vw;
            height: 100vh;
            position: fixed;
            left: 0;
            top: 0;
            z-index: 99999999;
            opacity: 1;
        }

            .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content {
                background-color: #fff;
                left: calc(50% - 400px);
                top: 5%;
                max-width: 800px;
                border-radius: 4px;
                z-index: 999999;
                pointer-events: auto;
                cursor: auto;
                box-shadow: 0 3px 7px rgba(0, 0, 0, 0.6);
                margin-bottom: 40px;
            }

@media (max-width: 768px) {
    .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content {
        top: 10%;
        width: 96%;
        margin: 0 auto 40px auto;
    }
}

@media (max-width: 450px) {
    .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content {
        top: 25%;
    }
}

@media (max-width: 1000px) {
    .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content {
        left: 0;
    }
}

.modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content .modal-close {
    color: #666;
    position: absolute;
    right: 2px;
    top: 0;
    padding-top: 7px;
    background: #fff;
    font-size: 16px;
    width: 25px;
    height: 28px;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}

    .modal-container #modal-toggle:checked ~ .modal-backdrop .modal-content .modal-close:hover {
        color: #333;
    }

.print-list .option-color span {
    background: rgba(255,255,255,0.9);
    color: #333;
    text-align: left;
    padding: 1px 0 1px;
    left: 3px;
    right: 3px;
    bottom: 3px;
    border-radius: 2px;
}

@media screen {
    #printSection {
        display: none;
    }

        #printSection ul.print-names li:before {
            font-family: FontAwesome;
            content: "\f101 ";
            float: left;
        }
}

@media print {
    body * {
        display: none;
        margin: 0;
        padding: 0;
    }

    #printSection, #printSection * {
        margin: 0;
        display: block;
    }

    #printSection {
        margin: 0;
    }

        #printSection .printable-page {
            position: absolute;
            top: 0;
            width: 19cm;
        }

            #printSection .printable-page .printable-img {
                margin-top: 20px;
            }

                #printSection .printable-page .printable-img h4 {
                    margin-bottom: 5px;
                    text-align: left;
                }

        #printSection .modal-container {
            position: absolute;
            top: 0;
            width: 19cm;
        }

            #printSection .modal-container p {
                padding: 10px;
            }

            #printSection .modal-container ul {
                overflow: hidden;
                display: block;
                padding: 10px;
            }

                #printSection .modal-container ul li:before {
                    font-family: FontAwesome;
                    content: "\f101 ";
                    float: left;
                    margin-right: 10px;
                }

                #printSection .modal-container ul.print-list li:first-child:before {
                    content: "";
                    margin-right: 0;
                }

                #printSection .modal-container ul.print-names li {
                    float: left;
                    width: 100%;
                }

        #printSection .invoice {
            position: absolute;
            top: 0;
            padding: 0;
            margin: 0;
            width: 19cm;
            vertical-align: top;
        }

            #printSection .invoice .printer {
                display: none;
            }

            #printSection .invoice .invoice-details table {
                display: table;
            }

            #printSection .invoice .invoice-details tr {
                display: table-row;
            }

            #printSection .invoice .invoice-details td {
                display: table-cell;
            }

                #printSection .invoice .invoice-details td a[href]:after {
                    content: none !important;
                }

            #printSection .invoice .invoice-details table td:nth-child(1) {
                width: 4cm;
            }

            #printSection .invoice .invoice-details table td:nth-child(2) {
                width: 9cm;
            }
}

.printable-page {
    background: white;
    border: 1px solid #ddd;
    margin-left: 20%;
    margin-top: 150px;
    margin-bottom: 130px;
    padding: 20px;
    width: 60%
}

@media (max-width: 900px) {
    .printable-page {
        width: 90%;
        margin-left: 5%
    }
}

.printable-page .printable-info {
    display: inline-block;
    vertical-align: top;
    width: 60%
}

@media (max-width: 450px) {
    .printable-page .printable-info {
        width: 100%
    }
}

.printable-page .printable-img {
    display: inline-block;
    vertical-align: top;
    width: 39%
}

@media (max-width: 450px) {
    .printable-page .printable-img {
        margin: 20px 0;
        width: 100%
    }
}

.printable-page .printable-img .modal-container-preview {
    width: auto
}

@media (max-width: 450px) {
    .printable-page .printable-img .modal-container-preview {
        float: left
    }
}

@media (max-width: 450px) {
    .printable-page .printable-img h4 {
        text-align: left
    }
}

/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
@media print {
    *, *:before, *:after {
        color: #000 !important;
        text-shadow: none !important;
        background: transparent !important;
        box-shadow: none !important
    }

    a, a:visited {
        text-decoration: underline
    }

        a[href]:after {
            content: " (" attr(href) ")"
        }

    abbr[title]:after {
        content: " (" attr(title) ")"
    }

    a[href^="#"]:after, a[href^="javascript:"]:after {
        content: ""
    }

    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid
    }

    thead {
        display: table-header-group
    }

    tr, img {
        page-break-inside: avoid
    }

    img {
        max-width: 100% !important
    }

    p, h2, h3 {
        orphans: 3;
        widows: 3
    }

    h2, h3 {
        page-break-after: avoid
    }

    .navbar {
        display: none
    }

    .btn > .caret, .dropup > .btn > .caret {
        border-top-color: #000 !important
    }

    .label {
        border: 1px solid #000
    }

    .table {
        border-collapse: collapse !important
    }

        .table td, .table th {
            background-color: #fff !important
        }

    .table-bordered th, .table-bordered td {
        border: 1px solid #ddd !important
    }
}

@media print {
    .visible-print {
        display: block !important
    }

    table.visible-print {
        display: table !important
    }

    tr.visible-print {
        display: table-row !important
    }

    th.visible-print, td.visible-print {
        display: table-cell !important
    }
}

.visible-print-block {
    display: none !important
}

@media print {
    .visible-print-block {
        display: block !important
    }
}

.visible-print-inline {
    display: none !important
}

@media print {
    .visible-print-inline {
        display: inline !important
    }
}

.visible-print-inline-block {
    display: none !important
}

@media print {
    .visible-print-inline-block {
        display: inline-block !important
    }
}

@media print {
    .hidden-print {
        display: none !important
    }
}

/* End Modal */
/* Upload names */
.upload-names-list {
    background: #f6f6f6;
    border: 1px solid #ddd;
    display: block;
    padding: 20px 20px 10px 20px;
}

    /*    @media (max-width: 800px) {
        .upload-names-list {
            width: 100%;
        }
    }*/

    .upload-names-list input[type="file"] {
        width: 100%;
        border: 0;
        background: none;
        padding: 0;
        box-shadow: none;
    }

    .upload-names-list .upload-names-list-title {
        font-size: 18px;
        display: block;
        font-weight: bold;
        margin-bottom: 10px;
        max-width: 80%;
    }

    .upload-names-list .fa {
        position: absolute;
        font-size: 36px;
        color: rgba(0, 0, 0, 0.2);
        right: 4px;
        width: 70px;
        text-align: center;
        top: 12px;
    }

    .upload-names-list button {
        width: 100%;
        border: none;
        background: #0657A8;
        color: white;
        transition: background 0.2s ease-in;
        text-transform: uppercase;
        border-radius: 4px;
        height: 35px;
        font-weight: 600;
        box-shadow: 0px 1px 1px 0 rgba(0, 0, 0, 0.3);
        margin-bottom: 5px;
        margin-top: -20px;
        padding: 0;
    }

        .upload-names-list button:hover {
            background: #043e77;
            transition: background 0.2s ease-in;
        }

#upload-names {
    display: block;
    height: 10px;
    visibility: hidden;
    width: 0;
}
/* End upload names */

.proof-form h3 {
    color: #0657A8;
    font-weight: bold;
    margin: 0 0 15px;
    text-align: left;
    text-transform: uppercase;
    font-size: 18px
}

.proof-form h5 {
    font-weight: bold;
    text-align: left
}

.proof-form .blue {
    color: #0657A8
}

.proof-form input[type="radio"] {
    margin: 10px 10px 5px 0;
    cursor: pointer
}

.proof-form input[type="checkbox"] {
    margin: 10px 10px 5px 0;
    cursor: pointer
}

.proof-form input[type="number"] {
    width: 10%
}

@media (max-width: 700px) {
    .proof-form input[type="number"] {
        width: 15%
    }
}

@media (max-width: 450px) {
    .proof-form input[type="number"] {
        width: 20%
    }
}

.proof-form textarea {
    padding-top: 5px;
    min-height: 80px;
    width: 100%
}

.proof-form label {
    cursor: default
}

.proof-form .ready-to-order-advice {
    background: #eee;
    border-radius: 2px;
    border: 1px solid #ccc;
    color: #333;
    margin-top: 0px;
    margin-top: 10px;
    padding: 5px 10px;
    width: 335px
}

@media (max-width: 600px) {
    .proof-form .ready-to-order-advice {
        width: 98%
    }
}

.proof-form .input-label {
    margin: 10px 0 5px
}

.proof-form input[type="text"] {
    margin-bottom: 10px
}

.proof-form select {
    width: 50%
}

@media (max-width: 600px) {
    .proof-form select {
        width: 100%
    }
}

@media (max-width: 600px) {
    .proof-form .step-container {
        width: 100%;
        float: left;
        margin-top: 20px
    }
}

.proof-form .modal-container-preview {
    float: right;
    position: relative;
    width: 200px
}

@media (max-width: 600px) {
    .proof-form .modal-container-preview {
        float: left
    }
}

.proof-form .modal-container-preview .pending {
    border: 4px double #000;
    border-radius: 4px;
    color: #000;
    font-size: 16px;
    text-align: center;
    margin-bottom: 12px;
    opacity: 0.7;
    padding: 3px 10px 2px;
    position: absolute;
    top: 4px;
    right: -15px;
    width: 140px;
    -webkit-transform: rotate(20deg);
    transform: rotate(20deg)
}

.proof-form .modal-container-preview .modal-btn {
    height: initial;
    width: 200px
}

.half-half {
    width: 48%;
    float: left
}

@media (max-width: 767px) {
    .half-half {
        width: 100%;
        float: none
    }
}

.half-half.mleft {
    margin-left: 2%
}

@media (max-width: 767px) {
    .half-half.mleft {
        margin-left: 0
    }
}

.reorder-container {
    background: white;
    border-radius: 3px;
    border: 1px solid #ddd;
    margin: 20px 10%;
    padding: 20px;
    position: relative;
    overflow: hidden;
}

@media (max-width: 950px) {
    .reorder-container {
        margin: 20px 1%
    }
}

@media (max-width: 600px) {
    .reorder-container {
        margin: 20px 1%;
        padding: 20px 5px
    }
}

.reorder-container .reorder-table {
    float: left;
    width: 55%
}

@media (max-width: 700px) {
    .reorder-container .reorder-table {
        width: 100%
    }
}

.reorder-container .reorder-table h4 {
    color: #0657A8;
    font-weight: bold;
    margin-top: 30px;
    text-align: left;
    text-transform: uppercase
}

.reorder-container .reorder-table table {
    border: 1px solid #ddd;
    font-size: 15px;
    margin-bottom: 20px;
    width:calc(100% - 126px);
}

@media (max-width: 600px) {
    .reorder-container .reorder-table table {
        font-size: 12px
    }
}

@media (max-width: 700px) {
    .reorder-container .reorder-table table {
        width: 100%
    }
}

.reorder-container .reorder-table thead {
    background: #0657A8;
    color: white
}

.reorder-container .reorder-table tr {
    border-top: 1px solid #eee
}

.reorder-container .reorder-table td {
    padding: 10px
}

@media (max-width: 600px) {
    .reorder-container .reorder-table td {
        padding: 5px
    }
}

.reorder-container .reorder-table td input[type="number"] {
    width: 60px
}

.reorder-container .reorder-table td select {
    padding-left: 10px
}

.reorder-container .reorder-table img {
    width: 100px;
    margin-right:10px;
    float:left;
}

.reorder-container .reorder-sidebar {
    float: right;
    width: 45%
}

@media (max-width: 700px) {
    .reorder-container .reorder-sidebar {
        width: 100%;
        margin-top: 20px
    }
}

@media (max-width: 1170px) {
    .reorder-container .terms-use {
        margin-bottom: 10px
    }
}

.modal-container-preview .modal-btn {
    background: transparent;
    border: 0;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    display: block;
    font-size: 22px;
    width: 160px;
    line-height: 50px;
    margin: 0 auto;
    text-align: center;
    -webkit-transition: background 0.3s ease-in;
    transition: background 0.3s ease-in
}

.modal-container-preview .modal-content, .modal-container-preview .modal-backdrop {
    height: 0;
    width: 0;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: opacity 0.2s ease-in;
    transition: opacity 0.2s ease-in
}

.modal-container-preview .modal-close {
    color: #aaa;
    position: absolute;
    right: 5px;
    top: 5px;
    padding-top: 3px;
    background: #fff;
    font-size: 16px;
    width: 25px;
    height: 25px;
    font-weight: bold;
    text-align: center;
    cursor: pointer
}

    .modal-container-preview .modal-close:hover {
        color: #333
    }

.modal-container-preview .modal-content-btn {
    position: absolute;
    text-align: center;
    cursor: pointer;
    bottom: 20px;
    right: 30px;
    background: #446CB3;
    color: #fff;
    width: 50px;
    border-radius: 2px;
    font-size: 14px;
    height: 32px;
    padding-top: 9px;
    font-weight: normal
}

    .modal-container-preview .modal-content-btn:hover {
        color: #fff;
        background: #365690
    }

.modal-container-preview #modal-toggle-preview {
    display: none
}

    .modal-container-preview #modal-toggle-preview.active ~ .modal-backdrop, .modal-container-preview #modal-toggle-preview:checked ~ .modal-backdrop {
        background-color: rgba(0,0,0,0.6);
        width: 100vw;
        height: 100vh;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 9;
        visibility: visible;
        opacity: 1;
        -webkit-transition: opacity 0.2s ease-in;
        transition: opacity 0.2s ease-in
    }

    .modal-container-preview #modal-toggle-preview.active ~ .modal-content, .modal-container-preview #modal-toggle-preview:checked ~ .modal-content {
        opacity: 1;
        background-color: #fff;
        max-width: 400px;
        width: 400px;
        height: initial;
        padding: 10px 30px;
        position: fixed;
        left: calc(50% - 200px);
        top: 16%;
        border-radius: 4px;
        z-index: 999;
        pointer-events: auto;
        cursor: auto;
        visibility: visible;
        box-shadow: 0 3px 7px rgba(0,0,0,0.6)
    }

@media (max-width: 450px) {
    .modal-container-preview #modal-toggle-preview.active ~ .modal-content, .modal-container-preview #modal-toggle-preview:checked ~ .modal-content {
        width: 100%;
        left: 0
    }
}

.modal-container-preview #modal-toggle-preview.active ~ .modal-content img, .modal-container-preview #modal-toggle-preview:checked ~ .modal-content img {
    margin: 0 auto;
    margin-top: 20px;
    margin-bottom: 20px
}

/* Credit cards */

#remove-credit-card-error {
    border: 1px solid #ef2028;
    background: rgba(199,45,35,0.1);
    border-radius: 2px;
    border-left: 3px solid #ef2028;
    color: #ef2028;
    margin-bottom: 10px;
    padding: 7px
}

.cc-list {
    font-weight: bold;
    margin-bottom: 20px
}

    .cc-list span {
        vertical-align: top
    }

    .cc-list li {
        border-bottom: 1px solid #eee;
        line-height: 28px;
        padding: 12px 10px 10px
    }

@media (max-width: 650px) {
    .cc-list li {
        overflow: hidden;
        line-height: 1
    }
}

@media (max-width: 450px) {
    .cc-list li {
        font-size: 15px
    }
}

.cc-list li.default-card {
    border-left: 4px solid #26A65B;
    background-color: #e9f6ef
}

/*    .cc-list li.default-card .settings-remove-credit-card {
        opacity: 0.3;
        pointer-events: none;
        cursor: not-allowed
    }*/

    .cc-list li.default-card .settings-default-card-btn {
        opacity: 0.3;
        pointer-events: none;
        cursor: not-allowed
    }

.cc-list img {
    display: inline-block;
    margin-right: 2%;
    vertical-align: top;
    width: 7%;
    max-width: 45px
}

.cc-list .cc-name {
    display: inline-block;
    width: 20%
}

@media (max-width: 450px) {
    .cc-list .cc-name {
        width: 30%
    }
}

.cc-list .cc-number {
    margin-left: 4%;
    margin-right: 4%
}

.cc-list .cc-links {
    float: right;
    margin-right: 1%
}

@media (max-width: 650px) {
    .cc-list .cc-links {
        float: left;
        margin-top: 10px;
        margin-right: 3%
    }
}

.cc-list .cc-links label {
    cursor: pointer
}

.credit-card-loading .modal-content {
    overflow: hidden !important;
    position: relative
}

    .credit-card-loading .modal-content:before {
        content: "";
        background: rgba(0,0,0,0.3);
        height: 230%;
        width: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in
    }

    .credit-card-loading .modal-content:after {
        content: "";
        font-size: 40px;
        width: 100%;
        text-align: center;
        position: absolute;
        top: 0;
        height: 100%;
        left: 0;
        z-index: 99999;
        background: url(../gif/spinner.gif);
        background-repeat: no-repeat;
        background-size: 70px;
        background-position: center center
    }

.address-loading, .email-loading, .cc-loading, .order-summary-item-loading {
    overflow: hidden !important;
    position: relative
}

    .address-loading:before, .email-loading:before, .cc-loading:before {
        content: "";
        background: rgba(0,0,0,0.3);
        height: 150%;
        width: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in
    }

    .address-loading:after, .email-loading:after, .cc-loading:after, .shippinggroups-loading:after {
        content: "";
        font-size: 40px;
        width: 100%;
        text-align: center;
        position: absolute;
        top: 0;
        height: 100%;
        left: 0;
        z-index: 99999;
        background: url(../gif/spinner.gif);
        background-repeat: no-repeat;
        background-size: 70px;
        background-position: center center
    }

    .shippinggroups-loading {
        position: relative; /* <- REQUIRED for :after to show inside */
    }

    .order-summary-item-loading:after {
        content: "";
        font-size: 40px;
        width: 100%;
        height: 100%;
        text-align: center;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 99999;
        background: url(../gif/spinner.gif), rgba(0,0,0,0.3);
        background-repeat: no-repeat;
        background-size: 70px;
        background-position: center center
    }

/* End Credit cards*/
.apparel-loading {
    overflow: hidden !important;
    position: relative
}

    .apparel-loading:before {
        content: "";
        background: rgba(0,0,0,0);
        height: 150%;
        width: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in
    }

    .apparel-loading:after {
        content: "";
        font-size: 40px;
        width: 100%;
        text-align: center;
        position: absolute;
        top: 0;
        height: 100%;
        left: 0;
        z-index: 99999;
        background: url(../gif/spinner.gif);
        background-repeat: no-repeat;
        background-size: 70px;
        background-position: center center
    }

.card-label {
    text-align: center;
    display: block;
    padding-top: 14px;
    border-width: 1px;
    border-style: solid;
    border-color: lightgray;
    border-radius: 10px;
}

.details-label {
    border-radius: 10px;
    padding: 15px;
    background-color: white;
    height: 90px;
    font-size: 12px;
    text-align: left;
    margin-top: 10px;
    margin-left: 14px;
    margin-right: 10px;
    margin-bottom: 10px;
    width: 88%;
}

.card-print-method {
    border-radius: 8px;
    border: solid 2px gray;
    margin-bottom: 10px;
}

    .card-print-method:hover {
        outline: 0px;
        cursor: pointer;
        border-radius: 8px;
        border: solid 2px #0657A8;
    }

        .card-print-method:hover .card-button {
            text-decoration: solid;
            background-color: #0657A8;
            text-decoration-color: white;
        }


.card-print-method-selected {
    border-radius: 8px;
    outline: 0px;
    border: solid 2px #0657A8;
}

.card-fabric {
    border-radius: 8px;
    border: solid 2px gray;
    margin-bottom: 10px;
}

.card-fabric-image {
    max-height: 60%;
    max-width: 60%;
    border-radius: 8px 8px 0px 0;
    text-align: center;
}

.card-fabric-selected {
    border-radius: 8px;
    outline: 0px;
    border: solid 2px #0657A8;
}

.card-fabric:hover .card-button-fabric {
    text-decoration: solid;
    background-color: #0657A8;
    text-decoration-color: white;
}

.card-fabric:hover {
    outline: 0px;
    cursor: pointer;
    border-radius: 8px;
    border: solid 2px #0657A8;
}

.card-button {
    display: flex;
    justify-content: center;
    padding: 11px 0;
    width: 100%;
    background-color: gray;
    color: #fff !important;
    border-radius: 0 0 5px 5px;
    font-family: Cabin;
    font-size: 22px;
}

    .card-button:hover {
        text-decoration: solid;
        background-color: #0657A8;
        text-decoration-color: white;
    }

.card-button-fabric {
    display: flex;
    padding: 8px 0;
    justify-content: center;
    width: 100%;
    background-color: gray;
    color: #fff !important;
    font-family: Cabin;
    font-size: 16px;
}

    .card-button-fabric:hover {
        text-decoration: solid;
        background-color: #0657A8;
        text-decoration-color: white;
    }

.card-button-selected {
    text-decoration: solid;
    background-color: #0657A8 !important;
    text-decoration-color: white;
}

.card-image img {
    max-height: 100%;
    max-width: 100%;
    border-radius: 8px 8px 0px 0;
}

.card-action {
    position: relative;
    float: right;
    margin-top: -25px;
    margin-right: 20px;
    z-index: 2;
    color: #E26D5C;
    background: #fff;
    border-radius: 100%;
    padding: 15px;
    font-size: 15px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 1px 2px 0 rgba(0, 0, 0, 0.19);
}

    .card-action:hover {
        color: #fff;
        background: #E26D5C;
        -webkit-animation: pulse 1.5s infinite;
    }

.card-heading {
    font-family: Cabin;
    font-size: 22px;
    font-weight: bold;
    background: #fff;
    padding: 6px 15px 0px 15px;
}

.card-title-fabric {
    margin: 0;
    text-align: center;
    font-family: Cabin;
    font-size: 18px;
    font-weight: bold;
    padding: 10px 2px 6px 2px;
}

.card-heading-subtitle {
    font-family: Cabin;
    color: gray;
    font-size: 16px;
    font-weight: lighter;
    padding-top: 6px;
}

.card-heading-product {
    font-family: Cabin;
    font-size: 18px;
    font-weight: bold;
    background: #fff;
    padding: 8px 10px 0px 8px;
}

.card-text-upload {
    font-family: Cabin;
    font-size: 16px;
    color: darkslategray;
    padding: 0px 6%;
    min-height: 168px;
}

.alert-upload {
    text-align: center;
    font-family: Cabin;
    font-size: 18px;
    margin-top: 15px;
}

.card-text-product {
    font-family: Cabin;
    font-size: 14px;
    color: darkslategray;
    padding: 0px 2% 4px 2%;
    height: 120px;
}


.card-product-body {
}

.card-title-product {
    margin-top: -5px;
}

.card-product {
    border-radius: 8px;
    border: solid 2px gray;
    margin-bottom: 10px;
    flex: 0 0 100%;
}

.card-product2 {
    border-radius: 8px;
    border: solid 2px gray;
    margin-bottom: 10px;
    flex: 0 0 100%;
}

.card-product-selected {
    border-radius: 8px;
    outline: 0px;
    border: solid 2px #0657A8;
}

.card-product:hover {
    outline: 0px;
    cursor: pointer;
    border-radius: 8px;
    border: solid 2px #0657A8;
}

.card-product2:hover {
    outline: 0px;
    cursor: pointer;
    border-radius: 8px;
    border: solid 2px #0657A8;
}

.card-button-product {
    display: flex;
    padding: 8px 0;
    justify-content: center;
    width: 100%;
    background-color: gray;
    color: #fff !important;
    font-family: Cabin;
    font-size: 16px;
}


    .card-button-product:hover {
        text-decoration: solid;
        background-color: #0657A8;
        text-decoration-color: white;
    }

.card-product:hover .card-button-product {
    text-decoration: solid;
    background-color: #0657A8;
    text-decoration-color: white;
}

.card-button-product2 {
    display: flex;
    padding: 8px 0;
    justify-content: center;
    width: 100%;
    background-color: gray;
    color: #fff !important;
    font-family: Cabin;
    font-size: 16px;
}

    .card-button-product2:hover {
        text-decoration: solid;
        background-color: #0657A8;
        text-decoration-color: white;
    }

.card-product2:hover .card-button-product2 {
    text-decoration: solid;
    background-color: #0657A8;
    text-decoration-color: white;
}

.details-label-product {
    border-radius: 10px;
    padding: 15px;
    background-color: white;
    height: 90px;
    margin-top: 10px;
    margin-left: 9px;
    margin-right: 12px;
    margin-bottom: 10px;
    padding: 10px;
    font-size: 11px;
    text-align: center;
    width: 90%;
}

.card-label-recom {
    text-align: center;
    display: block;
    /*background-blend-mode: color-burn;*/
    /*background-color: lawngreen;*/
    border-radius: 10px;
    box-shadow: #f6db6f;
    padding-top: 14px;
    border-width: 2px;
    border-style: solid;
    background: rgb(58,144,180);
    background: radial-gradient(circle, rgba(58,144,180,0.5410539215686274) 0%, rgba(29,218,253,0.49343487394957986) 50%, rgba(69,153,252,1) 100%);
    z-index: 2;
}

.terms-use.sidebar.related-videos, .terms-use.sidebar.related-videos li {
    border-top: 0 !important;
    box-shadow: none !important;
}

#artwork-forms-container input[type=radio].print-method-group-selection {
    display: none;
    border-radius: 10px;
}

    #artwork-forms-container input[type=radio].print-method-group-selection:checked + div {
        background-color: #a0c4de;
        border-radius: 10px;
        outline: 0px;
        box-shadow: 0 0 3pt 2pt #0657A8;
    }


/*div.print-method-group-selection {
    max-width: 200px;
    margin: 0px 5px;
    min-height: 350px;
}*/

div.print-method-group-selection {
    background-color: #dce5f2;
    border-radius: 10px;
}


.color-card {
    border: solid 1px gray !important;
    margin-bottom: 10px;
    background: url('../png/clickicon2.png');
    background-size: contain;
    background-color: lightgray;
    background-repeat: no-repeat;
}

    .color-card:hover {
        outline: 0px;
        cursor: pointer;
        border: solid 1px #0657A8 !important;
    }

div.print-method-group-selection:hover {
    box-shadow: 0 0 8px 3px #bdbdbd;
    border-radius: 10px;
    background-color: #bfdbf6;
    transition: .1s ease;
}

div.print-method-group-selection img {
    border-radius: 10px;
    width: 100%;
}

div.print-method-group-selection-description {
    color: #fff;
    background-color: #0657A8;
}

div.print-method-group-element {
    display: inline-block;
    min-width: 100%;
    margin-bottom: 30px;
}

.round-button {
    min-width: 30px;
    max-width: 30px;
    text-decoration: none;
    display: inline-block;
    outline: none;
    cursor: pointer;
    border-style: none;
    color: white;
    background-color: #4CAF50;
    border-radius: 100%;
    overflow:  none;
    text-align: center;
    padding: 0;
    border: 2px;
    border-style: solid;
    border-color: rgb(195,195,195) rgb(118,118,118) rgb(118,118,118) rgb(195,195,195);
}

    .round-button:before {
        content: '';
        display: inline-block;
        vertical-align: middle;
        padding-top: 100%;
        outline: none;
    }

    .round-button:focus {
        outline: none;
    }

span.round-button-span {
    display: inline-block;
    vertical-align: middle;
    max-width: 90%;
}

.round-button:active {
    background-color: #4CAF50;
    border: 2px;
    border-style: solid;
    border-color: rgb(118,118,118) rgb(195,195,195) rgb(195,195,195) rgb(118,118,118);
    outline: none;
}

.custom-color-box {
    width: 40px;
    height: 40px;
}

.color-config-container {
    display: flex;
    margin-bottom: 5px;
}

.custom-color-input {
    height: 40px;
    width: 80px;
}

.delete-custom-color {
    height: 30px;
    min-width: 30px;
    max-width: 30px;
    text-decoration: none;
    display: inline-block;
    outline: none;
    cursor: pointer;
    border-style: none;
    color: #b32424;
    border-radius: 100%;
    overflow: none;
    text-align: center;
    padding: 0;
    border: 2px;
    border-style: solid;
    border-color: rgb(195,195,195) rgb(118,118,118) rgb(118,118,118) rgb(195,195,195);
}

    .delete-custom-color:before {
        content: '';
        display: inline-block;
        vertical-align: middle;
        padding-top: 100%;
        outline: none;
    }

    .delete-custom-color:focus {
        outline: none;
    }

span.delete-custom-color-span {
    display: inline-block;
    vertical-align: middle;
    max-width: 90%;
}

.delete-custom-color:active {
    border: 2px;
    border-style: solid;
    border-color: rgb(118,118,118) rgb(195,195,195) rgb(195,195,195) rgb(118,118,118);
    outline: none;
}

.textbox-disabled {
    background-color: lightgrey;
}

.terms-use.terms-use-warning {
    background-color: #f6db6f;
}

    .terms-use.terms-use-warning h4 {
        text-align: left;
        font-weight: bold;
    }

    .terms-use.terms-use-warning ul {
        list-style-type: disc;
        margin-left: 10px;
    }

body.dealer .form-container .form-group.full-width-form-group {
    width: unset;
}

.successdivblacktext {
    background-color: #e9f6ef;
    border-radius: 2px;
    border-left: 3px solid #26A65B;
    color: #333;
    font-size: 14px;
    padding: 7px;
    margin-bottom: 10px
}

    .successdivblacktext .fa-check-circle {
        color: #26A65B;
    }

.warningdivblacktext {
    border-radius: 2px;
    border-left: 3px solid #f6db6f;
    color: #333;
    font-size: 14px;
    padding: 7px;
    margin-bottom: 10px
}

    .warningdivblacktext .fa-check-circle {
        color: #26A65B;
    }

body .content-container.content-page-titled {
    max-width: 1400px;
}

body .content-container .content-header.content-page-titled.row {
    margin-left: 0;
    margin-right: 0;
}

body .content-container .content-header.content-page-titled h1 {
    position: relative;
    text-align: left;
    margin: 0px 0px 0px 0px;
    font-size: 36px;
}

body .content-container .content-header.content-page-titled div.withborder {
    border: 1px solid #ccc;
}

body .content-container .content-header.content-page-titled div i {
    color: dimgray;
}

body .content-container .content-header.content-page-titled div p {
    margin: 0px 0px 0px 0px;
}

body .content-container .content-main.content-page-titled.withborder {
    border: 1px solid #ccc;
    padding: 25px 25px 25px 25px;
}

body .content-container .content-main.content-page-titled .side-banner div {
    right: 10px;
    position: absolute;
}

@media (max-width: 1000px) {
    .stacking {
        flex: unset;
        max-width: unset;
    }

    body .content-container .content-main.content-page-titled .side-banner div {
        padding-top: 10px;
        right: unset;
        position: unset;
    }
}

/*----------------  Help category card template-------------------------------------*/
.help-category-card {
    min-width: 25%;
    max-width: 50%;
    height: 400px;
    padding: 10px 5px;
    margin: 10px 10px;
    background: #fff;
    font-size: 16px;
    text-align: center;
    border-radius: 0;
}

@media (max-width: 768px) {
    .help-category-card {
        min-width: 40%;
    }

    .card-text-upload {
        font-size: 15px;
    }

    .card-text-product {
        font-size: 15px;
    }
}

@media (max-width: 600px) {
    .help-category-card {
        min-width: 95%;
        max-width: 95%;
        margin: 10px auto;
    }

    .card-text-upload {
        font-size: 14px;
    }

    .card-text-product {
        font-size: 14px;
    }
}

.help-category-card .date {
    width: 100%;
    text-align: center;
    padding-top: 10px;
    padding-top: 10px
}

.help-category-card .fa {
    opacity: 0.4;
    margin: 5px;
}

.help-category-card .location {
    font-style: italic;
    font-weight: bold;
    margin-bottom: 0;
}

    .help-category-card .location .fa {
        font-size: 25px;
    }

.help-category-card .title {
    font-size: 20px;
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
}

.help-category-card .site {
    margin: 0
}

    .help-category-card .site * {
        display: inline-block;
        opacity: 1;
    }

.help-category-card .divisor {
    width: 70%;
    height: 3px;
    margin-left: auto;
    margin-right: auto;
}

    .help-category-card .divisor hr {
        margin-top: 0;
        margin-bottom: 0;
    }

.help-category-card .help-links {
    margin-top: 10px;
}

    .help-category-card .help-links ul li:before {
        font-family: FontAwesome;
        content: "\f105";
        color: #0657A8;
        position: absolute;
        left: 2em;
    }

    .help-category-card .help-links ul {
        padding-left: 0;
        margin: 0 0 0 0;
        margin-left: -10px;
    }

        .help-category-card .help-links ul li {
            text-align: left;
            padding-left: 3em;
            margin: 0 0 0 0;
        }

div.breadcrumbs-outer {
    height: 2em;
}

.breadcrumbs-with-links p {
    display: inline;
}

.register-inputs.video-only {
    border-top: unset;
    float: unset;
}

.type-inner .register-inputs.video-only {
    margin-left: auto;
    margin-right: auto;
}

.landing-page-outer-banner {
    display: flex;
    justify-content: center;
}

.landing-page-header-main {
    float: left;
    position: relative;
}

    .landing-page-header-main img {
        position: relative;
    }

.landing-page-header-banner-headline {
    position: absolute;
    top: 10%;
    bottom: 10%;
    right: 20%;
    width: 42%;
    height: 80%;
    display: flex;
    flex-direction: column;
}

    .landing-page-header-banner-headline h1 {
        color: #fff;
        margin: 10px auto;
    }

    .landing-page-header-banner-headline a {
        margin: 10px auto;
        padding: 10px 20px 10px 20px;
    }


.landing-page-header-ebook-cover {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    max-width: 20%;
}

    .landing-page-header-ebook-cover img {
        height: 100%;
    }

.landing-page-body {
    background: white;
    border: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    max-width: 1180px;
    margin: 30px auto;
    display: flex;
    justify-content: space-between; /* Or use gap instead */
    flex-wrap: wrap;
    padding: 10px 30px;
}
.landing-page-top {
    max-width: 1180px;
    margin: 30px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
}


.landing-page-column {
    flex: 50%;
    max-width: 48%;
    padding: 0 4px;
}

@media (max-width: 600px) {
    .landing-page-column {
        flex: 100%;
        max-width: 100%;
    }
}

.content-container.save-for-later-items.onlytable .register-inputs.shopping-cart {
    float: none;
    margin: 0 auto
}

.content-container.save-for-later-items.onlytable h1 {
    color: #5c5c5c;
    font-weight: 400;
    font-family: Raleway,sans-serif;
    font-size: 42px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    text-transform: none
}

.register-inputs .save-for-later {
    margin: 40px 0
}

    .register-inputs .save-for-later h4 {
        padding-left: 0
    }

    .register-inputs .save-for-later table th {
        line-height: initial
    }

        .register-inputs .save-for-later table th:nth-child(1) {
            width: 5%;
            text-align: center;
            padding: 0
        }

@media (max-width: 500px) {
    .register-inputs .save-for-later table th:nth-child(1) {
        display: inline-block;
        padding-top: 10px;
        width: 20%
    }
}

.register-inputs .save-for-later table th:nth-child(2) {
    width: 10%
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table th:nth-child(2) {
        display: none
    }
}

.color-swatch-outer {
    color: white;
    height: 85px;
    width: 85px;
    border-radius: 3px;
    margin: 10px 10px 0 0 !important;
    cursor: pointer;
    position: relative;
    font-size: 12px;
    border: 1px solid #ddd;
    display: block !important;
    flex: unset !important;
}

.register-inputs .save-for-later table th:nth-child(3) {
    text-align: left;
    width: 24%
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table th:nth-child(3) {
        float: right;
        display: inherit;
        padding-top: 10px;
        width: 80%
    }
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table th:nth-child(4) {
        display: none
    }
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table th:nth-child(5) {
        display: none
    }
}

.register-inputs .save-for-later table td:nth-child(1) {
    width: 5%;
    padding: 10px;
    text-align:center;
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table td:nth-child(1) {
        display: inline-block;
        padding: 0px;
        text-align: center;
        padding-top: 20px;
        width: 20%
    }
}

.register-inputs .save-for-later table td:nth-child(2) {
    width: 10%;
    padding-top: 10px;
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table td:nth-child(2) {
        display: none
    }
}

.register-inputs .save-for-later table td:nth-child(3) {
    text-align: left;
    width: 24%;
    padding-bottom: 5px
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table td:nth-child(3) {
        float: right;
        display: inherit;
        width: 80%;
        min-height: 65px
    }
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table td:nth-child(4) {
        display: none
    }
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table td:nth-child(5) {
        display: none
    }
}

.register-inputs .save-for-later table tr.subtotal td {
    padding: 10px;
    vertical-align: middle;
    width: 50%
}

@media (max-width: 600px) {
    .register-inputs .save-for-later table tr.subtotal td {
        display: block;
        width: 98%
    }
}

.register-inputs .save-for-later table tr.subtotal td.button-selected {
    text-align: left
}

@media (max-width: 600px) {
    .register-inputs .save-for-later table tr.subtotal td.button-selected {
        padding: 5px
    }
}

.register-inputs .save-for-later table tr.subtotal td.button-selected input[type="button"] {
    border-color: #0657A8;
    color: #0657A8;
    padding: 0 10px 1px;
    margin-right: 10px
}

@media (max-width: 1000px) {
    .register-inputs .save-for-later table tr.subtotal td.button-selected input[type="button"] {
        font-size: 14px
    }
}

@media (max-width: 800px) {
    .register-inputs .save-for-later table tr.subtotal td.button-selected input[type="button"] {
        font-size: 13px;
        display: inline-block
    }
}

@media (max-width: 600px) {
    .register-inputs .save-for-later table tr.subtotal td.button-selected input[type="button"] {
        margin: 0 0 5px;
        width: 49%;
        padding: 0
    }
}

.register-inputs .save-for-later table tr.subtotal td.button-selected input[type="button"]:hover {
    background: #0657A8;
    color: white
}

@media (max-width: 500px) {
    .register-inputs .save-for-later table tr.subtotal td:nth-child(3) {
        display: none
    }
}

.register-inputs .cart h4 {
    padding-left: 0
}

.register-inputs .cart table th {
    line-height: initial
}

    .register-inputs .cart table th:nth-child(1) {
        width: 5%;
        text-align: center;
        padding: 0
    }

@media (max-width: 500px) {
    .register-inputs .cart table th:nth-child(1) {
        display: inline-block;
        padding-top: 10px;
        width: 20%
    }
}

.register-inputs .cart table th:nth-child(2) {
    width: 10%
}

@media (max-width: 500px) {
    .register-inputs .cart table th:nth-child(2) {
        display: none
    }
}

.color-swatch-outer {
    color: white;
    height: 85px;
    width: 85px;
    border-radius: 3px;
    margin: 10px 10px 0 0 !important;
    cursor: pointer;
    position: relative;
    font-size: 12px;
    border: 1px solid #ddd;
    display: block !important;
    flex: unset !important;
}

.register-inputs .cart table th:nth-child(3) {
    text-align: left;
    width: 24%
}

@media (max-width: 500px) {
    .register-inputs .cart table th:nth-child(3) {
        float: right;
        display: inherit;
        padding-top: 10px;
        width: 80%
    }
}

@media (max-width: 500px) {
    .register-inputs .cart table th:nth-child(4) {
        display: none
    }
}

@media (max-width: 500px) {
    .register-inputs .cart table th:nth-child(5) {
        display: none
    }
}

.register-inputs .cart table td:nth-child(1) {
    width: 5%;
    padding: 10px;
    text-align:center;
}

@media (max-width: 500px) {
    .register-inputs .cart table td:nth-child(1) {
        display: inline-block;
        padding: 0px;
        text-align: center;
        padding-top: 20px;
        width: 20%
    }
}

.register-inputs .cart table td:nth-child(2) {
    width: 10%;
    padding-top: 10px;
}

@media (max-width: 500px) {
    .register-inputs .cart table td:nth-child(2) {
        display: none
    }
}

.register-inputs .cart table td:nth-child(3) {
    text-align: left;
    width: 24%;
    padding-bottom: 5px
}

@media (max-width: 500px) {
    .register-inputs .cart table td:nth-child(3) {
        float: right;
        display: inherit;
        width: 80%;
        min-height: 65px
    }
}

@media (max-width: 500px) {
    .register-inputs .cart table td:nth-child(4) {
        display: none
    }
}

@media (max-width: 500px) {
    .register-inputs .cart table td:nth-child(5) {
        display: none
    }
}

.register-inputs .cart table tr.subtotal td {
    padding: 10px;
    vertical-align: middle;
    width: 50%
}

@media (max-width: 600px) {
    .register-inputs .cart table tr.subtotal td {
        display: block;
        width: 98%
    }
}

.register-inputs .cart table tr.subtotal td.button-selected {
    text-align: left
}

@media (max-width: 600px) {
    .register-inputs .cart table tr.subtotal td.button-selected {
        padding: 5px
    }
}

.register-inputs .cart table tr.subtotal td.button-selected input[type="button"] {
    border-color: #0657A8;
    color: #0657A8;
    padding: 0 10px 1px;
    margin-right: 10px
}

@media (max-width: 1000px) {
    .register-inputs .cart table tr.subtotal td.button-selected input[type="button"] {
        font-size: 14px
    }
}

@media (max-width: 800px) {
    .register-inputs .cart table tr.subtotal td.button-selected input[type="button"] {
        font-size: 13px;
        display: inline-block
    }
}

@media (max-width: 600px) {
    .register-inputs .cart table tr.subtotal td.button-selected input[type="button"] {
        margin: 0 0 5px;
        width: 49%;
        padding: 0
    }
}

.register-inputs .cart table tr.subtotal td.button-selected input[type="button"]:hover {
    background: #0657A8;
    color: white
}

@media (max-width: 500px) {
    .register-inputs .cart table tr.subtotal td:nth-child(3) {
        display: none
    }
}

.register-inputs .save-for-later.save-for-later-page {
    margin-top: 0px
}

@media (max-width: 800px) {
    .register-inputs table td.arrow-subtotal {
        width: 98%
    }
}

.register-inputs table td.arrow-subtotal span {
    font-weight: bold;
    display: inline-block;
    margin-right: 30px
}

    .register-inputs table td.arrow-subtotal span:before {
        color: rgba(0,0,0,0.6);
        content: "\f0da";
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        margin-right: 10px
    }

.content-cart-container .category-list li {
    width: 177px;
    min-height: 236px;
    border-radius: 2px;
    display: inline-block;
    margin: 4px;
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    padding: 0px;
    vertical-align: top;
    background: #fff
}

@media (max-width: 450px) {
    .content-cart-container .category-list li {
        width: 97%
    }
}

.content-cart-container .category-list li:first-child {
    margin-left: 0
}

.content-cart-container .category-list li:nth-child(5n+5) {
    margin-right: 0
}

.content-cart-container .category-list li .category-title {
    font-size: 15px;
    text-align: center;
    border-bottom: 1px solid #ddd;
    padding: 5px 0;
}

    .content-cart-container .category-list li .category-title p {
        min-height: 42px;
        margin-bottom: 5px
    }

    .content-cart-container .category-list li .category-title a {
        display: block;
        font-size: 13px;
        text-decoration: underline
    }

.uploadArt-text-box {
    padding-top: 10px;
    /*    border-style: solid;
    border-color: lightgray;
    border-width: thin;
    padding: 15px;*/
    font-size: 16px;
    /*    margin: 15px*/
}

.content-cart-container .category-list li .category-subtext {
    background: #0657A8;
    text-align: left;
    margin: 0;
    padding: 0;
    text-align: center
}

    .content-cart-container .category-list li .category-subtext a {
        font-size: 14px;
        display: block;
        padding: 5px;
        margin: 0;
        border-radius: 0
    }

        .content-cart-container .category-list li .category-subtext a:hover {
            background: #26A65B;
            border-color: #26A65B;
            color: #FFF
        }

input.qty {
    border-radius: 3px;
    font-size: 15px;
    width: 50px;
    padding: 5px 0 5px 5px;
    border: 1px solid #ddd;
    margin-top: -5px
}

@media (max-width: 450px) {
    input.qty {
        width: 40px
    }
}

input.qty.actived {
    border-color: #26A65B
}

.cart-update-qty-btn, .change-qty-btn, .later-update-qty-btn, .num-calc-update-qty {
    background: #26A65B;
    color: #fff;
    width: 50px;
    height: 14px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border: 0;
    padding: 0 7px;
    font-size: 10px;
    margin: 0 auto;
    position: relative;
    top: -2px
}


.category-list {
    font-size: 0;
    text-align: center;
    margin-bottom: 50px
}

    .category-list:after {
        content: "";
        display: table;
        clear: both
    }

    .category-list.small-imgs li img {
        width: 60%
    }

    .category-list > li {
        width: 23%;
        min-width: 300px;
        min-height: 453px;
        border-radius: 2px;
        display: inline-block;
        margin: 1%;
        border-top: 1px solid #ddd;
        box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
        padding: 0px;
        vertical-align: top;
        background: #fff
    }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .category-list > li {
        border: solid 1px #ddd
    }
}

@media (max-width: 600px) {
    .category-list > li {
        width: 95%;
        max-width: 400px
    }
}

.category-list > li:hover {
    border-top: 1px solid #bbb;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.8)
}

.category-list > li a {
    text-decoration: none
}

    .category-list > li a:hover {
        color: #333;
        text-decoration: none
    }

.category-list > li .category-title {
    background: #0657A8;
    font-size: 19px;
    text-align: center;
    border: 1px solid #ddd;
    padding: 5px 10px;
    display: table;
    width: 100%;
    color: #fff;
}

    .category-list > li .category-title span, .category-list > li .category-title a {
        display: table-cell;
        vertical-align: middle;
        height: 52px
    }

    .category-list > li .category-title span {
        padding: 0 20px
    }

    .category-list > li .category-title.two {
        min-height: initial
    }

    .category-list > li .category-title:before {
        content: "";
        height: 5px;
        width: 25px;
        background: #fff;
        position: absolute;
        right: 0;
        bottom: -1px
    }

    .category-list > li .category-title:after {
        content: "";
        height: 5px;
        width: 25px;
        background: #fff;
        position: absolute;
        left: 0;
        bottom: -1px
    }

.category-list > li .category-subtext {
    font-size: 15px;
    text-align: left;
    margin: 0;
    min-height: 60px;
    padding: 0 15px 15px
}

    .category-list > li .category-subtext .price {
        color: #0657A8;
        font-size: 22px;
        font-weight: bold
    }

.category-list > li img {
    width: 100%;
    max-height: 400px;
    padding: 15px
}

.category-list.two > li {
    width: 26%
}

@media (max-width: 900px) {
    .category-list.two > li {
        width: 30%
    }
}

@media (max-width: 768px) {
    .category-list.two > li {
        width: 50%
    }
}

@media (max-width: 450px) {
    .category-list.two > li {
        width: 96%
    }
}

.category-list.two > li button {
    margin: 5px 0 20px;
    padding: 10px 18px;
    width: 60%
}

.category-list.two .category-subtext {
    min-height: 162px
}

.category-list.searcher > li {
    width: 32%;
    margin: 0;
    margin-bottom: 15px;
    margin-left: 2%;
    float: left;
    min-height: 210px;
    max-height: 210px;
    cursor: pointer;
    position: relative
}

    .category-list.searcher > li.item-article .category-title, .category-list.searcher > li.item-article .article-description {
        margin-left: 20px
    }

    .category-list.searcher > li .svg-container-article {
        position: absolute;
        top: 15px;
        right: 15px
    }

        .category-list.searcher > li .svg-container-article svg {
            width: 30px;
            height: 30px
        }

            .category-list.searcher > li .svg-container-article svg path {
                fill: rgba(0,0,0,0.3)
            }

    .category-list.searcher > li:nth-child(3n+1) {
        margin-left: 0
    }

    .category-list.searcher > li img {
        width: 45%;
        position: absolute;
        left: 15px;
        top: 10px
    }

    .category-list.searcher > li .category-title {
        margin-left: 54%;
        text-align: left;
        line-height: 24px;
        padding-top: 5px;
        font-family: "cabin"
    }

    .category-list.searcher > li .article-description {
        font-size: 15px;
        padding-top: 10px;
        margin-left: 54%;
        padding-right: 30px;
        text-align: left
    }

        .category-list.searcher > li .article-description button {
            background: rgba(38,166,91,0.9);
            border: 0;
            color: white;
            width: 115px;
            margin: 15px 0;
            padding: 5px 0px;
            display: block;
            border-radius: 4px;
            text-transform: uppercase;
            -webkit-transition: background 0.2s ease-in;
            transition: background 0.2s ease-in
        }

            .category-list.searcher > li .article-description button:hover {
                background: #1d7d44;
                -webkit-transition: background 0.2s ease-in;
                transition: background 0.2s ease-in
            }

            .category-list.searcher > li .article-description button.blued {
                background: rgba(6,87,168,0.8)
            }

#recommendedsizes .category-list li {
    min-height: 350px
}

.heatpresses .category-list li img {
    max-height: 268px;
    width: auto
}

.heatpresses .category-list li > a {
    display: block;
    min-height: 268px
}

.heatpresses .category-list.packagesheight li > a {
    display: block;
    min-height: 180px
}

.summary-item:after {
    content: "";
    display: table;
    clear: both
}

.summary-item span {
    float: right
}

.summary-item.summary-item-total .summary-item-title {
    padding: 0 0 10px;
}

    .summary-item.summary-item-total .summary-item-title.border-bottomed {
        border-bottom: 1px solid #ddd;
        border-top: 1px solid #ddd;
        padding-top: 10px;
        margin: 10px 0
    }

.summary-item.summary-item-total .sumary-item-title {
    padding: 0 0 0px;
}

    .summary-item.summary-item-total .sumary-item-title span.sheets-counter {
        float: left
    }

.summary-item.summary-item-total .summary-item-excludes {
    text-align: left;
    border-top: 1px solid #ddd;
    padding-top: 10px;
    padding-right: 20px;
    padding-bottom: 10px
}

.summary-item .sumary-item-title-italic {
    font-style: italic;
    font-size: 13px
}

.summary-item .sumary-item-title span.sheets-counter {
    float: left
}

.video-content-page-titled-outer {
    margin: 14px 40px;
}

.video-content-page-titled-inner {
    width: 100%;
}

.font-show-item .gray-title {
    width: 100%;
    float: left;
}

    .font-show-item .gray-title h4 {
        background-color: grey;
        color: white;
        text-shadow: none;
        padding: 5px;
        font-weight: bold;
    }

.font-show-item .font-images {
    float: left;
    width: 80%;
}

.font-show-item .font-link {
    float: right;
    width: 20%;
}

.color-swatch-outer {
    color: white;
    height: 85px;
    width: 85px;
    border-radius: 3px;
    margin: 10px 10px 0 0;
    cursor: pointer;
    position: relative;
    font-size: 12px;
    border: 1px solid #ddd;
    display: block !important;
    flex: unset !important;
}

    .color-swatch-outer span {
        display: inline-block;
        position: absolute;
        background: rgba(255,255,255,0.9);
        color: #333;
        text-align: center;
        padding: 1px 0 1px;
        left: 3px;
        right: 3px;
        bottom: 3px;
        border-radius: 2px;
    }

    .color-swatch-outer label {
        width: 100%;
        height: 100%;
    }

.color-swatch-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

    .color-swatch-modal .close {
        color: #aaa;
        float: right;
        font-size: 28px;
        font-weight: bold;
    }

        .color-swatch-modal .close:hover,
        .color-swatch-modal .close:focus {
            color: black;
            text-decoration: none;
            cursor: pointer;
        }

    .color-swatch-modal .color-swatch-modal-contents {
        background-color: #fefefe;
        margin: 15% auto; /* 15% from the top and centered */
        padding: 20px;
        border: 1px solid #888;
        width: 80%; /* Could be more or less, depending on screen size */
        max-width: 600px;
    }

@media (max-width: 600px) {
    .color-swatch-modal .color-swatch-modal-contents {
        background-color: #fefefe;
        margin: 15% auto; /* 15% from the top and centered */
        margin-top: 200px;
        padding: 20px;
        border: 1px solid #888;
        width: 80%; /* Could be more or less, depending on screen size */
        max-width: 600px;
    }
}

button.plus {
    background: #0657A8;
    border: none;
    border-radius: 20px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    color: white;
    font-size: 18px;
    font-weight: 600;
    margin-right: 8px;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in;
    width: 28px
}

    button.plus:hover {
        background: #26A65B
    }

button#apply-promo-code {
    background: #26A65B;
    border: 0;
    color: white;
    display: block;
    border-radius: 4px;
    text-align: center;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in;
    height: 35px;
    min-width: 100px;
    font-weight: 600;
}

    button#apply-promo-code:hover {
        background: #1d7d44;
        -webkit-transition: background 0.2s ease-in;
        transition: background 0.2s ease-in
    }

#promo-code-error:not(:empty) {
    background: rgba(199,45,35,0.1);
    border-radius: 2px;
    color: #ef2028;
    padding: 8px 15px 8px;
    margin-bottom: 7px;
    box-shadow: none;
    border: none
}

    #promo-code-error:not(:empty):before {
        content: "\f071";
        font-family: FontAwesome;
        margin-right: 10px;
        margin-top: 1px
    }

.promo-notice {
    font-weight: 500;
    margin-bottom: 5px;
    padding-left: 25px;
    font-size: 11px;
    width: 100%;
    display: block;
    color: gray;
}

.green-button {
    background: #26A65B;
    border: 0;
    color: white;
    display: inline;
    border-radius: 4px;
    text-align: center;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in;
    height: 35px;
    min-width: 100px;
    font-weight: 600;
    padding-top: 1px;
    margin-left: 10px;
}

    .green-button:hover {
        background: #1d7d44;
        -webkit-transition: background 0.2s ease-in;
        transition: background 0.2s ease-in
    }

.exclusive-shipping-message {
    display: inline-block
}

    .exclusive-shipping-message .exclusive-ship-text {
        margin-left: 6px;
        color: #7c7c7c;
    }

    .exclusive-shipping-message .exclusive-ship-image {
        height: 20px
    }



label.select-shipping-msg {
    display: block;
    margin-left: 10px;
    font-weight: 600;
    margin-top: 10px;
    cursor: default;
    color: #f77102;
    font-size: 14px;
}

label.shipping-account-type {
    display: inline-block;
    margin-top: -5px;
    padding-bottom: 5px;
    font-weight: 600
}

span.shipping-cost-text {
    width: 60%;
    display: inline-block
}

@media (max-width: 600px) {
    span.shipping-cost-text {
        width: 80%
    }
}



.checkout-total {
    margin-top: 2px;
    padding: 20px
}

@media (max-width: 600px) {
    .checkout-total {
        padding: 20px 5px
    }
}

.checkout-total p {
    margin-bottom: 5px;
    text-transform: uppercase
}

    .checkout-total p span.total, .checkout-total p span.subtotal, .checkout-total p span.handling-fee {
        float: right;
        font-weight: bold;
        margin-right: 29.5%
    }

@media (max-width: 600px) {
    .checkout-total p span.total, .checkout-total p span.subtotal, .checkout-total p span.handling-fee {
        margin-right: 0
    }
}

.checkout-total .fa-caret-right {
    vertical-align: top;
    margin-top: 3px
}

.sid-inline-iframe {
    width: 400px;
    overflow: hidden
}

body.loading:not(.expressnames) .content-container {
    pointer-events: none
}

body.loading .terms-use:nth-child(1) {
    position: relative
}

body.loading .terms-use:nth-child(1) {
    pointer-events: none;
    overflow: hidden
}

    body.loading .terms-use:nth-child(1):before {
        content: "";
        background: transparent;
        height: 100%;
        width: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999;
        pointer-events: none;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in
    }

    body.loading .terms-use:nth-child(1):before {
        content: "";
        background: rgba(0,0,0,0.3);
        height: 100%;
        width: 100%;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in
    }

    body.loading .terms-use:nth-child(1):after {
        content: "";
        font-size: 40px;
        width: 100%;
        text-align: center;
        position: absolute;
        top: 0;
        height: 100%;
        left: 0;
        z-index: 99999;
        background: url(../gif/spinner.gif);
        background-repeat: no-repeat;
        background-size: 70px;
        background-position: center center
    }

body.loading.resolution .terms-use:nth-child(1):after {
    display: none
}

body.loading.resolution .terms-use:nth-child(1):before {
    display: none
}

.not-allow-click, .waiting-for-add {
    background: #ccc !important;
    cursor: not-allowed;
    opacity: 0.5;
    pointer-events: none !important
}

.design-swatches {
    display: block;
    height: 100px;
    position: relative;
    width: 100%;
    left: 2px;
    z-index: 999999;
    margin-top: 0px;
    padding: 18px;
    left: unset;
}

    .design-swatches button, .design-swatches label {
        border: 1px solid #446CB3;
        color: #0657A8;
        border-color: #446CB3;
        border-radius: 2px;
        width: 38.2%;
        margin-top: 15px;
        position: relative;
        background: #fff;
        font-size: 14px;
        text-align: center;
        cursor: pointer;
        line-height: 26px;
    }

    .design-swatches li {
        height: 31px;
        border: 1px solid black;
        border-color: black;
        width: 31px;
        display: block;
        margin: 1px;
        float: left;
        cursor: pointer;
        opacity: 0.8;
        border-radius: 2px;
    }

@media (max-width: 356px) {
    .design-swatches {
        margin-top: 0px;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .design-swatches {
        left: 0;
    }
}

@media (max-width: 600px) {
    .design-swatches button, .design-swatches label {
        width: 45%;
        margin-bottom: 20px;
    }
}

.design-swatches button:hover, .design-swatches label:hover {
    background: #0657A8;
    color: #fff;
}

.design-swatches .show-tee {
    display: none;
}

    .design-swatches .show-tee:checked ~ label {
        background: #446CB3;
        color: #fff;
        border: 1px solid #fff;
    }

.design-swatches li:hover {
    opacity: 1;
}

.design-swatches li#swatch_white {
    border: 1px solid #ccc;
}

.clipart-swatches {
    display: block;
    position: relative;
    width: 100%;
    left: 2px;
    z-index: 999999;
    margin-top: 0px;
    padding: 18px;
    background: white;
    left: unset;
}

@media (max-width: 356px) {
    .clipart-swatches {
        margin-top: 0px;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .clipart-swatches {
        left: 0;
    }
}

.clipart-swatches button, .clipart-swatches label {
    border: 1px solid #446CB3;
    color: #0657A8;
    border-radius: 2px;
    width: 38.2%;
    margin-top: 15px;
    position: relative;
    background: #fff;
    font-size: 14px;
    text-align: center;
    cursor: pointer;
    line-height: 26px;
}

@media (max-width: 600px) {
    .clipart-swatches button, .clipart-swatches label {
        width: 45%;
        margin-bottom: 20px;
    }
}

.clipart-swatches button:hover, .clipart-swatches label:hover {
    background: #0657A8;
    color: #fff;
}

.clipart-swatches .show-tee {
    display: none;
}

    .clipart-swatches .show-tee:checked ~ label {
        background: #446CB3;
        color: #fff;
        border: 1px solid #fff;
    }

.clipart-swatches li {
    height: 30.8px;
    width: 30.8px;
    display: block;
    margin: 1px;
    float: left;
    cursor: pointer;
    opacity: 0.8;
    border-radius: 2px;
}

    .clipart-swatches li:hover {
        opacity: 1;
    }

    .clipart-swatches li#swatch_white {
        border: 1px solid #ccc;
    }

#fivepacks-colors hr, #team-colors hr, #league-colors hr, #kits-colors hr, #expresspacks-colors hr {
    width: 100%;
}

#fivepacks-colors .express-options-title, #team-colors .express-options-title, #league-colors .express-options-title, #kits-colors .express-options-title, #expresspacks-colors .express-options-title {
    display: inline-block;
}

#fivepacks-colors .number-config-contain, #team-colors .number-config-contain, #league-colors .number-config-contain, #kits-colors .number-config-contain, #expresspacks-colors .number-config-contain {
    display: flex;
    align-items: flex-start;
    flex-flow: row nowrap;
    justify-content: space-between;
}

@media (max-width: 600px) {
    #fivepacks-colors .number-config-contain, #team-colors .number-config-contain, #league-colors .number-config-contain, #kits-colors .number-config-contain, #expresspacks-colors .number-config-contain {
        flex-flow: column-reverse;
        align-items: flex-start;
        margin-left: 0;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #fivepacks-colors .number-config-contain, #team-colors .number-config-contain, #league-colors .number-config-contain, #kits-colors .number-config-contain, #expresspacks-colors .number-config-contain {
        width: 100%;
    }
}

#fivepacks-colors .number-config-contain #modal-content-numbers, #team-colors .number-config-contain #modal-content-numbers, #league-colors .number-config-contain #modal-content-numbers, #kits-colors .number-config-contain #modal-content-numbers, #expresspacks-colors .number-config-contain #modal-content-numbers {
    max-height: none;
    width: 278px;
    background: white;
    overflow: hidden;
}

@media (max-width: 600px) {
    #fivepacks-colors .number-config-contain #modal-content-numbers, #team-colors .number-config-contain #modal-content-numbers, #league-colors .number-config-contain #modal-content-numbers, #kits-colors .number-config-contain #modal-content-numbers, #expresspacks-colors .number-config-contain #modal-content-numbers {
        align-self: flex-start;
    }
}

#fivepacks-colors .number-config-contain #modal-content-numbers .clipart-swatches, #team-colors .number-config-contain #modal-content-numbers .clipart-swatches, #league-colors .number-config-contain #modal-content-numbers .clipart-swatches, #kits-colors .number-config-contain #modal-content-numbers .clipart-swatches, #expresspacks-colors .number-config-contain #modal-content-numbers .clipart-swatches {
    height: auto;
    z-index: initial;
    display: inline-block;
    margin-bottom: -5px;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #fivepacks-colors .number-config-contain #modal-content-numbers .clipart-swatches, #team-colors .number-config-contain #modal-content-numbers .clipart-swatches, #league-colors .number-config-contain #modal-content-numbers .clipart-swatches, #kits-colors .number-config-contain #modal-content-numbers .clipart-swatches, #expresspacks-colors .number-config-contain #modal-content-numbers .clipart-swatches {
        left: 0;
    }
}

#fivepacks-colors .number-config-contain #modal-content-numbers .clipart-swatches li, #team-colors .number-config-contain #modal-content-numbers .clipart-swatches li, #league-colors .number-config-contain #modal-content-numbers .clipart-swatches li, #kits-colors .number-config-contain #modal-content-numbers .clipart-swatches li, #expresspacks-colors .number-config-contain #modal-content-numbers .clipart-swatches li {
    height: 32px;
    width: 32px;
}

#fivepacks-colors .number-config-contain .upload-color-container, #team-colors .number-config-contain .upload-color-container, #league-colors .number-config-contain .upload-color-container, #kits-colors .number-config-contain .upload-color-container, #expresspacks-colors .number-config-contain .upload-color-container {
    display: flex;
    flex-flow: row wrap;
}

@media (max-width: 600px) {
    #fivepacks-colors .number-config-contain .upload-color-container li, #team-colors .number-config-contain .upload-color-container li, #league-colors .number-config-contain .upload-color-container li, #kits-colors .number-config-contain .upload-color-container li, #expresspacks-colors .number-config-contain .upload-color-container li {
        height: auto;
        width: auto;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #fivepacks-colors .number-config-contain .select-number-color-contain, #team-colors .number-config-contain .select-number-color-contain, #league-colors .number-config-contain .select-number-color-contain, #kits-colors .number-config-contain .select-number-color-contain, #expresspacks-colors .number-config-contain .select-number-color-contain {
        width: calc(100% - 280px);
        float: left;
    }
}

@media (max-width: 600px) {
    #fivepacks-colors .number-config-contain .select-number-color-contain, #team-colors .number-config-contain .select-number-color-contain, #league-colors .number-config-contain .select-number-color-contain, #kits-colors .number-config-contain .select-number-color-contain, #expresspacks-colors .number-config-contain .select-number-color-contain {
        width: 100%;
    }
}

#fivepacks-colors .number-config-contain .preview-number-contain, #team-colors .number-config-contain .preview-number-contain, #league-colors .number-config-contain .preview-number-contain, #kits-colors .number-config-contain .preview-number-contain, #expresspacks-colors .number-config-contain .preview-number-contain {
    margin-top: -5px;
    background: white !important;
}

@media (max-width: 600px) {
    #fivepacks-colors .number-config-contain .preview-number-contain, #team-colors .number-config-contain .preview-number-contain, #league-colors .number-config-contain .preview-number-contain, #kits-colors .number-config-contain .preview-number-contain, #expresspacks-colors .number-config-contain .preview-number-contain {
        width: 100%;
        display: flex;
        flex-flow: column;
        margin-bottom: 20px;
    }
}

#fivepacks-colors .number-config-contain .preview-number-contain .express-options-title, #team-colors .number-config-contain .preview-number-contain .express-options-title, #league-colors .number-config-contain .preview-number-contain .express-options-title, #kits-colors .number-config-contain .preview-number-contain .express-options-title, #expresspacks-colors .number-config-contain .preview-number-contain .express-options-title {
    margin-right: 12.5px;
}

#fivepacks-colors .number-config-contain .preview-number-contain #preview-number, #team-colors .number-config-contain .preview-number-contain #preview-number, #league-colors .number-config-contain .preview-number-contain #preview-number, #kits-colors .number-config-contain .preview-number-contain #preview-number, #expresspacks-colors .number-config-contain .preview-number-contain #preview-number {
    width: 80px;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #fivepacks-colors .number-config-contain .preview-number-contain, #team-colors .number-config-contain .preview-number-contain, #league-colors .number-config-contain .preview-number-contain, #kits-colors .number-config-contain .preview-number-contain, #expresspacks-colors .number-config-contain .preview-number-contain {
        display: inline-block;
        float: right;
    }
}

#fivepacks-colors #modal-content-numbers {
    margin-top: 10px;
}

#fivepacks-colors-colors hr {
    width: 100%;
}

@media (max-width: 600px) {
    #expresspacks-colors .number-config-contain {
        flex-flow: column-reverse;
        margin-left: 0;
    }
}

#expresspacks-colors .number-config-contain #modal-content-numbers {
    max-height: none;
    min-width: 278px;
}

@media (max-width: 600px) {
    #expresspacks-colors .number-config-contain #modal-content-numbers {
        min-width: 65%;
        margin-left: 0;
    }
}

#expresspacks-colors .number-config-contain #modal-content-numbers .clipart-swatches {
    display: inline-block;
    height: auto;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #expresspacks-colors .number-config-contain #modal-content-numbers .clipart-swatches {
        left: 0;
    }
}

#expresspacks-colors .number-config-contain .upload-color-container {
    display: flex;
    flex-flow: row wrap;
    margin-top: 20px;
}

@media (max-width: 600px) {
    #expresspacks-colors .number-config-contain .upload-color-container {
        justify-content: center;
    }
}

@media (max-width: 600px) {
    #expresspacks-colors .number-config-contain .upload-color-container li {
        height: auto;
        width: initial;
    }
}

#kits-colors hr {
    width: 100%;
}

#kits-colors .number-config-contain {
    display: flex;
    align-items: flex-start;
    flex-flow: row nowrap;
    justify-content: space-between;
}

@media (max-width: 600px) {
    #kits-colors .number-config-contain {
        flex-flow: column-reverse;
        align-items: flex-start;
        margin-left: 0;
    }
}

#kits-colors .number-config-contain #modal-content-numbers {
    max-height: none;
    min-width: 278px;
}

@media (max-width: 600px) {
    #kits-colors .number-config-contain #modal-content-numbers {
        margin-left: 0;
    }
}

#kits-colors .number-config-contain #modal-content-numbers .clipart-swatches {
    display: inline-block;
    height: auto;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    #kits-colors .number-config-contain #modal-content-numbers .clipart-swatches {
        left: 0;
    }
}

#kits-colors .number-config-contain .upload-color-container {
    display: flex;
    flex-flow: row wrap;
}

@media (max-width: 600px) {
    #kits-colors .number-config-contain .upload-color-container {
        justify-content: flex-start;
    }
}

@media (max-width: 600px) {
    #kits-colors .number-config-contain .upload-color-container li {
        height: auto;
        width: initial;
    }
}


#number-ex-container {
    position: absolute;
    top: 35%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#modal-content-numbers {
    max-width: 500px;
    max-height: 500px;
    margin-bottom: 10px;
}

.tee {
    margin: 0 !important;
}

.express-options-title {
    color: #0657A8;
    font-weight: bold;
    padding-bottom: 10px;
    font-size: 16px;
}

.log-contain {
    display: inline-block;
    margin-bottom: 32px;
}

    .log-contain h2 {
        color: #0065bd;
        font-size: 17px;
        line-height: 1.2rem;
        margin-top: 10px;
        font-weight: 700;
        text-align: left;
    }

a.plainBlueButton {
    font-size: 16px;
    display: inline-block;
    cursor: pointer;
    text-decoration: none;
    font-weight: 700;
    background: transparent;
    color: #0657A8;
    padding: 10px 15px;
}

.apparel-addtocart {
    text-align: center;
    margin-top: 10px;
    position: relative;
    overflow: hidden;
}

    .apparel-addtocart .btn {
        margin: 5px;
        padding: 10px 0;
        width: calc(32% - 10px);
        float: left;
    }

    .apparel-addtocart .flip-container {
        width: 33%;
    }

@media (max-width: 550px) {
    .apparel-addtocart .btn {
        width: 90%;
    }

    .apparel-addtocart .flip-container {
        width: 90%;
    }
}

/* entire container, keeps perspective */
.flip-container {
    perspective: 1000px;
    transform-style: preserve-3d;
}

    .flip-container .btn {
        margin: 0;
        width: 100%;
    }

    /* flip the pane when hovered */
    .flip-container.active .flipper {
        transform: rotateY(180deg);
    }

        .flip-container.active .flipper .front {
            backface-visibility: hidden;
        }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .flip-container.active .flipper .front {
        display: none;
    }
}

.flip-container.active .flipper .back {
    display: block;
}

.flip-container {
    float: left;
    margin: 5px;
    height: 44px;
    width: calc(50% - 10px);
}

@media (max-width: 550px) {
    .flip-container {
        width: 90%;
    }
}

.flip-container .back, .flip-container .front {
    width: 100%;
}

/* flip speed goes here */
.flipper {
    transition: 0.6s;
    transform-style: preserve-3d;
    position: relative;
}

    .flipper:after {
        content: "";
        clear: both;
        display: table;
    }

/* hide back of pane during swap */
.front, .back {
    position: absolute;
    top: 0;
    left: 0;
}

/* front pane, placed above back */
.front {
    z-index: 2;
    /* for firefox 31 */
    transform: rotateY(0deg);
}

/* back, initially hidden pane */
.back {
    display: none;
    transform: rotateY(180deg);
    z-index: 1;
}

    .back a {
        background: white;
        border: 1px solid #26A65B;
        border-radius: 3px;
        color: #26A65B;
        display: block;
        font-size: 16px;
        padding: 10px 0;
    }

        .back a:hover {
            text-decoration: none;
        }

        .back a span {
            font-size: 14px;
            text-decoration: underline;
        }

@media (max-width: 550px) {
    .back a span {
        width: 100%;
    }
}

#error-apparel.apparel-error li {
    margin-left: 8px;
    margin-top: 10px;
    margin-bottom: -12px;
}

#error-list.free-samples-error li, #error-apparel.apparel-error li {
    list-style-type: none;
    margin-top: 5px;
    color: red;
    font-size: 12px;
}

.noticemessages.paypal-message {
    padding-top: 10px;
    padding-bottom: 10px;
    color: #0657A8;
    text-decoration: underline;
    margin-bottom: 5px;
    margin-top: 10px;
    width: calc(100% - 15px);
}

    .noticemessages.paypal-message:hover {
        opacity: .8;
    }

@media (max-width: 900px) {
    .noticemessages.paypal-message {
        width: 100%;
    }
}

.checkout-table .checkout-items .paypal-checkout-option {
    padding: 0;
}

    .checkout-table .checkout-items .paypal-checkout-option label {
        display: flex;
        flex-flow: nowrap row;
        justify-content: space-between;
        align-items: center;
        padding: 15px;
        width: 100%;
    }

        .checkout-table .checkout-items .paypal-checkout-option label > .payment-type {
            display: flex;
            align-items: center;
            min-width: 100%;
        }

            .checkout-table .checkout-items .paypal-checkout-option label > .payment-type .payment-content {
                min-width: 100%;
            }

                .checkout-table .checkout-items .paypal-checkout-option label > .payment-type .payment-content > span {
                    display: inline;
                }

                .checkout-table .checkout-items .paypal-checkout-option label > .payment-type .payment-content iframe {
                    padding-left: 10px;
                }

            .checkout-table .checkout-items .paypal-checkout-option label > .payment-type #pay-pay-selector {
                margin-top: 0px;
            }

        .checkout-table .checkout-items .paypal-checkout-option label div.payment-method {
            padding-right: 0;
            width: 275px;
        }

            .checkout-table .checkout-items .paypal-checkout-option label div.payment-method img {
                width: 85px;
            }

@media (max-width: 600px) {
    .checkout-table .checkout-items .paypal-checkout-option label div.payment-method {
        margin-top: 0;
    }
}

@media (max-width: 600px) {
    .checkout-table .checkout-items .paypal-checkout-option label {
        flex-flow: nowrap column;
        align-items: flex-start;
    }

        .checkout-table .checkout-items .paypal-checkout-option label .payment-method {
            padding-right: 100px;
            margin-top: 15px;
        }
}

.checkout-table .checkout-items .paypal-checkout-option.disabled {
    pointer-events: none;
    display: flex;
    flex-flow: row nowrap;
}

    .checkout-table .checkout-items .paypal-checkout-option.disabled > .label-contain {
        opacity: .7;
        max-width: 140px;
    }

    .checkout-table .checkout-items .paypal-checkout-option.disabled > #paypal-only-note {
        display: block;
        width: calc(100% - 155px);
        margin: 15px;
        opacity: .9;
        font-size: 12px;
        background: #f3f3f3;
        margin: 15px 15px 15px 0px;
    }

        .checkout-table .checkout-items .paypal-checkout-option.disabled > #paypal-only-note a {
            font-weight: 600;
        }

@media (max-width: 600px) {
    .checkout-table .checkout-items .paypal-checkout-option.disabled {
        flex-flow: column nowrap;
    }

        .checkout-table .checkout-items .paypal-checkout-option.disabled #paypal-only-note {
            width: calc(100% - 35px);
            margin: -10px 15px 15px 15px;
        }
}

.checkout-table .checkout-items .paypal-checkout-option + .paypal-notification.notification-alert {
    border-radius: 0;
    padding-left: 20px;
}

    .checkout-table .checkout-items .paypal-checkout-option + .paypal-notification.notification-alert i {
        padding-right: 10px;
    }

    .checkout-table .checkout-items .paypal-checkout-option + .paypal-notification.notification-alert a {
        color: #2c96ff;
    }

.checkout-table .checkout-items #paypal-payment-img {
    height: 40px;
}

.place-order-button#place-order-paypal {
    width: 100%;
    margin-top: 10px;
    max-height: 57px;
    background: #013087;
    object-fit: cover;
    border: 1px solid #aaaaaa;
    margin-bottom: 7px;
    border-radius: 6px;
    border-left: none;
    cursor: pointer;
    justify-content: inherit;
    padding: 6px 0 11px 0;
    cursor: pointer;
}

    .place-order-button#place-order-paypal:hover {
        opacity: .9;
    }

@media (max-width: 1283px) {
    .place-order-button#place-order-paypal {
        padding-top: 11px;
    }
}

@media (max-width: 900px) {
    .place-order-button#place-order-paypal {
        width: 250px;
        margin: auto;
        margin-bottom: 20px;
    }
}

#place-order-paypal-mobile {
    opacity: 0;
    position: absolute;
    pointer-events: none;
}

@media (max-width: 900px) {
    #place-order-paypal-mobile {
        opacity: 1;
        pointer-events: all;
        position: relative;
        padding-bottom: 10px;
    }

        #place-order-paypal-mobile[style*="display: inline;"] + .terms-use {
            display: none;
        }
}

@media (max-width: 900px) {
    #checkout-n-pay {
        display: none;
        opacity: 0;
        position: absolute;
        pointer-events: none;
    }
}

.paypal-click-here#paypal-only-note {
    padding: 0px 15px 10px 15px;
    opacity: 1;
    padding-top: 10px;
    pointer-events: none;
    display: none;
}

    .paypal-click-here#paypal-only-note i {
        font-size: 15px;
        margin-right: 5px;
    }

    .paypal-click-here#paypal-only-note a {
        pointer-events: all;
    }

h1.resolution-title {
    margin-bottom: 30px !important;
    color: #0657A8;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -1px;
    margin: 10px 0 10px;
    padding-left: 30px;
    text-align: left;
    text-transform: uppercase;
    font-family: Raleway,sans-serif;
    padding-top: 10px;
    padding-bottom: 10px;
}

a.new-resolution {
    position: absolute;
    width: 25%;
    border: none;
    background: #26A65B;
    padding: 12px;
    color: white;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in;
    text-transform: uppercase;
    border-radius: 4px;
    text-align: center;
    outline: none;
    right: 15px;
    top: 15px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
}

.register-inputs.upload-artwork-step, .register-inputs.new-resolution {
    background: #fff;
    border-radius: 3px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    margin-bottom: 20px;
    border-left: 1px solid #ddd;
    position: relative;
    min-height: 220px;
}

    .register-inputs.new-resolution .resolution-container button {
        background: #cfcfcf;
        border-bottom-right-radius: 2px;
        border-top-right-radius: 2px;
        border: 0px solid #ccc;
        color: white;
        font-size: 13px;
        position: absolute;
        top: 2px;
        height: 35px;
        left: 24%;
        min-width: 50px;
        -webkit-transition: 0.2s ease-in;
        transition: 0.2s ease-in;
    }

    .register-inputs.new-resolution .resolution-container input[name="order_number"] {
        width: 28%;
    }

.register-input-container.full {
    width: 100%;
    position: relative;
}

.register-input-container {
    width: 50%;
    float: left;
    margin-bottom: 10px;
}

.register-inputs.new-resolution .resolution-container {
    position: relative;
}

button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

.register-inputs.new-resolution .register-input-container {
    margin-bottom: 25px;
}

#edit-resolution .resolution-fields-container .issues-message {
    padding: 10px 15px;
    margin-bottom: 15px;
    border: 1px solid #ddd;
    border-radius: 2px;
    position: relative;
}

    #edit-resolution .resolution-fields-container .issues-message:before {
        content: "";
        height: 16px;
        width: 3px;
        background-color: #ddd;
        position: absolute;
        bottom: -16px;
        left: 30px;
    }

    #edit-resolution .resolution-fields-container .issues-message .issues-message-author {
        float: left;
        width: 85px;
        border-right: 1px dashed #ddd;
        font-size: 12px;
    }

#edit-resolution .resolution-fields-container .issues-message {
    padding: 10px 15px;
    margin-bottom: 15px;
    border: 1px solid #ddd;
    border-radius: 2px;
    position: relative;
}

.register-inputs.new-resolution .register-input-container {
    margin-bottom: 25px;
}

.register-input-container.full {
    width: 100%;
    position: relative;
}

#edit-resolution .resolution-fields-container:after {
    content: "";
    display: table;
    clear: both;
}

#edit-resolution .resolution-fields-container .issues-message:after {
    content: "";
    display: table;
    clear: both;
}

#edit-resolution .resolution-fields-container .issues-message p {
    float: left;
    padding-left: 20px;
    padding-top: 10px;
    width: calc(100% - 100px);
}

.register-inputs.new-resolution .resolution-type ul li, .register-inputs.new-resolution .resolution-subtype ul li, .register-inputs.new-resolution .resolution-outcome ul li {
    color: #777;
    padding: 9px 12px;
    width: 29%;
    font-size: 14px;
    -webkit-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    cursor: pointer;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.28);
    margin-top: 10px;
    border-top: 1px solid #ddd;
    border-radius: 2px;
    display: inline-block;
    margin-right: 10px;
}

    .register-inputs.new-resolution .resolution-type ul li.selected, .register-inputs.new-resolution .resolution-subtype ul li.selected, .register-inputs.new-resolution .resolution-outcome ul li.selected {
        border-left: 3px solid #26a65b;
        background: #e9f6ef;
    }

.summary-video, .summary-blog {
    font-size: 12px;
    margin-top: 6px;
    cursor: pointer;
}

#edit-resolution .resolution-fields-container .register-input-container.issues-uploads img {
    border: 1px solid #ddd;
    border-radius: 2px;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    float: left;
    margin: 5px;
    width: calc(50% - 10px);
}

.register-inputs.new-resolution .register-input-container {
    margin-bottom: 25px;
}

.register-input-container.full {
    width: 100%;
    position: relative;
}

@media (max-width: 900px) {
    .summary-video, .summary-blog {
        width: 30%;
        display: inline-block;
        margin: 0 1%;
    }
}

@media (max-width: 768px) {
    .summary-video, .summary-blog {
        width: 47%;
    }
}

@media (max-width: 450px) {
    .summary-video, .summary-blog {
        width: 98%;
    }
}

.summary-video:after, .summary-blog:after {
    content: "";
    display: table;
    clear: both;
}

.summary-video .thumb-wrap, .summary-blog .thumb-wrap {
    border: solid 1px #eee;
    float: left;
    width: 120px;
    overflow: hidden;
    position: relative;
}

    .summary-video .thumb-wrap div, .summary-blog .thumb-wrap div {
        position: relative;
        top: 0;
        height: 70px;
    }

.summary-video .video-title, .summary-blog .video-title, .summary-video .video-date, .summary-blog .video-date, .summary-video .video-views, .summary-blog .video-views, .summary-video .article-title, .summary-blog .article-title, .summary-video .article-date, .summary-blog .article-date, .summary-video .article-blog-title, .summary-blog .article-blog-title {
    padding-left: 10px;
    float: left;
    font-size: 10px;
    width: calc(100% - 120px);
}

.summary-video .video-title, .summary-blog .video-title, .summary-video .article-title, .summary-blog .article-title, .summary-video .article-blog-title, .summary-blog .article-blog-title {
    font-weight: bold;
    font-size: 12px;
}

.summary-video .video-time, .summary-blog .video-time {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 999;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 1px 4px;
}

.video-title a {
    color: #23527c !important;
    text-align: left;
    font-size: 12px !important;
    text-decoration: none !important;
    text-transform: capitalize !important;
}

@media (min-width: 900px) {
    #videoSidebar {
        max-height: 540px;
        overflow-y: auto;
    }
}

@media (min-width: 900px) and (max-width:1100px) {
    .thumb-wrap {
        width: 80px !important;
    }

    .video-title {
        width: calc(100% - 80px) !important;
    }
}

.express-input-container input {
    margin-right: 5px;
    border-radius: 3px;
    border: 1px solid #ccc;
    height: 35px;
    padding-left: 10px;
    background: #fff;
    margin-bottom: 6px;
}

    .express-input-container input:-ms-input-placeholder {
        color: #a9a9a9 !important;
    }

@media (max-width: 600px) {
    .express-input-container input {
        width: 51%;
        margin-right: 10px;
        margin-left: 0px;
    }
}

.express-input-container .fa {
    color: #888;
    cursor: pointer;
}

    .express-input-container .fa:hover {
        color: red;
    }

.express-input-container label {
    width: 30px;
    text-align: center;
}

@media (max-width: 600px) {
    .express-input-container label {
        width: 10%;
        margin-right: 5px;
    }
}

.express-input-container.more input {
    margin-left: 14px;
    margin-right: 4px;
}

@media (max-width: 600px) {
    .express-input-container.more input {
        margin-left: 4px;
        margin-right: 14px;
    }
}

.express-input-container.titles span {
    margin-left: 12px;
}

@media (max-width: 600px) {
    .express-input-container.titles span {
        margin-left: 0;
        display: inline-block;
        margin-right: 5px;
    }
}

.express-input-container.titles span.letter-height {
    margin-left: 125px;
}

@media (max-width: 600px) {
    .express-input-container.titles span.letter-height {
        margin-left: 0;
        width: 29%;
    }
}

@media (max-width: 600px) {
    .express-input-container.titles span.names {
        width: 55%;
        margin-left: -7px;
    }
}

@media (max-width: 600px) {
    .express-input-container.titles span.line {
        width: 10%;
    }
}

.names-list .btn.grey {
    margin-left: 12px;
}

#express-names-container h3 {
    text-align: left;
    font-size: 26px;
    margin-top: 10px;
    margin-bottom: 10px;
}

    #express-names-container h3 span {
        display: inline-block;
        background: transparent;
        color: #0657A8;
        width: 36px;
        line-height: 28px;
        border: 2px solid #0657A8;
        text-align: center;
        border-radius: 65%;
        padding: 1px 0 3px;
        position: relative;
        top: 0px;
        margin-right: 5px;
    }

.express-options {
    margin: 10px 0;
}

#express-names-container .product-form-options .product-option .option-style {
    padding: 0px;
}

#express-names-container .option-color {
    margin: 0px;
}

#express-names-container .product-form-options .product-option .option-style img {
    height: auto;
}

#express-names-container .product-form-options .product-option .option-style-notext img {
    padding: 2px 0px;
}

#express-names-container .product-form-options .product-option .option-color {
    width: 100%;
}

.upload-banner {
    margin: -20px auto 30px;
    display: block;
    width: 46%;
    min-width: 500px;
}

.ul .artwork-checklist {
    list-style-type: list !important;
    padding: 0;
    margin: 0
}

.ttt {
    background: #fff;
    font-size: 18px;
    text-align: center;
    border-bottom: 1px solid #ddd;
    padding: 5px 10px;
    text-transform: uppercase;
    position: relative;
    display: table;
    width: 100%;
}

.artwork-info-form-container ul.category-list > li {
    border-top: solid 1px #ececec;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-flow: column nowrap;
    min-width: 140px;
    max-width: 300px;
    min-height: unset;
    width: 23%;
    -webkit-box-flex: 1;
    flex: 1 0 auto;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 0;
    overflow: hidden;
    cursor: pointer;
}

.category-list > li {
    width: 23%;
    min-width: 300px;
    min-height: 372px;
    border-radius: 2px;
    display: inline-block;
    margin: 1%;
    border-top: 1px solid #ddd;
    box-shadow: 0px 1px 1px 0 rgba(0,0,0,0.3);
    padding: 0px;
    vertical-align: top;
    background: #fff;
}

.content-cart-container .category-list li .category-subtext {
    background: #0657A8;
    text-align: left;
    margin: 0;
    padding: 0;
    text-align: center;
}

.artwork-info-form-container ul.category-list > li p.category-subtext {
    color: white;
    padding: 7px;
    height: 100%;
}

.category-list > li .category-subtext {
    font-size: 14px;
    text-align: center;
    margin: 0;
    min-height: 80px;
    padding: 6px 15px 0px 15px;
}

.transfers-containment .one-third {
    -webkit-box-flex: 0;
    flex: 0 0 33.3333%;
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: 33.3333%;
    width: 33.3333%;
}

.transfers-containment {
    display: -webkit-box;
    display: flex;
    float: left;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row wrap;
    padding-bottom: 15px;
}



.btn {
    display: inline-block;
    margin: 2px 0px;
    text-align: center;
    white-space: nowrap;
    font-weight: 500;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    padding: 6px 12px;
    font-size: 14px;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-transform: capitalize;
    color: #FFF;
    border-radius: 3px;
}

a {
    color: #0657A8;
    text-decoration: none;
}

a {
    color: #337ab7;
    text-decoration: none;
}

a {
    background-color: transparent;
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
}

*, *:before, *:after {
    box-sizing: border-box;
}

* {
    box-sizing: border-box;
}

user agent stylesheet
a:-webkit-any-link {
    color: -webkit-link;
    cursor: pointer;
    text-decoration: underline;
}

.transfers-containment > * {
    padding: 10px 5px;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-flow: column;
    -webkit-box-pack: start;
    justify-content: flex-start;
}

.transfers-containment {
    display: -webkit-box;
    display: flex;
    float: left;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-flow: row wrap;
    padding-bottom: 15px;
}

body {
    font-size: 14px;
    margin: 0;
    position: relative;
    background: #fff;
    font-family: "open sans";
    overflow-x: hidden;
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.428571429;
    color: #333333;
    background-color: #fff;
}

html {
    font-size: 10px;
    -webkit-tap-highlight-color: transparent;
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

*, *:before, *:after {
    box-sizing: border-box;
}

    *:before, *:after {
        box-sizing: border-box;
    }

    *, *:before, *:after {
        box-sizing: border-box;
    }

        *:before, *:after {
            box-sizing: border-box;
        }

.full-width {
    width: 100%;
    flex-basis: 100%;
}

.transfers-containment .subtitle {
    font-style: italic;
    font-size: 12px;
    color: #424242;
    padding-bottom: 5px;
    line-height: 1;
}

.upload .register-input-container.radios > div {
    width: 50%;
}

.fl-cl-right {
    float: right;
    clear: right;
}

.step-explainer-2 {
    width: 100%;
    background-color: #f6f6f6;
    position: relative;
    padding: 10px 15px 12px;
    border-radius: 2px;
    border: 0;
    padding-left: 70px;
}

.half-width {
    width: 45%;
    display: inline-block;
    margin: 0px;
}

.step-explainer-2 .fa {
    position: absolute;
    font-size: 36px;
    color: #999;
    left: 5px;
    width: 60px;
    text-align: center;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
}

#new-address-override-option-div {
    border: 1px solid #ef2028;
    background: rgba(199,45,35,0.1);
    border-radius: 2px;
    border-left: 4px solid #ef2028;
    color: #ef2028;
    padding: 7px
}

    #new-address-override-option-div p {
        margin: 0px 0 5px
    }

@media (max-width: 700px) {
    .select2 span {
        min-width: 300px;
    }
}

@media (min-width: 701px) {
    .select2 span {
        min-width: 500px;
    }
}

.blink {
    animation: blinker 1.7s cubic-bezier(.5, 0, 1, 1) infinite alternate;
}

@keyframes blinker {
    to {
        opacity: 0;
    }
}


p#applied-text {
    color: green;
    padding-left: 0px;
    padding-top: 7px;
    margin-bottom: 0;
    font-weight:bold;
}

    p#applied-text:before {
        content: "\f00c";
        font-family: FontAwesome;
        margin-right: 5px;
    }


.btn-check {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

    .btn-check[disabled] + .btn, .btn-check:disabled + .btn {
        pointer-events: none;
        filter: none;
        opacity: 0.25;
    }

.btn-sheet-size {
}

    .btn-sheet-size:hover {
        opacity: 0.5;
        border: 1px solid white;
        color: white;
        transition: all 0.2s ease;
    }

.btn-check:checked + .btn-sheet-size {
    box-shadow: 0 0 0 0.3rem rgba(6, 87, 168, 0.5);
    transition: all 0.2s ease;
}

.popover-body {
    font-size: 14px;
}

.use-pointer {
    cursor: pointer;
}

.btn-xlarge {
    padding: 10px 43px;
    font-size: 18px;
    line-height: normal;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.vert-align {
    display: flex;
    align-items: center;
}

.overrideCardHeaderStyling {
    padding-top: 20px;
    background-color: white !important;
    border-bottom: 0 !important;
    text-align: center;
}

.cropImage {
    object-fit: cover;
    width: 100%;
}

.cropImageProduct {
    object-fit: cover;
    width: 100%;
    height: 10vw;
    border-radius: 7px 7px 0px 0px;
}

.card-text-upload ul {
    display: block;
    list-style: disc outside none;
    margin: 10px 0px 0px 0px;
    padding: 0 0 0 20px;
}

.card-text-upload li {
    display: list-item;
}

.card-text-product ul {
    display: block;
    list-style: disc outside none;
    margin: 6px 0px 0px 0px;
    padding: 0 0 0 20px;
}

.card-text-product li {
    display: list-item;
}

.uploadQuoteBox {
    background-color: #cce5ff;
    background-clip: border-box;
    margin-top: 2px;
    color: #004085;
    font-family: Cabin;
    min-height: 70px;
}

@media screen and (min-width: 601px) {
    .uploadQuoteBox {
        font-size: 16px;
        min-height: 70px;
    }

    .prevBtn {
        font-size: 18px;
    }

    .nextBtn {
        font-size: 18px;
    }

    .restartBtn {
        font-size: 18px;
    }

    .btnAddToCart {
        font-size: 18px;
    }
}

/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 600px) {
    .uploadQuoteBox {
        font-size: 12px;
        min-height: 50px;
    }

    .prevBtn {
        font-size: 12px;
        padding: 0px !important;
    }

    .nextBtn {
        font-size: 12px;
        padding: 0px !important;
    }

    .restartBtn {
        font-size: 12px;
        padding: 0px !important;
    }

    .btnAddToCart {
        font-size: 12px;
        padding: 0px !important;
    }
}

.prevBtn {
    margin: 0 !important;
}

.nextBtn {
    margin: 0 !important;
}

.restartBtn {
    margin: 0 !important;
}

.btnAddToCart {
    margin: 0 !important;
}

.alert-errors-upload-artwork {
    width: 100%;
    height: 100%;
    padding-top: 2.5%;
}

#smartwizard {
    background-color: white;
}

#DivTransferColorCount {
    margin-bottom: 10px;
}

.box {
    width: 200px;
    height: 300px;
    position: relative;
    border: 1px solid #bbb;
    background: #eee;
    float: left;
    margin: 20px;
}

.ribbon {
    position: absolute;
    right: -3px;
    top: -6px;
    z-index: 1;
    overflow: hidden;
    width: 183px;
    height: 183px;
    text-align: right;
}

    .ribbon span {
        font-size: 1.8rem;
        color: #fff;
        text-transform: uppercase;
        text-align: center;
        font-weight: bold;
        line-height: 42px;
        transform: rotate(45deg);
        width: 235px;
        display: block;
        background: #79a70a;
        background: linear-gradient(#9bc90d 0%, #79a70a 100%);
        box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
        position: absolute;
        top: 47px;
        /*        // change this, if no border right: -29px;
        // change this, if no border*/
    }

        .ribbon span::before {
            content: '';
            position: absolute;
            left: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid #79A70A;
            border-right: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #79A70A;
        }

        .ribbon span::after {
            content: '';
            position: absolute;
            right: 0%;
            top: 100%;
            z-index: -1;
            border-right: 3px solid #79A70A;
            border-left: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #79A70A;
        }

.red span {
    background: linear-gradient(#f70505 0%, #8f0808 100%);
}

    .red span::before {
        border-left-color: #8f0808;
        border-top-color: #8f0808;
    }

    .red span::after {
        border-right-color: #8f0808;
        border-top-color: #8f0808;
    }

.blue span {
    background: linear-gradient(#2989d8 0%, #1e5799 100%);
}

    .blue span::before {
        border-left-color: #1e5799;
        border-top-color: #1e5799;
    }

    .blue span::after {
        border-right-color: #1e5799;
        border-top-color: #1e5799;
    }

.foo {
    clear: both;
}

.bar {
    content: "";
    left: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid #79a70a;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #79a70a;
}

.baz {
    font-size: 1rem;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    line-height: 2em;
    transform: rotate(45deg);
    width: 100px;
    display: block;
    background: #79a70a;
    background: linear-gradient(#9bc90d 0%, #79a70a 100%);
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    position: absolute;
    top: 100px;
    left: 1000px;
}

.modal-header .close {
    font-size: 3rem !important;
    padding-top: 1.5rem;
}

.lnk-how-to-size {
    margin-left: 12px;
    cursor: pointer;
    margin-bottom: 8px;
}

.lnk-how-to-outline {
    margin-left: 3px;
    cursor: pointer;
}

.pointer-link {
    cursor: pointer;
}

.modal-center-screen {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.nav-tabs-wrapper {
    position:relative;
}
#vinylTabs {
    display: flex;
    overflow: visible;
    justify-content: space-between;
    margin-bottom: 20px;
    width: 100%;
    position:relative;
}
    #vinylTabs .nav-tabs {
        overflow:visible;
        position:relative;
    }
    #vinylTabs .nav-item {
        flex-grow: 1;
        text-align: center;
        position: relative;
    }
#vinylTabs .nav-link {
    
    display:block;
    padding:15px;
    border:1px solid #ddd;
    background-color:#f8f9fa;
    color:#0657A8;
    transition: background-color 0.3s, color 0.3s;
}

    #vinylTabs .nav-link:hover {
        background-color: #e9ecef;
        color: #043a6e;
    }

    #vinylTabs .nav-link.active {
        background-color: #0657A8;
        color: white;
        border-color: #043a6e;
    }

#vinylTabs.nav-tabs > li a {
    font-size: 18px;
}

#vinylTabsContent.tab-content {
    border: 1px solid #dee2e6;
    padding: 20px;
    background-color: #fff;
}

.saveRibbon {
    position: absolute;
    top: 0px;
    right: -20px;
    background-color: #ff0000;
    color: white;
    font-size: 12px;
    font-weight: bold;
    padding: 5px 18px;
    border-radius: 3px;
    clip-path: polygon(0% 0%, 100% 0%, 90% 50%, 100% 100%, 0% 100%, 10% 50%);
    transform: rotate(15deg);
    z-index: 10;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    text-align: center;
    line-height: 1.5;
}

#vinylTabsContent .card {
    position:relative;
}

.card .top-left-branding {
    position:absolute;
    top:10px;
    left:10px;
    width:50px;
    z-index:10;
}

#packages-tab:hover .saveRibbon {
    background: #e0a800;
    color:#000;
}

#settingsTabs.nav-tabs > li a {
    font-size: 18px;
    padding: 10px 20px;
}

#settingTabsContent.tab-content {
    border: 1px solid #dee2e6;
    padding: 20px;
    background-color: #fff;
}

.upload-drag-drop {
    background-color: white;
    cursor: pointer;
}

    .upload-drag-drop:hover {
        outline-color: Highlight;
    }

.checkout-table .checkout-items .shipping-fees {
    border-bottom: 1px solid #eee;
    color: #0657A8;
    margin-top: 2px;
}

    .checkout-table .checkout-items .shipping-fees h5 {
        margin-bottom: 15px
    }

        .checkout-table .checkout-items .shipping-fees h5.title-with-link {
            display: inline
        }

    .checkout-table .checkout-items .shipping-fees li {
        color: initial;
        display: inline-block;
        margin-right: 1%;
        min-width: 318px
    }

@media (max-width: 650px) {
    .checkout-table .checkout-items .shipping-fees li {
        min-width: 48%
    }
}

@media (max-width: 450px) {
    .checkout-table .checkout-items .shipping-fees li {
        min-width: 98%
    }
}

.checkout-table .checkout-items .shipping-fees li.active {
    background: initial
}

.checkout-table .checkout-items .shipping-fees li.apparel-price {
    font-size: 13px;
    display: block
}

.checkout-table .checkout-items .shipping-fees li input[type="radio"]:not(old) {
    width: 15px;
    margin: 0;
    padding: 0;
    font-size: 15px;
    opacity: 0;
    cursor: pointer;
    position: absolute;
    top: -9999px;
    left: -99999px
}

    .checkout-table .checkout-items .shipping-fees li input[type="radio"]:not(old) + label {
        display: inline-block;
        margin-left: 5px;
        line-height: 1.5
    }

        .checkout-table .checkout-items .shipping-fees li input[type="radio"]:not(old) + label > span {
            display: inline-block;
            width: 17px;
            height: 17px;
            margin: 0px 8px 2px 0px;
            border: 1px solid silver;
            border-radius: 3px;
            background: #eee;
            vertical-align: bottom
        }

    .checkout-table .checkout-items .shipping-fees li input[type="radio"]:not(old):checked + label > span {
        background: #eee;
        border: 1px solid #26A65B
    }

        .checkout-table .checkout-items .shipping-fees li input[type="radio"]:not(old):checked + label > span > span {
            background: #26A65B;
            border-radius: 3px;
            display: block;
            width: 13px;
            height: 13px;
            margin: 1px
        }

.checkout-table .checkout-items .shipping-fees a {
    margin-left: 15px;
    font-size: 13px;
    text-decoration: underline;
    cursor: pointer
}

.us-autocomplete-pro-example {
    font-family: helvetica;
    color: #0a0a0a;
    text-align: left;
}

    .us-autocomplete-pro-example label {
        color: #0a0a0a;
    }

    .us-autocomplete-pro-example .us-autocomplete-pro-input-container {
        margin: 0 auto 2em;
        /*width: 60%;*/
    }

.us-autocomplete-pro-menu {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 20em;
    /*box-shadow: 0 7px 7px rgba(0, 0, 0, 0.12);*/
    /*color: #7d7d7d;*/
    position: absolute;
    text-align: left;
    width: inherit;
    z-index: 10;
    padding-left: 1em;
    background-color: antiquewhite;
}

    .us-autocomplete-pro-menu .ui-menu-item-wrapper {
        padding-left: 1em;
    }

/*.us-autocomplete-pro-example .labels {
    display: inline-block;
    font-weight: bold;
    width: 40%;
}

.us-autocomplete-pro-example .data {
    display: inline-block;
    padding-left: 1em;
    width: 50%;
}*/

.inline {
    display: inline-block;
    vertical-align: top;
    width: 40%;
}

.data-container {
    text-align: center;
    margin-bottom: 2em;
}

.align-right {
    text-align: right;
}

.align-left {
    text-align: left;
}

#map {
    width: 395px;
    height: 440px;
    background-color: grey;
}

.AlertOutline {
    outline-style: solid;
    outline-color: palegoldenrod;
    outline-width: thin;
}

.LabelMargin5px {
    margin-top: 5px
}

.state-dropdown {
    color: black;
    background-color: white;
}

state-dropdown:focus {
    background-color: white;
}

.address-group {
    outline-color: lightgray;
    outline-style: solid;
    outline-width: thin;
    padding: 10px;
    background-color: #ececec;
}

div[disabled] {
    opacity: 0.6;
    pointer-events: none;
}

.cart-color-label {
    font-size: smaller;
    margin-bottom: 0px;
}

.cart-color-item {
    font-size: smaller;
    color: slategray;
    margin-bottom: 0px;
}

.names-input-alert {
    color: red;
    margin-left: 34px;
}

.names-text-container {
    background: rgba(255,255,255,0.7);
    display: flex;
    text-align: center;
    position: relative;
    margin: 0 auto;
}

.names-aspect-ratio {
    aspect-ratio: 1;
}

.names-alert-warning {
    font-size: 12px;
    color: #fd7e14;
    display: none;
}

.names-alert-danger {
    font-size: 12px;
    color: #ff4444;
    display: none;
}

@media (min-width: 1300px) and (max-width: 1499px) {
    .cart-product-column-width {
        min-width: 300px
    }
}

@media (min-width: 1500px) {
    .cart-product-column-width {
        min-width: 380px
    }
}

@media (min-width: 1500px) {
    .cart-product-column-width {
        min-width: 380px
    }
}

.text-description h2 {
    padding: 0px;
}

.h4-inline {
    color: #0657A8;
    font-weight: bold;
    text-align: left;
    font-size: 18px;
    font-family: inherit;
    line-height: 1.1;
}

.searchText:focus {
    background: white;
}

.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #0657A8;
    border-color: #0657A8;
}

.page-link:hover {
    z-index: 2;
    color: #0056b3;
    text-decoration: none;
    background-color: #e9ecef;
    border-color: #dee2e6;
}

.page-link {
    color: #0657A8;
}

.pagination-lg .page-link {
    padding: 0.75rem 1.5rem;
    font-size: 1.5rem;
    /* line-height: 1.5; */
}

.orderTable {
    font-size: 14px;
}

@media (max-width: 900px) {
    .orderTable {
        font-size: 12px;
    }
}

@media (max-width: 660px) {
    .orderTable {
        font-size: 10px;
    }
}

@media (max-width: 900px) {
    .landing-page-header-banner-headline h1 {
        font-size: 27px;
    }
}

@media (max-width: 660px) {
    .landing-page-header-banner-headline h1 {
        font-size: 16px;
    }
}



.orderTable td {
    vertical-align: middle;
}

.lightGrayBorder {
    border: 1px solid #e0e0e0;
}

.truncateText {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

.blueHeader {
    color: #0657A8;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -1px;
    text-transform: uppercase;
    display: inline;
}

.designerButton {
    color: #26a65b;
}

.btnGreen {
    background: #26a65b;
    color: #fff !important;
}

    .btnGreen:hover {
        background: #219150;
        color: #fff !important;
    }

    .btnGreen:focus {
        background: #219150;
        color: #fff !important;
    }

.text-rich figure {
    margin: 0;
}

.badge {
    font-size: 100%;
}

.vinylColorSwatch {
    cursor: pointer;
    padding: 2px;
    height: 44px;
    margin: 2px 1px;
}

    .vinylColorSwatch.active {
        border: 2px solid #0071e3;
    }

    .vinylColorSwatch:hover {
        border: 2px solid #ccc;
    }

.ulSizes li {
    margin: 0px 8px;
}

    .ulSizes li:first-child {
        margin-left: 0px;
    }

.vinylProductThumbnail {
    cursor: pointer;
    height: 143.25px;
    width: 143.25px;
    object-fit: contain;
    background-color: #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 5px;
}

    .vinylProductThumbnail:hover {
        border: 2px solid #ccc;
    }


.vinylProductImage {
    margin-left: 6px;
    height: 440.84px;
    width: 440.84px;
    object-fit: contain;
    background-color: #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blueIndicator {
    border-left: solid 2px #0071e3
}

.cabinFont {
    font-family: Cabin;
}

.bigMoney {
    color: green;
    font-size: larger;
    font-weight: bold;
}

.vinylCardTitle {
    font-size: 1.7rem;
    font-weight: bold;
    text-align: center;
}

.vinylStahlsImage {
    height: 22px;
    margin-left: 6px;
}

.vinylAvailableSizes {
    font-size: 1.4rem;
    margin-top: 4px;
    font-weight: bold;
}

.vinylColorWheel {
    height: 22px;
    vertical-align: middle;
}

.breadcrumbNew {
    margin: 10px 0px;
    padding: 0px;
}

.blockFullWidth {
    display: block;
    width: 100%;
}

.blockDisplayNone {
    display: none;
    width: 100%;
}

#vinylCOlorSelection {
    font-size: 13pt;
    font-weight: bold;
    margin-bottom: 6px;
}

.VinylQuestionLabel {
    font-size: 13pt;
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 6px;
}

#ulSizesVinyl {
    display: flex;
    list-style: none;
    margin-bottom: 20px;
    text-align: center;
    font-size: 11pt;
}

#clearQuantities {
    cursor: pointer;
    color: #0071e3;
    margin-top: 28px;
}

.vinylOrderTotal {
    margin-left: 5px;
}

#divVinylProductInfo {
    font-size: 13pt;
    font-weight: bold;
    margin: 10px 0px;
}

.preLine {
    white-space: pre-line
}

.vinylQty {
    font-size: 20px;
    text-align: center;
    font-weight: bold;
    width: 60px;
    height: 30px;
}

.qtySizeLabel {
    font-size: 10pt;
}


.chat-btn {
    position: fixed;
    z-index: 99994;
    right: 26px;
    bottom: 30px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    background-color: #0657A8;
    color: #fff;
    font-size: 40px;
    width: 70px;
    height: 70px;
    padding: 10px 12px 12px 12px;
    border-radius: 35px;
    text-align: center;
    border: 3px solid white;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
    transition: all 0.2s ease 0s;
    margin-top: 10px;
    transform: scale(1);
}

    .chat-btn:hover {
        transform: translateY(-4px);
    }

    .chat-btn .closeX {
        color: #fff;
        display: none;
    }

    .chat-btn i {
        transition: all 0.9s ease
    }

#checkChatBot:checked ~ .chat-btn i {
    display: block;
    pointer-events: auto;
    transform: rotate(180deg)
}

#checkChatBot:checked ~ .chat-btn {
    transform: scale(.8);
}

    #checkChatBot:checked ~ .chat-btn .comment {
        display: none;
    }

#checkChatBot:checked ~ .wrapper {
    display: block;
    transition: all 0.2s ease 0s;
}

.chat-btn i {
    font-size: 28px;
    color: #fff !important
}

.wrapper {
    display: none;
    position: fixed;
    z-index: 99990;
    right: 20px;
    bottom: 100px;
    width: 350px;
    height: 500px;
    background-color: #fff;
    border-radius: 5px;
    opacity: 0;
    transition: all 0.2s ease 0s;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}

#checkChatBot:checked ~ .wrapper {
    opacity: 1;
}


.chat-form {
    padding: 15px
}

    .chat-form input,
    textarea,
    button {
        margin-bottom: 10px
    }

    .chat-form textarea {
        resize: none
    }


#checkChatBot {
    display: none !important;
}

.chatbot-welcome {
    background-color: #0065bd;
    border: 3px solid #fff;
    border-radius: 12px;
    bottom: 24px;
    box-shadow: 1px 4px 6px 0 rgb(0 0 0 / 30%);
    color: #fff;
    cursor: default;
    display: none;
    font-size: 14px;
    font-weight: 400;
    margin-left: 20px;
    max-width: 380px;
    padding: 12px 18px;
    position: fixed;
    right: 120px;
    text-transform: none;
    z-index: 99997;
}

    .chatbot-welcome.activated {
        display: block;
        -webkit-animation: 2s ease 0s normal forwards 1 fadein;
        animation: 2s ease 0s normal forwards 1 fadein;
    }

@keyframes fadein {
    0% {
        opacity: 0;
    }

    66% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadein {
    0% {
        opacity: 0;
    }

    66% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}


.chatbot-welcome-close {
    background-color: #0065bd;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 1px 4px 6px 0 rgb(0 0 0 / 30%);
    cursor: pointer;
    height: 24px;
    position: absolute;
    right: -12px;
    text-align: center;
    top: -12px;
    width: 24px;
    z-index: 99999;
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

#TermsPolicyDiv a {
    color: #0657A8;
    text-decoration: underline;
    background: none;
    font-size: inherit;
    font-weight: normal;
    box-shadow: none;
    border-radius: unset;
    cursor: pointer;
    padding: 0px;
}

.not-allow-click-policy {
    cursor: not-allowed !important;
    opacity: 0.5 !important;
    pointer-events: none !important;
}

.apparelCountPill {
    background-color: #0657A8;
    font-weight: normal;
    color: #fff;
    border-radius: 20px;
    min-width: 36px;
    text-align: center;
    font-size: 1.4rem;
    margin-left: 6px;
    float: right;
}

.PagedList-pageCountAndLocation a {
    position: relative;
    display: block;
    padding: 0.75rem 1.5rem;
    font-size: 1.5rem;
    margin-left: -1px;
    line-height: 1.5;
    color: #007bff;
    background-color: #fff;
    border: 1px solid #dee2e6;
    color: #0657A8;
}

.graySubtitle {
    color: #727272;
    font-size: 12pt;
    font-weight: normal;
}

.register-button {
    width: 200px;
    height: 50px;
    font-size: 14pt;
}

.submit-button {
    width: 200px;
    height: 50px;
    font-size: 14pt;
}

#OrderBy{
    cursor:pointer;
}

#ItemsPerPage {
    cursor: pointer;
}

.carousel-indicators li::after {
    bottom: 0px !important;
}

.carousel-indicators li {
    margin: 0px !important;
}

#filtersDiv {
    display: block;
}

@media (max-width:767px) {
    #filtersDiv {
        display: none;
    }

    .toggle-button {
        display: inline-block;
    }
}

@media (min-width:768px) {
    .toggle-button {
        display: none;
    }
}

.img-wrapper {
    position: relative;
}

.img-responsive {
    width: 100%;
    height: auto;
}

.img-overlay {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
}

    .img-overlay:before {
        content: ' ';
        display: block;
        /* adjust 'height' to position overlay content vertically */
        height: 50%;
    }

#orderDetailsTabs.nav-tabs > li a {
    font-size: 18px;
    padding: 10px 20px;
}

#orderDetailTabsContent.tab-content {
    border: 1px solid #dee2e6;
    padding: 20px;
    background-color: #fff;
}

#ReorderDetailTabsContent.tab-content {
    border: 1px solid #dee2e6;
    padding: 20px;
    background-color: #fff;
}

.order-details-body {
    margin: 20px 10% 0;
    overflow: hidden
}

.password-alert-danger {
    font-size: 12px;
    color: #ff4444;
    margin: 0px;
}

.password-alert-success {
    font-size: 12px;
    color: #289408;
    margin:0px;
}

@media (min-width: 992px) {
    .pull-up100-lg {
        margin-top: -100px;
    }

    .pull-up50-lg {
        margin-top: -50px;
    }
}

.side-banner img {
    float: right;
    margin-top: 8px;
}

.call-us-container {
    display: flex;
    align-items: flex-start;
    float: right;
    margin-top: 20px;
}

.call-us-text-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-size: 1.8rem;
}

.call-us-icon {
    font-size: 4rem;
    margin-top: 4px;
    margin-right: 10px;
    display: flex;
    align-items: center;
}

@media (max-width:600px) {
    .call-us-icon {
        font-size: 2.9rem;
        margin-top: 8px;
    }

    .call-us-container p {
        font-size: 1.5rem;
    }

    .call-us-container {
        margin-top: 10px;
    }
}

.delayed-more-info {
    font-size: 12px;
    color: #0657A8;
    cursor: pointer;
}


.color-group-reorder {
    height: 100%;
    vertical-align: middle;
    padding-top: 2px;
}

.color-group-reorder .option-color {
    color: white;
    height: 60px;
    width: 60px;
    border: 1px solid rgb(221, 221, 221);
    border-radius: 3px;
    vertical-align: middle;
    margin: 2px 5px 5px 0px;
    cursor: pointer;
    position: relative;
    font-size: 0px;
    text-align: center;
    padding: 4px 4px;
    min-width: 60px;
}

.color-group-reorder .option-color.active {
    display: inline-block;
}

.color-group-reorder .option-color label {
    width: 100%;
    height: 100%;
}

.color-group-reorder .check-select.active label:after {
    content: "\f00c";
    font-family: FontAwesome;
    position: absolute;
    right: 0;
    top: 0px;
    text-align: center;
    left: 0;
    line-height: 58px;
    color: #fff;
    font-size: 26px;
    text-shadow: -1px 0 #555, 0 1px #555, 1px 0 #555, 0 -1px #555;
}

.color-group-reorder .option-color input[type="checkbox"] {
    width: 0;
    opacity: 0;
    height: 0;
}

.color-group-reorder .option-color span {
    display: inline-block;
    position: absolute;
    background: rgba(255,255,255,0.9);
    color: #333;
    text-align: center;
    padding: 1px 0 1px;
    left: 3px;
    right: 3px;
    bottom: 3px;
    border-radius: 2px;
    font-size: 10px;
    line-height: 15px;
}

.accordion-toggle {
    cursor: pointer;
}

.faq-question-links {
    padding: 4px;
    margin-left:10px;
}

.faq-question-answers {
    padding-left: 18px;
    padding-bottom: 12px;
}

.btn-questions {
    padding: 2px;
   
}

.tab-container {
    border: 1px solid #dee2ef;
    border-radius: 5px;
    background-color:#ffffff;
}
.card-salestax-tabs {
    background-color: #ffffff;
}

.landing-page-top .nav-tabs .nav-link {
    border:none;
}

.landing-page-top .nav-tabs .nav-link {
    padding: 12px 20px;
    font-size: 1.9rem;
    min-height: 50px;
    font-weight:bold;
    border-radius:5px 5px 0 0;
    background-color:#ffffff;
    border: 1px solid #dee2e6;
}
.landing-page-top .nav-tabs .nav-link.active {
    background-color:#ffffff;
    border-bottom:none;
}

.landing-page-top .tab-content {
    border: 1px solid #dee2e6;
    border-top:none;
    margin-top: -1px;
    padding: 20px;
    background-color: #ffffff;
    border-collapse:collapse;
}

.landing-page-top .card {
    border:none;
    box-shadow:none;
    padding:20px;
}

.landing-page-top .card .card-body {
    padding:20px;
    background-color: #ffffff;
}

.landing-page-top .accordion-item {
    border: none;
    border-radius: 5px;
    margin-bottom: 10px;
}


    .landing-page-top .accordion-item .accordion-header a {
        display: block;
        margin-bottom: 10px;
        margin-top: 5px;
    }

.landing-page-top .accordion-body {
    background-color: #ffffff;
    border: none;
    font-size: 1.6rem;
}

.landing-page-top .accordion-header .btn {
    padding:10px;
    font-size:1.7rem;
    font-weight:bold;
    border:none;
    box-shadow:none;
}

.salesTaxQuestion {
    padding-left: 4px;
    cursor: pointer;
    color: #337ab7;
}

.landing-page-top .accordion-body ul {
    list-style-type:disc;
    padding-left: 20px;
    margin-top:10px;
}
.landing-page-top .accordion-body ol {
    list-style-type: decimal;
    padding-left: 20px;
    margin-top: 10px;
}

.custom-card-img {
    height: 276px;
    object-fit:contain;
    background-color:#f0f0f0;
    display:flex;
    align-items:center;
    justify-content:center;
}

@media (max-width: 768px) {
    .background-image-container {
        position: static; /* Reset the position to ensure proper stacking */
        height: auto; /* Ensure the image container adjusts to content */
    }

    .section1-content-container {
        position: relative; /* Keep it properly positioned */
        z-index: 2; /* Ensure it stays above the background image */
        width: 100%; /* Ensure it spans full width */
        padding: 20px; /* Add padding for readability */
        background-color: rgba(48, 52, 60); /* Add contrast for readability */
    }

    .section1-container {
        display: flex; /* Optional: Use flexbox to ensure both sections stay aligned */
        flex-direction: column; /* Stack elements vertically */
    }

    .accordion {
        width: 100%; /* Ensure the accordion takes the full width of the screen */
    }

    .prod-features-pic {
        margin-top: 2rem;
    }

    .page-button-2col {
        margin-top:15px;
    }
}

@media (max-width: 450px) {
    .btn.btn-learn-more {
        font-size: 16px; /* Optionally reduce font size for better fit */        
    }
}

@media (max-width: 380px) {
    .btn.btn-learn-more {
        font-size: 12px; /* Optionally reduce font size for better fit */
    }
}

@media (min-width: 769px) {
    /* Background image styling */
    .background-image-container {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1; /* Send to the background */
        overflow: hidden;
    }

        .background-image-container img {
            width: 100%;
            height: 100%;
            object-fit: cover; /* Ensures proper scaling of the image */
        }

    .section1-container {
        position: relative;
        background-color: transparent; /* Remove the original background color */
        overflow: hidden; /* Ensure content doesn't spill */
    }

    /* Content container styling */
    .section1-content-container {
        position: relative;
        z-index: 2; /* Bring content to the foreground */
        background-color: rgba(48, 52, 60); /* Add semi-transparent background for readability */
        padding: 20px; /* Optional for spacing */
    }
}

.product-page .content-wrap {
    background: white;
}

/* Responsive margin adjustments for different devices */
.product-page .mt-lg-7,
.product-page .mt-lg-6 {
    margin-top: 2rem !important;
}

.product-page .mt-md-5 {
    margin-top: 2.5rem !important;
}

/* General typography improvements */
.product-page .description-format {
    text-align: justify;
    color: #fcb61f;
}

.product-page .items-format {
    color: white;
    font-size: 1.4rem;
}

.product-page .upload-box {
    color: black;
    font-size: 1.2rem;
    background-color: white;
    padding: 20px;
    border: 3px dashed #1f75fd;
}

.product-page .upload-box-bold {
    color: black;
    font-size: 1.4rem;
    font-weight: 700;
}

.product-page .upload-box-regular {
    color: black;
    font-size: 1.2rem;
}

.product-page .learn-more-section p {
    font-weight: 400 !important;
}

/* Learn More Section */
.product-page .learn-more-section {
    position: relative;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    overflow: hidden;
    padding: 40px 0;
    font-weight: 400 !important;
}

    .product-page .learn-more-section::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(31, 117, 253, 0.8);
        z-index: 0;
    }

.product-page .learn-more-section-content {
    position: relative;
    z-index: 1;
}
.product-page .title-section {
    background-color: #1f75fd;
    padding: 60px 10px;
    color: white;
}

.product-page .page-button {
    border-radius: 0 !important;
    padding: 10px 15px;
    color: white;
    font-size: 1.1rem;
    font-weight: 700;
    background-color: #1f75fd;
    border-style: solid;
    border-width: 2px;
    white-space: normal;
    word-wrap: break-word;
    text-align: left;
}

    .product-page .page-button:hover {
        background-color: #30343c;
        border-color: #30343c;
    }

    .product-page .page-button.selected {
        background-color: white;
        color: #1f75fd;
        border-color: #1f75fd;
    }

.product-page .features-description-format {
    text-align: justify;
    color: #d4273e;
}

.product-page hr {
    height: 2px;
    border: none;
    background-color: lightgray;
    margin: 0 1rem;
}

.product-page .learn-more-section {
    background-color: #1f75fd;
}

.product-page .learn-more-title {
    color: white;
}

.product-page .btn-learn-more {
    border-radius: 0 !important;
    background-color: white !important;
    color: #1f75fd !important;
    width: 100%;
    font-size: 1.3rem;
    font-weight: 600;
    height: 55px;
    white-space: normal;
    word-wrap: break-word;
    text-align: left;
}

    .product-page .btn-learn-more:hover {
        color: black !important;
    }

.product-page .accordion-item-container {
    padding: 20px;
    font-size: .8rem;
}

.product-page .content-wrap ul {
    padding-left: 20px;
    margin-top: 10px;
}

.product-page .image-caption {
    background-color: lightgray;
    height: 40px;
    font-weight: 600;
    font-size: .9rem;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-page .text-ev {
    font-size: 1.1rem;
}

.product-page .ev-items-format {
    color: black;
    font-size: 1.2rem;
    font-weight: bold;
}

.product-page .label-ev {
    background-color: lightgray;
    text-align: center;
    width: 100%;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    padding: 10px 0px;
}

.product-page .text-rich hr {
    margin: 0 !important;
}

.product-page .image-container {
    width: 100%;
    height: 50%;
    overflow: hidden;
    position: relative;
}

    .product-page .image-container img {
        width: 100%;
        height: auto;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
    }

.product-page .image-container-2col {
    position: relative;
    display: inline-block;
    width: 100%;
}

    .product-page .image-container-2col img {
        width: 100%;
        height: auto;
    }

.product-page .label-ev-2col {
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: lightgray;
    text-align: center;
    width: 100%;
    font-weight: 600;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    padding: 10px 0px;
}

.product-page .content-container {
    padding: 0px;
}

.product-page .dynamic-hr {
    margin-top: 80px;
    margin-bottom: 30px;
}

@media (min-width: 1700px) {
    .product-page .custom-offset {
        margin-left: 25%;
        padding-right: 10%;
    }
}

.hawk-container {
    width:100%;
}

.hawk-toast-container {
    width: 100%;
}

.gray-background {
    background-color: rgb(223,219,210); /* Background applies only where image exists */
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0px !important;
}

.settings-hr {
    border: 0;
    height: 2px; /* Sets the thickness */
    background-color: #0065bd; /* Sets the color */
    margin-top: 1px !important;
    margin-bottom: 30px !important;
}

.settings-content h4 {
    font-size: 20px !important;
    color: #0065bd; /* Sets the color */
}

.group-settings {
    margin-top: 5px;
    display: flex;
    flex-direction: column;
    gap: 5px; /* Reduce spacing between rows */
}
.group-settings-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.group-settings-item-title {
    flex: 0 0 40%; /* Adjust width for the title */
    font-weight: bold;
    margin-right: 10px;
}

.group-settings-item {
    flex: 1;
    text-align: left;
}

.input-group-settings {
    display: flex;
    flex-wrap: wrap; /* Allows wrapping on smaller screens */
    justify-content: space-between; /* Adds space between the two columns */
    gap: 20px; /* Adds spacing between columns */
    width: 100%;
}

    .input-group-settings .col-md-6 {
        flex: 0 0 48%; /* Makes columns take up ~50% of the width with spacing */
        box-sizing: border-box; /* Ensures padding/margins are included in width */
    }

@media (max-width: 768px) {
    .input-group-settings {
        flex-direction: column; /* Stack columns vertically on small screens */
        gap: 10px; /* Adjust spacing for mobile */
    }

        .input-group-settings .col-md-6 {
            flex: 0 0 100%; /* Full width on mobile */
        }
}

.learn-more-full-width {
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    width: 100vw;
}

.text-rich .no-bullets ul li:before {
    content: none !important;
}

.okta-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.okta-modal-content {
    background: white;
    padding: 30px;
    border-radius: 10px;
    text-align: center;
    max-width: 400px;
    width: 90%;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

.okta-close {
    position: absolute;
    top: 20px;
    right: 25px;
    font-size: 24px;
    cursor: pointer;
}

.trust-pilot-widget-style {
    padding: 50px;
    background-color: aliceblue;
    border-bottom: solid;
    border-width: 1px;
    border-color: lightgray;
}

.shipgroup-border {
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 30px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
    border-color: lightgray;
    border-collapse: separate;
    border-spacing: 0;
}

    .shipgroup-border td {
        border: none !important;
    }

.btn-order-action {
    min-width: 95px;
    white-space: nowrap;
}

.editShipGroupForm #checkout-cc-select li {
    background-color: #fff; /* or Bootstrap's var(--bs-body-bg) */
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
}

.editShipGroupForm #checkout-cc-select {
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 1055;
    position: absolute;
    width: 100%;
}

    .editShipGroupForm #checkout-cc-select li:hover {
        background-color: #f8f9fa; /* light gray on hover */
    }

    .editShipGroupForm #checkout-cc-select li.selected {
        background-color: #e9f5ff; /* light blue for selected item */
        font-weight: 500;
    }

.editShipGroupForm #active-cc {
    position: relative;
    padding-right: 24px; /* space for the arrow */
    cursor: pointer;
}

    .editShipGroupForm #active-cc::after {
        content: '';
        position: absolute;
        top: 50%;
        right: 8px;
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid #333; /* arrow color */
        transform: translateY(-50%);
        pointer-events: none;
    }

/* Rounded border container for both sections */
.editShipGroupForm .section-box-order-edit {

    padding: 12px;
}

/* Scroll behavior for shipping address block */
.editShipGroupForm .scrollable-section-order-edit .shipping-address-container {
    background-color: #f7f7f9;
    max-height: 188px; /* ~5 visible items */
    overflow-y: auto;
    overflow-x: hidden;
    white-space: normal;
    padding: 4px;
    margin: 0;
    border: #ddd 1px solid;
}

/* Prevent horizontal scroll in items */
.editShipGroupForm .shipping-address-container li {
    white-space: normal;
    word-break: break-word;
}

.editShipGroupForm .checkout-items.payment {
    border: 1px solid #ccc;
    border-radius: 8px;
    background-color: #fff;
    margin-top: 10px;
}

/* Shipping method layout: 2 columns, responsive */
.editShipGroupForm .shipping-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-left: 0;
    list-style-type: none;
    margin-top: 15px;
}

    /* Each shipping method tile */
    .editShipGroupForm .shipping-options li {
        flex: 0 1 calc(50% - 10px); /* Two items per row, equal width */
        min-width: 280px; /* Controls minimum size */
        max-width: calc(50% - 10px); /* Prevents overflow */
        padding: 10px 12px;
        border: 1px solid #ddd;
        border-radius: 8px;
        background-color: white;
        display: flex;
        align-items: flex-start;
        box-sizing: border-box;
    }

        .editShipGroupForm .shipping-options li:hover {
            background-color: #f0f8ff;
            cursor: pointer;
        }

        .editShipGroupForm .shipping-options li.active {
            background-color: #e6f4ff;
            border-radius: 5px;
            color: black;
            border: 1px solid darkgray;
        }


.editShipGroupForm .shipping-address-container li.shipping-address {
    border: 1px solid #ddd;
    background-color: white;
    transition: background-color 0.2s ease;
}


    .editShipGroupForm .shipping-address-container li.shipping-address:hover {
        background-color: #f0f8ff;
        cursor: pointer;
    }

    .editShipGroupForm .shipping-address-container li.shipping-address.active {
        background-color: #e6f4ff;
        border: 1px solid darkgray;
        border-radius: 5px;
        color: black;
        margin-bottom: 3px;
    }

        .editShipGroupForm .shipping-address-container li.shipping-address.active:hover {
            background-color: #e6f4ff;
        }

    /* Radio input style */
    .editShipGroupForm .shipping-options input[type="radio"] {
        margin-right: 10px;
        margin-top: 4px;
    }

    /* Label wraps remaining content */
    .editShipGroupForm .shipping-options label {
        flex: 1;
        margin-bottom: 0;
        font-weight: normal;
        color: #333;
        cursor: pointer;
    }

    /* Heading for section */
    .editShipGroupForm .shipping-options h5 {
        margin-bottom: 5px;
        font-size: 16px;
        font-weight: 600;
    }

/* UPS note */
.editShipGroupForm .exclusive-shipping-message {
    font-size: 14px;
    color: #555;
    margin-bottom: 10px;
}

    /* UPS icon sizing */
    .editShipGroupForm .exclusive-shipping-message img {
        height: 20px;
        margin-left: 5px;
    }

/* Responsive: stack items on narrow screens */
@media (max-width: 576px) {
    .editShipGroupForm .shipping-options li {
        flex: 1 1 100%;
        max-width: 100%;
    }
}

.gray-borders-cards {
    border-style: solid;
    border-width: thin;
    border-color: lightgray;
    border-radius: 5px;
}

.btn-secondary-shipgroups {
    background-color: #6c757d; /* default Bootstrap secondary gray */
    color: #fff;
    border: 1px solid #6c757d;
}

    .btn-secondary-shipgroups:hover {
        background-color: #5a6268;
        border-color: #545b62;
        color: #fff;
    }

.modal-loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.4); /* translucent white */
    z-index: 999999; /* above all modal content */
    display: none;
    cursor: wait;
}

@media (max-width: 768px) {
    #editShipGroupForm .cc-dropdown {
        display: block;
        width: 100%;
    }

    #editShipGroupForm #checkout-cc-select {
        position: static !important;
        width: 100% !important;
        margin-top: 0.5rem;
        display: block;
    }

    #editShipGroupForm .cc-toggle {
        width: 100%;
        display: block;
    }

    #editShipGroupForm .shipping-options {
        display: block;
        width: 100%;
    }

        #editShipGroupForm .shipping-options li {
            display: flex;
            align-items: flex-start;
            padding: 10px;
            gap: 10px;
            width: 100%;
            margin-bottom: 10px;
        }

            #editShipGroupForm .shipping-options li input[type="radio"] {
                margin-top: 5px;
                flex-shrink: 0;
            }

            #editShipGroupForm .shipping-options li label {
                flex: 1;
                line-height: 1.4;
                cursor: pointer;
                display: block;
            }
}

.filter-box {
    border: 1px solid #ddd;
    border-radius: 10px;
    background-color: #f9f9f9;
}

.btn.order-edit-toggle-active {
    background-color: #0056b3 !important;
    color: white !important;
    border: 1px solid #0056b3 !important;
    border-radius: 3px !important;
}

.btn.order-edit-toggle-inactive {
    background-color: white !important;
    color: #0056b3 !important;
    border: 1px solid #0056b3 !important;
    border-radius: 3px !important;
}

    .btn.order-edit-toggle-inactive:hover {
        background-color: #e9f1ff !important;
    }

.shipgroup-tooltip {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 5px;
    padding-top: 2px;
}

    .shipgroup-tooltip i {
        font-size: 1.5rem; /* adjust size */
        color: #6c757d; /* muted */
        line-height: 1;
        cursor: help;
    }

td.border-end {
    border-right: 1px solid #bbb !important; /* Matches Bootstrap's default */
    text-align: center;
    font-weight: 700;
}

.order-index-column {
    width: 80px; /* or 70px, test as needed */
    min-width: 70px;
    max-width: 80px;
    text-align: center;
    font-weight: 700;
}

.order-index-header {
    background-color: #d6d8db !important; /* darker than #e9ecef */
}

.order-index-cell {
    background-color: #e2e3e5 !important; /* darker than #f8f9fa */
}

    .order-index-cell:hover {
        background-color: #dce0e3 !important;
    }
}

.msrp_price {
    text-decoration: line-through;
    margin-bottom:0px;
}

.tier_price {
    color: #0657A8;
    font-size: 15px;
    margin-bottom: 0px !important;
}

.apparel-discount {
    background-color: #f2505b;
    font-size: 10px;
    font-style: italic;
    margin-bottom: 0px;
}

.login-warning {
    font-size: 16px;
    margin-bottom: 0px;
    margin-top: 10px;
}

.lock-format {
    color: #0657A8;
    font-size: 48px;
}

.ship-msg-bottom {
    background-color: #e6f4ea;
    border: 1px solid #b0e4c0;
    color: #1b6e38;
    font-weight: 600;
    border-radius: 5px;
    font-size: 15px;
    text-align: center;
    font-family: Cabin;
}

.login-cell {
    color: #0657A8;
    font-size: 20px;
    font-weight: 700 !important;
    font-family: Cabin;
}

.login-cell-detail {
    font-size: 14px;
    max-width: 360px;
    font-family: Cabin;
}

.ship-method-value {
    font-weight:550;
}

.resend-btn {
    background-color: white;
    color: #0657A8;
    border-width: 1px;
    border-style: solid;
    border-color: #0657A8;
}

    .resend-btn:hover {
        background-color: white;
        color: #0657A8;
        border-width: 1px;
        border-style: solid;
        border-color: #0657A8;
    }

/* Keep Font Awesome spinners spinning even on disabled buttons */
button[disabled] .fa-spin,
button[disabled] svg.fa-spin,
.register-button[disabled] .fa-spin,
.register-button[disabled] svg.fa-spin {
    animation: fa-spin 2s linear infinite !important;
}