/*individual pages */
.grayarea {
    background-color: #E7E7E8;
    padding: 10px;
    margin: 0px;
    margin-top: 0;
}


/* megamenu custom items */
.mcileft {
    float: left;
    width: 145px;
    height: 95px;
    background-size: contain;
    padding-bottom: 5px;
}
.mciright {
    float: left;
    width: 175px;
    padding-left: 10px;
    padding-bottom: 5px;
    display: table;
    height: 95px;
}
.mciright div {
    vertical-align: middle;
    display: table-cell;
}
.megamenu-digitalcatalog .mcileft {
    height: initial;
    text-align: center;
    padding-top: 7px;
    padding-bottom: 7px;
}
.megamenu-digitalcatalog .mcicontain {
    cursor: default;
}
.megamenu-digitalcatalog .mciright a {
    font-size: 15px;
}


.mcicontain {
    cursor: pointer;
}
.mcicontain:hover {
    background-color: #eee;
}

/* megamenu */
.megamenu {
    border: 2px solid black;
    background-color: white;
    padding: 0px;
    max-width: 800px;
    position: absolute;
    z-index: 29;
}
.megamenu-products .menucol {
    float: left;
    width: 25%;
    padding: 10px;
}
.megamenu-mfrs .menucol {
    float: left;
    width: 16.6%;
    padding: 5px;
}
.megamenu-custom-items .menucol {
    float: left;
    width: 50%;
    padding: 5px;
}

.menucol a {
    font-size: 13px;
    display: block;
    padding-bottom: 10px;
    color: black;
}
.megamenu-arrow {
    position: absolute;
    height: 20px;
    width: 30px;
    background-image: url(/images/mm-arrow.png);
    z-index: 35;

}

.megamenu-login {
    width: 300px;
}
.megamenu-tracking {
    width: 300px;
}
.megamenu-myaccount {
    width: 100%;
    max-width: none;
}

.megamenu .mmlabel {
    text-align: center;
    padding-top: 20px;
}
.megamenu .grayarea {
    background-color: #E7E7E8;
    padding: 10px;
    margin: 10px;
    padding-bottom: 5px;
}
.megamenu .mmheaderarea {
    background-color: #fff;
    padding: 10px;
    margin: 10px;
    padding-left: 0;
    margin-right: 0px;
    margin-top: 0;
    padding-top: 5px;
    padding-bottom: 0;
    margin-bottom: 0;
}

.megamenu input {
    width: 100%;
    margin-bottom: 10px;
    padding: 5px;
}
.megamenu .blackbutton {
    width: 100%;
    color: white;
    background-color: black;
    border: none;
    line-height: 18px;
    padding: 9px;
    cursor: pointer;
}

.megamenu .redbutton {
    width: 100%;
    color: white;
    background-color: red;
    border: none;
    line-height: 18px;
    padding: 9px;
    cursor: pointer;
}

.megamenu-login a {
    color: red;
}
.megamenu .grayarea p {
    padding-top: 10px;
    margin-bottom: 5px;
    line-height: 16px;
}
.megamenu-stays-open .closer, .gigamenu .closer {
    position: absolute;
    top: 5px;
    right: 5px;
    height: 20px;
    width: 20px;
    background-image: url(/images/Grey_close_x.png);
    background-position: center center;
    background-repeat: no-repeat;
    padding: 5px;
    cursor: pointer;
    color: #aaa;
}

.megamenu-rhsinfo .menucol {
    padding: 10px;
}


.gigamenu .closer {
    top: 14px;
    right: 15px;
    z-index: 50;
}

.topnav-isyellow {
    color: yellow !important;
}

/* popup - adjustment to Bootstrap4 modal component  */
#existingCustomerNeedsAccess h5 {
    font-size: 17px;
    text-align: center;
    display: block;
    width: 100%;
}
#existingCustomerNeedsAccess .redbutton {
    width: 50%;
    color: white;
    background-color: red;
    border: none;
    line-height: 18px;
    padding: 9px;
    cursor: pointer;
}

