/* 	===========================================================
	DOCUMENT INFORMATION:
	- Cardinal Build In B2B Template - CSS 7/10/2023
	- Custom Homepage
	- Version: 1
	- Client: Cardinal Health
	- Author: Debbie Holcomb

	- Brand Colors: #E4002B, #000000, #ffffff
	- Fonts: Myriad Pro Light
	===========================================================
*/
/* ================================================================ 
	SPECIAL COMMANDS - ENTIRE SITE
   ================================================================ */
/this set a blank canvas wiht padding & margins*/
    * {
      padding: 0;
      margin: 0;
      box-sizing: border-box; }

/*these are wrapped in an anchor >THIS TARGETS ONLY THE HEIGHT OF THE TABLE TENT BOPIS & DELIVERY+ BOPIS - DOWNSIZES FOR A MORE PRESENTABLE VIEW*/
    td a:nth-child(1) img{HEIGHT: 150PX;}

/*these are NOT wrapped in an anchor >THIS TARGETS ONLY THE HEIGHT OF THE products that land within the SAVED CART- DOWNSIZES FOR A MORE PRESENTABLE VIEW*/
    td img:nth-child(1){HEIGHT:150PX;}

/*This is for all H2*/
    h2 {
        line height: 0.9rem; 
        letter spacing: 0.1rem; 
        font-weight: normal;
        font-family: system-ui; }

/*ADDS HOVER*/
.addToBasket:hover, .saveChanges:hover, .printItem:hover, .emailItem:hover, #UploadButtonArea, .pageListPageItem.is-active:hover, .product-grid .productlistaddtocartbutton:hover {
    background-color: #AF0322 !important;
    cursor: pointer;
}
input[type="submit"]:hover {
    background-color: #af0322 !important;
}

/* ================================================================ 
	LOGIN PAGE
   ================================================================ */
/*LOGIN PAGE this controls the forgotten password on login, controls text width & padding*/
    .password-recovery-page {
        width: 40%;
        padding-left: 10px; }

/*LOGIN PAGE this controls the font color caps, size padding, border , margins, letterspace & float position*/
    .returning-wrapper .login-title {
        color: #000;
        text-transform: capitalize;
        font-weight: normal!important;
        font-size: 24px;
        padding-bottom: 1px;
        border-bottom: solid 1px #E4002B;
        margin-bottom: 30px;
        float: revert;
        letter-spacing: 1px;
        padding-top:  105px; }

/*LOGIN PAGE this gives the login page button a hover*/
    .returning-wrapper .login-block .loginbutton:hover {
        background-color: #af0322;
        color: #fff; }

/*LOGIN PAGE this makes the position for the keep me logged in checkbox & text*/
    .returning-wrapper .table-container #RememberMe {
        display: block;
        margin-left: 10px;
        margin-bottom: -2px; }

/*LOGIN PAGE this controls the labels on login page, lowers the boldness username & password*/
    label, legend {
        font-weight: 400; }

/*LOGIN PAGE this controls the the text next to the checkbox, this aligns both horizonially*/
    .returning-wrapper .table-container #RememberMe ~ label {
        float: right;
        text-align: right;
        width: 100%;
        display: block;
        font-size: 14px;
        margin-top: -15px; }

/*LOGIN PAGE this controls the hidden checkbox & forces it to NOT display*/
    .returning-wrapper .table-container input#RememberMe:checked ~ label:before {
        display:none!important;
}
/*LOGIN PAGE this controls the margin top of the text forgotten password? and forces it up to fit better*/
    .returning-wrapper .table-container .forgot-password {
        margin-top: -5px; }

/*LOGIN PAGE this controls the width of the registration form*/
.register-customer-wrapper.grid_6 {
    width: 675px;
}


/*LOGIN PAGE this controls the label for the SAP # the customer needs to input*/
label[for=Custom2]{
    color: red;
    font-weight: 600;
}

/* ================================================================ 
	HOMEPAGE custom codes
   ================================================================ */
/*HOME PAGE - this control is for after the BIG PICTURE for custom Homepage Image*/
    .cardinalBrandLayout:after {
      content: "";
      display: table;
      clear: both; }

/*HOME PAGE - this controls the BIG PICTURE for custom Homepage Image padding*/
    .cardinalBrandLayout {
        padding-top: 465px;
        /*padding-bottom: 20px;*/ }

