.Site {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.Site2 {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.bodywrapper {
    flex: 1 0 auto;
}

.material-icons {
    vertical-align: middle;
}

/* =========================
   Footer base
   ========================= */

#footer {
    padding-top: 2rem;
    width: 100%;
    background: #282828;
    color: #fff;
    z-index: 25;
    flex-shrink: 0;
    -webkit-flex-shrink: 0;
    font-size: 0.875rem;
}

.footer {
    clear: both;
}

/* =========================
   Footer headings (Follow Us / Support)
   ========================= */

#footer .footer-heading,
#footer .footerNav-heading {
    display: block;
    margin: 0 0 .4rem 0;
    padding: 0;
    font-family: "orgonregular", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 22.4px;
    letter-spacing: 0.56px;
    color: #fff;
}

/* Uppercase for all footer nav/link text in those lists */

#footer .footerNav-heading,
#footer .footer-heading {
    text-transform: uppercase;
}

/* Exception: brand must keep its casing */

#footer .brand-name {
    text-transform: none;
}

/* Spacing under Follow Us only */

#footer h4.footer-heading {
    margin-bottom: 8px;
}

/* =========================
   Follow Us column
   ========================= */

#footer .footer-col--follow {
    margin-top: 0;
    padding-top: 0;
}

/* =========================
   Support / additional info column
   ========================= */

#footer .additionalinfo a {
    color: #999;
    font-family: "orgonlight", "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}

#footer .additionalinfo > ul,
#footer .additionalinfo .small-block-grid-2 {
    margin-top: 0;
}

#footer ul.footerNav {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.875rem;
}

/* =========================
   Social icons
   ========================= */

#footer .footer-social {
    list-style: none;
    margin: 0;
    padding: 2rem 0;
    display: flex;
    gap: 12px;
    align-items: center;
}

#footer .footer-social__link {
    width: 44px;
    height: 44px;
    border-radius: 3px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    text-decoration: none;
    transition: background-color 0.15s ease;
}

#footer .footer-social__link i {
    font-size: 22px;
    line-height: 1;
    color: #fff;
}

#footer .footer-social__link:hover {
    background-color: rgba(255, 255, 255, 0.12);
}

#footer .footer-social__link:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.6);
    outline-offset: 2px;
}

.reveal-modal-bg {
    position: fixed;
}

.modal-text p {
    font-size: 14px;
    line-height: 15px;
}

/* photoswipe customization */

/* =========================================================
   PhotoSwipe + mobile safety
   ========================================================= */

/* Hide mobile menu when PhotoSwipe is open */

/* Prevent horizontal scroll bleed (mobile zoom edge cases) */

html,
body {
    overflow-x: hidden;
}

/* Ensure PhotoSwipe never exceeds viewport width */

.pswp,
.pswp__scroll-wrap,
.pswp__container,
.pswp__item,
.pswp__zoom-wrap,
.pswp__ui {
    max-width: 100vw !important;
}

/* =========================================================
   Product gallery � hero
   ========================================================= */

.product-gallery__hero img {
    width: 100%;
    height: auto;
    display: block;
}

/* =========================================================
   Product gallery � thumbnails
   ========================================================= */

.product-gallery__thumbs {
    display: flex;
    gap: 10px;
    margin-top: 10px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.product-gallery__thumb {
    position: relative;
    flex: 0 0 auto;

    /* IMPORTANT: do not shrink */
    flex-shrink: 0;

    /* belt + suspenders */
    width: 160px;

    /* lock the slot */
    height: 160px;

    /* lock the slot */
    padding: 0;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border: 0;
    cursor: pointer;
}

.product-gallery__thumb img {
    width: 100%;
    height: 100%;
    display: block;
    -o-object-fit: contain;
       object-fit: contain;

    /* IMPORTANT: no cropping */
}

/* underline indicator */

.product-gallery__thumb::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -18px;
    width: 20%;
    height: 4px;
    background-color: #888;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.product-gallery__thumb.is-active::after {
    opacity: 1;
}

/* =========================================================
   Active thumbnail indicator (underline)
   ========================================================= */

.product-gallery__thumb::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -18px;

    /* spacing below thumbnail */
    width: 20%;
    height: 4px;
    background-color: #888;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.product-gallery__thumb.is-active::after {
    opacity: 1;
}

/* done in _reveal.scss.reveal-modal{position:fixed;}*/

.push {
    height: 76px;
}

/* #mgmenu1 {
       /* position: fixed;
        top: 0px;
       */

/*  -webkit-filter: drop-shadow(0 1px 3px rgba(0,0,0,0.6));
       -webkit-transform: translateZ(0);
        -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
        filter: drop-shadow(0 1px 3px rgba(0,0,0,0.6));
        }*/

.italic {
    font-style: italic;
}

.PN-EAN {
    /* margin-top: -20px;*/
    font-family: "myriad-pro",sans-serif;
    font-weight: 400;
    font-size: 0.7125rem;
    margin-bottom: 20px;
}

.PN,
.EAN {
    float: left;
    padding-right: 10px;
}

.PN-no,
.EAN-no {
    color: #888;
    padding-left: 2px;
}

.PN-EAN_2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.flex-left {
    display: flex;
    justify-content: flex-start;
}

.PN_2,
.EAN_2 {
    flex: 0;
    padding: 0 0.6rem;
}

.graphcaption p {
    line-height: 1em;
    font-family: "orgonextralight";
    margin-left: 40px;
}

div#main.container h3 {
    margin-top: 1.8em;
    margin-bottom: 1.6em;
}

.OCtoggle {
    margin-left: -20px;
}

ul.small-block-grid-6 {
    line-height: 0.1;
}

ul.small-block-grid-6.logoheader {
    line-height: 1.6;
}

ul.accordion {
    margin-left: 0px;
}

li.accordion-navigation {
    position: relative;
}

li.accordion-navigation a.toggle {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 10px;
    right: 10px;
    background: #888;
}

span.accordion-header-icon::before {
    position: absolute;
    font-family: FontAwesome;
    top: 0;
    left: 0;
    content: "\25AE";
    width: 30px;
    height: 30px;
}

.acc-head-icon::before {
    position: absolute;
    font-family: FontAwesome;
    font-size: 0.8em;
    top: 8px;
    right: 14px;
    content: "\f077";
    color: #282828;
    display: normal;
}

.accordion-icon:before {
    position: absolute;
    font-family: FontAwesome;
    font-size: 0.9em;
    top: 12px;
    right: 14px;
    content: "\f067";
    color: #888;
}

.active .accordion-icon:before {
    content: "\f068";
}

.accordion-navigation a:hover .accordion-icon::before {
    color: #000;
}

.external-link::before {
    font-family: FontAwesome;
    font-size: 1.4em;
    content: "\f14c";

    /*content: "\f08e";*/
    padding-right: 0.4em;
}

.download-link::before {
    font-family: FontAwesome;
    font-size: 1.4em;
    content: "\f019";

    /*content: "\f08e";*/
    padding-right: 0.4em;
}

p a {
    font-weight: 600;
}

#FiltersXfixed {
    position: fixed;
    top: 200px;
    left: auto;
    margin-left: -20px;
}

#effect-1 div.horizontalRule {
    clear: both;
    width: 100%;
    background-color: #d1d1d1;
    height: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#effect-1 li.divider {
    height: 1px;
    background: #d1d1d1;
    margin: 10px 0;
}

#main p a:hover {
    text-decoration: underline;
}

#full-width-slider {
    color: #000;
    width: 100% !important;
    bottom: 0px;

    /* height of thumbs (if not required set to 0) */
}

.coloredBlock {
    padding: 12px;
    background: rgba(255,0,0,0.6);
    color: #FFF;
    width: 200px;
    left: 20%;
    top: 5%;
}

.infoBlock {
    position: absolute;
    top: auto;
    bottom: 14%;
    left: 0px;
    min-width: 100%;
    padding-bottom: 0;
    background: #000;
    background: rgba(0, 0, 0, 0.60);
    overflow: hidden;
    padding: 16px 40px 16px 15%;
}

.infoBlockGen2,
.infoBlockGen3 {
    position: absolute;
    top: 30px;
    left: 30px;
    padding-bottom: 0;
    overflow: hidden;
    padding: 16px 16px 16px 16px;
}

.block-shaded {
    background: #000;
    background: rgba(0, 0, 0, 0.20);
}

.infoBlockGen4 {
    position: absolute;

    /*top: 16%;
    left: 22%;*/
    top: 64%;
    left: 12%;
    padding: 0 3em;
    overflow: hidden;
}

.infoBlockGen4 h2.slogan {
    font-family: "orgonblack", sans-serif;
    font-size: 4.0em;
    line-height: 1.2em;
    color: #fff;
}

.infoBlockGen5 {
    position: absolute;

    /*top: 16%;
    left: 22%;*/
    top: 20%;
    left: 14%;
    padding-bottom: 0;
    overflow: hidden;
}

