/* #region Root Variables/Styles */
:root {
    --primary-color: #c7141e;
    --secondary-color: #00376d;
    --tertiary-color: #2e9cca;
    --quaternary-color: #238823;
    --dark-grey1: #333;
    --dark-grey2: #444;
}
 
* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

img {
  max-width: 100%;
  height: auto;
}

body {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 0.833rem;
    width: unset !important;
    background: var(--dark-grey2);
}
/* #endregion */

/* #region Universal Styles */
#maincontent {
    max-width: 1200px;
    padding: 0 .5rem;
}

.headercontent {
    width: 100%;
}

.centered {
    margin: auto;
}

h1 {
    font-size: 1.2rem !important;
    margin-bottom: 1rem;
    color: var(--tertiary-color);
}

h2 {
    font-size: 1rem !important;
    margin: 0.5rem 0;
    text-align: center;
}

h3 {
    font-size: .95rem !important;
    margin-bottom: 1rem;
    text-align: center;
    color: var(--tertiary-color);
}

.pcfooter h4 b a {
    color: var(--primary-color);
}

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.flex-wrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.flex-row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.flex-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.flex-full {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
}

.flex-half {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
}

.flex-one-third {
    -ms-flex-preferred-size: 33%;
    flex-basis: 33%;
}

.flex-two-third {
    -ms-flex-preferred-size: 67%;
    flex-basis: 67%;
}

.flex-one-fourth {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
}

.flex-three-fourth {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
}

.flex-5 {
    -ms-flex-preferred-size: 5%;
    flex-basis: 5%;
}

.flex-10 {
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
}

.flex-15 {
    -ms-flex-preferred-size: 15%;
    flex-basis: 15%;
}

.flex-20 {
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
}

.flex-25 {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
}

.flex-30 {
    -ms-flex-preferred-size: 30%;
    flex-basis: 30%;
}

.flex-35 {
    -ms-flex-preferred-size: 35%;
    flex-basis: 35%;
}

.flex-40 {
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%;
}

.flex-45 {
    -ms-flex-preferred-size: 45%;
    flex-basis: 45%;
}

.flex-50 {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
}

.flex-55 {
    -ms-flex-preferred-size: 55%;
    flex-basis: 55%;
}

.flex-60 {
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%;
}

.flex-65 {
    -ms-flex-preferred-size: 65%;
    flex-basis: 65%;
}

.flex-70 {
    -ms-flex-preferred-size: 70%;
    flex-basis: 70%;
}

.flex-75 {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
}

.flex-80 {
    -ms-flex-preferred-size: 80%;
    flex-basis: 80%;
}

.flex-85 {
    -ms-flex-preferred-size: 85%;
    flex-basis: 85%;
}

.flex-90 {
    -ms-flex-preferred-size: 90%;
    flex-basis: 90%;
}

.flex-95 {
    -ms-flex-preferred-size: 95%;
    flex-basis: 95%;
}

.flex-100 {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
}


.justify-evenly {
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
}