/*HOMEPAGE this hides the bestseller title on homepage*/
    .bestsellers h3, .featuredproducts h3 {
        float: right;
        letter-spacing: .5rem;
        margin-right: 50px; }

/* ================================================================ 
	BANNERS - custom codes
   ================================================================ */
/*BANNERS this controls the cookie banner if it is on throughout the website*/
    .cookiebanner__accept {
        background-color: #e4002B !important; }

/*BANNERS this controls the cookie banner it is hidden throughout the website*/
    .cookiebanner__closeicon {
        visibility: hidden; }

/*BANNERS this controls the banner - No Payment Due - this flows through website*/
    .header {
        width: 100%;
        text-align: left;
        background-color: #e4002b;
        color: #fff;
        padding-left: 10px; }

/* ================================================================
	header / nav
   ================================================================ */

/*HEADER/NAV this controls the line-height for the account links in header/nav-bar*/
    .header-links-wrapper {
        line-height: normal; }

/*HEADER/NAV this controls the boldness for product text on header/nav-bar*/
    h1.productname.acentcolour {
        font-weight: normal; }

/*HEADER/NAV this removes text Product Description - unnecessary*/
    .fulldescriptionontop .fulldescriptionTitle {
        margin: 0;
        display: none; }

/*HEADER/NAV this give the header dropdown the width, color & padding needed to fit the length of product text*/
    ul.dropdown ul {
        width: 240px;
        color: #000;
        font-size: 11px;
        text-transform: none;
        background-color: #E4002B;
        padding-bottom: 10px; }

/* ================================================================
	footer
   ================================================================ */
/*FOOTER this moves the footer down for more room under the last products*/
.catfish-footer {
    margin-top: 50px; }

/* ================================================================ 
	FEATURED CATEGORIES
   ================================================================ */
/* HOMEPAGE / FEATURED CATEGORIES do not adjust this controls the FEATURED Category Titles*/
    .homeFeaturedCategoriesWrapper .listItem .product-title, .homeFeaturedProductsWrapper .listItem .product-title {
        border: none;
        position: relative !important;
        z-index: 2;
        bottom: 0px;
        padding: 6%;
        font-size: 26px !important;
        width: 70% !important;
        box-sizing: border-box;
        text-align: left !important;
        font-weight: 400;
        word-break: break-word;
        line-height: 20px; 
        line-height: normal !important; }

/* HOMEPAGE / FEATURED CATEGORIES do not adjust this control the size, position, border, width & height for each 3 FEATURED Categories*/
    .homeFeaturedCategoriesWrapper .listItem, .homeFeaturedProductsWrapper .listItem_1 {
        position: relative;
        border: solid 1px #eee;
        margin-left: 750px;
        height: 150px;
        padding-bottom: 0 !important;
        box-sizing: border-box;
        -webkit-transition: all .4s linear;
        -moz-transition: all .4s linear;
        -o-transition: all .4s linear;
        transition: all .4s linear;
        width: 450px; }

/*FEATURED CATEGORIES this controls the category titles*/
    .category-page-title, .navigationmenu h6, .page-title h1 {
        display: none;
        visibility: hidden; }

/*HOMEPAGE / FEATURED CATEGORIES this controls the position of the picture/image for the 3 FEATURED CATEGORIES */
    .homeFeaturedCategoriesWrapper .listItem .picture, .homeFeaturedProductsWrapper .listItem .picture {
        border: 0;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0;
        padding: 0;
        display: block;
        width: 25%;
        height: auto;
        margin-left: 310px; }


/*HOMEPAGE / FEATURED CATEGORIES this controls the picture image for the 3 FEATURED CATEGORIES size*/
    .homeFeaturedCategoriesWrapper .listItem .picture img, .homeFeaturedProductsWrapper .listItem .picture img {
        max-height: none;
        max-width: 100%;
        height: auto;
        width: auto;
        margin-left: auto;
        margin-right: auto;
        display: block;
        box-sizing: border-box;
        padding: 10%;
        opacity: 1;
        background: #fff;
        padding-top: 30px; }

/*FEATURED CATEGORIES this controls the short description for featured categories*/
    .category-short-description {
        margin-top: 110px;
        padding-left: 18px; }

/* ================================================================ 
	SUB-CATEGORIES
   ================================================================ */

/*SUB-CATEGORIES this sets the position, width, padding, height, margins, borders & border boxes for image*/
    .allProductsCategoriesWrapper .sub-category-grid .listWrapper .picture img {
        width: auto;
        display: block;
        max-width: 100%;
        max-height: none;
        padding: 10px;
        box-sizing: border-box;
        background: #fff;
        opacity: 1;
        border: none!important;
        height: auto;
        margin-left: auto;
        margin-right: auto;
        padding-top: 30px;
        padding-bottom: 30px; }

/*SUB-CATEGORIES this sets the position, width, padding, height, margins, borders & border boxes*/
    .allProductsCategoriesWrapper .sub-category-grid .listItem {
        margin: 0px;
        width: 25%;
        position: relative;
        height: 0px;
        box-sizing: border-box;
        padding-bottom: 25%;
        border: solid 1px #ccc;
        margin-left: -1px;
        margin-bottom: -1px; }

/*SUB-CATEGORIES this pushes the title down to not interfer with image & remain in border-box*/
    .sub-category-grid .listWrapper .item-box {
        height: 225px; }

/*SUB-CATEGORIES this controls the sub categories position, width, padding, font & color*/
.allProductsCategoriesWrapper .sub-category-grid .listWrapper .category-title {
        position: absolute;
        z-index: 2;
        width: 100%;
        box-sizing: border-box;
        padding: 6%;
        bottom: 0;
        margin: 0;
        font-size: 16px;
        line-height: 16px;
        text-align: center;
        color: #000000; }

/*SUB-CATEGORIES this controls the sub-category header and hides it*/
    .category-title__inner {
        visibility: hidden; }

/* ================================================================ 
	PRODUCTS PAGE
   ================================================================ */

/*PRODUCT GRID this hides the pricing on the product grid*/
    .alternate--prices {
        visibility: hidden; }

/*PRODUCT TAGS this applies the color of the front for product tag links*/
    .producttags-box .producttags-list .producttags-wrapper .producttag {
        color: #e4002b !important; }

/*PRODUCT TAGS this applies a hover on the product tag link*/
    .producttags-box:hover .producttags-list:hover .producttags-wrapper:hover .producttag:hover {
        color: #af0322 !important; }
/*PRODUCT TAGS this turns on the product tags to be visible*/
    .producttags-box {
        visibility: visible; }

/*PRODUCT GRID this applies a hover on the product title with customer brand*/
    .allProductsCategoriesWrapper .product-grid .listItem .product-title a:hover {
        color: #E4002B; }

/*PRODUCT GRID this removes the underline for the hyperlink - too crowded for titles*/
    a:hover {
        text-decoration: none; }

/*PRODUCT GRID this adds padding around the Product Title*/
    .allProductsCategoriesWrapper .product-grid .listItem .product-title {
        padding: 10%; }


/*PRODUCT PAGE this repositions the product name to the bottom of the block, aligns & center, adjusts line height*/
    .allProductsCategoriesWrapper .product-grid .listItem .product-title a {
        top: 55%;
        width: auto;
        box-sizing: border-box;
        text-align: center;
        font-weight: 400;
        letter-spacing: 0.1rem;
        line-height: 15px; }

/*PRODUCT PAGE this makes the title wrap, adds line-height & hides overflow*/
    .product-title {
        overflow:hidden;
        white-space: normal;
        text-overflow: ellipsis; }

/*ALL PRODUCTS GRID IMAGES this controls the position, width, height & top*/
    .product-grid .listItem .picture img {
        position: absolute; 
        -webkit-transform: translate(-50%,-50%);
        max-width: 90%!important;
        max-height: 90%!important;
        width: auto!important;
        height: auto!important;
        top: 101px; }

/* PRODUCT PAGE this controls the width of the textbox for Quantity */
    .addToCartQuantityBox {
        width: 80px !important; }

/* =======================================================================
   SPECIAL PRODUCT ADJUSTMENTS - LEADER>LEADER MARKETING ASSETS CATEGORIES
   ======================================================================= */
/*SPECIAL PRODUCT this removes the radio attribute button for blade signs ENG*/
    #product_attribute_v586_233_1339 {
        display: none; }

    #label_1339 {
        display: none; }

    #hook_1339 {
        padding-left: 5px; }

/*SPECIAL PRODUCT this removes the radio attribute button for blade signs SPANISH*/
    #product_attribute_v587_233_1340 {
        display: none; }

    #label_1340{
        display: none; }

    #hook_1340 {
        padding-left: 5px; }