div.modelLogo img.catalystModelLogo {
    max-width: 60%;
    filter: drop-shadow(2px 2px 2px #151515);
}

.infoBlockGen2 p,
.infoBlockGen3 p {
    color: #fff;
    margin: 0 0;
    padding: 0 0;
    font-size: 1.8em;
    line-height: 1em;
}

.infoBlockGen2 p.blockLight,
.infoBlockGen3 p.blockLight {
    font-family: "proxima-nova",sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: 1.8em;
    line-height: 1em;
}

.infoBlockGen2 p.blockHeavy,
.infoBlockGen3 p.blockHeavy {
    font-family: "proxima-nova",sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 2.6em;
    line-height: 1em;
}

.infoBlockGen2 a,
.infoBlockGen3 a {
    color: #fff;
    margin: 0px 0 0 0px;
    padding: 3px 20px 2px 20px;
    border: 1px solid #fff;
    line-height: 3em;
    font-family: "proxima-nova",sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: .7em;
}

.infoBlockGen2 a:hover,
.infoBlockGen3 a:hover {
    color: #fff;
}

.externalCaption {
    margin: 10px 0;
    padding: 0 6px;
}

.externalCaption p.blockHeavy {
    font-family: "orgonextrabold", sans-serif;
    font-size: 1.4em;
    line-height: 0.8em;
    margin-bottom: 12px;
}

.externalCaption a {
    color: #fff;
    background: #000;
    margin: 0px 0 0 0px;
    padding: 3px 20px 2px 20px;
    border: 1px solid #000;
    line-height: 3em;
    font-family: "proxima-nova",sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: .7em;
}

.externalCaption a:hover,
.externalCaption a:active {
    color: #000;
    background: #fff;
}

.tilerow>div {
    padding: 0 0;
    min-height: 360px;
}

.tilerow>div.blackTile {
    background-color: #000;
}

.tilerow > div.blackTile blockquote {
    color: #b3b3b3;
    line-height: 1.4rem;
}

.tilerow > div.blackTile blockquote cite {
    color: #e6e6e6;
    line-height: 3rem;
}

.tilerow div.imageTile div.TileHeader {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    text-align: center;
}

.tilerow div.imageTile div.TileHeader .HeroText {
    color: white;
    text-transform: uppercase;
    font-size: 2rem;
    letter-spacing: .2rem;
    font-family: "orgonbold";
}

.tilerow div.FeaturedContentTile .TileTextCol {
    margin-top: 4rem;
    text-align: right;
}

.tilerow div.FeaturedContentTile .HeroText {
    color: white;
    margin: 0 0;
    text-transform: uppercase;
    font-size: 2.2rem;
    font-family: "orgonbold";
}

.tilerow div.FeaturedContentTile .HeroText strong {
    font-family: "orgonextrabold";
    letter-spacing: -.1rem;
}

.tilerow div.FeaturedContentTile .SubText {
    color: white;
    margin: 0;
    text-transform: uppercase;
    font-size: 1.2rem;
    font-family: "orgonlight";
}

.tilerow div.FeaturedContentTile hr.custom-divider {
    display: inline-block;
    text-align: right;
    border: none;
    height: .08rem;
    background-color: #fff;
    margin: 1rem 0 .6rem 0;
    width: 2rem;
}

.tilerow>div.textTile {
    padding: 1rem 1rem;
}

.tilerow div.PairAndFairTile {
    background-color: #bec6cb;
    background-repeat: no-repeat;
    background-image: linear-gradient(90deg, rgba(124,148,168,1), rgba(124,148,168,0));
    color: #000000;
    text-transform: uppercase;
    text-align: right;
}

.tilerow .row div.TileTextCol {
    padding: 1rem .8rem 1rem 1rem;
}

.overviewIntro {
    padding: 4rem 0;
}

div.PairAndFairTileImage {
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: left 50% center;
}

img.PairAndFairLogo {
    /* padding: 1rem 1rem; */
    padding-right: 2rem;
    padding-bottom: 6rem;
}

div.TileTextCol h4.PairAndFairTileLead {
    font-size: 1.4rem;
}

div.TileTextCol p.PairAndFairTileSub {
    line-height: 1rem;
}

hr.custom-divider {
    display: inline-block;
    text-align: right;
    border: none;
    height: .08rem;
    background-color: #000;
    margin: 2rem 0 .6rem 0;
    width: 2rem;
}

.blackTile p {
    color: #fff;
    padding: 0 0;
    margin: 0 0;
    font-size: 1.4em;
}

.blackTile p.blockLight {
    font-family: "orgonextralight", sans-serif;
    line-height: 1.4em;
    font-size: 1em;
    margin-bottom: 6px;
}

.blackTile p.blockHeavy {
    font-family: "orgonbold", sans-serif;
    line-height: 1.2em;
    font-size: 1.4em;
    margin-bottom: 6px;
}

.blackTile a {
    color: #ffffff;
}

.blackTile a:hover {
    color: #d7d7d7;
}

.yellowTile {
    background-color: #ffe600;
    position: relative;
    min-height: 100px;
}

.tilerow > div.feature_tile {
    padding: 60px 60px;
    text-align: center;
    display: flex;

    /* establish flex container */
    align-items: center;
    justify-content: center;
}

.tilerow > div.feature_tile2 {
    padding: 60px 60px;
    text-align: left;
    display: flex;

    /* establish flex container */
    align-items: center;
    justify-content: center;
}

.tilerow > div.feature_tile3 {
    padding: 3rem 8rem;
    text-align: left;
    background: rgb(174,187,194);
    background: linear-gradient(90deg, rgba(174,187,194,1) 0%, rgba(186,196,201,1) 40%, rgba(203,209,212,1) 100%);
}

.tilerow > div.feature_tile4 {
    padding: 6rem 6rem;
    text-align: left;
    display: flex;

    /* establish flex container */
    align-items: center;
    justify-content: center;
}

.compound-description {
    margin-bottom: 3rem;
}

.two-pair-row {
    background: rgb(174,187,194);
    background: linear-gradient(90deg, rgba(174,187,194,1) 0%, rgba(186,196,201,1) 40%, rgba(203,209,212,1) 100%);
}

.tilerow>div.feature_1 {
    background-color: #000;
}

.tilerow>div.feature_2 {
    background-color: #f5f5f5;
}

.model-list-heading {
    text-align: center;
    padding: 1rem 4rem;
}

li.discModelNameli {
    height: 100%;
}

.discModelName {
    text-align: center;
    height: 100%;
    align-items: center;
}

.discModelName h4 {
    font-size: 1.2em;
    font-family: "orgonmedium", sans-serif;
    padding: 40px 0;
}

/* the "DISC 36" lockup (ProductLockup) in place of the plain model name */
.discModelName svg.lockup {
    display: inline-block;
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

.superDetail_container,
.superDetail_container2 {
    display: block;
}

.superDetail_container2 {
    padding-bottom: 20px;
    margin-top: -20px;
}

.superDetail_new_marker {
    font-weight: bold;
    background-color: transparent;
    font-size: .875rem;
    line-height: .875rem;
}

.feature_1 p,
.feature_1 h2 {
    color: #fff;
}

.feature_tile p {
    padding: 0 0;
    margin: 0 0;
    font-size: 1.4em;
}

.feature_tile p.blockLight {
    font-family: "orgonextralight", sans-serif;
    line-height: 1.2em;
    font-size: 1.2em;
    margin-bottom: 6px;
}

.feature_tile h2.blockHeavy {
    /*font-family: "orgonbold", sans-serif;
        line-height: 1.2em;
        font-size: 2.4em;
        margin-bottom: 6px;*/
    text-transform: uppercase;
}

.feature_1 a {
    color: #ffffff;
}

.feature_1 a:hover {
    color: #d7d7d7;
}

.feature_tile div.vCen {
    margin: 5% 5%;
}

.feature_tile4 div.vCen {
    margin: 5% 5%;
}

/*end new*/

.centeredImageTile img {
    position: absolute;
    bottom: 0px;
    left: 0px;
    max-width: 100%;
    max-height: 100%;
    margin-left: auto;
    right: 0px;
    margin-right: auto;
}

.tileImageTop {
    max-width: 60%;
}

.tileImageBase {
    padding: 0 0;
    margin: 0 0;
    max-width: 70%;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    bottom: 0;
}

.imageTile {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#mini-width-slider {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0px;

    /* height of thumbs (if not required set to 0) */
    height: auto;

    /* optionally add !important for WP version */
    width: auto;
}

.miniHero {
    height: 100%;
    width: 100%;
}

.blackTile div.vCen {
    margin: 5% 15%;
}

/*.infoBlockLeftBlack {
            color: #FFF;
            background: #000;
            background: rgba(0,0,0,0.2);
            left: 30px;
            right: auto;
        }*/

.infoBlock h4 {
    font-size: 20px;
    line-height: 1.2;
    margin: 0;
    padding-bottom: 3px;
}

.infoBlock p {
    font-size: 14px;
    margin: 4px 0 0;
}

.infoBlock a {
    color: #FFF;
    text-decoration: underline;
}

.cbp {
    max-width: 70%;
}

div.fullWidth {
    max-width: 3400px;
}

.sliderContainer {
    /*margin-bottom: 10px;*/
    height: 100%;
}

.news-item {
    padding-bottom: 5em;
}

.backToGrid {
    font-size: 18px;
    padding: 0 4px 0 0;
}

div.sidebar {
    margin-top: 60px;
}

.bigPush {
    padding-top: 400px;
}

a.UIlinkDown {
    color: #d1d1d1;
}

a.UIlinkDown:hover {
    color: #282828;
}

.backToGridBox {
    padding: 20px 0 6px 0;
    text-align: right;
}

a#notice {
    display: block;
    overflow: hidden;
    position: relative;
    padding: 1rem 0;
    width: 100%;
    background: #FCE400;
}

a#notice #closeNotice {
    position: absolute;
    top: 0px;
    right: 8px;
    font-size: 24px;
}