.justify-around {
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.justify-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.justify-start {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.align-evenly {
    -webkit-box-align: space-evenly;
    -ms-flex-align: space-evenly;
    align-items: space-evenly;
}

.align-around {
    -webkit-box-align: space-around;
    -ms-flex-align: space-around;
    align-items: space-around;
}

.align-between {
    -webkit-box-align: space-between;
    -ms-flex-align: space-between;
    align-items: space-between;
}

.align-start {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.align-end {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.align-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.grid {
    display: -ms-grid;
    display: grid;
}

.text-centered {
    text-align: center;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

.text-bold {
    font-weight: bold;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.float-clear {
    clear: both;
}

.mb-quarter {
    margin-bottom: 0.25rem;
}

.mb-half {
    margin-bottom: 0.5rem;
}

.mb-three-quarter {
    margin-bottom: 0.75rem;
}

.mb-1 {
    margin-bottom: 1rem;
}

.mb-2 {
    margin-bottom: 2rem;
}

.mb-3 {
    margin-bottom: 3rem;
}

.row {
    width: 100%;
}

.bgwhite {
    background: #fff;
}

.bggrey {
    background: var(--dark-grey1);
}

.bgred {
    background: var(--primary-color);
}

.bgblue {
    background: var(--secondary-color);
}

.text-white {
    color: #fff;
}

.text-grey {
    color: var(--dark-grey1);
}

.text-red {
    color: #c7141e;
}

.text-blue {
    color: var(--secondary-color);
}

.text-light-blue {
    color: var(--tertiary-color);
}

.btnSpace { margin: 3px }


.btnColor1,
.btnColor2,
.btnColor3,
.btnColor4,
.btnColor5 {
    color: #fff;
    font-weight: bold;
    padding: 0.25rem 0.5rem;
    border-radius: 25px;
}

.btnColor1 {
    background: var(--secondary-color);
    border: 2px solid var(--secondary-color);
}

.btnColor1:hover {
    color: var(--secondary-color);
    background: #fff;
}

.btnColor2 {
    background: var(--primary-color);
    border: 2px solid var(--primary-color);
}

.btnColor2:hover {
    color: var(--primary-color);
    background: #fff;
}

.btnColor3 {
    background: var(--tertiary-color);
    border: 2px solid var(--tertiary-color);
}

.btnColor3:hover {
    color: var(--tertiary-color);
    background: #fff;
}

.btnColor4 {
    background: var(--quaternary-color);
    border: 2px solid var(--quaternary-color);
}

.btnColor4:hover {
    color: var(--quaternary-color);
    background: #fff;
}

.btnColor5 {
    background: var(--dark-grey2);
    border: 2px solid var(--dark-grey2);
}

.btnColor5:hover {
    color: var(--dark-grey2);
    background: #fff;
}

a {
    text-decoration: none;
    font-weight: bold;
    color: unset;
}

p {
    font-size: 0.95rem;
    margin: 0.5rem 0;
    line-height: 1.5;
}

p a {
    color: var(--tertiary-color) !important;
}

input {
    cursor: pointer;
}

.green {
    color: #18a011;
    font-size: 1.1rem;
}
/* #endregion */

/* #region Header */
#header-top-row {
    padding: 0.5rem;
}

.search-form {
    margin-top: .25rem;
}

.search-box {
    height: 30px;
    border-radius: 20px 0 0 20px;
    border: 2px solid var(--dark-grey2);
    width: 100%;
    min-width: 100px;
    padding: 0 .5rem;
}

.search-btn {
    height: 30px;
    padding: 0 .5rem;
    font-size: 1rem;
    font-weight: 700;
    background: 0 0;
    border-radius: 0 20px 20px 0;
    margin-right: 0;
    border: 2px solid var(--dark-grey2);
    border-left: none;
}

.search-btn:hover {
    background: var(--primary-color);
    color: #fff;
}

#mobile-search {
    display: none;
}

#header_mycart,
#header_profile,
#header_logout,
#header_login {
    font-size: 0.8rem !important;
}

#menu-items {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    margin: 0 0 1rem 0;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.menulinks {
    padding: 0.25rem;
    font-size: 0.75rem;
    height: auto;
    color: #fff;
    background: var(--secondary-color);
    width: 100%;
    margin: 0 0.1rem;
}

.menulinks:hover {
    text-decoration: none !important;
}

.menulinks-grey:hover {
    background: var(--primary-color);
}

.menulinksHide {
    display: none;
}

.clearance:hover {
    font-size: 0.85rem;
}

.mobile-financing,
.mobile-price-request {
    display: none;
}
/* #endregion */

/* #region Body Fixes */
#page-content {
    width: 100%;
}

.nav {
    width: inherit;
}

.brandgrid {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    height: unset !important;
}

.branditem {
    width: unset !important;
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    margin-bottom: 1rem;
    height: auto !important;
}

.brandimage img {
    padding: 0 !important;
    height: auto !important;
    width: 100% !important;
}

.brandimage a img {
    padding: 0 !important;
    height: auto !important;
    width: 100% !important;
}

.brandtext a {
    color: unset !important;
    font-size: 0.9rem;
}

.productgrid {
    height: auto !important;
}

.overlayprice,
.overlayright {
    bottom: 144px !important;
}
/* #endregion */

/* #region Category Pages */
.menu_title,
.menu_item {
    width: 149px;
    padding: 0;
    text-decoration: none;
}

.menu_title {
    background: rgb(200, 200, 200);
    color: var(--secondary-color);
    text-align: center;
    font-weight: bold;
    font-size: 0.75rem;
    padding: 0.2rem 0;
}

.menu_item,
.menu_macrocategory {
    text-align: left !important;
    background: rgb(236, 236, 236);
    font-weight: 500 !important;
    padding: 0.2rem 0 !important;
    width: unset !important;
    font-family: unset !important;
}

.menu_item>a,
.menu_macrocategory>a {
    font-weight: 500;
    font-size: 0.8rem !important;
    font-family: Verdana;
    Color: var(--secondary-color);
    text-decoration: none;
}

.menu_item>a:hover,
.menu_macrocategory>a:hover {
    text-decoration: underline;
}

.catlabel>a>img {
    height: auto !important;
}
/* #endregion */

/* #region Item Pages */
#product-data {
    font-size: 0.9rem;
}

#priceDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#priceRequest input,
.reqPriceBtn {
    border: none;
    background: var(--primary-color);
    height: 30px;
    min-width: 205px;
    color: #fff;
    font-weight: bold;
    font-size: 1.1rem;
    border-radius: 50px;
}

#priceRequest input:hover,
.reqPriceBtn:hover {
    border: 2px solid var(--primary-color);
    color: var(--primary-color);
    background: #fff;
}

.reqSampleBtn {
    margin: 0.5rem 0;
    border: none;
    background: var(--secondary-color);
    height: 30px;
    width: 205px;
    color: #fff;
    font-weight: bold;
    font-size: 1.1rem;
    border-radius: 50px;
}

.reqSampleBtn:hover {
    border: 2px solid var(--secondary-color);
    color: var(--secondary-color);
    background: #fff;
}

#product-data>div {
    margin-bottom: 0.25rem;
}

#product-image {
    max-width: 600px;
    height: auto;
}

#product-images-column {
    padding-right: 1rem;
}

#cTopText:empty,
#cTopImage:empty {
    display: none;
}

#salesman-helper>table {
    width: 100%;
    margin: 0.5rem 0;
    border: 1px solid #000;
}

#accessories-list hr {
    margin: 0.5rem 0;
}

.accessory-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.accessory-flex-pricing {
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
}

.accessory-flex-img {
    -ms-flex-preferred-size: 15%;
    flex-basis: 15%;
}

.accessory-flex-description {
    -ms-flex-preferred-size: 55%;
    flex-basis: 55%;
}

#color-swatches a {
    margin: 0.25rem;
}
/* #endregion */

/* #region Non-Roll Calc Table */
#nonRollTable {
    padding: 1rem 1rem 0.25rem 1rem;
    background: #e9e9e9;
    border-radius: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

input[name=warning] {
    display: none;
    background: rgba(255, 0, 0, 0.3);
    font-weight: bold;
    border: 1px solid rgba(255, 0, 0, 0.5);
    padding: 1rem;
    border-radius: 15px;
    margin: unset !important;
}

.calc-input-non-roll {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: bold;
}

.calc-input-non-roll input[type="number"] {
    width: 70px;
}

.priceNoShow {
    -ms-flex-preferred-size: 33.333% !important;
    flex-basis: 33.333% !important;
}

.calc-input-non-roll div {
    font-size: 0.75rem;
}

.calc-non-roll-title {
    -ms-flex-preferred-size: 100% !important;
    flex-basis: 100% !important;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    font-size: 0.75rem;
    border-bottom: 1px solid var(--dark-grey1);
    padding-bottom: 0.5rem;
    color: var(--secondary-color);
    font-weight: bold;
}

.calc-input-non-roll div {
    margin: 0.25rem 0;
}

.cartAddBtn input {
    color: #fff;
    background: var(--primary-color);
    border: none;
    padding: 0.5rem 0.75rem;
    border-radius: 50px;
    font-weight: bold;
}

.cartTotal div {
    color: var(--secondary-color);
    font-weight: bold;
}

#itemtot {
    color: unset;
    width: 100%;
    text-align: center;
    font-size: 0.9rem;
}
/* #endregion */