/*SPECIAL PRODUCT this removes the radio attribute button for endcap wings ENG*/
    #product_attribute_v588_233_1341 {
        display: none; }

    #label_1341{
        display: none; }

    #hook_1341 {
        padding-left: 5px; }

/*SPECIAL PRODUCT this removes the radio attribute button for endcap wings SPANISH*/
    #product_attribute_v589_233_1342 {
        display: none; }

    #label_1342 {
        display: none; }

    #hook_1342 {
        padding-left: 5px; }    

/*SPECIAL PRODUCT this removes the radio attribute button for triangle shelf signs both versions*/
    #product_attribute_v594_233_1351 {
        display: none; }

    #label_1351 {
        display: none; }

    #hook_1351 {
        padding-left: 5px; }

/*SPECIAL PRODUCT this removes the attribute from the cart and displays none*/
    .cart-item-row .product .rawAttributeInfo {
        display: none; }

/* =======================================================================
      SPECIAL PRODUCT ADJUSTMENTS - LEADER>KITS VITAMINS CATEGORIES
   ======================================================================= */
/*SPECIAL PRODUCT this removes the radio attribute button for adult vitamins*/
    #product_attribute_v544_233_1274 {
        display: none; }

    #label_1274 {
        display: none; }

    #hook_1274 {
        padding-left: 5px; }