a#notice .info {
    left: 0;
    right: 0;
    z-index: 20;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

a#notice .info h5 {
    color: #282828;
    margin: 0 0;
    padding: 0 0;
}

.coloredBlock {
    padding: 12px;
    background: rgba(255,0,0,0.6);
    color: #FFF;
    width: 200px;
    left: 20%;
    top: 5%;
}

.infoBlock2 {
    position: absolute;
    top: 30px;
    right: 30px;
    left: auto;
    max-width: 40%;
    padding-bottom: 0;
    background: #FFF;
    background: rgba(255, 255, 255, 0.8);
    overflow: hidden;
    padding: 20px;
}

.infoBlockLeftBlack {
    color: #FFF;
    background: #000;
    background: rgba(0,0,0,0.2);
    left: 30px;
    right: auto;
}

.infoBlockLeft {
    color: #FFF;
    background: none;
    left: 30px;
    right: auto;
}

.infoBlockLeft h1 {
    text-shadow: 2px 2px 10px #000;
    text-transform: uppercase;
}

.infoBlock2 h4 {
    font-size: 20px;
    line-height: 1.2;
    margin: 0;
    padding-bottom: 3px;
}

.infoBlock2 p {
    font-size: 14px;
    margin: 4px 0 0;
}

.infoBlock2 a {
    color: #FFF;
    text-decoration: underline;
}

.infoBlock2 h1,
.infoBlock2 h2,
.infoBlock2 h5 {
    font-family: "orgonextralight";
    color: #fff;
    padding: 0px 0 0px 0;
    margin: 4px 0;
}

.infoBlockGen6 {
    position: absolute;
    left: auto;
    top: 36%;
}

.infoBlockGen6 h1 {
    font-family: "orgonbold";
    color: #fff;
}

h1.XLheading {
    font-size: 3.8rem;
}

.txtCent {
    text-align: center;
    width: 100%;
}

.creditBlock {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 2%;
    overflow: hidden;
    padding: 0 0;
}

.creditBlock2 {
    position: absolute;

    /*top: 10%; 
            top: 0%;
            bottom: 50%;*/

    /* left: -4%;
             left: 2%;*/
    overflow: hidden;
    padding: 0 0;
    top: 4px;
    left: 16px;
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;

    /* IE 9 */

    /* Chrome, Safari, Opera */
    transform: rotate(90deg);
}

.imageHolderForPhotoCredit {
    position: absolute;
}

.creditBlock2a {
    position: absolute;

    /*top: 10%; 
            top: 0%;
            bottom: 50%;*/

    /* left: -4%;
             left: 2%;*/
    overflow: hidden;
    padding: 0 0;
    bottom: 0;
    left: 16px;
}

.creditBlock3 {
    position: absolute;
    top: auto;
    bottom: 10px;
    left: 10px;
    overflow: hidden;
    padding: 0 0;
}

.photoCredit,
.photoCreditStandard {
    color: rgba(255, 255, 255, 0.40);
}

.photoCredit p {
    font-size: .05em;
    margin: 0 0;
    text-shadow: 1px 1px rgba(0,0,0, 0.3);
}

.photoCreditNews p {
    font-size: .6em;
    margin: 0 0;
    text-shadow: 1px 1px rgba(0,0,0, 0.3);
}

.photoCreditStandard p {
    font-size: .6em;
    margin: 0 0;
    text-shadow: 1px 1px rgba(0,0,0, 0.3);
}

.large {
    font-size: 50px;
    line-height: 50px;
}

.medium {
    font-size: 35px;
    padding: 0 5px;
    font-weight: 100;
}

.small {
    font-size: 20px;
    padding: 0 5px;
}

.block-shadowtext .slogan {
    text-shadow: -1px 0 2px rgba(0,0,0, 0.1), 0 1px 2px rgba(0,0,0, 0.1), 1px 0 2px rgba(0,0,0, 0.1), 0 -1px 2px rgba(0,0,0, 0.1), 0em 0em .6em rgba(0,0,0, 0.52);
}

div.noPadding div.background-image {
    padding-left: 0;
    padding-right: 0;
    overflow: hidden;
    background-size: cover;
    background-position: center center;
}

.single-image img,
.single-column img {
    padding: 5% 15%;
}

div.noPadding div.block-grid {
    padding-top: 4%;
    padding-left: 4%;
    padding-right: 4%;
}

div.noPadding div.block-grid li {
    padding: 8px 8px;
}

div.noPadding div.text {
    padding-left: 8%;
    padding-right: 8%;
    padding-top: 4%;
    padding-bottom: 6%;
}

div.catalystIntro {
    background-color: #000000;
    text-align: center;
}

div.catalystIntro .introSection {
    color: #ffffff;
    padding-top: 20px;
    padding-bottom: 40px;
}

h5.introTitle {
    color: #ffffff;
    letter-spacing: 8px;
    text-transform: uppercase;
    font-family: "orgonlight",sans-serif;
    margin-bottom: 1.5rem;
    margin-top: 2.5rem;
    line-height: 2rem;
    font-size: 1.6rem;
    position: relative;
}

/*    h2.introTitle::after {
        
        display: block;
        content: '';
  width: 60%;
  height: 1px;
  background: #ffffff;
 
  bottom: 0px;
  
margin: 1.5rem auto; 
        }*/

.introSection p {
    text-transform: uppercase;
    font-family: "orgonbold", sans-serif;
    letter-spacing: 4px;
    font-size: 2.2rem;
    margin-top: 0;
}