/* #region Roll Calc Table */
#rollItems div {
    padding: 0.25rem;
    text-align: center !important;
}

.checkedForCart {
    background: rgba(50, 50, 50, 0.15);
    border-radius: 15px;
    font-weight: bold;
}

#rollItems input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

#accessories-list .flex-full.float-right input[name='btnSubmit'] {
    display: none;
}
/* #endregion */

/* #region Shopping Cart */
#couponcode:valid+#addc {
    display: inline-block;
}

#couponcode:invalid+#addc {
    display: none;
}
/* #endregion */

/* #region Media Queries */
@media screen and (max-width:1000px) {
    .branditem {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
    }
}

@media screen and (min-width:640px) and (max-width:1050px) {
    #priceDiv {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .calc-input-non-roll {
        -ms-flex-preferred-size: 33.333%;
        flex-basis: 33.333%;
    }

    .priceNoShow {
        -ms-flex-preferred-size: 50% !important;
        flex-basis: 50% !important;
    }

    .cartAddBtn {
        -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        margin-top: 0.5rem;
    }
}

@media screen and (max-width:800px) {
    .branditem {
        -ms-flex-preferred-size: 33%;
        flex-basis: 33%;
    }
}

@media screen and (max-width:750px) {
    #header-top-row {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 0.5rem 0 0 0;
    }

    .search-hide {
        display: none;
    }

    #header-top-row>div {
        margin-bottom: 1rem;
    }

    #mobile-search {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #profile-container {
        max-width: 500px;
        margin-bottom: unset !important;
    }

    #profile-container>div {
        margin-bottom: 0.25rem;
    }

    #userbox {
        width: 315px !important;
    }

    #menu-label {
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        max-width: 315px;
        margin: auto;
        cursor: pointer;
        margin-bottom: 1rem;
    }

    .menu-btn {
        padding: 0.5rem 2rem;
        height: 46px;
        width: 100%;
        margin: -0.25rem 0 1rem 0;
    }

    #menu-items {
        display: none;
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    #menu-hide {
        display: none;
    }

    .menulinks {
        font-size: 0.9rem;
        background: unset;
        color: var(--dark-grey1);
        border: 1px var(--dark-grey1) solid;
        padding: 0.5rem 0.25rem;
        margin-bottom: 0.5rem;
        max-width: 315px;
    }

    .menulinks:hover {
        color: #fff;
        background: var(--secondary-color);
    }

    .menulinksHide {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .clearance {
        margin-left: unset !important;
        color: #fff !important;
    }

    .clearance:hover {
        font-size: initial;
    }
}

@media screen and (max-width:640px) {
    #maincontent {
        padding: 0 !important;
    }

    #search-image {
        display: none;
    }

    .overlayright {
        left: 125px !important;
    }

    #product-images-column {
        padding-right: unset;
    }

    .mobile-financing,
    .mobile-price-request {
        display: block;
        margin: auto;
        max-width: 315px;
        margin-bottom: 0.25rem;
    }

    #menu-label {
        margin-bottom: unset !important;
    }
}

@media screen and (max-width:550px) {
    .branditem {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    }

    .productitem img {
        height: 140px !important;
        width: 140px !important;
    }

    .overlayprice,
    .overlayright {
        bottom: 124px !important;
    }

    .overlayright {
        left: 105px !important;
    }

    .accessory-flex-pricing,
    .accessory-flex-img {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    }

    .accessory-flex-description {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        margin-top: 1rem;
    }

    #priceDiv {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .calc-input-non-roll {
        -ms-flex-preferred-size: 33.333%;
        flex-basis: 33.333%;
    }

    .priceNoShow {
        -ms-flex-preferred-size: 50% !important;
        flex-basis: 50% !important;
    }

    .cartAddBtn {
        -webkit-box-ordinal-group: 5;
        -ms-flex-order: 4;
        order: 4;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        margin-top: 0.5rem;
    }
}

@media screen and (max-width:350px) {
    #maincontent {
        padding: 0;
    }

    .productitem img {
        height: 125px !important;
        width: 125px !important;
    }

    .overlayprice,
    .overlayright {
        bottom: 109px !important;
    }

    .overlayright {
        left: 90px !important;
    }
}
/* #endregion */