/*SPECIAL PRODUCT this removes the radio attribute button for kids vitamins*/
    #product_attribute_v545_233_1275 {
        display: none; }

    #label_1275 {
        display: none; }

    #hook_1275 {
        padding-left: 5px; }

/* =======================================================================
      SPECIAL PRODUCT ADJUSTMENTS - PMAC>BOPIS/DELIVERY CATEGORIES
   ======================================================================= */
/*SPECIAL PRODUCT this removes the radio attribute button for PMAC blade signs BOPIS*/
    #product_attribute_v519_233_1202 {
        display: none; }

    #label_1202 {
        display: none; }

    #hook_1202 {
        padding-left: 5px; }

/*SPECIAL PRODUCT this removes the radio attribute button for PMAC blade signs DELIVERY*/
    #product_attribute_v534_233_1255 {
        display: none; }

    #label_1255 {
        display: none; }

    #hook_1255 {
        padding-left: 5px; }

/* ================================================================ 
	INFIGO EDITOR
   ================================================================ */
/*INFIGO EDITOR this populates the editor instructions adds margin-bottom & position*/
    .instruction_panel {
        margin-bottom: 8px;
        display: block !important; }

/*INFIGO EDITOR this moves the color picker over too crowded*/
    .fontcolorselectorrow .datacolumn {
        padding-left: 25px; }

/*INFIGO EDITOR this sets the hover background to none*/
    .pageZoomButtons #btn_zoomin:hover, .pageZoomButtons #btn_zoomout:hover {
        background: none !important; }

/*INFIGO EDITOR this sets the background color & font fo th reset buttons*/
    .pageZoomReset button {
        background-color: #4a4a4a;
        color: #FFFFFF; }

/*INFIGO EDITOR this sets the background & font color of the reset button*/
    #btn_zoomtofit:hover {
        background-color: #E4002B;
        color: #FFFFFF; }

/*INFIGO EDITOR this sets the mouse cursor from a pointer to a grabby hand */
    #viewport1 {
        cursor: grab; }

/*INFIGO EDITOR this sets the position, background & font color & visible*/
    .updatePreview {
        display: inline-block !important;
        background-color: Orange;
        color: #000000;
        visibility: visible; }

/*INFIGO EDITOR this sets the hover on the download preview button*/
    .updatePreview:hover {
        background-color: #E4002b;
        color: #ffffff; }

/*INFIGO EDITOR this adds a hover over the add to cart button in editor*/
    #btn_addtobasket:hover {
        background-color: #af0322 !important;
        color: #ffffff !important; }

/*INFIGO EDITOR this turns off the save changes button in editor*/
    #btn_saveChanges {
        display: none !important; }

/*INFIGO EDITOR this controls the add to cart button, sets position background & font colors in editor*/
    #btn_addtobasket {
        display: inline-block !important;
        background-color: #e4002B !important;
        color: #fff !important; }

/* ================================================================ 
	preview dialog box
   ================================================================ */