div.catalystLogo {
    /*background-color: #f5f5f5;*/
    background-color: #f5f5f5;
    opacity: 1;
    background-image: linear-gradient(#f9f9f9 2.2px, transparent 2.2px), linear-gradient(90deg, #f9f9f9 2.2px, transparent 2.2px), linear-gradient(#f9f9f9 1.1px, transparent 1.1px), linear-gradient(90deg, #f9f9f9 1.1px, #f5f5f5 1.1px);
    background-size: 55px 55px, 55px 55px, 11px 11px, 11px 11px;
    background-position: -2.2px -2.2px, -2.2px -2.2px, -1.1px -1.1px, -1.1px -1.1px;
}

div.catalystLogo .leadSection {
    padding-top: 20px;
    padding-bottom: 40px;
}

div.catalystLogo ul {
    font-size: 1.2rem;
}

.vertical-CenterLogo:before {
    /* create a full-height inline block pseudo=element */
    content: ' ';
    display: inline-block;
    vertical-align: middle;

    /* vertical alignment of the inline element */
    height: 100%;
}

.vertical-CenterLogo {
    /* create a full-height inline block pseudo=element */
    text-align: center;
}

.introRowBorder::after {
    display: block;
    content: '';
    width: 80%;
    height: 2px;
    background: #ddd;
    bottom: 0px;
    margin: 0 auto;
}

.CatalystModelIntroRow div.feature_tile {
    padding: 0 0;
}

.CatalystModelIntroRow div.feature_tile div.vCen {
    margin: 4% 4%;
}

.CatalystModelIntro h6 {
    text-transform: uppercase;
    font-size: 1rem;
    font-family: "orgonlight", sans-serif;
    letter-spacing: 2px;
}

img.CatalystModelLogo {
    max-width: 80%;
}

img.CatalystModelImage {
    max-width: 90%;
    filter: drop-shadow(5px 5px 5px #c2c2c2);
}

div.CatalystModelDescription,
div.BrakeServiceProductDescription,
div.ProductDescription {
    padding: .4rem 4% 1.2rem 4%;
}

div.product-rows {
    margin-bottom: 40px;
}

.CatalystGridArea,
.CatalystProductArea {
    padding-top: 2%;

    /*overflow:hidden;*/
    height: var(--calc-height);
    transition-delay: 1s;
    transition: height .8s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.CatalystGridArea > div {
    padding-bottom: 5%;
}

div.BrakeServiceProductDescription li {
    padding-bottom: .785rem;
}

p.catalyst-productname {
    text-align: right;
    padding: 0 8% 0px 0;
}

div.catalyst-product-container {
    text-align: right;
    padding-bottom: 5%;
}

.CatalystGridHeadingCell {
    text-align: center;
    padding: 2% 2%;
}

.CatalystGridHeadingCell img.CatalystModelLogoFixedSize {
    max-width: 12rem;
}

.CatalystGridHeadingCell h6 {
    text-transform: uppercase;
    font-size: .8rem;
    font-family: "orgonlight", sans-serif;
    letter-spacing: 2px;
}

.CatalystGridModelSizeCell {
    text-align: left;
}

.CatalystGridModelSizeCell h4 {
    padding-top: 8%;
    padding-right: 5%;
    font-size: .9rem;
    font-family: "orgonlight", sans-serif;
    color: #282828;
}

span.CatalystGridModelSizeCell {
    display: block;
    padding-top: 30%;
    padding-right: 5%;
    font-size: 1rem;
    font-family: "orgonlight", sans-serif;
}

.CatalystGridCell {
    text-align: center;

    /*padding-bottom: 3%;*/
    padding-bottom: 10px;
}

div .CatalystGridCell.end {
    padding-left: 20px;
}

.CatalystGridCell-Internal {
    display: grid;
    justify-content: center;
}

.CatalystGridCell-Cols-1 {
    grid-template-columns: 66% auto;

    /*auto for when in mountoptionsx2 column, 66% auto for when in mountoptions+2 column*/
}

.CatalystGridCell-Cols-2 {
    grid-template-columns: 50% auto;
}

.CatalystGridCell-Cols-3 {
    grid-template-columns: 66% auto;
}

.CatalystGridCell-Internal > span {
    /*background-color: rgba(0,0,0,0.05);*/
    padding: 8% 0px;
    margin: 0 10px 0 0;
}

LABEL.indented-checkbox-text {
    margin-left: 2em;
    display: block;
    position: relative;
    margin-top: -1.4em;

    /* make this margin match whatever your line-height is */
    line-height: 1.4em;

    /* can be set here, or elsewehere */
}

.CatalystSpecifications {
    padding-top: 2% 0;
}

div.brakeservice-product-container {
    text-align: center;
    padding: 5% 0;
}

div.brakeservice-product-imagecontainer {
    position: relative;
}

.new-br {
    position: absolute;
    bottom: 8px;
    right: 20%;
}

p.brakeservice-productname {
    text-align: center;
    margin: 2% 20%;
    padding: 2% 4%;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

h5.brakeservice-productname {
    text-align: center;
    margin: 2% 20%;
    padding: 2% 4%;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.vCen2 {
    text-align: center;
}

.teamLogo .royalSlider {
    max-width: 100%;
    margin-top: 9rem;
}

.pandf .royalSlider {
    max-width: 100%;
}

.pandfSecondaryImage {
    margin: .8rem 0;
    max-width: 10rem;
}

div.PandF-ModelsSection:before {
    content: '';
    display: block;
    width: 60%;
    height: .2rem;
    margin: 0 auto 4rem auto;
    background: rgb(174,187,194);
    background: linear-gradient(90deg, rgba(174,187,194,1) 0%, rgba(186,196,201,1) 40%, rgba(203,209,212,1) 100%);
}

div.PandF-ModelsSection {
    margin-top: 4rem;
}

ul.websocial {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

ul.websocial li {
    float: left;
    padding-left: 0;
    padding-right: .875rem;
}

ul.websocial li a:hover {
    text-decoration: underline;
}

.aft-lighterweight {
    -webkit-text-stroke: 1px white;
}

.aft-alignfix {
    position: relative;
    margin-top: -2px;
}

.feature-text-small {
    font-size: .825rem;
}

div.placeholder {
    line-height: 1px;
}

div.afG5 .small-block-grid-5 > li:nth-of-type(5n+1) {
    clear: both;
}

.tabs-content > .content.tabContentAdjust {
    padding-bottom: 0;
}

.tabs-content > .content.minrpanel2 {
    min-height: 18rem;
}

h2.leadTitle {
    text-transform: uppercase;
    font-family: "orgonblack",sans-serif;
    margin-bottom: 2.5rem;
    margin-top: 2.5rem;
    line-height: 2rem;
}

h1.leadTitle {
    text-transform: uppercase;
    font-family: "orgonblack",sans-serif;
    margin-bottom: 2.5rem;
    margin-top: 2.5rem;
    line-height: 2rem;
}

.leadSection ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    line-height: 18px;
}

.leadSection li {
    margin-bottom: 20px;
}

.mediaSection hr {
    border: solid #f5f5f5;
    border-width: 1px;
    margin: 2% 6%;
}

.BrakeServiceIntroSection {
    padding: 2% 4%;
}

.BrakeServiceIntroSection blockquote {
    font-size: .9rem;
}

.BrakeServiceProductIntro h1.lgHeading {
    font-size: 3.6rem;
    letter-spacing: .8rem;
    text-align: center;
}

.BrakeServiceProductFeatureImageContainer {
    text-align: center;
}

.BrakeServiceProductFeatureImageContainer img {
    margin-left: -25%;
}

.YTcontainer {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%;

    /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
    margin-bottom: 1rem;
}

.vContainer {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.vContainer--overlay {
    align-items: center;
    background-color: rgba(0, 0, 0, 0.25);
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0px;
    position: absolute;
    top: 0px;
    width: 100%;
}

.pb_C {
    align-items: center;
    border: 4px solid rgb(255, 255, 255);
    border-radius: 9999px;
    display: flex;
    height: 64px;
    justify-content: center;
    width: 64px;
}

.pb_A {
    border-color: transparent transparent transparent rgb(255, 255, 255);
    border-style: solid;
    border-width: 8px 0px 8px 16px;
    height: 0px;
    width: 0px;
}

/* Then style the iframe to fit in the container div with full height and width */

.responsive-iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

/* modal */

/* padding-bottom and top for image */

.mfp-no-margins img.mfp-img {
    padding: 0;
}

/* position of shadow behind the image */

.mfp-no-margins .mfp-figure:after {
    top: 0;
    bottom: 0;
}

/* padding for main container */

.mfp-no-margins .mfp-container {
    padding: 0;
}

.productModal {
    text-align: center;
}

.reveal-modal.full.videoModal.open {
    background-color: rgba(0, 0, 0, 0.7);
}

.reveal-modal.xlarge.videoModal.open a.close-reveal-modal {
    top: -3rem;
}

.videoModal {
    display: flex;
}

.videoZone {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
}

.video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.modal.descriptionFromProduct ul {
    list-style-position: inside;
    margin-left: 0;
}

/* 

for zoom animation 
uncomment this part if you haven't added this code anywhere else

*/

.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
    opacity: 0;
    -webkit-backface-visibility: hidden;
    transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
    opacity: 1;
}

.mfp-with-zoom.mfp-ready.mfp-bg {
    opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container,
.mfp-with-zoom.mfp-removing.mfp-bg {
    opacity: 0;
}

.modal-primaryImage {
    text-align: center;
}

.modal-primaryImage img {
    max-width: 80%;
}

/* end modal */

.title_span {
    padding-bottom: 2px;
    border-bottom: #000 2px solid;
}

.center-column-contents {
    text-align: center;
}

.center-column-contents table {
    margin-left: auto;
    margin-right: auto;
}

i {
    vertical-align: middle !important;
}

i.fineborder {
    border: solid 1px #000;
}

.compound-table a {
    font-weight: 700;
    display: block;
}

.compound-table a:hover,
.product-detail a:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #000;
}

.fullrow dd:first-of-type {
    padding-left: 25%;
}

.columns iframe {
    max-width: 100%;
}

.videoWrapper {
    position: relative;
    padding-bottom: 56.25%;

    /* 16:9 */
    padding-top: 25px;
    margin-bottom: 25px;
    height: 0;
}

.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#OCmenuswitch {
    padding-left: 8px;

    /*
        color: #fff;
      
        background-color: #282828;
        height: 32px;
        min-width: 32px;
        text-align: center;
        padding: 4px 4px;
        line-height: 25px;
        font-weight: 700;
        margin-top: 10px;
        */
}

#OCplace {
    padding: 16px 16px;

    /* padding-top: 20px;*/
}

.row .row.TeamRow {
    padding-bottom: 8rem;
}

.row .row.TeamTableRow {
    border-bottom: .12rem solid #000;
    margin: 0 0 0 0;
    padding: 1rem 0;
}

.row .row.TeamTableRow p {
    margin-bottom: 0;
}

.columns div.menu-column {
    padding-right: 0;
}

.columns div.productgrid-column {
    padding-right: 0rem;
    padding-left: 1rem;
}

.capitalize {
    text-transform: capitalize;
}

/* Royal Slider height*/

.royalSlider.heroSlider2,
.royalSlider.heroSlider2 .rsOverflow {
    height: 800px !important;
}

.royalSlider.heroSlider3,
.royalSlider.heroSlider3 .rsOverflow {
    height: 640px !important;
}

.royalSlider.heroSlider4,
.royalSlider.heroSlider4 .rsOverflow {
    height: 480px !important;
}

.royalSlider.heroSliderVH,
.royalSlider.heroSliderVH .rsOverflow {
    /* height: -webkit-calc(100vh - 300px);*/
    height: calc(100vh - 300px) !important;
    min-height: 540px;
}

div#full-width-slider.heroSliderVH div.rsGCaption {
    display: none;
}

.royalSlider.teamSlider {
    height: 480px !important;
}

.externalCaption {
    background-color: #fff;
}

.modal-centered {
    text-align: center;
}

a.CompoundLogoInGrid {
    display: inline-block;
}

/* disc pad grid: each compound logo centred in its column */
li.compoundLogoCell {
    text-align: center;
}

.compoundLogo {
    margin-top: 4rem;
    max-width: 70%;
    margin-bottom: 2rem;
}

.centeredHere {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.compoundLogoCompact {
    margin-top: 2rem;
    max-width: 10rem;
    margin-bottom: 1rem;
    margin-left: 0;
}

.compatList-model,
.compatList-calipers {
    font-size: .8rem;
}

div.clear-right-padding {
    padding-right: 0;
}

div.clear-left-padding {
    padding-left: 0;
}

ul.tech-doc-list li {
    padding: 10px 0;
}

.discbrakepowercleanRow {
    padding-top: 4%;
    padding-bottom: 2%;
    background-color: #e6e6e6;
    background-image: linear-gradient(135deg, #e6e6e6, #929292);
}

.discbrakesilencerRow {
    padding-top: 2%;
    padding-bottom: 6%;
    background-color: #e6e6e6;
    background-image: linear-gradient(135deg, #e6e6e6, #929292);

    /*background-color: #ffe600;
background-image: linear-gradient(180deg, #ffe600, #d3be00, #ffe600);
*/
}

.discbrakepowercleanwipesRow {
    padding-top: 4%;
    padding-bottom: 4%;

    /*background-color: #ffe600; WAS 4 and 2 above*/
    background-color: #e6e6e6;
    background-image: linear-gradient(135deg, #e6e6e6, #929292);
}

.gravelbrakeHeroRow {
    padding-top: 4%;
    padding-bottom: 0;
    background-color: #8b8C6e;
    background-image: url('/Images/PaperTexture-Map_webCrop1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

    /* border-bottom: 24px solid rgba(0,0,0, 0.2); */

    /* outline: 16px solid rgba(0,0,0, 0.1);
  outline-offset: -16px; */
}

.gravelbrakeFooterRow {
    padding-top: 0;
    padding-bottom: 4%;
    background-color: #8b8C6e;
    background-image: url('/Images/PaperTexture-Map_webCrop1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;

    /* border-bottom: 24px solid rgba(0,0,0, 0.2); */

    /* outline: 16px solid rgba(0,0,0, 0.1);
  outline-offset: -16px; */
}

.gravelbrakeHeroRow h1 {
    position: absolute;
    top: 20%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: "avalanche", sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 4rem;
    letter-spacing: .4rem;
    color: #fff;
}

.gravelbrakeHeroRow img {
    max-height: 34vh;
}

.gravelbrakeHeroRow .overlay_0 {
    margin-top: 6%;
    height: 24px;
    background-color: rgba(0,0,0,0.2);
}

.gravelbrakeFooterRow .overlay_0 {
    margin-bottom: 6%;
    height: 24px;
    background-color: rgba(0,0,0,0.2);
}

.photoPrint {
    border: 8px solid white;
}

.photoPrintShadow {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.angled5 {
    transform: rotate(-5deg);
}

.rot0 {
    transform: rotate(-5deg);
}

.rot1 {
    transform: rotate(2deg);
}

.rot2 {
    transform: rotate(-4deg);
}

.gravelbrakeHeroRow .textImg {
    max-width: 100%;
}

.textImg {
    position: relative;
    text-align: center;
}

.gravelbrakeContentRow {
    min-height: 40vh;
    background-color: #a2987f;

    /*#a2987f*/
    background-image: url('/Images/clean-gray-paper.png'), linear-gradient(130deg, rgba(177,166,139,1) 0%, rgba(200,185,148,1) 85%, rgba(206,195,168,1) 100%);

    /* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */
}

.gravelbrakeContentRow h3 {
    font-family: marydale, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 2rem;
}

.gravelbrakeContentRow p {
    font-family: marydale, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.2rem;
}

.gravelbrake-item-row {
    padding: 4rem 0;
}

.gravelbrake-item-img-col {
    text-align: right;
}

.gravelbrake-item-img {
    max-width: 80%;
    border: 10px solid white;
    transform: rotate(-5deg);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.item-list-item {
    margin-top: .4rem;
}

.item-list-item-morepadding {
    padding-top: 1.4rem;
}

/* Some positioning and ratios */

.sticky-container {
    max-width: 270px;
    position: relative;
}

.sticky-outer {
    display: flex;
    padding-top: 92.5925926%;
    position: relative;
    width: 100%;
}

.sticky {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

/* Shadow behind the sticky note */

.sticky:before {
    box-shadow: -2px 2px 15px 0 rgba(0, 0, 0, 0.5);
    background-color: rgba(0, 0, 0, 0.25);
    content: '';
    width: 90%;
    left: 5px;
    height: 83%;
    position: absolute;
    top: 30%;
}

/* The sticky note itself */

.sticky-content {
    background: linear-gradient( 180deg, rgba(198, 206, 96, 1) 0%, rgba(220, 228, 108, 1) 12%, rgba(199, 207, 87, 1) 75%, rgba(204, 212, 99, 1) 100% );
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    font-family: marydale, sans-serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.2rem;
    clip-path: url(#stickyClip);
}

.sticky-content-textboundary {
    width: 90%;
}

.sticky-content h4 {
    margin-top: 0;
    font-family: marydale, sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 1.6rem;
}

/* Foundation Responsiveness - Small screens*/

@media only screen {
    div.TileTextCol h4.PairAndFairTileLead {
        font-size: 1.2rem;
    }

    div.TileTextCol p.PairAndFairTileSub {
        font-size: .8rem;
        line-height: 1rem;
    }

    div.PairAndFairTileImage {
        background-size: auto 70%;
        background-position: left 50% center;
    }
}

/* Define mobile styles */

/* max-width 640px, mobile-only styles, use when QAing mobile issues */

/* Foundation Responsiveness - Medium screens*/

@media only screen and (min-width: 40.063em) {
    div.TileTextCol h4.PairAndFairTileLead {
        padding-left: 6rem;
    }

    div.PairAndFairSubContentHolder {
        padding-top: 1rem;
    }
}

/* min-width 641px, medium screens */

/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

/* Foundation Responsiveness - Larage screens*/

@media only screen and (min-width: 64.063em) {
    div.TileTextCol h4.PairAndFairTileLead {
        padding-left: 8rem;
    }

    div.PairAndFairSubContentHolder {
        padding-top: 2rem;
    }
}

/* min-width 1025px, large screens */

/* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */

/* Foundation Responsiveness - XLarge screens*/

@media only screen and (min-width: 90.063em) {
    div.TileTextCol h4.PairAndFairTileLead {
        font-size: 1.4rem;
        padding-left: 14rem;
    }
}

/* min-width 1441px, xlarge screens */

/* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */

/* Foundation Responsiveness - XXL screens*/

/* min-width 1921px, xxlarge screens */

/* Add responsiveness */

@media screen and (min-width: 360px) {
    .sticky-container {
        right: 0;
        top: -2rem;
    }

    .gravelbrake-item-row {
        padding: 2rem 0;
    }

    .sticky-content-textboundary {
        padding-left: 1rem;
    }

    .sticky-content h4 {
        font-size: 1.6rem;
    }

    .sticky-content p {
        font-size: 1.2rem;
    }

    .gravelbrake-item-img {
        max-width: 90%;
        border: 8px solid white;
    }

    .photoPrint {
        border: 8px solid white;
    }
}

@media screen and (min-width: 640px) {
    .sticky:before {
        height: 79%;
        width: 90%;
    }

    .gravelbrake-item-row {
        padding: 1rem 0;
    }

    .sticky-content-textboundary {
        padding-left: .6rem;
    }

    .sticky-content h4 {
        font-size: .8rem;
    }

    .sticky-content p {
        font-size: .6rem;
    }

    .gravelbrake-item-img {
        max-width: 80%;
        border: 4px solid white;
    }

    .photoPrint {
        border: 4px solid white;
    }
}

@media screen and (min-width: 768px) {
    .sticky:before {
        height: 75%;
        width: 90%;
    }

    .sticky-container {
        top: 1rem;
        right: 4rem;
    }

    .gravelbrake-item-row {
        padding: 2rem 0;
    }

    .sticky-content-textboundary {
        padding-left: 1rem;
    }

    .sticky-content h4 {
        font-size: 1rem;
    }

    .sticky-content p {
        font-size: .8rem;
    }

    .gravelbrake-item-img {
        max-width: 80%;
        border: 6px solid white;
    }

    .photoPrint {
        border: 6px solid white;
    }
}

@media screen and (min-width: 1024px) {
    .sticky:before {
        height: 73%;
        width: 90%;
    }

    .sticky-content {
        padding-left: 8%;
        font-size: 1.875rem;
    }

    .gravelbrake-item-row {
        padding: 3rem 0;
    }

    .sticky-content-textboundary {
        padding-left: 1rem;
    }

    .sticky-content h4 {
        font-size: 1.2rem;
    }

    .sticky-content p {
        font-size: 1rem;
    }

    .gravelbrake-item-img {
        max-width: 80%;
        border: 8px solid white;
    }

    .photoPrint {
        border: 8px solid white;
    }
}

/* end gravelbrake */

.reviewImage {
    width: 70%;
    max-height: 400px;
}

.reviewItem {
    padding-top: 0px;
    padding-bottom: 30px;

    /*top was 30px*/
}

.indentsmall {
    padding-left: 5%;
}

#faq a.active {
    background: #fce400;
}

.installation-block {
    width: 90%;
    min-height: 220px;
    padding-top: 20px;
}

.installation-text {
    margin-top: 20px;
}

.distri-block {
    width: 90%;
    min-height: 260px;
}

.distri-address h6 {
    font-weight: 700;
}

.distri-address p.countryName {
    font-weight: 700;
    margin: 6px 0;
    padding: 4px 4px;
    font-size: 1em;
    display: block;
    background: #282828;
    color: #fff;
}

.distri-address p {
    font-size: .8em;
    padding: 0px 0;
    margin: 4px 0;
    line-height: 1.2em;
}

#mainContent {
    position: relative;
}

.bodywrapper .wrapper {
    background: url('/img/transpBG3.png') repeat 0 0;
    z-index: 7;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

ul.topNavLanguageSelect {
    margin: 20px 0;
}

ul.topNavLanguageSelect li {
    display: block;
    width: 100%;
}

ul.topNavLanguageSelect li a {
    padding: .2em .4em;
    width: 100%;
}

ul.topNavLanguageSelect li a:hover {
    background: #282828;
    color: #fff;
}

.uppercase {
    text-transform: uppercase;
}

.product-rows {
    padding: 0 0 40px 0;
}

.label.alert {
    margin-right: 2px;

    /* temp remove  padding-top: .4rem; */
}

.main-nav-block {
    min-height: 220px;
    width: 80%;
    margin-bottom: 20px;
}

.main-nav-block img {
    max-height: 180px;
}

.main-nav-block-brakepads {
    /*min-height: 240px; */
    width: 80%;
    margin-bottom: 50px;
}

.main-nav-block-brakepads img {
    max-height: 230px;
}

h2 {
    margin-bottom: 1.6rem;
}

h1.lgHeadingProductName {
    font-family: "orgonlight",sans-serif;
    margin-bottom: 2.5rem;
    margin-top: 2.5rem;
}

h1.lgHeading {
    text-transform: uppercase;
    font-family: "orgonextralight",sans-serif;
    margin-bottom: 2.5rem;
    margin-top: 2.5rem;
}

h2.lgHeading {
    text-transform: uppercase;
    font-family: "orgonextralight",sans-serif;
    margin-bottom: 2.5rem;
    margin-top: 2.5rem;
}

h3.lgHeading {
    text-transform: uppercase;
    font-family: "orgonextralight",sans-serif;
    margin-bottom: 2.5rem;
    margin-top: 5rem;
}

h4.lgHeading {
    text-transform: uppercase;
    font-family: "orgonextralight",sans-serif;
    margin-bottom: 2.5rem;
    margin-top: 2.5rem;
}

h5.lgHeading {
    text-transform: uppercase;
    font-family: "orgonextralight",sans-serif;
    margin-bottom: 1.2rem;
    margin-top: 2.5rem;
}

h6.lgHeading {
    text-transform: uppercase;
    font-family: "orgonextralight",sans-serif;
    margin-bottom: 1.2rem;
    margin-top: 1.6rem;
}

div.LinkedProductSection {
    margin-top: .5rem;
}

.lgHeading span.lgHeadStrong {
    font-family: "orgonbold", sans-serif;
}

.lgHeading span.brandMark {
    text-transform: none;
}

.titleFullUnderline {
    border-bottom: 1px solid #000;
    padding-bottom: 8px;
    width: 100%;
    display: block;
}

.titleLightUnderline {
    border-bottom: 1px solid #000;
    width: 100%;
    display: block;
}

.titleUnderline-light {
    border-bottom: solid 1px #DDD;
    padding-bottom: 0.75rem;
    width: 100%;
    display: block;
}

.titleUnderline-heavy {
    border-bottom: 1px solid #000;
    padding-bottom: 0.75rem;
    width: 100%;
    display: block;
}

h5.mdHeading {
    text-transform: uppercase;
    font-family: "orgonregular",sans-serif;
    margin-bottom: 1.2rem;
    margin-top: 2.5rem;
}

.formattedText ul {
    padding-left: 5%;
}

h3 {
    margin-top: 2.5rem;
    margin-bottom: .5rem;
}

.filterelement.hidden {
    display: none;
}

.ui-showall {
    display: block;
    font-size: .8em;
    background: #fafafa;
    padding: 4px 4px;
    display: block;
    cursor: pointer;
    width: 100%;
}

.ui-showall:hover {
    background: #e6e6e6;
}

.contactPageFAQsection {
    padding: 20px 0 40px 0;
}

.row .fullWide {
    margin: 0 0;
    padding: 0 0;
}

.fullWide img {
    width: 100%;
}

ul.productsFitsList {
    list-style-type: square;
}

ul.productsFitsList li {
    padding: 0 0 0 0px;
    margin: 0 0 0 10%;
    line-height: 1.2;
}

.product-detail h2 {
    margin-bottom: .8rem;
}

.product-detail p {
    font-size: 1em;
    line-height: 1.6em;
}

.product-heading {
    text-transform: uppercase;
    margin-bottom: 2.6rem;
}

.product-heading span.dimension {
    text-transform: none;
}

.product-heading h2 {
    margin-bottom: .4rem;
}

.product-heading h4 {
    margin-top: .2rem;
}

.lighter {
    color: #888;
    -webkit-margin-after: 0;
}

.lighterweight {
    font-weight: 400;
}

.extralight {
    font-family: "orgonextralight",sans-serif;
}

.imptitle {
    background: #282828;
    color: #fff;
    padding: 0 6px;
    position: relative;
    display: inline-block;
    width: 100%;
    margin-top: 0.8rem;
}

.imptitle:after {
    border-bottom: 14px solid #282828;
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    width: 0;
    height: 0;
    content: "";
    display: block;
    position: absolute;
    bottom: 100%;
    left: 0.4em;
}

ul.otherModelList {
    padding-top: 0.2rem;
}

.product-detail-heading {
    font-family: 'orgonlight';
    border-bottom: solid 1px #000;
    display: block;
    padding-top: 0px;
    margin-top: 2.6rem;
    margin-bottom: 20px;
}

.product-detail-heading-light {
    font-family: 'orgonregular';
    border-bottom: solid 1px #DDD;
    display: block;
    padding-top: 0px;
    padding-bottom: 0.75rem;
    padding-left: .1rem;
    margin-top: 2rem;
    margin-bottom: 0.8rem;
}

.product-detail-section {
    padding: .4rem 4% 1.6rem 4%;
}

.product-detail-section-full-width {
    padding: .4rem 0 1.6rem 0;
}

.product-section-heading {
    font-family: 'orgonlight';
    padding: 6px 0 6px 0;
}

.product-detail-section h4 {
    margin-top: .6rem;
    margin-bottom: .2rem;
}

.product-detail-section h6 {
    margin-top: .4rem;
    margin-bottom: .2rem;
}

.product-detail-section ul {
    font-size: .9rem;
}

.product-detail-section p {
    font-size: .9rem;
}

p.product-detail-label {
    font-family: 'orgonlight';
    font-size: .8rem;
    padding: 1.4rem 3.4rem;
}

.category-section-heading {
    padding: 0 0 36px 0;
}

.ZM a:hover {
    cursor: zoom-in;
}

figure {
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

.my-gallery figcaption {
    display: none;
}

.compound-featurebox {
    max-width: 90%;
    min-height: 100px;
    text-align: center;
    transition: box-shadow .2s;
    border-radius: 6px;

    /*border: 1px solid #ccc;*/
    background: #fff;
    padding-bottom: 1rem;
}

.compound-featurebox:hover {
    box-shadow: 0 0 8px rgba(33,33,33,.2);
}

.compound-featurebox a {
    display: block;
}

.compound-featurebox img {
    max-width: 80%;
    margin: 2rem 1rem 1rem 1rem;
    padding: 0 0;
}

.compound-featurebox.reduced-margins img {
    max-width: 90%;
    margin: .5rem .5rem;
    padding: 0 0;
}

.reduced-margins p {
    line-height: 1.25rem;
}

.asymmetricalR-image img {
    margin: 2rem 9rem 1rem 1rem;
}

.compound-featurebox h5 {
    padding: 20px 0 0 0;
}

.model-featurebox {
    max-width: 90%;
    min-height: 200px;
}

.model-featurebox img {
    padding: 20px 0 0 0;
}

.model-featurebox h5 {
    padding: 20px 0 0 0;
}

.dummy {
    padding-top: 100%;

    /* forces 1:1 aspect ratio */
}

/* VERTICAL CENTERING ---------------------- */

.out-vc {
    display: table;
}

.in-vc {
    display: table-cell;

    /*text-align: left;*/
    vertical-align: middle;
}

.oem-featurebox {
    max-width: 90%;
    min-height: 300px;
}

.oem-featurebox img {
    padding-left: 5%;
    padding-bottom: 20px;
}

.oem-featurebox h4 {
    padding: 0 0;
    margin: 0 0;
}

.oem-featurebox h5 {
    padding: 0 0;
    margin: 0 0;
}

.eventsTable {
    width: 100%;
}

/* royal slider visible nearby*/

.visibleNearby .rsGCaption {
    /* font-size: 16px;*/
    line-height: 18px;
    padding: 8px 16px;

    /* background: #141414;
            width: 100%;
            position: static;*/
    bottom: auto;
    text-align: center;
    font-weight: 700;
    font-size: 18px;
    background: #282828;
    color: #FFF;
}

.visibleNearby > .rsGCaption {
    clear: both;
    float: none;
    margin-left: auto;
    margin-right: auto;
}

.visibleNearby .rsGCaption span {
    display: block;
    clear: both;
    color: #bbb;
    font-size: 14px;
    line-height: 22px;
}

/* Scaling transforms */

.visibleNearby .rsSlide img {
    opacity: 0.45;
    transition: all 0.3s ease-out;
    transform: scale(0.9);
}

.visibleNearby .rsActiveSlide img {
    opacity: 1;
    transform: scale(1);
}

.compoundSlider .rsMinW .rsBullet span {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #CCC;
    background: rgba(0,0,0,0.3);
    box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1);
}

.compoundSlider .rsMinW .rsBullet.rsNavSelected span {
    background: #282828;
}

.f-dropdown h6,
.f-dropdown h5,
.f-dropdown h4,
.f-dropdown h3,
.f-dropdown h2,
.f-dropdown p,
.f-dropdown ul {
    color: #fff;
}

.f-dropdown h4 small,
.f-dropdown h3 small {
    color: #ccc;
}

.f-dropdown p {
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    font-size: .9em;
}

.f-dropdown h5 {
    padding: 0 0 0 0;
    margin: 0 0 4px 0;
}

.f-dropdown h4 {
    font-size: .875rem;
}

.f-dropdown h3 {
    padding: 0 0 0 0;
    margin-top: .6rem;
    font-size: .875rem;
}

.f-dropdown h2 {
    font-size: 1.25rem;
}

.f-dropdown {
    padding: 20px 20px;
}

.f-dropdown ul.ratings {
    list-style-type: none;
    list-style-position: outside;
    margin-left: 0;
    padding-bottom: 10px;
}

ul.compound-id-logos li {
    padding: 0 20px 0 0;
}

.testRatingItem {
    max-width: 200px;
    margin-right: 40px;
}

@media only screen and (max-width: 380px) {
    #main {
        /**/
        padding-top: 6px;
    }

    .royalSlider.heroSlider,
    .royalSlider.heroSlider .rsOverflow {
        height: 470px !important;
    }

    .royalSlider.heroSlider2,
    .royalSlider.heroSlider2 .rsOverflow {
        height: 240px !important;
    }

    .royalSlider.heroSlider3,
    .royalSlider.heroSlider3 .rsOverflow {
        height: 240px !important;
    }

    .cbp {
        max-width: 90%;
    }

    .yellowTile,
    .imageTile {
        max-height: 160px;
    }

    .royalSlider.heroSliderVH,
    .royalSlider.heroSliderVH .rsOverflow {
        height: 220px !important;
        min-height: 220px;
        max-height: 220px;

        /* min-height: 360px;
       max-height: 440px;*/
    }

    .title_span {
        border-bottom: none;
    }

    .tilerow > div.feature_tile {
        padding: 30px 30px;
        text-align: center;
    }

    .infoBlockGen4 {
        position: absolute;

        /*top: 16%;
    left: 22%;*/
        top: 56%;
        left: 4%;
        padding: 0 2em;
        overflow: hidden;
    }

    .infoBlockGen4 h2.slogan {
        font-size: 1.2em;
        line-height: 1.0em;
    }

    .CatalystGridHeadingCell img.CatalystModelLogoFixedSize {
        max-width: 5rem;
    }

    .CatalystGridHeadingCell h6 {
        margin-top: 0.8rem;
        font-size: .4rem;
        letter-spacing: .04rem;
    }

    .CatalystGridModelSizeCell h5 {
        padding-top: 8%;
        font-size: .6rem;
    }

    img.CatalystModelLogo {
        max-width: 100%;
    }

    h3.lgHeading {
        font-size: 1.2rem;
    }

    .modal-primaryImage img {
        margin-top: 40%;
        max-width: 100%;
    }

    div.modalTextBlock h5 {
        font-size: 1.4rem;
    }

    div.modalTextBlock ul {
        margin-top: 20px;
        font-size: .8rem;
    }

    img.cataloguePreview {
        max-width: 70%;
    }

    h1.XLheading {
        font-size: 1.8rem;
    }
}

@media only screen and (min-width: 381px) and (max-width: 767px) {
    #main {
        /**/
        padding-top: 14px;
    }

    .infoBlock2 {
        max-width: 55%;
        top: 10px;
        left: 10px;
        padding: 10px;
    }

    .infoBlock2 h1 {
        font-size: 2rem;
    }

    .infoBlock2 h2 {
        font-size: 14px;
    }

    .infoBlock2 h5 {
        font-size: 12px;
    }

    .fullrow dd:first-of-type {
        padding-left: 20px;
    }

    .photoCredit p {
        font-size: .3em;
    }

    .royalSlider.heroSlider2,
    .royalSlider.heroSlider2 .rsOverflow {
        height: 280px !important;
    }

    .royalSlider.heroSlider3,
    .royalSlider.heroSlider3 .rsOverflow {
        height: 280px !important;
    }

    .royalSlider.heroSlider4,
    .royalSlider.heroSlider4 .rsOverflow {
        height: 280px !important;
    }

    .royalSlider.heroSlider,
    .royalSlider.heroSlider .rsOverflow {
        height: 400px !important;
    }

    /* .yellowTile, .imageTile {max-height: 180px;}*/

    .royalSlider.heroSliderVH,
    .royalSlider.heroSliderVH .rsOverflow {
        height: 360px !important;
        min-height: 360px;
        max-height: 360px;

        /* min-height: 360px;
       max-height: 440px;*/
    }

    .infoBlockGen4 {
        /*top: 12%;
    left: 18%;*/
        top: 48%;
        left: 12%;
    }

    .infoBlockGen4 h2.slogan {
        font-size: 2.0em;
        line-height: 1.2em;
    }

    .fullrow dd:first-of-type {
        padding-left: 5%;
    }

    h5.introTitle {
        font-size: 1.4rem;
    }

    .introSection p {
        font-size: 2rem;
    }

    .CatalystGridModelSizeCell h5 {
        font-size: .6rem;
    }

    p.catalyst-productname {
        text-align: center;
        padding: 0 0;
    }

    .BrakeServiceProductIntro h1.lgHeading {
        font-size: 2.6rem;
        letter-spacing: .8rem;
        margin-bottom: 1.5rem;
        margin-top: 1.5rem;
    }

    .CatalystGridHeadingCell img.CatalystModelLogoFixedSize {
        max-width: 5rem;
    }

    .CatalystGridHeadingCell h6 {
        margin-top: 1.2rem;
        font-size: .6rem;
        letter-spacing: 0.06rem;
    }

    .teamLogo img {
        padding-top: 0;
    }

    h1.XLheading {
        font-size: 2.2rem;
    }
}

/*here*/

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .infoBlock2 h1 {
        font-size: 28px;
    }

    .infoBlock2 h5 {
        font-size: 16px;
    }

    .photoCredit p {
        font-size: .4em;
    }

    .infoBlockGen4 h2.slogan {
        font-size: 3.0em;
        line-height: 1.2em;
    }

    .infoBlock2 h1 {
        font-size: 2rem;
    }

    .royalSlider.heroSlider4,
    .royalSlider.heroSlider4 .rsOverflow {
        height: 320px !important;
    }

    h1.XLheading {
        font-size: 2.8rem;
    }
}

@media only screen and (min-width: 768px) {
    div.CatalystModelIntro div.vCen {
        padding-left: 30%;
    }

    div.CatalystModelIntroImage div.vCen {
        padding-right: 10%;
    }
}

@media only screen and (min-width: 640px) and (max-width: 1024px) {
    .BrakeServiceProductIntro {
        top: 10%;
    }

    .BrakeServiceProductIntro h4.lgHeading {
        margin-top: 0;
    }

    .BrakeServiceProductIntro h1.lgHeading {
        margin-top: 0;
    }

    .tilerow > div.feature_tile3 {
        padding: 3rem 6rem;
    }
}

@media only screen and (min-width: 1025px) {
    #mainContent {
        padding-top: 0px;
    }

    img.catalystLogo {
        padding-top: 20px;
    }

    .product-MainImage {
        padding-top: 40px;
    }

    .BrakeServiceProductIntro {
        top: 5%;
    }

    .BrakeServiceProductFeatureImageContainer img {
        max-width: 70%;
    }
}

@media only screen and (min-width: 1025px) and (max-width: 1399px) {
    .BrakeServiceProductIntro h1.lgHeading {
        font-size: 2.8rem;
        letter-spacing: .55rem;
    }

    .BrakeServiceProductIntro {
        max-width: 55%;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .BrakeServiceProductIntro h1.lgHeading {
        font-size: 2.2rem;
        letter-spacing: .4rem;
    }

    .BrakeServiceProductIntro {
        max-width: 60%;
    }
}

@media only screen and (min-width: 640px) {
    .BrakeServiceProductFeatureImageContainer {
        position: relative;
    }

    .BrakeServiceProductIntro {
        position: absolute;
    }

    .BrakeServiceProductFeatureImageContainer img {
        margin-left: 0;
    }
}

@media only screen and (max-width: 640px) {
    img.cataloguePreview {
        max-width: 70%;
    }
}

@media only screen and (min-width: 1600px) {
    img.catalystLogo {
        max-width: 360px;
    }

    .BrakeServiceProductIntro {
        top: 20%;
    }
}

@media screen and (min-width:960px) and (min-height:660px) {
    #main {
        padding-top: 30px;
        padding-bottom: 50px;
    }
}

@media screen and (min-width:960px) and (min-height:1000px) {
    .infoBlock {
        padding: 10px;
        height: auto;
        max-height: 90%;
    }

    .infoBlock h3 {
        font-size: 14px;
        line-height: 17px;
    }
}

/* iPads (landscape) ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    /* Styles */

    [class*="block-grid-"] {
        display: block;
        padding: 0;
        margin: 0 0;
    }

    #main-wrapper {
        padding-top: 0px;
    }
}

/* where main nav converts to mini ----------- */

@media only screen and (max-width: 767px) {
    /* Styles */

    .subNav {
        padding-top: 0px;
    }

    .subNav li,
    .subNav li li {
        font-size: .8em;
    }

    div.sidebar.panel {
        padding: .8rem;
    }

    .infoBlockGen3 {
        display: none;

        /* position: absolute;
            top: 60px;
            left: 30px;
            padding-bottom: 0;
           
            overflow: hidden;
            padding: 16px 16px 16px 16px;*/
    }

    div#full-width-slider.heroSliderVH div.rsGCaption {
        display: block;
    }

    div.rsGCaption p {
        padding: 0 0;
        margin: 0 0;
    }

    .compoundLogo {
        margin-top: 0px;
    }

    span.productName,
    div.PN-EAN.PN-EAN_2 {
        font-size: 0.7125rem;
    }

    .discModelName h4 {
        font-size: 0.8em;
        font-family: "orgonbold", sans-serif;
        padding: 0 0;
    }

    /* the lockup at about the old label's size, clear of the pad photos */
    .discModelName svg.lockup {
        max-width: 52px;
    }

    .CatalystGridModelSizeCell h4 {
        font-size: 0.6em;
        font-family: "orgonlight", sans-serif;
        padding: 0 0;
        margin-top: 0.8rem;
    }

    .superDetail_container .label {
        font-size: .6rem;
    }

    .superDetail_container .secondary {
        display: none;
    }

    .product-heading {
        text-align: center;
    }

    .product-heading h2 {
        font-size: 2.2rem;
    }

    div.container .tabs {
        margin-top: 2.6rem;
    }

    div.container .tabs dd > a {
        font-size: .8rem;
    }

    div.container ul,
    div.container p,
    div.container table thead tr th,
    div.container table thead tr td {
        font-size: 80%;
    }

    p.product-detail-label {
        padding: 1.4rem 1.4rem;
    }

    .gravelbrakeHeroRow h1 {
        top: 15%;
        font-size: 2rem;
        letter-spacing: .2rem;
    }

    .tilerow > div.feature_tile4 {
        padding: 3rem 3rem;
    }
}

@media only screen and (max-width: 1158px) {
    h2.leadTitle {
        font-size: 1.8rem;
        line-height: 1.6rem;
    }

    div.catalystLogo ul {
        font-size: 1rem;
    }

    .feature_1 h2,
    .feature_2 h2 {
        font-size: 1.8rem;
        margin: 0 0 10px 0;
        line-height: 1.6rem;
    }

    .feature_1 p.blockLight,
    .feature_2 p.blockLight {
        font-size: 1rem;
    }

    .modal-text p {
        font-size: 13px;
        line-height: 14px;
    }

    .tilerow > div.feature_tile3 {
        padding: 3rem 6rem;
    }
}

/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */

/* Portrait */

/* Landscape */

/* ----------- iPhone 5 and 5S ----------- */

/* Portrait and Landscape */

/* Portrait */

/* Landscape */

/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */

/* Portrait */

/* Landscape */

/* --- iPhone X ---- */

@media only screen and (device-width : 375px) and (device-height : 812px) and (-webkit-device-pixel-ratio : 3) {
    .fullrow dd:first-of-type {
        padding-left: 5%;
    }
}

/* ----------- iPhone 6+ ----------- */

/* Portrait and Landscape */

/* Portrait */

/* Landscape */

@media only screen and (min-width: 768px) and (max-width: 984px) {
    .royalSlider.heroSlider,
    .royalSlider.heroSlider .rsOverflow {
        height: 480px !important;
    }

    .royalSlider.heroSlider2,
    .royalSlider.heroSlider2 .rsOverflow {
        height: 480px !important;
    }

    .royalSlider.heroSlider3,
    .royalSlider.heroSlider3 .rsOverflow {
        height: 400px !important;
    }
}

#footer .row {
    padding-top: .8rem;
    padding-bottom: .8rem;
}

/* Footer text links (aligned with social icon style) */

#footer ul.footerlinks {
    list-style: none;
    margin: 0 0 0.5rem 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

#footer ul.footerlinks li {
    margin: 0;
    padding: 0;
}

/* 36px clickable pill */

#footer ul.footerlinks li a {
    display: inline-flex;
    align-items: center;
    height: 36px;
    padding: 0 12px;

    /* horizontal padding only */
    border-radius: 3px;
    font-size: 0.875rem;
    line-height: 1;
    color: #999;
    text-decoration: none;
    background: transparent;
    transition: background-color 0.15s ease, color 0.15s ease;
}

/* Hover = same treatment as icons */

#footer ul.footerlinks li a:hover {
    background-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}