#existingCustomerNeedsAccess .grayarea {
    background-color: #E7E7E8;
    padding: 10px;
    margin: 10px;
    padding-bottom: 5px;
}

#existingCustomerNeedsAccess input {
    width: 100%;
    margin-bottom: 10px;
    padding: 5px;
}


#existingCustomerNeedsAccess .modal-footer {
    text-align: center;
    display: block;
}


.searchbox {
    background-color: #E6E7E8;
    border: 1px solid #3A3738;
}
.searchboxicon {
    border: 1px solid #3A3738;
    background-color: #E6E7E8; border-left: none;
}
.cartwidget {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 120px;
    height: 50px;
    cursor: pointer;
    color: black;
}
.cartwidget > div {
    position: absolute;
}
/*
.cartwidget > div:nth-of-type(1) {
    left: 0;
    top: 5px;
    width: 100%;
    height: 39%;
    text-align: center;
    font-size: 12px;
    line-height: 13px;
}
.cartwidget > div:nth-of-type(8) {

    right: 0;
    top: 5px;
    width: 40%;
    height: 70%;
}
.cartwidget > div:nth-of-type(2) {

    bottom: 0;
    left: 0;
    width: 100%;
    height: 30%;
    font-size: 11px;
    text-align: center;
    border-top: 1px solid gray;
}
*/

body {
    font-family: "Helvetica Neue", Arial, sans-serif;
}
.navrow {
    font-size: 0.7rem;
    background-color: black;
    min-height: 35px;
    color: white;
    border-bottom: 5px solid #E31F27;
}
.navrow a {
    color: white;
}
.headerrow {
    background-color: black;
    color: white;
    margin-top: 10px;
    margin-bottom: 2px;
    min-height: 30px;
    padding-left: 10px;
    font-weight: bold;
}
.item-carousel .arrow {
    height: 100%;
    width: 30px;
    position: absolute;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}
.item-carousel .leftarrow {
    left: 0;
    background-image: url(/images/leftchev.png);
    opacity: 0.6;
}
.item-carousel .leftarrow:hover, .item-carousel .rightarrow:hover {
    opacity: 1;
}

.item-carousel .rightarrow {
    right: 0;
    background-image: url(/images/rightchev.png);
    opacity: 0.6;
}

.item-carousel .centerholder {
    position: absolute;
    left: 34px;
    width: calc(100% - 68px);
    height: 100%;
    overflow: hidden;
}
.item-carousel .slide {

    height: 100%;
    display: none;
    /* carousel is shown after width is calculated */
    text-align: center;
}
.item-carousel .itemblock {
    border: 2px solid black;
    height: 100%;
    /*width: 3.2%; */
    /* width is calculated at runtime */
    /*float: left;*/
    display: inline-block;
    margin-left: 2px;
    margin-right: 2px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}
.item-carousel .itemblockhead {
    background-color: rgba(50,50,50,0.5);
    color: white;
    text-align: center;
    line-height: 35px;
    position: absolute;
    width: 100%;
}
.item-carousel .col {
    height: 300px;
}
.pnimage {
    position: absolute;
    top: 0;
    width: 100%;
    height: 200px;
}
.pndata {
    position: absolute;
    bottom: 0;
    width:100%;
    height:80px;
    text-align: center;
    font-size: 14px;
}
.pn {
    height: 300px;
}
.pn .red {
    color: red;
}
.pnimgbg {
    width: 80%; height: 80%; margin: 10%;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;

}

.col-hidden {
    display: none;
}

.footerblock {
    background-color: white;
    color: white;
    font-size: 14px;
    border-top: 2px solid black;
    color: #616161;
}
.footerblock a {
    color: #616161;
}
.footerblock .secondcol {
    border-left: 2px solid black;
    border-right: 2px solid black;
}