/*PREVIEW DIALOG BOX this controls the background & front colors for the continue Editing button*/
    .previewDialog.previewDialogAddToBasket #btn-preview-continueEditing {
        color: white;
        background: #E4002B !important;
        padding: 0;
        border: 0; }

/*PREVIEW DIALOG BOX this controls the hover background & front colors for the continue Editing button*/
    .previewDialog.previewDialogAddToBasket #btn-preview-continueEditing:hover {
        color: white;
        background: #af0322 !important; }

/*PREVIEW DIALOG BOX this controls the hover background & front colors for the approve add to basket button*/
    .previewDialog.previewDialogAddToBasket #btn-preview-addToBasket:hover {
        color: white;
        background: #af0322 !important; }

/* ================================================================ 
	MY ACCOUNT PAGE
   ================================================================ */
/*MY ACCOUNT - ORDERS TAB this changes the buttons & the bar color to customer brand colors*/
    .orders_v2 .order_page_select_container .order_page_but {
        background-color: #E4002B;
        text-decoration: none;
        color: #fff; }

/*MY ACCOUNT - ORDERS TAB this changes the buttons & the bar color to customer brand colors on hover*/
    .orders_v2 .order_page_select_container .order_page_but:hover {
        background-color: #af0322;
        text-decoration: none;
        color: #fff; }

/*MY ACCOUNT this hides the category header with my account*/
    .account-page__myaccounttitletext {
        visibility: hidden; }


/*MY ACCOUNT - CUSTOMER INFO TAB this turns off borders, it provides margin & padding for grid 9 container*/
    .grid_9 .section-body, .grid_9 .section-body, .grid_9 .section-body, .grid_9 .section-body {
        padding: 10px 10px 60px;
        margin-bottom: 30px;
        border-bottom: none; }

/*MY ACCOUNT - CUSTOMER INFO TAB this controls the save button, floats to the right in this section*/
    #checkDepartmentChanged {
        float: right;
        width: 30%; }

/*MY ACCOUNT - CUSTOMER INFO TAB this controls the check-availability button, floats button to the right*/
    #check-availability-button {
        float: right;
        width: 50%; }

/*MY ACCOUNT - CUSTOMER INFO TAB this controls the TEXT response that populates when searching for a username*/
    #username-availabilty {
        font-weight: 600;
        font-size: 16px; }

/* ================================================================
	saved carts
   ================================================================ */