/* Keyboard focus */

#footer ul.footerlinks li a:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.6);
    outline-offset: 2px;
    background-color: rgba(255, 255, 255, 0.12);
    color: #fff;
}

/* Current item stays neutral */

#footer ul.footerlinks li.current a:hover,
#footer ul.footerlinks li.current a:focus-visible {
    background-color: transparent;
}

.subNav a {
    text-decoration: none;
}

.subNav li {
    margin: 4px 2px;
    font-size: 1em;
    font-weight: 600;

    /*background: #fff;
   border: 1px solid #ddd;
   padding: .5em;*/
}

.subNav li li {
    border: none;
    font-size: 1em;
    font-weight: 400;
    padding: 0;
    margin: 0px 2px;
    border-bottom: 1px solid #e6e6e6;
}

.subNav li a {
    padding: .2em .4em;
    display: block;
    width: 100%;
}

.subNav li li a {
    display: block;
    width: 100%;
}

/**/

.subNav li a:hover {
    background: #282828;
    color: #fff;
}

.subNav li.current a {
    color: #888;
}

.subNav .active {
    color: #282828;
    padding: .2em .4em;
    background: #fce400;
    display: block;
    width: 100%;
}

.subNav a.active {
    border-bottom: 1px solid #fff;
}

.newsOverviewImage {
    max-height: 240px;
}