.megamenu-myaccount .account {
    width: 250px;
    height: 58px;
    float: left;
}
.accountopened {
    text-align: center;
    float: left;
    width: 100px;
    font-size: 12px;
    line-height: 12px;
    padding-top: 10px;
}
.picleft {
    float: left;
    width: 80px;
    text-align: center;
}
.pictext {
    float: left;
    display: table;
    height: 58px;
    /*width: 100%;*/
}
.pictext span {
    display: table-cell;
    vertical-align: middle;
    font-size: 11px;
}
.grayicons {
    width: calc(100% - 20px);
    background-color: #DCDDDE;
    height: 60px;
    margin: 10px;
    margin-top: 5px;
    border-top: 5px solid #dcddde;
    border-bottom: 5px solid #dcddde;
}
.grayicons.subcontent {
    margin-top: 0;
}
.sixpanel {
    width: 16.65%;
    float: left;
    text-align: center;
    height: 100%;
}
.whiteicon {
    width: 80%;
    margin: auto;
    background-color: white;
    height: 100%;
    cursor: pointer;
}
.whiteicon.active {
    background-color: #FFFCD6;
}
a.subcontenticon {
    display: block;
    color: black;
}
.subcontenticon {
    width: 80%;
    margin: auto;
    height: 100%;
}
.wileft {
    float: left;
    height: 50px;
}
.subcontenticon .wileft {
    width: auto;
}
.wiright {
    float: left;
    display: table;
    height: 50px;
    text-align: left;
}
.subcontenticon .wiright span {
    line-height: 10px;
}

.wiright span {
    display: table-cell;
    vertical-align: middle;
    font-size: 10px;
}
.aclarger {
    font-size: 15px;
}
.tabswitched-area {
    margin-top: 10px;
    min-height: 50px;
}
.tabheader {
    background-color: red;
    color: white;
    line-height: 19px;
    font-size: 15px;
    margin: 10px;
    padding-left: 10px;
    margin-bottom: 0;
}
.subcontenticon small {
    font-size: 10px;
}

#requestTradeWholesaleAccount {
}
.gigamenu {
    border: 2px solid black;
    background-color: white;
    padding: 12px;
    position: absolute;
    z-index: 30;

}
.gigamenu .blackcol, .blackcol {
    background-color: black;
    color: white;
    font-weight: bold;
}
.gigamenu .fullField {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}
.gigamenu .halfField {
    width: 50%;
    margin-top: 10px;
    margin-bottom: 10px;
}
.gigamenu .greyrow {
    background-color: #E7E7E8;
}
.gigamenu .label1 {
    padding-top: 10px;
    line-height: 15px;
    text-indent: -18px;
}
.breakrow {
    height: 20px;
}
.gigamenu .label2 {
    line-height: 20px;
    padding-top: 13px;
}

.gigamenu .requestButton {
    margin-top: 11px;
    color: white;
    background-color: red;
    border: none;
}

.gigamenu .greybg {
    background-color: #636466;
}

.header-mobile {
    max-height: 75px;
    background-color: #E31E27;
}
.header-mobile img {
    height: 100%;
    width: auto;
}
.mobile-subhead {
    color: #E31E27;
    font-weight: bold;
    font-family: "Arial Black", Arial;
}


.pageregion {
    padding-top: 10px;
    padding-bottom: 10px;
    min-height: 500px;
}

.megamenu-research {
    min-width: 400px;
}

/* boostrap md */
@media (max-width: 768px) {
    .custom-item-block {
        margin-top: 5px;
    }
    .item-carousel .itemblock {
        width: 4.7%;
    }
    .item-carousel .itemblockhead {
        font-size: 12px;
    }
    .item-carousel .col {
        height: 200px;
    }
}

.navrow {
    min-height: auto !important;
}

.navrow .col {
    height: 100%;
}

.navrow .col a {
    height: 35px;
    display: block;
    line-height: 35px;
}
.navrow .col a.topnav-research {
    /*line-height: 14px;*/
    /*padding-top: 4px;*/
}
.navrow .col a:hover {
    background-color: #6D6E70;
    text-decoration: none;
}

/* extend homepage to 100% width */
.container {
    max-width: 100% !important;
}

.addToCartLink {
    background-color: grey;
    display: block;
    text-align: center;
    color: white;
    padding: 6px 6px;
    font-weight: bold;
}

.addToCartLink:hover {
    color: white;
    background-color: #666;
    text-decoration: none;
}