/*SAVED CART - this controls the background & font colors for the Re-Instate Button*/
    .catfish-classes .button {
       background-color: #E4002B;
       color: #FFFFFF; }

/*SAVED CART - this controls the background & font colors for the Delete Button*/
    .catfish-classes .button.is-danger {
       background-color: #E4002B;
       color: #FFFFFF; }

/* ================================================================
	faq page
   ================================================================ */
/******** FREQUENTLY ASKED QUESTIONS IMAGES ********/

    #forgottenPassword {
        width: 33%; }

    #reset {
        width: 66%; }

    #resetEmail {
        width: 33%; }

    #newPassword {
        width: 66%; }

    #placeOrder {
        width: 66%; }

    #addToCardNew {
        width: 66%; }

    #featuredCatPlaceOrder {
        width: 66%; }

    #featuredCatPlaceOrder1 {
        width: 66%; }

    #featuredCatPlaceOrder3 {
        width: 66%; }

    #designChooseQty {
        width: 66%; }

    #orderTheCart1 {
        width: 66%; }

    #shipInfoBillAdd {
        width: 66%; }

    #shipInfoDelAdd {
        width: 66%; }

    #shipInfoEnterStoreInfo {
        width: 66%; }

    #shipInfoNoEdit {
        width: 66%; }

    #shipInfoMethod {
        width: 66%; }

    #shipInfoPayMethod {
        width: 66%; }

    #shipInfoConfirm {
        width: 66%; }

    #designProduct1 {
        width:66%; }

    #designChooseQty {
        width:66%; }

    #designChooseQtyAddToCart {
        width:66%; }

    #designStart {
        width: 66%; }

    #clickTextboxField {
        width: 66%; }

    #designTextboxField {
        width: 66%; }

    #designUpdateDownloadPreview {
        width: 66%; }

    #designUpdatePreview {
        width: 66%; }

    #designOpenPreview {
        width: 66%; }

    #designAddToCart {
        width: 66%; }

    #designApprove {
        width: 66%; }

    #designProductInCart {
        width: 66%; }

    #digitalDownload1 {
        width: 66%; }

    #digitalDownload2 {
        width: 66%; }

    #digitalDownload3 {
        width: 66%; }

    #digitalDownload4 {
        width: 66%; }

    #digitalDownload5 {
        width: 66%; }   
 
    #digitalDownload6 {
        width: 66%; }

    #DelAndShipAddEditUpdate1 {
        width: 66%; }

    #DelAndShipAddEditUpdate2 {
        width: 66%; }

    #DelAndShipAddEditUpdate3 {
        width: 66%; }

    #DelAndShipAddEditUpdate4 {
        width: 66%; }

    #DelAndShipAddEditUpdate5 {
        width: 66%; }

    #DelAndShipAddEditUpdate6 {
        width: 66%; }

    #BillAndShipAddEditUpdate1 {
        width: 66%; }

    #BillAndShipAddEditUpdate2 {
        width: 66%; }

    #BillAndShipAddEditUpdate3 {
        width: 66%; }

    #BillAndShipAddEditUpdate4 {
        width: 66%; }

    #BillAndShipAddEditUpdate5 {
        width: 66%; }

    #BillAndShipAddEditUpdate6 {
        width: 66%; }


    #Q1:hover {
        background-color: #af0322 !important;
        color: white !important; }

    #Q2:hover {
        background-color: #af0322 !important;
        color: white !important; }

    #Q3:hover {
        background-color: #af0322 !important;
        color: white !important; }

    #Q4:hover {
        background-color: #af0322 !important;
        color: white !important; }

    #Q5:hover {
        background-color: #af0322 !important;
        color: white !important; }

    #Q6:hover {
        background-color: #af0322 !important;
        color: white !important; }

    #Q7:hover {
        background-color: #af0322 !important;
        color: white !important; }

    #Q8:hover {
        background-color: #af0322 !important;
        color: white !important; }

/* ================================================================
	contact us page
   ================================================================ */
/*CONTACT US this is the top banner*/
    .callout {
        background-color: #00aeff;
        padding: 20px; }

/*CONTACT US this controls display properties for the callout row for contact us page & customer banner*/
    .row .row {
        display: block; }

/*CONTACT US this controls the amount of padding between the text and map*/
    .text-center {
        padding-bottom: 25px; }

/*CONTACT US this moves the Pressworks logo over for a better center of image*/
    .press_logo {
         padding-right: 50px; }


/* ================================================================ 
	BILLING PAGE
   ================================================================ */
/*THIS MOVES THE ADDRESS BOOK HEADER DOWN OUT OF THE SEARCH ELEMENT & controls customer banner location*/

.column {
    padding-top: 0px;
}

.product--sku {
    white-space: nowrap;
}

/* ================================================================ 
	THE SHOPPING CART
   ================================================================ */

/*THE CART - This controls FONT COLOR for short description for digital download text to populate in cart */
    .summaryShortDescription {
        color: #E4002B; }

/*THE CART controls table data padding for better separation*/
    .cart-item-row td {
        vertical-align: middle;
        text-align: left; }

/*THE CART gives more height instead of scrunched, centers input*/
.cart-item-row input {
    height: initial!important;
    text-align: center; }

/*THE CART adds customer brand color, font, color & display button for better lineup with other buttons*/
    #btn_addtobasket {
        display: inline-block !important;
        background-color: #e4002B !important;
        color: #fff !important; }

/*THE CART this hides the save changes button - unnecessary*/
    #btn_saveChanges {
        display: none !important; }

/*THE CART this creates a hover effect for the button*/
    #btn_addtobasket:hover {
        background-color: #af0322 !important;
        color: #ffffff !important; }

/*THE CART this creates a hover effect for the buttons and elements*/
    .addToBasket:hover, .saveChanges:hover, .printItem:hover, .emailItem:hover, #UploadButtonArea, .pageListPageItem.is-active:hover, .product-grid .productlistaddtocartbutton:hover {
        background-color: #AF0322 !important;
        cursor: pointer; }