.hideThis {
    display: none;
}

.fwImage {
    margin-bottom: 20px;
}

/* rs images in box starts here*/

#gallery-t-group {
    width: 100%;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

#gallery-t-group .rsThumb {
    float: left;
    overflow: hidden;

    /* width: 56px;
  height: 56px;*/
    margin-right: 1px;
}

#gallery-t-group .rsThumbs {
    /*width: 285px;
  height: 100%;
  position: absolute;
  top: 0;
  padding: 0 0 0 1px;
  right: 0;*/

    /*height: auto;*/
    width: 100%;
    overflow: hidden;
    padding-top: 10px;
}

#gallery-t-group .rsGCaption {
    /*right: 285px;*/
    line-height: 12px;
    padding: 1px 7px;
    font-size: 11px;
    background: #EEE;
    position: absolute;
    width: auto;
    bottom: 0;
    float: none;
    text-align: left;
}

/* Non-linear resizing on smaller screens */

@media screen and (min-width: 0px) and (max-width: 900px) {
    #gallery-1 {
        padding: 12px 0 12px;
    }

    #gallery-1 .rsOverflow,
    .royalSlider#gallery-1 {
        height: 200px !important;
    }

    img.catalystLogo {
        padding-top: 20px;
        max-width: 90%;
    }

    .tilerow > div.feature_tile3 {
        padding: 3rem 4rem;
    }
}

@media screen and (min-width: 0px) and (max-width: 500px) {
    #gallery-1 .rsOverflow,
    .royalSlider#gallery-1 {
        height: 300px !important;
    }
}

/* royal slider visible nearby end*/

.compounds-secondary {
    font-size: 18px;
    padding-top: 20px;
    font-weight: 700;
}

.compound-table {
    width: 100%;
}

.keeptight {
    padding: 0 0;
    margin: -12px 0 20px 0;
}

@media screen and (min-width: 0px) and (max-width: 1200px) {
    #gallery-t-group .rsThumbs {
        /*  width: 228px;*/
        width: 100%;
    }
}

@media screen and (min-width: 0px) and (max-width: 760px) {
    #gallery-t-group .rsThumbs {
        left: 0;
        position: relative;
        width: 100%;
        height: auto;
        padding: 1px 0 0 1px;
    }

    #gallery-t-group .rsThumbsContainer {
        height: auto !important;
    }

    #gallery-t-group .rsGCaption {
        right: 0;
    }

    .main-nav-block {
        min-height: 160px;
    }
}
