.chizel-grid { display: flex; margin: 0; padding: 0; width: 100%; }

    .chizel-grid .details { width: 65%; }
        .chizel-grid .details h1,
        .chizel-grid .details h2,
        .chizel-grid .details h3,
        .chizel-grid .details h4,
        .chizel-grid .details h5,
        .chizel-grid .details h6,
        .chizel-grid .details p { margin: 0; padding: 0; line-height: normal; width: 100%; }

        .chizel-grid .details .price { padding: 0 0 20px; }

        .chizel-grid .details .description { padding: 20px 0; }

    .chizel-grid .special { display: flex; justify-content: space-between; }

        .chizel-grid .special .bulk-discounts { padding: 0 0 20px; width: 50%; }
            .chizel-grid .special .bulk-discounts p span { width: 50px; border-bottom: 1px dotted #333; display: inline-block; margin: 0 5px; }

        .chizel-grid .special .instructions { display: flex; flex-wrap: wrap; width: 50%; }
            .chizel-grid .special .instructions p { width: auto; margin-right: 10px; }
            .chizel-grid .special .instructions textarea { width: 98%; min-height: 75px; margin-top: 10px; }
            .chizel-grid .special .instructions div { width: 240px; display: flex; margin: 20px 0 0; }
                .chizel-grid .special .instructions div button { width: 150px; }




/* Catalog Image */
.catalog-image { padding: 0 0 0 50px; margin: 0; width: 35%; position: relative; }
    .catalog-image .catalogBgImage { background: transparent center center no-repeat; background-size: cover; width: 100%; }
        .catalog-image .catalogBgImage img { width: 100%; opacity: 0; visibility: hidden; margin: 0; padding: 0; }

    /*.productDetails .catalogProduct .imgDescription { width: 100%; }*/

    .catalog-image .alternativeImages { display: flex; justify-content: center; align-items: flex-end; flex-wrap: wrap; width: 100%; height: auto; margin-top: -35px; position: relative; z-index: 1; }

        .catalog-image .alternativeImages div { width: 50px; height: 50px; margin: 5px 0.5%; background: transparent center top no-repeat; background-size: cover; }
        .catalog-image .alternativeImages .imgDescription { display: none; }

        .catalog-image .alternativeImages .showDescription { width: 100%; }
            .catalog-image .alternativeImages .showDescription .imgDescription { display: block; }

        .catalog-image .alternativeImages .imgSwap { cursor: pointer; }
            .catalog-image .alternativeImages .imgSwap.active { border: 1px solid #000; }




.add-personality { display: flex; align-items: center; }
    .add-personality h2 { width: auto; }

    .add-personality label { display: flex; align-items: center; flex-wrap: wrap; margin: 0 0 0 30px; cursor: pointer; }
        .add-personality label input { display: none; }

        .add-personality label span:nth-of-type(1):before { content: ""; display: inline-block; width: 20px; height: 20px; border: 1px solid #000; border-radius: 5px; background-color: #fff; }
        .add-personality label input:checked + span:nth-of-type(1):before { background-color: #ccc; }

        .add-personality label span:nth-of-type(2) { display: flex; flex-wrap: wrap; padding: 0 10px; }
            .add-personality label span:nth-of-type(2) strong { width: 100%; align-items: center; }






.personality-examples { width: 100%; display: flex; }
    .personality-examples p { width: calc(100% - 400px); }

    .personality-examples ul { display: flex; width: 400px; list-style: none; margin: 0; padding: 0; }
        .personality-examples ul li { margin: 0; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; }
            .personality-examples ul li strong { width: 100%; text-align: center; }



.fa-question-circle { position: relative; display: flex; align-items: center; }
    .fa-question-circle:hover:after { content: ""; display: block; position: absolute; bottom: 30px; right: -102px; z-index: 1; width: 200px; height: 200px; border: 1px solid #000; border-radius: 10px; background: #fff center center no-repeat; background-size: cover; }

body { counter-reset: section; }

.personality-message { margin: 15px 0; padding: 15px 0; border-top: 1px solid #000; display: flex; justify-content: space-between; flex-wrap: wrap; }
    .personality-message p { margin: 0 0 5px; padding: 0; }

    .personality-message:last-of-type { border-bottom: 1px solid #000; }
    .personality-message div { padding-right: 50px; display: flex; flex-wrap: wrap; align-items: flex-start; }

        .personality-message div input { width: 100%; padding: 10px; }

        .personality-message div:nth-of-type(1) { width: 120px; padding: 0 20px 0 0; }

            .personality-message div:nth-of-type(1) p:after { counter-increment: section; content: " : " counter(section) ""; }


            .personality-message div:nth-of-type(1) input { width: 20px; height: 20px; }

            .personality-message div:nth-of-type(1) span { display: flex; align-items: center; }
                .personality-message div:nth-of-type(1) span:before { content: "Duplicate Previous"; font-size: 14px; opacity: 0.8; }
    .personality-message:nth-of-type(1) div span:before { content: "Use Same Info for All"; }

    .personality-message div:nth-of-type(2) { width: 300px; }
    .personality-message div:nth-of-type(3) { width: 100px; }
    .personality-message div:nth-of-type(4) { width: calc(100% - 550px); padding: 0; }


@media only screen and (max-width: 1024px) {
    .personality-message div:nth-of-type(4) { width: 100%; padding: 10px 0 0; }
}

@media only screen and (max-width: 768px) {
    .personality-message div:nth-of-type(1) { width: 49%; }
    .personality-message div:nth-of-type(2),
    .personality-message div:nth-of-type(3),
    .personality-message div:nth-of-type(4) { width: 49%; padding: 10px 0 0; }
}

@media only screen and (max-width: 650px) {
    .personality-message div:nth-of-type(1) { width: 100%; }
    .personality-message div:nth-of-type(2),
    .personality-message div:nth-of-type(3),
    .personality-message div:nth-of-type(4) { width: 100%; padding: 10px 0 0; }
}





/*.personality-message div span { display: flex; }
            .personality-message div span label,
            .personality-message div span input { padding: 0 5px; min-height: 41px; }

            .personality-message div span:nth-of-type(1) { width: 130px; }
                .personality-message div span:nth-of-type(1) label { display: flex; align-items: center; }
                    .personality-message div span:nth-of-type(1) label input { width: 40px; height: 30px; margin: 0 auto; padding: 0; }

                    .personality-message div span:nth-of-type(1) label:before { content: "Duplicate Previous"; }
    .personality-message:nth-of-type(1) div span:nth-of-type(1) label:before { content: "Use Same Info for All"; }

    .personality-message div span:nth-of-type(2) { width: 250px; }
        .personality-message div span:nth-of-type(2) input { width: 100%; }

    .personality-message div span:nth-of-type(3) { width: 100px; }
        .personality-message div span:nth-of-type(3) input { width: 100%; }

    .personality-message div span:nth-of-type(4) { width: 700px; }
        .personality-message div span:nth-of-type(4) input { width: 100%; }*/


/*@media only screen and (max-width: 1480px) {
    .personality-message div { flex-wrap: wrap; }

        .personality-message div span:nth-of-type(4) { width: 100%; }
}*/