/*THE CART this creates a hover effect for the buttons and elements*/
    input[type="submit"]:hover {
        background-color: #af0322 !important; }

/*THE CART - this controls the text/number input for the qty box in cart*/
    .cart-item-row input[type="number"] {
        width: auto; }

/*THE CART this controls the product title in cart & breaks the word to wrap*/
    .is-word-break-all {
        word-break: break-word; }

/*THE CART this controls the product picture alignment within the cart*/
    .cart-item-row .productpicture {
        text-align: left; }

/*THE CART this controls the cart quantity box alignment*/
    .cart--quantity {
        text-align: center !important; }

/*THE CART this controls the textbox with and the font-size within textbox*/
    input[type="number"], input[type="text"], input[type="tel"], input[type="url"] {
        width: 100%;
        font-size: 14px !important; }

/*THE CART this turns on the order progress IN THE CART & throughout the website flow*/
    .order-progress grid_12 {
        display: block; }

/*THE CART this turns on the CLEAR CART button*/
    .deletecartbutton catfish-button {
        display: block; }

/*THE CART this moves the calculation/totals to right for better line up*/
    .cart_total_right {
        text-align: end; }

/*THE CART this pushes the Order Process/Boxing Fee to right align */
    .checkout-attributes {
        float: right !important; }

/* ================================================================ 
	DEALS Discount Coupon Code - Controls - CHECKOUT PAGE
   ================================================================ */
/*CHECKOUT PAGE - Deals --------------------------------*/
    .deals {
        margin-top: 0;
        margin-bottom: 10px;
        padding: 10px;
        float: right;
        padding-top: 12px;
        margin-right: 20px; }


/*CHECKOUT PAGE - Deals the controls the textbox width*/
    #discountcouponcode {
        width: 100% !important; }

/*CHECKOUT PAGE - Deals this controls the discount code container moves to right & margin top & bottom between textbox & button*/
    #applydiscountcouponcode {
        float: right;
        margin-top: 5px;
        margin-bottom: 5px; }

/*CHECKOUT PAGE this controls the font weight, makes it bolder*/
    .success-box notification is-success {
        font-weight: 600; }

/*CHECKOUT PAGE this changes the shape of the remove button for coupon code*/
    #removesubtotaldiscount {
        border-radius: 100px; }

/* ================================================================ 
	CONFIRM ORDER - CHECKOUT PAGE
   ================================================================ */

/*THIS ADDS BRANDING COLOR TO TEXT ON ORDER STATUS PROCESSING SUMMARY THAT COMPLETES ORDER*/

.order-details-box b
{
    color: #E4002b;
}


/* ================================================================ 
	CODES BELOW ARE UN-USED BUT READY TO ENGAGE IF NEEDED
   ================================================================ */
/*FOR BANNER PAGE TITLE **NOT IN USE** CREATES A WELCOME BANNER WITH CUSTOMER NAME,
LOCATION OF WEBSITE AND BRAND COLOR BACKGROUND - location of code is HTMLBLOCK4 - the
layout has the HTMLBLOCK4 ALREADY INSERTED*/

/*#logorow .grid_12 .banner_page_title 
{
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #FFF;
    font-size: 35px;
    width: 561px;
    max-width: 65%;
    text-shadow: rgba(0,0,0,0.6) 1px 1px 4px;
}*/

/*IF PHOTO ALBUM IS ENGAGED, THIS REMOVES THE FACEBOOK BUTTON - NOT IN USE NOW*/

/*.facebookbutton.catfish-button 
{
    visibility: hidden !important;
}*/

/*IF PHOTO ALBUM IS ENGAGED, THIS CONTROL THE FILE UPLOAD BUTTON - NOT IN USE NOW*/

/*#file-upload-button {
    background-color: #ef0505;
    border: 0;
    border-radius: 0;
    display: inline-block!important;
    height: 33px;
    font-family: "Campton-SemiBold", sans-serif;
    font-size: 16px;
    line-height: 1.3em;
    margin: 5px auto 5px auto;
    padding: 7px 7px 7px 7px!important;
    color: #fff;
    webkit-border-radius: 0;
}*/

/*IF PHOTO ALBUM IS ENGAGED, THIS CONTROLS THE IMAGE SIZE - NOT IN USE NOW*/

/*.imageItem img{
    min-height: auto;
    min-width: auto;
}*/

/*IF PHOTO ALBUM IS ENGAGED, THIS CONTROLS THE CONTROLS - NOT IN USE NOW*/
/*.albumManagement, .uploadControl {
    padding: 1%;
    display: block;
    width: 100%;
    margin-left: 2PX;
}*/







/* ================================================================ 
	TESTING AREA ONLY - TEST TEST TEST
   ================================================================ */
/*********   TESTING TESTING   *********


label[for=Custom1]{
    visibility: hidden;
}
label[for=Custom2]{
    visibility: hidden;
}
label[for=Custom3]{
    visibility: hidden;
}
label[for=URL]{
    visibility: hidden;
}
#Custom1{
    visibility: hidden;
}
#Custom2{
    visibility: hidden;
}
#Custom3{
    visibility: hidden;
}

TESTING TESTING   **********/


/* ================================================================ 
	NEEDS COMMENTS AS TO WHAT CODES ARE DOING BELOW HERE
   ================================================================ */


/*this unhides to custom kit grouping section under kit product description*/

.catfish-classes .control, .vue-component-wrapper .control {
    clear: both;
    font-size: 1rem;
    position: relative;
    text-align: left;
    visibility: visible;
}

/******** UNSURE WHAT THESE ARE DOING RIGHT NOW - NEEDS CHECKED********/
/******** UNSURE WHAT THESE ARE DOING RIGHT NOW - NEEDS CHECKED********/
/******** UNSURE WHAT THESE ARE DOING RIGHT NOW - NEEDS CHECKED********/

.orders_v2 .order_products_list .order_prod_name {
    width: 60%;
    position: relative;
    float: left;
    text-align: left;
    line-height: 20px;
    margin-top: 10px;
    color: #E4002b;
    font-weight: 400;
}
/* @MEDIA only screen and (min-width: 1200ps) GRID 12 adjusted size for device and hides visibility */
@media only screen and (min-width: 1200px) {
    #editorTabControl .grid_12 {
    width: 1190px;
    visibility: hidden;
}}


.row, .clearfix {
    zoom:1;

.listItem grid_3 column is-6-mobile is-6-tablet is-3-widescreen item_1,
.listItem grid_3 column is-6-mobile is-6-tablet is-3-widescreen item_2,
.listItem grid_3 column is-6-mobile is-6-tablet is-3-widescreen item_3 {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 0;
}
.listItem grid_3 column is-6-mobile is-6-tablet is-3-widescreen item_1
{
    /*margin-top: -400px !important;*/

}

.listItem grid_3 column is-6-mobile is-6-tablet is-3-widescreen item_2 {
    /*margin-top: -179px !important;*/
}

.listItem grid_3 column is-6-mobile is-6-tablet is-3-widescreen item_1 {
  top: 20px;
  background: #6b9080;
}
.listItem grid_3 column is-6-mobile is-6-tablet is-3-widescreen item_2 {
  top: 80px;
  background: #eaf4f4;
}
.listItem grid_3 column is-6-mobile is-6-tablet is-3-widescreen item_3 {
  top: 140px;
  background: #cce3de;
}




#hardwareButton {
    letter-spacing: 0.12em;
    font-weight: 600;
}

.label[for=URL]{
    visibility: hidden;
}
.product-grid {
    padding-top:50px;
}

.selected-checkout-attributes {
    float: right;
}
/* removes background colors */
.button {
    visibility: visible;
    width: 0px;
    height: 0;
    border: none;
}
/* removes the remaining button visibility */
.catfish-classes .buttons.is-fullwidth .button {
    height: auto;
    width: 100%;
}

.orders_v2 .default {
    width: 100%;
}

/* not sure what this is controling*/
div.description {
    color: #E4002B;
}



/* ================================================================
	customer info
   ================================================================ */
/* ================================================================
	addresses
   ================================================================ */

/* ================================================================
	orders
   ================================================================ */
/* ================================================================
	downloadable products
   ================================================================ */
/* ================================================================
	change password
   ================================================================ */
/* ================================================================
	saved projects
   ================================================================ */

/* ================================================================ 
	CONTENT PAGES
   ================================================================ */

/* ================================================================
	help - terms page
   ================================================================ */
/* ================================================================
	help - privacy page
   ================================================================ */
/* ================================================================ 
	DELIVERY PAGE
   ================================================================ */

/* ================================================================ 
	DELIVERY METHOD PAGE
   ================================================================ */

/* ================================================================ 
	PAYMENT METHOD PAGE
   ================================================================ */



/* ================================================================ 
	CONFIRM ORDER - CHECKOUT PAGE
   ================================================================ */