/* ---------------------------------------------------------------------
Original Author: Chris Cheney
Contributors: Michael Start, Peter Marty

Target Browsers: All
Media Type: Screen, Projection
Width: Min-Width 768px
------------------------------------------------------------------------ */

body:after { content: 'medium' !important; }

/* ---------------------------------------------------------------------
 Wrappers
------------------------------------------------------------------------ */
.wrapper { width: 727px; }

.wrapper_extended {
    width: 768px;
}

/* ---------------------------------------------------------------------
 Grid
 Generated with cssgrid v0.7 at 2013-12-02 18:03:53
 cssgrid --units=percent --cols=10 --col-width=67 --gutter=30 --max-width=940
------------------------------------------------------------------------ */
.grid { margin-bottom: 0; }

.grid: { *zoom: 1; /* clear for lte ie7 */ }

.grid:before,
.grid:after {
    display: table;
    content: " ";
}

.grid:after { clear: both; }

.grid-col {
    position: relative;
    float: left;
}

.grid-col + .grid-col { margin-left: 3.1914893617021%; }

.grid-col_1of10 { width: 7.1276595744681%; }
.grid-col_2of10 { width: 17.446808510638%; }
.grid-col_3of10 { width: 27.765957446809%; }
.grid-col_4of10 { width: 38.085106382979%; }
.grid-col_5of10 { width: 48.404255319149%; }
.grid-col_6of10 { width: 58.723404255319%; }
.grid-col_7of10 { width: 69.042553191489%; }
.grid-col_8of10 { width: 79.36170212766%; }
.grid-col_9of10 { width: 89.68085106383%; }
.grid-col_10of10 { width: 100%; }

.grid-col_push1of10 { left: 10.31914893617%; }
.grid-col_push2of10 { left: 20.63829787234%; }
.grid-col_push3of10 { left: 30.957446808511%; }
.grid-col_push4of10 { left: 41.276595744681%; }
.grid-col_push5of10 { left: 51.595744680851%; }
.grid-col_push6of10 { left: 61.914893617021%; }
.grid-col_push7of10 { left: 72.234042553191%; }
.grid-col_push8of10 { left: 82.553191489362%; }
.grid-col_push9of10 { left: 92.872340425532%; }
.grid-col_push10of10 { left: 100%; }

.grid-col_pull1of10 { left: -10.31914893617%; }
.grid-col_pull2of10 { left: -20.63829787234%; }
.grid-col_pull3of10 { left: -30.957446808511%; }
.grid-col_pull4of10 { left: -41.276595744681%; }
.grid-col_pull5of10 { left: -51.595744680851%; }
.grid-col_pull6of10 { left: -61.914893617021%; }
.grid-col_pull7of10 { left: -72.234042553191%; }
.grid-col_pull8of10 { left: -82.553191489362%; }
.grid-col_pull9of10 { left: -92.872340425532%; }
.grid-col_pull10of10 { left: -100%; }

.grid-col_prefix1of10 { margin-left: 10.31914893617%; }
.grid-col_prefix2of10 { margin-left: 20.63829787234%; }
.grid-col_prefix3of10 { margin-left: 30.957446808511%; }
.grid-col_prefix4of10 { margin-left: 41.276595744681%; }
.grid-col_prefix5of10 { margin-left: 51.595744680851%; }
.grid-col_prefix6of10 { margin-left: 61.914893617021%; }
.grid-col_prefix7of10 { margin-left: 72.234042553191%; }
.grid-col_prefix8of10 { margin-left: 82.553191489362%; }
.grid-col_prefix9of10 { margin-left: 92.872340425532%; }
.grid-col_prefix10of10 { margin-left: 100%; }

.grid-col_suffix1of10 { margin-right: 10.31914893617%; }
.grid-col_suffix2of10 { margin-right: 20.63829787234%; }
.grid-col_suffix3of10 { margin-right: 30.957446808511%; }
.grid-col_suffix4of10 { margin-right: 41.276595744681%; }
.grid-col_suffix5of10 { margin-right: 51.595744680851%; }
.grid-col_suffix6of10 { margin-right: 61.914893617021%; }
.grid-col_suffix7of10 { margin-right: 72.234042553191%; }
.grid-col_suffix8of10 { margin-right: 82.553191489362%; }
.grid-col_suffix9of10 { margin-right: 92.872340425532%; }
.grid-col_suffix10of10 { margin-right: 100%; }

.grid-col_1of4 { width: 25%; }
.grid-col_2of4 { width: 50%; }
.grid-col_3of4 { width: 75%; }
.grid-col_4of4 { width: 100%; }

.grid-col_10to6 { width: 100%; }

.grid-col_wide { width: 30.9%; }

.grid-col + .grid-col_collapse { margin-left: 0; }

.grid-col_clear { clear: left; }

.grid-col_opposite { float: right; }

/* ---------------------------------------------------------------------
 formGrid:

 Provides pixel units, inline-block, and box-sizing alternative
------------------------------------------------------------------------ */

.formGrid-col_5of10 {
    width: 50%;
}

/* ---------------------------------------------------------------------
 Page Backgrounds
------------------------------------------------------------------------ */
.pageBg_portal { background-image: url(../images/bg_home.jpg); }

.pageBg_dogWalk { background-image: url(../images/bg_article_tablet.jpg); }

.pageBg_ourIngredients { background-image: url(../images/bg_our-ingredients.jpg); }

.pageBg_benchLake { background-image: url(../images/bg_benchLake_desktop.png); }

.pageBg_catOnBack { background-image: url(../images/bg_catOnBack.jpg); }

.pageBg_foodBowl_dog { background-image: url(../images/bg_foodBowl_dog.jpg); }

.pageBg_portalIndex {
    background-image: url(../images/bg_portalIndex_medium.jpg);
    background-size: cover;
}

/* ---------------------------------------------------------------------
 Utilities
------------------------------------------------------------------------ */
.isDisplayedMD {
    display: block;
}

.isNotDisplayedMD {
    display: none;
}

/* ---------------------------------------------------------------------
 Body Content
------------------------------------------------------------------------ */
.page { border: 0; }

.mix-page_borderTop { border-top: 9px solid #a71c20; }

.mix-page_borderBottom { border-bottom: 9px solid #a71c20; }

.mix-page-interact_borderBottom { border-bottom: 9px solid #a71c20; }

.mix-page-interact_borderBottom .blocks_tight { margin-bottom: -4px; }

/* ---------------------------------------------------------------------
 Buttons
------------------------------------------------------------------------ */
.btn_switch {
    width: auto;
    padding: 10px 22px;
    font-size: 13px;
}

.btn_cta { padding: 20px 0; }

.btn_action { padding: 20px 0; }

.btn_smallToLarge { padding: 12px 30px; }

.btn_plus { width: auto; }

.btn_social {
    padding: 8px 18px;
    font-size: 10px;
}

.btn_wideToShort {
    width: auto;
    padding: 8px;
}

.btn_hero {
    padding: 14px 21px;
    font-size: 16px;
    color: #ffffff;
    letter-spacing: 0;
}

.btn_signup {
    padding: 14px;
    min-width: 0;
}

.btn_fusePump { 
    padding: 12px;
    width: 100%;
    max-width: 230px;
    transition-duration: .25s;
    border: none;
    cursor: pointer;
}

/* ---------------------------------------------------------------------
 fusePump: Controls the layout of buttons used for fuse pump api
------------------------------------------------------------------------ */
.fusePump {
    text-align: left;
}

/* ---------------------------------------------------------------------
 Hero
------------------------------------------------------------------------ */
.hero {
    position: relative;
    padding: 0;
    border-top: 10px solid #a71c20;
    background: #ffffff;
}
.hero sup {
    vertical-align: super;
    font-size: 70%;
}

.hero-cta {
    position: absolute;
    top: 55px;
    left: 97px;
    font-weight: 300;
    line-height: 1.05;
    color: #414042;
    text-align: left;
}

.hero_imgSplit .hero-cta {
    left: 55px;
}

.hero_imgSplit .hero-cta-hd {
    width: 350px;
    color: #414042;
}

.hero-cta-hd {
    width: 500px;
    margin-bottom: 10px;
    font-size: 32px;
    letter-spacing: 1.4px;
}

.shelter-hero .hero-cta-hd {
    font-size: 32px;
}

.hero-cta-bd {
    width: 240px;
    margin-bottom: 28px;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 400;
}

.hero_imgSplit .hero-cta-hd {
    padding: 0;
}

.hero_imgSplit .hero-cta-bd {
    padding: 0;
}

.hero-media-img {
    display: block;
    margin: 0;
}

.hero_imgSplit .hero-media-img {
    margin-bottom: 0;
}

@media (max-width: 991px) {
    .hero_hasImageInSmall .hero-cta-hd {
        font-size: 36px;
        width: 320px;
    }

    .hero_hasImageInSmall_short .hero-cta-hd {
        width: 342px;
    }

    .hero_hasImageInSmall .hero-cta-bd {
        width: 320px;
    }

    .hero_hasImageInSmall_short .hero-cta-bd {
        width: 348px;
    }
}

/* ---------------------------------------------------------------------
 lesserNav
------------------------------------------------------------------------ */
.lesserNav { display: block; }

/* ---------------------------------------------------------------------
 Zoom Hero
------------------------------------------------------------------------ */
.zoomHero-wrap {
    padding-top: 93px;
    padding-bottom: 0;
}

.zoomHero-wrap-heading {
    margin-bottom: 14px;
    font-size: 24px;
    letter-spacing: 0.03em;
    line-height: 1.1;
}

.zoomHero-wrap-heading-emphasis {
    font-size: 34px;
}

.zoomHero-wrap-subHeading {
    margin-bottom: 13px;
    font-size: 15px;
}

.zoomHero-wrap-cta {
    margin-bottom: 35px;
}

.zoomHero-wrap-cta > .btn { /* Controls the styling of cta. the btn has no extensions. Overriding style from cta parent. */
    padding: 14px;
    min-width: 136px; /* This is for matching the current product image width */
}

.zoomHero-wrap-zoom {
    margin-bottom: 35px;
}


.zoomHero-wrap-zoom-media {
    top: -253px;
    z-index: 0;
}

.zoomHero-wrap-zoom-toggleMedia-mag {
    left: 243px;
    top: -168px;
}

.zoomHero-wrap-zoom-toggleMedia-overlay {
    left: 55px;
    top: -486px;
}

.zoomHero-wrap-zoom-toggleMedia-overlay > img {
    width: 78px;
}

.zoomHero-wrap-media {
    top: 0;
}

.zoomHero-wrap-media img,
.zoomHero-wrap-zoom-toggleMedia-overlay > img {
    max-width: 270px;
}

.zoomHero-wrap-media-figure-caption {
    display: block;
    bottom: -45px;
    left: 24px;
}

.zoomHero-wrap-media-cta {
    display: none;
}

.zoomHero-wrap-product {
    margin-bottom: 0;
}

.zoomHero-wrap-subCta { /* Is hidden on medium breakpoint and up. */
    overflow: hidden !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    border: 0 !important;
    padding: 0 !important;
    position: absolute !important;
    clip: rect(1px 1px 1px 1px) !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
}

.zoomHero-wrap-bodyCopy {
    position: absolute;
    right: 20px;
    top: 452px;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}

.zoomHero-wrap-mediaStack {
    position: absolute;
    right: 80px;
    top: 230px;
}

/* Styles specifically for when it's desktop none-touch-screen instance*/
.no-touch .zoomHero-wrap-zoom-cta {
    display: none;
}

.no-touch .zoomHero-wrap-media-cta {
    display: inline-block;
    position: absolute;
    white-space: nowrap;
    left: 9px;
    bottom: 109px;
}

.no-touch .zoomHero-wrap-cta {
    margin-bottom: 60px;
}

.no-touch .zoomHero-wrap-subHeading {
    margin-bottom: 47px;
}

/* ---------------------------------------------------------------------
 ReviewStack:

 object containing a quote, image, and user info stacked
 vertically
------------------------------------------------------------------------ */
.reviewStack {
    max-width: 130px;
}

.reviewStack_mdUp {
    display: block;
}

.reviewStack-quote {
    margin-bottom: 10px;
}

.reviewStack-quote-content {
    font-size: 13px;
}

.reviewStack-media {
    margin-bottom: 11px;
}

.reviewStack-user {
    font-size: 12px;
    line-height: 1.2;
}

/* ---------------------------------------------------------------------
 Media Review
------------------------------------------------------------------------ */
.mediaReview {
    position: relative;
    padding: 42px 12px 35px;
}

.mediaReview-hd {
    max-width: 183px;
    position: absolute;
    left: 91px;
    bottom: 59px;
    font-size: 12px;
    line-height: 1.2;
    letter-spacing: 0.13em;
}

.mediaReview-quote {
    margin: 0 auto 12px;
    max-width: none;
    font-family: "ff-meta-serif-web-pro", Georgia, Times, "Times New Roman", serif;
    font-style: italic;
    font-size: 24px;
    line-height: 1.4;
}

.mediaReview-user {
    font-size: 13px;
    text-transform: uppercase;
    margin-bottom: 19px;
}

.mediaReview-mediaTrigger {
    display: inline-block;
    margin-bottom: 15px;
}

.mediaReview-ft {
    max-width: 126px;
    position: absolute;
    right: 127px;
    bottom: 75px;
    font-size: 12px;
    line-height: 1.2;
    letter-spacing: 0.13em;
}

/* ---------------------------------------------------------------------
 ParaLinker
------------------------------------------------------------------------ */
.paraLinker {
    padding: 22px 0px 30px;
    text-align: center;
}

.paraLinker > * {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.paraLinker-hd {
    margin-bottom: 6px;
}

.paraLinker-hd > * {
    font-size: 32px;
    line-height: 1.2;
}

.paraLinker-bd {
    margin-bottom: 9px;
}

.paraLinker-bd > * {
    font-size: 13px;
}

.paraLinker-ft > .btn {
    padding: 13px 15px;
    font-size: 12px;
}

/* ---------------------------------------------------------------------
 Switch CTA
------------------------------------------------------------------------ */
.switchCta {
    padding: 50px 0;
    border-bottom: 10px solid #a71c20;
}

.switchCta-links > * {
    min-width: 140px;
}

.switchCta-links > * + * {
    margin-top: 0;
    margin-left: 30px;
}

/* ---------------------------------------------------------------------
 Portal
------------------------------------------------------------------------ */
.portal {
    margin-top: 0px;
    margin-bottom: 76px;
}

.portal_clipped {
    margin-top: -30px;
    margin-left: -44px;
    margin-bottom: 0;
}

.portal_collapse { padding: 0; }

.portal-hd { margin-bottom: 22px; }

.portal-hd_collapse {
    margin: 0;
    text-align: left;
}

.portal-bd { padding: 0; }

/* ---------------------------------------------------------------------
 Quote
------------------------------------------------------------------------ */
.quote-citation,
.quote-citation-bar,
.quote-citation-source { font-size: 18px; }

/* ---------------------------------------------------------------------
 User Quote
------------------------------------------------------------------------ */
.userQuote {
    padding: 75px 40px;
    font-size: 16px;
    text-align: center;
}
.userQuote:before { left: 50%; }

.userQuote-citation,
.userQuote-citation-bar,
.userQuote-citation-source { font-size: 13px; }

/* ---------------------------------------------------------------------
 Tabs Nav
------------------------------------------------------------------------ */
.tabs-nav {
    width: 100%;
    margin-bottom: 0;
    padding-bottom: 0;
    font-size: 0;
    background-color: transparent;
}

.tabs-nav > * {
    display: inline-block;
    text-align: center;
}

.tabs-nav > * + * { margin-left: 1px; }

.tabs-nav-link {
    display: table-cell;
    height: 41px;
    padding: 0;
    vertical-align: middle;
    font: 700 11px/1.0 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #ffffff;
    background-color: #aaa18b;
}

.tabs-nav > * > * { width: 144px; }

.no-touch .tabs-nav-link:hover { background-color: #f0ece2; }

.tabs-nav-link_isActive {
    color: #4c4940;
    background-color: #f0ece2;
}

/* ---------------------------------------------------------------------
 Lesser Nav
------------------------------------------------------------------------ */
.lesserNav {
    display: block; /* displaying this starting with the medium breakpoint */
}

/* ---------------------------------------------------------------------
 Tabs Content
------------------------------------------------------------------------ */
.tabs {}

.tabs-content { background-color: #f0ece2; }

.tabs-content_compressedTablet { padding-bottom: 0; }

.tabs-content_compressed { padding-bottom: 0; }

.tabs-content-item_isActive {
    display: block;
    overflow: hidden;
    padding: 0;
}

.tabs-content-item-bd {
    padding: 45px 0 0 45px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    -ms-box-sizing:     border-box;
    -o-box-sizing:      border-box;
    box-sizing:         border-box;
}

.tabs-content-item-bd_tall { padding: 48px 0 60px 45px; } /* bottom padding creates required tab-content bottom padding of 60px */

.tabs-content-item-bd_fill { padding: 45px 45px 38px 45px; }

.tabs-content-item-bd_collapse { padding: 0px 0px 0px 0px; }

.tabs-content-item-ft {
    padding: 0 45px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    -ms-box-sizing:     border-box;
    -o-box-sizing:      border-box;
    box-sizing:         border-box;
}

.tabs-content-item-bd .userContent p:last-child { margin-bottom: 0; }

.tabs-content-item_tight {
    padding: 40px 20px 28px 20px;
    background: #f0ece2;
}

/* ---------------------------------------------------------------------
 Stack
------------------------------------------------------------------------ */
.stack {
    background: transparent;
}

.stack-bd {
    background: #ffffff;
    margin-bottom: 15px;
    padding: 15px 60px 25px 60px;
}

.stack-img {
    line-height: 0;
}

.stack .btn {
    width: auto;
    padding: 14px 35px;
    font-weight: 700;
}

/* ---------------------------------------------------------------------
 Blocks TODO: CLEAN UP
------------------------------------------------------------------------ */
.blocks { margin-left: -2%; }

.blocks > * {
    display: inline-block;
    margin-left: 2%;
    vertical-align: top;
}

.blocks_wide { margin-left: -4.2%; }

.blocks_stacked > * { margin-bottom: 0; }

.blocks_spaced_large > * + * { margin-top: 0px; }

.blocks_1up > * { width: 48%; }

.blocks_2up > * { width: 48%; }

.blocks_3up > * { width: 31.3%; }

.blocks_4up > * { width: 23%; }

.blocks_1upto2up { margin-left: -2%; }

.blocks_1upto2up > * {
    width: 48%;
    margin-left: 2%;
}

.blocks_1upto2upto3up > * { width: 49.2%; }

.blocks_1upto2up_wide { margin: 0 0 30px -4.2%; }
.blocks_1upto2up_wide > * { margin-left: 4.2%; }
.blocks_1upto2up_wide > * { width: 45.8%; }
.blocks_1upto2up_seperated > * + * {
    border-top: none;
    border-left: 1px solid #dcd9cc;
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    -ms-box-sizing:     border-box;
    -o-box-sizing:      border-box;
    box-sizing:         border-box;
}

.blocks_1upto4up > * { width: 23%; }

.blocks_1upto4up_wide > * { width: 22.45%; }

.blocks_1upto4up_wide > *:nth-child(4n-1) { margin-left: 4.2%; }

.blocks_2upTo4up { margin-left: -5px; }

.blocks_2upTo4up > * { margin-left: 5px; }

.blocks_2upTo4up > * { width: 133px; }

.blocks_2upTo4up_uneven > * { width: 109px; }

.blocks_2upTo4up_uneven > *:nth-child(-n+3) { width: 109px; }

.blocks_2upTo1up > * { width: 100%; }

.blocks_1upto3up > * { width: 31.3333%; }

.blocks_1upto3up_seperated { padding: 0 20px; }

.blocks_1upto3up_seperated > * {
    margin: 0 0 0 2%;
    border-bottom: none;
}

.blocks_2upTo5up > * { width: 273px; }

.blocks_tight { margin-left: -4px; }

.blocks_tight > * { margin: 0 0 4px 4px; }

.mix-blocks_tall > * { padding-bottom: 60px; }

.mix-blocks_evenMargin { margin-left: -4.5%; }

.mix-blocks_evenMargin > * {
    width: 45.5%;
    margin-left: 4.5%;
}

.mix-blocks_centered {
    margin-left: 0;
    text-align: center;
}

.mix-blocks_centered > * {
    width: 49%;
}

.blocks_2up.mix-blocks_centered > *:nth-child(2n+1)  {
    margin-left: 0;
}

/* ---------------------------------------------------------------------
 Text
------------------------------------------------------------------------ */
.txt {
    font-size: 16px;
    line-height: 1.5;
}

.txt_sans {
    font-size: 14px;
    line-height: 1.3;
}

.txt_constant { font-size: 12px; }

.txt_sans {
    font-size: 14px;
    line-height: 1.3;
}

.txt_constant { font-size: 12px; }

.txt_legalese {
    font-size: 8px;
}

/* ---------------------------------------------------------------------
 Call
------------------------------------------------------------------------ */
.call {
    padding: 30px 40px;
    background: #ffffff;
}

.call-hd {
    display: inline-block;
    text-transform: none;
}

.call-hd > * {
    margin-right: 1px;
    font: 700 20px/1.4 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-align: inherit;
}

.call-bd {
    display: inline-block;
    text-align: inherit;
}

.call-bd > * {
    font-size: 20px;
    text-align: inherit;
}

/* ---------------------------------------------------------------------
 Header
------------------------------------------------------------------------ */
.header {
    width: 100%;
    display: inline-block;
    position: relative;
    margin-bottom: 25px;
}

.header-hd { margin-bottom: 40px; }

.header-hd:before,
.header-hd:after {
    content: " ";
    display: table;
}

.header-hd:after { clear: both; }

/* ---------------------------------------------------------------------
 Header Intro
------------------------------------------------------------------------ */
.headerIntro { width: 50%; }

/* ---------------------------------------------------------------------
 Logo
------------------------------------------------------------------------ */
.logo {
    margin: -14px 0 0 -20px;
    float: left;
}

.logo:before,
.logo:after {
    content: " ";
    display: table;
}

.logo:after { clear: both; }

.logo-inner { text-align: left; }

/* ---------------------------------------------------------------------
 Menu
------------------------------------------------------------------------ */
.menu:before,
.menu:after {
    content: " ";
    display: table;
}

.menu:after { clear: both; }

.menu-list {
    margin-top: 0;
    position: absolute;
    top: 35px;
    right: 0;
}

.menu-list > * {
    width: auto;
    text-align: left;
}

.menu-list > *:nth-child(2) {
    margin-left: 35px;
    margin-right: 0;
}

.menu-list > * + * {
    margin-left: 35px;
    padding: 0;
    overflow:visible;
}

.menu-list-item-link {
    font-size: 13px;
    letter-spacing: 0.028em;
}

/* ---------------------------------------------------------------------
 Search
------------------------------------------------------------------------ */
.header-ft {
    width: 441px;
    position: absolute;
    bottom: 0;
    right: 0;
}

.search-bd { margin-bottom: 0; }

.search-bd + .search-ft { margin-top: 12px; }

.search-ft { overflow: hidden; }

.search-ft-title {
    width: 70px;
    padding-right: 30px;
    margin-bottom: 10px;
    float: left;
    font: 700 12px/1.2 "futura-pt", Futura, "Century Gothic", AppleGothic, Verdana, sans-serif;
    color: #565656;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.search-ft-links {
    width: 500px;
    float: left;
}

/* ---------------------------------------------------------------------
 Search Form
------------------------------------------------------------------------ */
.searchForm-results a { font-size: 18px; }

/* ---------------------------------------------------------------------
 Portal Nav
------------------------------------------------------------------------ */
.portalNav {
    margin-top: 25px;
    float: right;
}

.portalNav a { font-size: 15px; }

.portalNav > * {
    display: inline-block;
    vertical-align: middle;
}

.theme-portalNav-item_dogs { color: #a71c20; }
.theme-portalNav-item_cats { color: #008caa; }

.portalNav > * + * { margin-left: 10px; }

.portalNav > *:first-child { float: none; } /* floats in screen */

.portalNav > *:last-child { float: none; } /* floats in screen */

/* ---------------------------------------------------------------------
 Portal Footer
------------------------------------------------------------------------ */
.portalFooter_tight { margin-top: 20px; }

.portalFooter_wide { width: 727px; }

.portalFooter-hd {
    padding: 25px 0;
    font-size: 18px;
}

.portalFooter-hd_alt {
    padding: 55px 150px 25px 150px;
    font-size: 20px;
    color: #4c4940;
}

.portalFooter-nav { text-align: center; }

.portalFooter-nav > * > * {
    display: inline-block;
    margin-bottom: 0;
}

.portalFooter-meta > * { padding: 0px 12px; }

.portalFooter-meta-link { font-size: 12px; }

.portalFooter-cta-list > * {
    display: inline-block;
    vertical-align: middle;
}

.portalFooter-cta-list > * + * { margin-left: 40px; }

.portalFooter-links-list > * {
    padding: 0 15px;
}

.portalFooter-links-list > *:nth-child(3) { border-left: 2px solid #4d4d4d; } /* none in screen */

/* ---------------------------------------------------------------------
 navList
------------------------------------------------------------------------ */
.navList { margin-left: -10px; }

.navList > * { margin: 0px 0px 0px 10px; }

.navList-link { font-size: 14px; }

/* ---------------------------------------------------------------------
 Placard
------------------------------------------------------------------------ */
.slide .placard { padding-bottom: 0; }

.slide .placard_compressed { background: #fdfbf8; }

.placard-img_small { height: 201px; }

.placard-hd {
    margin-bottom: 10px;
    font: 700 26px/1.05 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #4c4940;
    text-transform: uppercase;
}

.placard-img { float: left; }

.placard-img_invert { float: right; }

.placard-bd {
    padding-top: 132px;
    overflow:hidden;
}

.placard-bd_pullUp { margin-top: 0px;padding-top: 132px; }

.placard-bd_small { padding: 32px 45px 0 30px; }

.placard-bd-title { font-size: 28px; }

.placard-bd-desc { margin-bottom: 35px; }

.placard-bd-desc_pushDown { margin-bottom: 35px; }

.placard-bd-desc_large { font-size: 24px; }

.placard-bd-desc-highlight { font-size: 75px; }

.placard-ft { padding-bottom: 0; }

.placard_dogTheme .placard-cta_mobileFull {
    text-align: center;
}

.placard_dogTheme .placard-cta_mobileFull .btn {
    min-width: 140px; /* matches comp. */
    display: inline-block; /* resets screen */
    width: auto;
    padding: 14px 35px;
}

/*changing perceptions*/
.placard_changingPerceptions {
    padding-top: 0px;
    padding-left: 57px;
    padding-bottom: 0;
}

.placard_changingPerceptions .placard-bd {
    position: absolute;
    padding-top: 40px;
}

.placard_changingPerceptions .placard-bd-title {
    width: 261px;
    margin-bottom: 10px;
    text-align: left;
}

.placard_changingPerceptions .placard-bd-desc { width: 345px; }

/*Feeding is the First Step*/
.placard_feedingIsTheFirstStep .placard-hd {
    width: 100%;
    padding-top: 35px;
    padding-left: 123px;
    position: absolute;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.placard_feedingIsTheFirstStep .placard-bd {
    padding-top: 100px;
}

/*bowl by bowl*/
.placard_bowlByBowl { height: 382px; }

.placard_bowlByBowl .placard-img {
    width: 485px;
    padding-top: 86px;
    float: none;
}

.placard_bowlByBowl .placard-bd {
    width: 550px;
    margin: 0 auto;
}

.placard_bowlByBowl .placard-bd-desc { font-size: 16px; }

/*did you know*/
.placard_didYouKnow .placard-img { margin-bottom: 0; }

.placard_didYouKnow .placard-bd {
    width: 375px;
    padding-left: 40px;
}

.placard_didYouKnow .placard-ft {
    width: auto;
    margin: 0;
    padding-left: 40px;
}

/*did you know 2*/
.placard_didYouKnow2 { height: 382px; }

.placard_didYouKnow2 .placard-img {
    width: 650px;
    float: none;
}

.placard_didYouKnow2 .placard-bd {
    margin-bottom: 10px;
    padding: 30px 15px 15px 15px;
}

.placard_didYouKnow2 .placard-bd-title,
.placard_didYouKnow2 .placard-bd-desc {
    width: 414px;
    margin: 0 auto;
    text-align: center;
}

.placard_didYouKnow2 .placard-bd-title { margin-bottom: 20px; }

.placard_didYouKnow2 .placard-ft {
    width: auto;
    margin: 0;
    padding-left: 40px;
}

/*did you know 3*/
.placard_didYouKnow3 { height: 382px; }

.placard_didYouKnow3 .placard-bd {
    margin-bottom: 10px;
    padding: 30px 15px 15px 15px;
}

.placard_didYouKnow3 .placard-bd-title,
.placard_didYouKnow3 .placard-bd-desc {
    width: 597px;
    margin: 0 auto;
    text-align: center;
}

.placard_didYouKnow3 .placard-bd-title { margin-bottom: 20px; }

.placard_didYouKnow3 .placard-ft {
    width: 183px;
    margin: 0 auto;
}

/*what we're doing today*/
.placard_whatWereDoingToday .placard-hd { margin-bottom: 25px; }

/* ---------------------------------------------------------------------
 Wow
------------------------------------------------------------------------ */
.wow-value {
    margin-bottom: 10px;
    font-size: 65px;
}

.wow-meta {
    margin-bottom: 10px;
    font-size: 16px;
}

.mix-wow-meta_thin {
    font-weight: 100;
    font-size: 36px;
}

/* ---------------------------------------------------------------------
 Cycler
------------------------------------------------------------------------ */
.cycler { padding-bottom: 0px; }

.cycler-direction { top: 50%; }

.cycler-nav_pullUp { bottom: 25px; }

.cycler-nav_bg { bottom: 10px; }

.mix-cycler-nav_center {
    width: auto;
    bottom: 36px;
}

/* ---------------------------------------------------------------------
 Media
------------------------------------------------------------------------ */
.media,
.media-bd { overflow: hidden; }

.media_wide { padding: 18px 0; }

.media_wide > .media-img {
    margin-right: 18px;
}

.media_wide > .media-img_invert {
    margin-left: 18px;
    margin-right: 0;
}

.media-img { float: left; }

.media-img_invert { float: right; }

.media-img_pull { float: left; }

.media-img_wide { margin-right: 18px; }

.media-img_invert.media-img_wide { margin: 0 0 0 18px; }

.media-img_loose { padding: 0; }

.mix-media-img_constrain { width: 390px; }

.mix-media-img_spread { margin-right: 50px; }

.media-img_invert.mix-media-img_spread { margin: 0 0 0 100px; }

/* ---------------------------------------------------------------------
 Inventory
------------------------------------------------------------------------ */
.inventory {
    margin-bottom: 0;
    padding: 0 50px;
}

.inventory: { *zoom: 1; /* clear for lte ie7 */ }

.inventory:before,
.inventory:after {
    display: table;
    content: " ";
}

.inventory:after { clear: both; }

.inventory-col {
    padding-right: 23px;
    position: relative;
    float: left;
}

.inventory-col + .inventory-col { padding-right: 0; }

.inventory-col_1of2 { width: 122px; }

.inventory-col_2of2 { width: 436px; }

/* ---------------------------------------------------------------------
 Vertical Tags
------------------------------------------------------------------------ */
.verticalTags > * { margin-bottom: 7px; }

.verticalTags > *:last-child { margin-bottom: 0; }

.verticalTags > * {
    padding: 7px 0 7px 5px;
    text-transform: uppercase;
}

.verticalTags > * > * {
    display: block;
    font: 700 14px/1.0 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #4c4940;
    text-decoration: none;
}

.verticalTags > .verticalTags_isActive > * {
    position: relative;
    background-color: #a71c20;
    color: #ffffff;
}

.verticalTags > .verticalTags_isActive { padding: 0; }

.verticalTags > .verticalTags_isActive > * {
    padding: 7px 0 7px 5px;
    color: #ffffff;
}

.verticalTags .verticalTags_isActive > *:after {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    cursor: pointer;
    display: block;
    border-color: transparent;
    border-left-color: #a71c20;
    border-width: 14px;
    margin-top: -14px;
}

/* ---------------------------------------------------------------------
 Tags
------------------------------------------------------------------------ */
.tags > * { width: auto; }

/* ---------------------------------------------------------------------
 Feature
------------------------------------------------------------------------ */
.feature {
    display: table;
    height: 252px;
    padding: 0 0 0 39px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    -ms-box-sizing:     border-box;
    -o-box-sizing:      border-box;
    box-sizing:         border-box;
}

.feature_autoHeight {
    height: auto;
    padding: 39px;
}

.feature-hd {
    display: table-cell;
    vertical-align: middle;
    position: relative;
}

.feature-hd-heading {
    margin-bottom: 70px;
    padding-right: 20px;
}

.mix-feature-hd-heading_tight { margin-bottom: 0; }

.feature-hd-subHd { font-size: 18px; }

.feature-hd-datetime { font-size: 16px; }

.feature-hd-datetime { margin-bottom: 15px; }

/* ---------------------------------------------------------------------
 Spread
------------------------------------------------------------------------ */
.spread { background: transparent; }

/* ---------------------------------------------------------------------
 Pager
------------------------------------------------------------------------ */
.pager {
    width: auto;
    margin-left: 0px;
    text-align: left;
}

.mix-page_light { background: none; }

/* ---------------------------------------------------------------------
 Page
------------------------------------------------------------------------ */
.page-hd {
    margin-bottom: 0;
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, 0.88);
}

.page-hd_screen { background-color: rgba( 255, 255, 255, 0.88 ); }

.page-hd-overlay {
    background: #ffffff;
    background: rgba(255, 255, 255, 0.9);
}

.page-hd_clear { background: transparent; }

.page-bd_std { padding: 20px; }

.page-bd_bg { background: #f0ece2; }

.page-mid {
    padding: 40px 0 30px 40px;
    overflow: hidden;
}

.page-mid-aside {
    width: 260px;
    padding-top: 8px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}

.page-mid-aside-hd {
    margin-bottom: 22px;
    font-size: 14px;
    text-align: left;
}

.page-bd-content {
    width: 66.6666%;
    padding-top: 40px;
    float: left;
}

.page-bd-aside {
    width: 29.1%;
    padding: 40px 0 0 0;
    float: right;
}

.page-bd-aside-hd {
    margin-bottom: 25px;
    text-align: left;
}

.page-bd-aside-subHd {}

.page-bd-aside-bd {}

@media (max-width: 991px) {
    .page-bd_paddedUpToLarge {
        padding: 30px;
    }

    .page-bd_paddedUpToLarge_noBottomPadMed {
        padding-bottom: 0;
    }
}

/* ---------------------------------------------------------------------
 Horizontal List
------------------------------------------------------------------------ */
.hList_medium > * + * { margin-left: 35px; }

.hList_tabs { margin-left: -1%; }

.hList_piped_wide > * + * { padding-left: 15px; }

.mix-hList_orphan > *:last-child { margin-left: 15px; }


/* ---------------------------------------------------------------------
 Icon
------------------------------------------------------------------------ */
.icon_logo_home {
    width: 256px;
    height: 256px;
    background: transparent url(../images/icons/icon_logo_medium.png) 0 0 no-repeat;
}

.icon_logo_footer {
    width: 178px;
    height: 85px;
    background: transparent url(../images/logo_footer.png) 0 0 no-repeat;
}

.icon_panel-prev {
    width: 46px;
    height: 46px;
    background: transparent url(../images/icons/icon_panel-prev_large.png) 0 0 no-repeat;
}

.icon_panel-next {
    width: 46px;
    height: 46px;
    background: transparent url(../images/icons/icon_panel-next_large.png) 0 0 no-repeat;
}

/* ---------------------------------------------------------------------
 Article Promo
------------------------------------------------------------------------ */
.articlePromo { border-width: 4px; }

.articlePromo-img_fixed { max-height: 95px; }

.articlePromo-text_small { font-size: 13px; }

.articlePromo-text_tight {
    padding: 0 0 5px 5px;
    font-size: 15px;
}

.articlePromo-text_std { font-size: 15px; }

.mix-articlePromo-text_largeToSmall { font-size: 15px; }

/* ---------------------------------------------------------------------
 Spotlight
------------------------------------------------------------------------ */
.spotlight { margin-bottom: 0; }

.spotlight-hd { font-size: 32px;}

.spotlight-bd { font-size: 14px; }

/* ---------------------------------------------------------------------
 Speech
------------------------------------------------------------------------ */
.speech_stacked { overflow: visible; }

.speech_stacked_MobiletoTablet { overflow: visible; }

.speech-bd { margin-left: 16px; }

.speech-bd_collapse { margin-left: 0; }

.speech-bd-context {
    padding-right: 0;
    font-size: 12px;
}

.speech-bd-context_clear { clear: left; }

.speech-bd-context_narrow { padding-right: 25px; }

.speech-bd-bubble { font: 700 30px/1.0 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif; }

.speech-bd-bubble_centered { float: none; }

.speech-bd-bubble_small {
    width: 52px;
    height: 49px;
    padding-top: 14px;
    padding-right: 20px;
    font-size: 26px;
}

.speech-bd-context-link { margin-top: 8px; }

.speech-ft {
    text-align: left;
    margin-left: 16px;
}

/* ---------------------------------------------------------------------
 Details
------------------------------------------------------------------------ */
.details-hd {
    width: 100%;
    text-align: center;
}

.details-subHd {
    width: 100%;
    text-align: center;
}

.details-image {
    width: 300px;
    margin: 0 auto;
}

.details-rating {
    width: 217px;
    margin: 0 auto;
}

.details-cta {
    margin: 0 auto;
}

/* ---------------------------------------------------------------------
 Gauge
------------------------------------------------------------------------ */
.gauge {
    width: 58px;
    margin-left: 18px;
}

.gauge-hd {
    width: 50px;
    height: 37px;
    padding-top: 13px;
    border-width: 4px;
    font-size: 24px;
}

/* ---------------------------------------------------------------------
 subNav
------------------------------------------------------------------------ */
.subNav {
    display: block;
    width: 511px;
    top: 32px;
    overflow: hidden;
    z-index: 11;
    opacity: 1;
    text-align: left;
    position: absolute;
}

.subNav_isActive {
    opacity: 1;
    right: 0;
}

.subNav-col {
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    -ms-box-sizing:     border-box;
    -o-box-sizing:      border-box;
    box-sizing:         border-box;
}

.subNav-col_wide { width: 63.01369863013699%; }

.subNav-col_narrow { width: 36.98630136986301%; }

.subNav-col_padding { padding: 25px 0 10px 25px; }

.subNav-col-header {
    margin-bottom: 15px;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
}

/* ---------------------------------------------------------------------
 textLinks - js fallback for no css column support
------------------------------------------------------------------------ */
.textLinks {
    margin-left: -2%;
    margin-bottom: 18px;
}

.textLinks > * {
    display: inline-block;
    margin-left: 2%;
    vertical-align: top;
}

.textLinks > * {
    width: 47%;
    margin-bottom: 6px;
}

.textLinks_tight > * {
    width: 25%;
}

.textLinks > * > * {
    display: block;
    font: 400 12px/1.2 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #414042;
    text-decoration: none;
}

/* ---------------------------------------------------------------------
 boxLinks
------------------------------------------------------------------------ */
.boxLinks {
    border-left: 1px solid #ccc7b8;
    font-size: 12px;
}

.boxLinks > * + * { border-top: 1px solid #ccc7b8; }

.boxLinks > * > * {
    display: block;
    padding: 19px 15px 17px 15px;
    text-decoration: none;
    text-transform: uppercase;
    font: 700 14px/1.2 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #a71c20;
}

/* ---------------------------------------------------------------------
 filter-feature
------------------------------------------------------------------------ */
.filter-feature {
    width: 262px;
    margin-bottom: 0;
}

.filter-feature-ft {
    width: 100%;
    padding: 22px 0 20px 0;
}

.filter-feature-bd-rating {
    width: 88px;
    padding-top: 5px;
}

/* ---------------------------------------------------------------------
 Poster
------------------------------------------------------------------------ */
.poster-hd { font-size: 36px; }

/* ---------------------------------------------------------------------
 Promo Aside
------------------------------------------------------------------------ */
.promo-aside { margin-bottom: 0; }

.promo-aside_tabs {
    padding: 58px 45px 60px 0; /* bottom padding is a backup to main content padding and creates required tab-content bottom padding */
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    -ms-box-sizing:     border-box;
    -o-box-sizing:      border-box;
    box-sizing:         border-box;
}

.promo-aside_horiz-hd {
    margin-bottom: 0;
    padding: 25px 0;
    text-align: center;
}

/* ---------------------------------------------------------------------
 Panel
------------------------------------------------------------------------ */
.panel {
    padding: 60px 0 0 0;
    background-color: #f0ece2;
}

.panel-hd-control_prev {
    top: 0;
    left: 41px;
}

.panel-hd-control_next {
    top: 0;
    right: 41px;
}

.panel-bd { padding: 0 30px; }

.panel-hd {
    margin-bottom: 40px;
    font-size: 52px;
    font-weight: 300;
}

.panel-hd_tight { margin-bottom: 0px; }

.panel-hd-heading_alt {
    margin-bottom: 5px;
    font-size: 38px;
}

.panel-hd-heading_growSmallToMedium { width: auto; }

.panel-hd-heading_growMediumToLarge {
    width: 445px;
    margin: 0 auto;
}

.panel-hd_collapsed { margin-bottom: 0; }

.panel-hd-content {
    padding: 0 55px;
    text-align: center;
}

.panel-hd-subHeading { font-size: 17px; }

.mix-panel-hd_tall { padding: 0 27px; }

.panel-mobile-left {
    text-align: center;
    padding: 10px 20px;
}

.panel-bd_collapse { padding: 0; }

.panel-bd_collapseAll {
    padding: 0;
    margin-top: 0;
}

.panel-hd-heading_tall { padding-bottom: 52px; }

/* ---------------------------------------------------------------------
 Index
------------------------------------------------------------------------ */
.index > * {
    width: 31px;
    height: 31px;
}

.index-item a { padding: 9px; }

/* ---------------------------------------------------------------------
 Sup
------------------------------------------------------------------------ */
.sup { vertical-align: super; }

.sup_large {
    font-size: 57px;
    line-height: .9;
}

/* ---------------------------------------------------------------------
 Billboard
------------------------------------------------------------------------ */
.billboard { padding-left: 65px; }

.billboard_wide {
    width: 90%;
    margin: 0 auto;
    padding-left: 0;
}

.billboard-hd {
    font: 700 120px/.8 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-align: left;
}

.billboard_wide > * {
    display: inline-block;
    vertical-align: top;
}

.billboard_wide .billboard-hd-value { font-size: 120px; }

.billboard_wide > .billboard-subHd {
    width: 58%;
    margin-left: 20px;
}

.billboard-subHd {
    font-size: 31px;
    line-height: 1;
    text-align: left;
}

.billboard-subHd-meta {
    margin-top: 22px;
    text-align: left;
}

.billboard-subHd-meta-img > * {
    width: 135px;
    height: 24px;
    margin-right: 4px;
}

/* ---------------------------------------------------------------------
 Timeline
------------------------------------------------------------------------ */
.timeline { margin-bottom: 12px; }

.timeline > * { margin-bottom: 15px; }

.timeline-heading {
    font-size: 19px;
    margin-bottom: 15px;
}

.timeline-heading {
    margin-bottom: 10px;
    font: 700 14px/1.0 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #4c4940;
}

.timeline-content {
    font: 400 14px/1.0 "ff-meta-serif-web-pro", Georgia, Times, "Times New Roman", serif;
    color: #4c4940;
}

/* ---------------------------------------------------------------------
 Figure
------------------------------------------------------------------------ */
.figure_collapse { padding-bottom: 0; }

.figure-bd {
    margin-bottom: 38px;
    font-size: 15px;
}

.figure-media { margin-bottom: 17px; }

.figure-bd_collapse { margin: 0; }

.figure-info { margin-bottom: 30px; }

.figure-cta a { display: inline-block; }

.figure_seperated {
    margin-bottom: 20px;
    border-bottom: 1px solid #4c4940;
}

.figure-media_skinny > * { width: 123px; }

/* ---------------------------------------------------------------------
 Action
------------------------------------------------------------------------ */
.action { margin-top: 16px; }

.action-cta > * {
    font-size: 24px;
    line-height: 1.1;
    letter-spacing: 2px;
}

/* ---------------------------------------------------------------------
 Glossary
------------------------------------------------------------------------ */
.glossary-terms { width: 165px; }

.glossary-definition {
    width: 365px;
    margin-left: 35px;
    display: inline-block;
}

/* ---------------------------------------------------------------------
 Layer
------------------------------------------------------------------------ */
.layer-hd { font-size: 52px; }

.layer-hd-heading {
    font-weight: 100;
    font-size: 52px;
}

.layer-hd-heading_alt {
    margin-bottom: 5px;
    font-size: 38px;
}

/* ---------------------------------------------------------------------
 Mixins
------------------------------------------------------------------------ */
.mix-visibility_mobile,
.mix-visibility_desktop,
.mix-visibility_mobileAndDesktop { display: none; }

.mix-visibility_mobiletoTabletTable { display: table; }

.mix-visibility_tablet,
.mix-visibility_tabletToDesktop,
.mix-visibility_mobileAndTablet { display: block; }

/* ---------------------------------------------------------------------
 Attention
------------------------------------------------------------------------ */
.attention {
    margin: 26px 0 30px 0;
    padding-bottom: 0;
    border-bottom: none;
}

.attention-img {
    width: 100%;
    border-bottom: 1px solid #aaa6a3;
    float: none;
}

.attention-inner { padding-top: 16px; }

.attention-inner-hd {
    margin-bottom: 10px;
    font-size: 24px;
    font-weight: 300;
}

.attention-inner-supHd {
    margin-bottom: 10px;
    font-size: 700 10px/1.5 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #564e47;
}

.attention-inner-bd{ font-size: 13px; }

/* ---------------------------------------------------------------------
 Rule
------------------------------------------------------------------------ */
.rule {
    width: 93%;
    border: 0;
    height: 1px;
    background: #aaa18b;
    margin: 40px auto 0 auto;
}

.rule_thick { height: 2px; }

/* ---------------------------------------------------------------------
 Info Table
------------------------------------------------------------------------ */
.infoTable-bd td { width: 110px; }

.infoTable-bd td + td { width: auto; }

/* ---------------------------------------------------------------------
 AttentionTable
------------------------------------------------------------------------ */
.attentionTable-row { position: relative; }

.attentionTable-row-caption { padding-bottom: 0; }

.attentionTable-row > * + * {
    position: absolute;
    right: 0;
    top: -4.5px;
}

td.mix-attentionTable-ft_last {
    padding-top: 0;
    padding-bottom: 30px;
}

td.mix-attentionTable-ft_center {
    text-align: center;
    padding: 0 0 40px 0;
}
td.mix-attentionTable-ft_disclaimer {
    padding-bottom: 0px;
}
/* ---------------------------------------------------------------------
 ActionTable
------------------------------------------------------------------------ */
.actionTable-hd-row-aside > *,
.actionTable-hd-row > *:last-child,
.actionTable-row > *:last-child { display: table-cell; }

.actionTable { padding: 40px; }

.actionTable-subHd {
    width: 100%;
    display: block;
    padding: 20px 0 10px 0;
    border-top: 1px solid #aaa6a3;
}

.actionTable-hd-row-aside {
    display: table-cell;
    width: 140px;
    padding: 45px 20px 0 0;
    vertical-align: top;
    font: 400 20px/1.3 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #4c4940;
}

.actionTable-hd-rowMobile { display: none; }

.actionTable-hd-row > * + * {
    padding: 20px 0 48px 0;
    border-left: 20px solid #ffffff;
}

.actionTable-row > * {
    max-width: none;
    font-size: 12px;
}

.actionTable-row > * + * {
    width: 215px;
    min-width: 90px;
    padding: 12px;
    border-left: 20px solid #ffffff;
    font-size: 14px;
}

.actionTable-title {
    font-size: 14px;
    line-height: 1.4;
}

/* ---------------------------------------------------------------------
 Slides
------------------------------------------------------------------------ */
.slide-overlay-hd { width: 340px; }

.slide-overlay-hd_large { font-size: 52px; }

.slide-overlay-hd_wide { width: 493px; }

.slide-overlay-bd {
    width: 333px;
    margin-bottom: 15px;
}

.slide-overlay-bd_wide { width: 493px; }

.slide-overlay-links { width: 333px; }

/* ---------------------------------------------------------------------
 listCols - js fallback for no css column support
------------------------------------------------------------------------ */
.listCols {
    -webkit-column-count: 2;
    -moz-column-count:    2;
    -ms-column-count:     2;
    -o-column-count:      2;
    column-count:         2;
    -webkit-column-gap: 5px;
    -moz-column-gap:    5px;
    -ms-column-gap:     5px;
    -o-column-gap:      5px;
    column-gap:         5px;
}

.listCols > * {
    margin-bottom: 7px;
}

/* ---------------------------------------------------------------------
 Section
------------------------------------------------------------------------ */
.section-nav {
    display: none;
}

.section-media {
    display: block;
}

.section-media_medium {
    float: left;
    width: 54%;
}

.section-media_medium.section-media_opposite {
    float: right;
    width: 54%;
}

.section-inner {
    position: absolute;
    top: 42px;
    left: 42px;
    padding: 0;
    width: 36%;
}

.section-inner-bd {
    font-size: 11px;
}

.section-inner_opposite {
    right: 42px;
    left: auto;
}

.section-inner-title {
    margin-bottom: 8px;
    font-size: 42px;
}

.section-inner_expand {
    width: auto;
    display: block;
    padding: 28px 40px;
    position: static;
    background: #f0ece2;
}

.section-inner-title_light {
    color: #0090aa;
}

.section-inner-bd-intro {
    display: block;
    /*font-weight: 300;*/
    font-size: 13px;
}

/* ---------------------------------------------------------------------
 chron
------------------------------------------------------------------------ */
.chron-hd {
    padding: 25px 50px 50px 50px;
}

.chron-hd-heading {
    margin-bottom: 8px;

    font-size: 24px;
}

.chron-hd-subhd {
    font-size: 18px;
}

/* ---------------------------------------------------------------------
 slider
------------------------------------------------------------------------ */
.slider {
    height: 280px; /* default height, gets overwritten by JS */
}

/* ---------------------------------------------------------------------
 Column List
------------------------------------------------------------------------ */
.columnList_2up {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    -ms-column-count: 2;
    -o-column-count: 2;
    column-count: 2;
}

.columnList_3up {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    -ms-column-count: 3;
    -o-column-count: 3;
    column-count: 3;
}

.columnList > * {
    -webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    -ms-column-break-inside: avoid;
    -o-column-break-inside: avoid;
    column-break-inside: avoid;
}

.mix-columnList_std {
    -webkit-column-gap: 21px;
    -moz-column-gap: 21px;
    -ms-column-gap: 21px;
    -o-column-gap: 21px;
    column-gap: 21px;
}

.mix-columnList_wide {
    -webkit-column-gap: 50px;
    -moz-column-gap: 50px;
    -ms-column-gap: 50px;
    -o-column-gap: 50px;
    column-gap: 50px;
}

.mix-columnList_collapsed {
    -webkit-column-gap: 0;
    -moz-column-gap: 0;
    -ms-column-gap: 0;
    -o-column-gap: 0;
    column-gap: 0;
}

/*js fallback column styles*/
.columnList .column {
    float: left!important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    -ms-box-sizing:     border-box;
    -o-box-sizing:      border-box;
    box-sizing:         border-box;
}

.columnList_2up .column { width: 50%!important; }

.columnList_2up .column + .column { padding-left: 21px; }

/* ---------------------------------------------------------------------
 padUtil
------------------------------------------------------------------------ */
.column .padUtil { padding: 0 12px; }

.column.first .padUtil { padding-left: 0; }

.column.last .padUtil { padding-right: 0; }

/* ---------------------------------------------------------------------
 Brand
------------------------------------------------------------------------ */
.brand-hd { font-size: 35px; }

/* ---------------------------------------------------------------------
 Interact
------------------------------------------------------------------------ */
.interact {
    display: block;
    width: 280px;
    padding: 42px;
    float: right;
}

.interact-media {
    position: relative;
    height: 184px;
    margin-bottom: 10px;
}

.interact-media > * {
    width: 301px;
    height: 217px;
    position: absolute;
    left: 25px;
    top: 0;
    background: url(../images/innovations/sprite-switch-dog-tablet.png) no-repeat;
    opacity: 0;
}

.interact-media-varOne { background-position: 26px 0; }

.interact-media-varTwo {
    background-position: -254px 0;
    opacity: 1;
}

.interact-media-varThree { background-position: -536px 0; }

.interact-ft { display: block; } /* hidden in screen */

.interact-ft-nav {
    margin-bottom: 20px;
    font: 700 14px/1.0 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #ffffff;
}

.interact-ft-slider {
    height: 20px;
    position: relative;
    background-color: #ffffff;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    border-radius: 20px;
}

/* ---------------------------------------------------------------------
 Social
------------------------------------------------------------------------ */
.social {
    height: auto;
    padding: 20px 20px 40px 20px;
}

.social_carousel {
    height: 100%;
    padding: 20px;
    margin-bottom: 0;
}

.social_carousel > .social-media img { max-height: 140px; }

.social_carousel_aside { padding: 0 0 20px 0; }

.social_carousel_collapse { padding: 0; }

/* ---------------------------------------------------------------------
 Comment
------------------------------------------------------------------------ */
.comment-link { display: inline; }

.comment-link + .comment-link { padding-left: 20px; }

/* ---------------------------------------------------------------------
 Refine
------------------------------------------------------------------------ */
.refine { padding: 0 5px 0 5px; }

.refine_compressed { padding: 0 12px;}

.refine-hd {
margin-bottom: 30px;
    font-size: 24px;
}

.refine_push { padding: 30px 0 0 14px; }

.refine_pushTop { padding-top: 30px; }

.refine-list { padding-top: 40px; }

.refine-list > * {
    padding: 24px 16px;
    border-top: 2px solid #d1caba;
}

.refine-list > * > * { font-size: 14px; }

.refine > .refine-list { margin-left: 0; }

/* ---------------------------------------------------------------------
 Forms
------------------------------------------------------------------------ */
.fieldset { margin-bottom: 30px; }

.mix-fieldset_short { margin-bottom: 12px; }

.legend {
    margin-bottom: 12px;
    font-size: 12px;
}

.mix-legend_tall { margin-bottom: 18px; }

.legend_medium { font-size: 14px; }

.legend_large {
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 700;
    text-transform: none;
}

/* ---------------------------------------------------------------------
 Refine form
------------------------------------------------------------------------ */
.refineForm_tall { padding-bottom: 30px; }

.refineForm-list > * { margin-bottom: 12px; }

.refineForm_tight { padding: 20px; }

.refineForm-columns {
    margin-bottom: 20px;
    font-size: 0;
}

.refineForm-columns > * {
    display: inline-block;
    vertical-align: top;
    width: 32%;
    font-size: medium;
}

/* ---------------------------------------------------------------------
 Location form
------------------------------------------------------------------------ */
.locationForm-search > * { font-size: 10px; }

.locationForm-select { margin-bottom: 8px; }

/* ---------------------------------------------------------------------
 Inputs
------------------------------------------------------------------------ */
.checkboxOverlay {
    width: 21px;
    height: 21px;
    background: transparent url("../images/icons/checkbox-overlay-spriteDesktop.png") 0 -24px no-repeat;
}

.input_checkbox:checked + .checkboxOverlay { background-position: 0 0; }
.input_checkbox_isDisabled:checked + .checkboxOverlay { background-position: 0 -24px; }

.input_submit {
    top: 9px;
    background-size: 28px 27px;
}

.input_select { width: 87%; }

.input_select_skinny { width: 32.3333%; }

.input_search {
    min-height: 43px;
    padding: 11px 45px 11px 11px;
    font-size: 18px;
}

.input_find { padding: 10px 28px; }

.input_search_small { font-size: 10px; }

.select { width: 90%; }

/* ---------------------------------------------------------------------
 Form labels
------------------------------------------------------------------------ */
.label {
    font-size: 13px;
    font-weight: 700;
}

.label_indent { margin-left: 28px; }

.label_medium {
    font-size: 12px;
    font-weight: 500;
}

.label_mediumMD { /* "MD" means it's applied starting with medium breakpoint*/
    font-size: 12px;
}

.label_light {
    font-size: 14px;
    font-weight: 300;
}

.label_largeMD { /* "MD" means it's applied starting with medium breakpoint*/
    font-size: 18px;
}

.label_highlight { font-size: 18px; }

/* ---------------------------------------------------------------------
 Social Feed
------------------------------------------------------------------------ */
.socialFeed {
    display: block; /* Hidden in screen */
    margin: 42px 0 70px 0;
    padding: 10px 0 0 69px;
    background: transparent url(/dogcat-assets/images/icons/FB-f-Logo__blue_40.png) 0 0 no-repeat;
}

.socialFeed-hd {
    margin-bottom: 15px;
    font: 700 12px/1.83 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    color: #aaa18b;
}

.socialFeed-ft-hd { margin-bottom: 20px; }

.socialFeed-ft-hd a {
    font: 700 10px/1.83 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    color: #aaa18b;
}

/* ---------------------------------------------------------------------
 Afterword
------------------------------------------------------------------------ */
.afterword {
    display: block; /* none in screen */
    margin: 42px 0 70px 0;
    padding-top: 10px;
}

.afterword-hd {
    margin-bottom: 15px;
    font: 700 12px/1.83 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    color: #aaa18b;
}

.afterword-bd { margin-bottom: 50px; }

.afterword-ft {
    font: 700 12px/1.4 "ff-meta-serif-web-pro", Georgia, Times, "Times New Roman", serif;
    color: #aaa18b;
}

.afterword-ft-link { margin-bottom: 4px }

.afterword-ft-link > * {
    display: block;
    font: 700 14px/1.2 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    text-decoration: none;
    color: #4993b0;
}

/* ---------------------------------------------------------------------
 Social Post
------------------------------------------------------------------------ */
.socialPost { margin-bottom: 17px; }

.socialPost a {
    display: block;
    text-decoration: none;
    color: #aaa18b;
}

.no-touch .socialPost a:hover { color: #000000; }

.socialPost-hd { font: 700 10px/1.83 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif; }

.socialPost-bd { font: 400 italic 13px/1.4 "ff-meta-serif-web-pro", Georgia, Times, "Times New Roman", serif; }

.socialPost-bd a { color: #a71c20; }

/* ---------------------------------------------------------------------
 Pip
------------------------------------------------------------------------ */
.pip {
    display: inline-block;
    margin: 0 0 9px 8px;
    padding: 0 7px;
    position: relative;
    z-index: 0;
    font: 700 11px/1.72 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    color: #ffffff;
    background-color: #3c579a;
}

.pip:before {
    width: 0;
    height: 0;
    border-top: 4px solid #3c579a;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
    content: "";
    position: absolute;
    right: 3px;
    bottom: -4px;
    z-index: 1
}

/* ---------------------------------------------------------------------
 Callout
------------------------------------------------------------------------ */
.callout {
    max-width: 137px;
    background-color: #f1ede3;
}

.callout-bd {
    padding: 10px;
    font-size: 11px;
}

.callout-figure > * { display: block; }

/* ---------------------------------------------------------------------
 Table Row
------------------------------------------------------------------------ */
.tableRow > * { display: table-cell; }

.mix-tableRow_shaded > * {
    border-left: 20px solid #faf6f0; /* (psuedo-margin) matches page background */
    background-color: #f1ede3;
    vertical-align: top;
}

.mix-tableRow_shaded > *:first-child { border-left: none; }

/* Targets anchor tag that is wrapping .callout */
.mix-tableRow_shaded > * > * {
    display: inline-block;
    height: 100%;
    font: 700 14px/1.2 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    text-decoration: none;
    color: #a71c20;
}

.no-touch .tableRow > *:hover > * > .callout,
.no-touch .tableRow > *:hover { background-color: #aaa18b; }

/* ---------------------------------------------------------------------
 Footer
------------------------------------------------------------------------ */
.footer {
    margin-top: 0;
    padding: 34px 0 24px 10px;
}

.footer_portal { padding: 0; }

.footer-logo {
    display: block; /* none in screen */
    float: left;
    width: 178px;
    height: 85px;
}

.footer-nav,
.footer-meta,
.footer-legalese { display: inline-block; }

.footer-nav {
    margin-bottom: 0;
    padding-top: 7px;
    padding-right: 0; /* override screen.css */
    padding-left: 8px; /* override screen.css */
}

.footer-nav {
    width: 525px;
    margin-bottom: 7px;
}

.footer-nav > * { margin-bottom: 4px; }

.footer-social { display: none; }

.footer-meta {
    margin-bottom: 5px;
    padding-left: 13px;
    text-align: left;
}

.footer-meta a {
    font-size: 12px;
    line-height: 1;
}

.footer-meta > * + * {
    margin-left: 0;
    border-left: 2px solid #d2ccbd;
    padding: 0 12px;
}

.footer-meta > *:first-child { padding-right: 12px; }

.footer-legalese {
    padding-left: 13px;
    font-size: 10px;
}

.footer-nav > * { display: inline-block; }

.footer-nav a { font-size: 14px; }

.footer-nav > * > a {
    display: inline-block; /* override screen.css */
    padding-left: 4px; /* override screen.css */
    padding-right: 4px; /* override screen.css */
}

.footer-nav-item {
    padding: 0; /* override screen.css */
    margin-left: 0; /* override screen.css */
    width: auto;
}

.footer-nav-item_isActive .footer-nav-item-list,
.no-touch .footer-nav-item:hover .footer-nav-item-list {
    width: 200px;
    padding: 20px 0 7px 0; /* override screen.css */
    bottom: 34px;
}

.footer-nav-item_isActive .footer-nav-item-list a,
.no-touch .footer-nav-item:hover .footer-nav-item-list a {
    padding: 0 6px; /* override screen.css */
}

/* ---------------------------------------------------------------------
 AdSense iframe container
------------------------------------------------------------------------ */
.afshcontainer {
    margin: 0 auto;
}

/* ---------------------------------------------------------------------
 Results
------------------------------------------------------------------------ */
.results-hgroup {
    margin-bottom: 50px;
    margin-top: 40px;
    padding-top: 0;
    font-size: 28px;
}

.results-hgroup_paddingTopSM {
    padding-top: 0;
}

.results-hgroup-link {
    margin-top: -54px;
    float: right;
}

.results-container{
    margin:0 20px;
}

/* ---------------------------------------------------------------------
 Results Table
------------------------------------------------------------------------ */
.results-table_productFinder {
    width: auto;
    max-width: none;
}

.results-table-hd {
    font: 400 16px/1.4 "ff-meta-serif-web-pro", Georgia, Times, "Times New Roman", serif;
    color: #353535;
}

.results-table-bd > * > * {
    padding-top: 20px;
    padding-bottom: 20px;
}

.results-table-row > * { 
    display: table-cell;
    vertical-align: middle;
}

.results-table-hd-row  > * {
    display: table-cell;
    text-align: center;
}

.results-table-cell_small { width: 64px; }

.results-table-cell_small_push { width: 110px; }

.results-table-cell_large {
    width: 154px;
    padding-right: 20px;
}

.results-table-cell_medium {
    width: 90px;
    padding-right: 16px;
}


/* ---------------------------------------------------------------------
 Caption
------------------------------------------------------------------------ */
.caption {
    width: 95%;
    margin-bottom: 0;
}

.caption-hd { font-size: 38px; }

/* ---------------------------------------------------------------------
 Foreward
------------------------------------------------------------------------ */
.foreward {
    border-bottom: 58px;
    overflow: hidden;
}

.foreward_alignMiddle > .foreward-col {
    vertical-align: middle;
}

.foreward-col + .foreward-col { margin-left: 2.4%; }


.foreward-col {
    display: inline-block; /* To create desired bottom alignment on columns */
    font-size: 0;
    vertical-align: bottom;
}

.foreward-col_3of10 { width: 27.765957446809%; }

.foreward-col_7of10 { width: 69.042553191489%; }

/* ---------------------------------------------------------------------
 Intro
------------------------------------------------------------------------ */
.preface-hd { font-size: 42px; }

/* ---------------------------------------------------------------------
 Meta
------------------------------------------------------------------------ */
.meta-bd { margin-left: -12px; }

.meta-bd > * {
    display: inline-block;
    margin-left: 12px;
}

/* ---------------------------------------------------------------------
 Engagement
------------------------------------------------------------------------ */
.engagement-meta { position: relative; }

.engagement-meta > * {
    display: inline-block;
    vertical-align: middle;
}

.engagement-meta-text_opposite {
    display: inline-block;
    margin: 0;
    position: absolute;
    top: 5px;
    right: 0;
}

.engagement-bd { margin-bottom: 38px; }

.engagement-bd-col {
    display: inline-block;
    vertical-align: top;
}

.engagement-bd-col_1of4 { width: 29.3%; }

.engagement-bd-col_3of4 { width: 62%; }

.engagement-bd-col + .engagement-bd-col { margin-left: 7%; }

.engagement-ft > * + * { margin-left: 11px; }

.engagement-bd-img { width: 84px; }

/* ---------------------------------------------------------------------
 Rating
------------------------------------------------------------------------ */
.rating-bd-img { width: 84px; }

.rating-bd-text { margin-left: 0; }

/* ---------------------------------------------------------------------
 Cluster
------------------------------------------------------------------------ */
.cluster-img { padding-right: 15px; }

.cluster-bd-title { font-size: 20px;}

/* ---------------------------------------------------------------------
 Island
------------------------------------------------------------------------ */
.island-hd {
    font-size: 52px;
    font-weight: 300;
}

.island-hd-heading { font-size: 32px; }

.island-hd-subHeading {
    font-size: 22px;
    line-height: 1.8;
}

.island-bd { margin-bottom: 50px; }

.island-bd_alt { margin-bottom: 20px; }

.island-bd_collapsed { margin-bottom: 0px; }

.island-bd_divided { padding-bottom: 25px; }

.island-ft {
    width: 80%;
    margin: 0 auto;
}

/* ---------------------------------------------------------------------
 Info
------------------------------------------------------------------------ */
.info {}

.info-hd { font-size: 36px; }

.info-hd_intro { font-size: 25px; }

.info-bd { font-size: 16px; }

.info-img {}

.info-imgStd {
    width: 265px;
    float: right;
}

.info-cta {}

.info-cta-item { font-size: 16px; }

/* ---------------------------------------------------------------------
 infoGraphic
------------------------------------------------------------------------ */
.infoGraphic { margin-bottom: 25px; }

.infoGraphic-img { margin: 0 auto 15px auto; }

.infoGraphic-hd { font-size: 25px; }

.infoGraphic-bd { font-size: 16px; }

/* ---------------------------------------------------------------------
 Spinner
------------------------------------------------------------------------ */

.spinner.mix-spinner_centeredPadded {
    background-position: center center;
    padding: 20px;
}

/* ---------------------------------------------------------------------
 Video
------------------------------------------------------------------------ */
.video { margin-bottom: 0; }

/* ---------------------------------------------------------------------
 Tile Wrapper
------------------------------------------------------------------------ */
.tile {
    background-size: auto;
}

.tileWrapper {
    width: 600px;
    margin: 0 auto;
}


/* ---------------------------------------------------------------------
 Card
------------------------------------------------------------------------ */
.card {
    position: relative;
    height: 380px;
    z-index: 1;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    -o-perspective: 1000px;
}

.card_isActive { z-index: 2; }

.card-face {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    font-family: 'futura-pt', Futura, 'Century Gothic', AppleGothic, Verdana, sans-serif;
    text-rendering: optimizeLegibility;
    font-weight: 700;
    color: #ffffff;

    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;

    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
}

.card_isActive .card-face {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
}

.card-face-front,
.card-face-back {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;

    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
}

.card-face-front { z-index: 2; }

.card_isActive .card-face-front { z-index: 1; }

.card-face-back {
    z-index: 1;

    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
}

.card_isActive .card-face-back { z-index: 2; }

/* TODO = li is coming from different widgets and the widgets can be used else where so it not feasible to add a style to each of them */
.blocks_1upto2upto3up > *:nth-child(odd) .card .tile-hd {
    position: absolute;
    bottom: 38px;
}

.card:nth-child(even) .tile-hd { padding-top: 60px; }

/* ---------------------------------------------------------------------
 Tile
------------------------------------------------------------------------ */
.tile {
    height: 380px;
    padding: 0;
}

.tile-inner {
    position: relative;
    top: 39%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.tile-hd { padding-top: 53px;}

.tile-hd, /* stacking because these properties are shared but have independent layouts */
.tile-inner-hd { font-size: 41px; }

.tile-inner-hd { padding-bottom: 25px; }

.tile-bd, /* stacking because these properties are shared but have independent layouts */
.tile-inner-bd { font-size: 18px; }

.tile-ft {
    font-size: 18px;
    bottom: 20px;
}

/* ---------------------------------------------------------------------
 Counter
------------------------------------------------------------------------ */
.counter { margin-bottom: 12px; }

.counter > * { margin-left: 5px; }

.counter-count { font-size: 16px; }

.counter-type { font-size: 10px; }

/* ---------------------------------------------------------------------
 Topic List
------------------------------------------------------------------------ */
.topicList { background-color: #ffffff; }

.topicList-hd {
    height: 47px;
    position: relative;
    cursor: default;
    background-color: #a51d0b;
}

.topicList-hd-l {
    position: absolute;
    top: 50%;
    left: 8px;
    cursor: pointer;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.topicList-hd-r {
    position: absolute;
    top: 50%;
    right: 8px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.topicList-bd {
    padding-left: 0;
    height: 333px;
    overflow: auto;
}

.no-touch .topicList-bd > *:hover { background-color: #f0efe9; }

.topicList-bd-item {
    padding: 6px 0 6px 27px;
    background-color: #ffffff;
}

.topicList-bd-item a {
    display: block;
    text-decoration: none;
}

/* ---------------------------------------------------------------------
 Subject
------------------------------------------------------------------------ */
.subject-hd { font-size: 18px; }

/* ---------------------------------------------------------------------
 Tooltip
------------------------------------------------------------------------ */
.tooltip-pip {
    padding: 24px;
    width: 275px;
}

.mix-tooltip_mitochondria{
    top: -20px;
    right: 128px;
}

.mix-tooltip_membrane {
    bottom: 0px;
    right: 174px;
}

.mix-tooltip_fattyAcid {
    top: 52px;
    left: 105px;
}

.mix-tooltip_lCarnitine {
    bottom: 94px;
    left: 128px;
}

.mix-tooltip_cell {
    bottom: 106px;
    left: 0px;
}

/* ---------------------------------------------------------------------
 Interactive
------------------------------------------------------------------------ */
.interactive-bd { padding: 20px; }

.interactive-bd a { font-size: 12px; }

.interactive-bd-col {
    display: inline-block;
    vertical-align: top;
}

.interactive-bd-col_1of4 { width: 29.3%; }

.interactive-bd-col_3of4 { width: 62%; }

.interactive-bd-col_4of4 { width: 100%; }

.interactive-bd-col + .interactive-bd-col { margin-left: 7%; }

/* ---------------------------------------------------------------------
 Prologue
------------------------------------------------------------------------ */
.prologue { padding: 60px; }

.prologue-hd {
    margin-bottom: 50px;
    font-size: 21px;
}

/* ---------------------------------------------------------------------
 Reference
------------------------------------------------------------------------ */
.reference {
    padding: 30px 76px;
    background: #ffffff url('../images/reference_medium.png') 50% no-repeat;
}

.reference-hd { font-size: 20px; }

.reference-bd-list {
    margin-bottom: 20px;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    -ms-column-count: 2;
    -o-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 20px solid #cec8b7;
    -moz-column-gap: 20px solid #cec8b7;
    -ms-column-gap: 20px solid #cec8b7;
    -o-column-gap: 20px solid #cec8b7;
    column-gap: 20px solid #cec8b7;
}

/* ---------------------------------------------------------------------
 Advertisement
------------------------------------------------------------------------ */
.advertisement {
    padding: 32px 128px;
    background: #c8e8e6 url('../images/advertisement-arrow.png') 89% 28% no-repeat;
    font-size: 18px;
}

.advertisement-hd {
    padding: 0;
    font-size: 18px;
}

.advertisement-bd-highlight { font-size: 110px; }

/* ---------------------------------------------------------------------
 Legos
------------------------------------------------------------------------ */
.legos_1upto2up > * + * {
    border-top: none;
    border-left: 1px solid #dcd9cc;
}

.legos_1upto2up > * {
    width: 50%;
    padding: 0 40px;
    display: inline-block;
    vertical-align: top;
}

/* ---------------------------------------------------------------------
 socialConnect
------------------------------------------------------------------------ */
.socialConnect-ft-title { font-size: 15px; }

.socialConnect-ft-title:after {
    width: 90px;
    height: 50px;
    top: 16px;
    right: 82px;
    background: url('../images/socialConnect-arrow_medium.png') 0 0 no-repeat;
}

/* ---------------------------------------------------------------------
 Locate
------------------------------------------------------------------------ */
.locate { padding-top: 0; }

.locate-bd-cta > * {
    width: 137px;
    height: 61px;
    background: url('../images/btn_dog_medium.png') 0 0 no-repeat; }

.locate-bd-cta > * + * { background: url('../images/btn_cat_medium.png') 0 0 no-repeat; }

.locate-bd-cta > .isActive,
.no-touch .locate-bd-cta > *:hover { background: #ffffff url('../images/btn_dog_medium.png') 0 0 no-repeat; }

.locate-bd-cta > * + .isActive,
.no-touch .locate-bd-cta > * + *:hover { background: #ffffff url('../images/btn_cat_medium.png') 0 0 no-repeat; }

/* ---------------------------------------------------------------------
 Locate form
------------------------------------------------------------------------ */
.locate-form-ad:after {
    width: 107px;
    height: 27px;
    /* TODO = change to transparent bg image */
    background: url('../images/adoptApet_medium.png') 0 0 no-repeat;
}

.locate-form-ad { font-size: 11px; }

.locate-form-ad:after { margin-left: 3px; }

/* ---------------------------------------------------------------------
 Product CTA
------------------------------------------------------------------------ */
.productCta {
    padding: 0 17px 17px 17px;
    background-color: transparent;
}

.productCta-hd { text-align: left; }

/* ---------------------------------------------------------------------
 Product Comparison
------------------------------------------------------------------------ */
.productComparison {
    width: 647px;
    overflow: hidden;
}

.productComparison-img {
    max-width: none; /* override screen.css */
    float: left;
}

.productComparison-bd {
    padding-top: 20px;
    overflow: hidden;
}

.productComparison-bd-input {
    margin-bottom: 6px;
}

/* ---------------------------------------------------------------------
 Modal
------------------------------------------------------------------------ */
.modalSneezeGuard-inner { width: 727px; }

.modal {
    padding: 50px 40px 25px;
    top: 50%;
}

/* ---------------------------------------------------------------------
 Best Food
------------------------------------------------------------------------ */
.bestFood {
    max-width: 540px;
    padding-top: 20px;
    margin: 0 auto 44px auto;
}

.bestFood-hd {
    font-size: 56px;
    font-weight: 300;
}

.bestFood-bd {
    font-size: 21px;
}

/* ---------------------------------------------------------------------
 Recommendation Quiz
------------------------------------------------------------------------ */
.recommendationQuiz {
    height: 320px;
}

.recommendationQuiz-back {
    bottom: auto; /* override screen.css */
    top: 6px;
}

.recommendationQuiz-pagination {
    bottom: auto; /* override screen.css */
    right: 10px; /* override screen.css */
    top: 8px;
}

/* ---------------------------------------------------------------------
 Recommendation Question
------------------------------------------------------------------------ */
.recommendationQuestion-options {
    max-width: none;
    text-align: center;
}

.recommendationQuestion-options > * {
    width: 160px;
}

.recommendationQuestion-options_4up > * {
    width: 140px;
}

.recommendationQuestion-options > * + * {
    margin-left: 30px;
}

.recommendationQuestion-options-option-title,
.recommendationQuestion-options_4up .recommendationQuestion-options-option-title {
    font-size: 19px;
}

.recommendationQuestion-options-option-subtitle,
.recommendationQuestion-options_4up .recommendationQuestion-options-option-subtitle {
    font-size: 15px;
}

/* ---------------------------------------------------------------------
 Recommendation Results
------------------------------------------------------------------------ */
.recommendationResults {
    padding: 0; /* override screen.css */
    background-color: transparent; /* override screen.css */
}

.recommendationResults > * {
    float: left;
}

.recommendationResults-sidebar {
    width: 24.0425532%; /* 225/940 */
    background-color: #f0ece2;
}

.recommendationResults-bd {
    width: 75.9574468%; /* 715/940 */
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, .78);
}

.recommendationResults-ft {
    width: 75.9574468%; /* 715/940 */
    margin-left: 24.0425532%; /* 225/940 */
    background-color: #ffffff;
    background-color: rgba(255, 255, 255, .78);
    overflow: hidden;
}

.recommendationResults-ft-btn {
    width: 31.3%; /* to match blocks 3_up */
    margin-right: 18px;
    margin-bottom: 20px;
    float: right;
}

.recommendationResults-sidebar-inner,
.recommendationResults-bd-inner {
    padding: 18px;
}

.recommendationResults-bd-inner { padding-top: 0; }

/* ---------------------------------------------------------------------
 Sample Signup
------------------------------------------------------------------------ */
.sampleSignup {
    padding-top: 52px;
}

.sampleSignup-social {
    margin-top: 85px;
    margin-bottom: 287px;
}

.sampleSignup-social-hd {
    max-width: 540px;
    margin-bottom: 29px;
    font-size: 22px;
}

.sampleSignup-hd {
    max-width: none;
    font-size: 32px;
}

.sampleSignup-bd {
    margin-top: 9px;
    line-height: 1.45;
    max-width: 380px;
}

.sampleSignup-form {
    min-height: 254px;
    padding-bottom: 6px;
}

.sampleSignup-form-fieldset {
    max-width: 505px;
    margin: auto;
}

.sampleSignup-form-fieldset-legend {
    margin-bottom: 26px;
}

.sampleSignup-form-checkbox {
    padding-top: 4px;
    margin-bottom: 3px;
}

.sampleSignup-form-legal {
    display: -moz-inline-stack;
    max-width: 505px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 20px;
    text-align: center;
}

.sampleSignup-form-legal_bottom {
    margin-bottom: 160px;
    text-align: left;
}

/* ---------------------------------------------------------------------
 Subtext
------------------------------------------------------------------------ */
.subtext {
    max-width: 505px;
    margin: auto;
}

/* ---------------------------------------------------------------------
 Inputs
------------------------------------------------------------------------ */
.input_signup {
    margin-bottom: 3px;
}

/* ---------------------------------------------------------------------
 Recommendation Result
------------------------------------------------------------------------ */
.recommendationResult-hd {}

.recommendationResult-hd > a > img {
    width: 220px;
    margin-left: -15px;
}

.recommendationResult-bd {
    min-height: 155px;
}

.recommendationResult-key {
    min-height: 118px;
}

/* ---------------------------------------------------------------------
 Profile
------------------------------------------------------------------------ */
.profile { text-align: center; }

.profile > * { margin-bottom: 15px; }

.profile-media { margin-bottom: 10px; }

.profile-name {
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    color: #a71c20;
}

.profile a {
    display: block;
    font: 400 12px/1.0 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #4c4940;
    text-decoration: none;
}

.profile img {
    width: auto;
    min-height: 90px;
}

/* ---------------------------------------------------------------------
 Passage
------------------------------------------------------------------------ */
.passage-hd { font-size: 24px; }

.passage-bd { font-size: 16px; }

/* ---------------------------------------------------------------------
 Excerpt
------------------------------------------------------------------------ */
.excerpt-hd { font-size: 24px; }

.excerpt-bd { font-size: 16px; }

/* ---------------------------------------------------------------------
 Testimonial
------------------------------------------------------------------------ */
.testimonial { font-size: 18px; }

/* ---------------------------------------------------------------------
 Call to Action
------------------------------------------------------------------------ */
.cta-hd { font-size: 36px; }

/* ---------------------------------------------------------------------
 Combos
 - use for when you want and object like ".media" with vertical aligment
 - if you want a combo with the media child on the right, it must be
   phsyically placed there. cannot float
------------------------------------------------------------------------ */
.combo {
    display: table;
    width: 100%;
}

.combo > * {
    display: table-cell;
    margin-top: 0;
    vertical-align: middle;
}

.combo-media { white-space: nowrap; }

.combo-media > * {
    width: auto;
    max-width: none;
}

.combo-bd { width: 99%; }

.combo-bd_contain {
    padding: 20px 70px;
    background-color: #ffffff;
}

.combo_spread > .combo-bd { padding-right: 30px; }

.combo_spread > .combo-media + .combo-bd { padding-left: 30px; }

/* ---------------------------------------------------------------------
 infoGraph
------------------------------------------------------------------------ */
.infoGraph { margin-top: 0; }

.infoGraph-media > * {
    width: auto;
    max-width: none;
}

/* ---------------------------------------------------------------------
 Row (Grid)
------------------------------------------------------------------------ */

.row { }

.row-col {
    margin-left: auto;
    margin-right: auto;
}

.mix-row-col_detailsCTA { width: 230px; }

/* ---------------------------------------------------------------------
 Control
------------------------------------------------------------------------ */
.control {
    bottom: -7px;
    padding: 0 100px;
    z-index: 10;
    -webkit-transform: translate3d(0,0,0); /* iPad needs this to fix weird rendering issue */
    transform: translate3d(0,0,0);
}

.control-reference {
    width: 100%;
    margin-bottom: 10px;
    display: table;
    font: 300 18px/1.2 "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #ffffff;
}

.control-reference > * {
    display: table-cell;
    vertical-align: middle;
}

.control-reference-l {
    text-align: left;
}

.control-reference-r {
    text-align: right;
}

.control-bd-list {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    border-radius: 15px;

    padding: 0 18px;
}

.control-bd-list > * > * {
    display: block;

    margin: 3px 0;

    height: 9px;

    overflow: hidden;
    text-indent: -99999px;
}

.control-bd-handle {
    left: 18px;
    right: 18px;
}

.control-info {
    position: absolute;
    top: -20px;
    right: 0;
    left: 0;

    display: block;

    opacity: 0;

    margin: auto;

    text-align: center;

    font: 500 12px/1.4 "ff-meta-serif-web-pro", Georgia, Times, "Times New Roman", serif;
    font-style: italic;
    color: #ffffff;
}

.control-info_isActive {
    opacity: 1;
}

/* ---------------------------------------------------------------------
 jQuery UI Slider
------------------------------------------------------------------------ */
.ui-slider-handle {
    margin-left: -15px; /* horiz center */

    width: 30px;
    height: 30px;
}

.ui-slider-handle:before {
    width: 15px;
    height: 15px;
}

/* ---------------------------------------------------------------------
 Quote Wrap & Carousel
------------------------------------------------------------------------ */
.quoteWrap-hd {
    font-size: 30px;
    padding-top: 50px;
    padding-bottom: 40px;
}

.quoteWrap-ft {
    display:  block;
}

.quoteCarousel {
    margin-bottom: 38px;
    position: relative;
}

.quoteCarousel-slides {
    width: 727px;
    position: relative;
    height: 126px;
    overflow: hidden;
}

.quoteCarousel-slides > * {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.quoteCarousel-slides > * + * {
    left: 100%;
}

.quoteCarousel-nav {
    width: 15px;
    height: 28px;
    display: block;
    position: absolute;
    top: 36px;
    background-image: url('/dogcat-assets/images/icons/icon_arrow_review.png');
    background-size: cover;
    background-color: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
    font-size: 0;
    line-height: normal;
    overflow: visible;
    padding: 0;
    -webkit-appearance: button; /* for input */
    -webkit-user-select: none; /* for button */
       -moz-user-select: none;
        -ms-user-select: none;
}

.quoteCarousel-nav_previous {
    left: 20px;
}

.quoteCarousel-nav_next {
    right: 20px;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

/* ---------------------------------------------------------------------
 Media Carousel
------------------------------------------------------------------------ */
.mediaCarousel-slides {
    height: 409px;
}

.mediaCarousel-nav {
    width: 21px;
    height: 37px;
    background-size: 21px 37px;
    margin-top: 2px;
}

.mediaCarousel_tsb,
.mediaCarousel_tsb .mediaCarousel-slides {
    height: 428px;
}

/* ---------------------------------------------------------------------
 Media Overlay
------------------------------------------------------------------------ */
.mediaOverlay {
    height: 409px;
}
.mediaOverlay-panel {
    padding: 78px 60px 78px 63px;
}

.mediaOverlay-panel_right  {
    left: 50%;
}

.mediaOverlay-panel_left  {
    right: 50%;
}
.mediaOverlay-panel_Right  {
    left: 50%;
}

.mediaOverlay-panel_Left  {
    right: 50%;
}
.mediaOverlay-panel-icn {
    top: -13px;
    left: -24px;
    border-width: 5px;
    width: 76px;
    height: 76px;
}

.mediaOverlay-panel-hdg {
    font-size: 29px;
    margin-bottom: 11px;
}

.mediaOverlay-panel-bd {
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 30px;
}

/* TODO: This extension needs to be it's own object in the future */

.mediaOverlay_tsb {
    height: 428px; // Must match mediaCarousel_tsb
}

.mediaOverlay_tsb .mediaOverlay-media > img {
    display: block;
    position: absolute;
    min-height: 100%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.mediaOverlay_tsb .mediaOverlay-panel {
    position: absolute;
    background-color: transparent;
    color: #6d6a6a;
    top: 90px;
    padding-right: 50px;
}

.mediaOverlay_tsb .mediaOverlay-panel-bd {
    font-size: 12px;
    margin-bottom: 20px;
}

@media (max-width: 767px) {
    .mediaOverlay_tsb .mediaOverlay-panel-hdg {
        margin-right: 0;
    }
}

.mediaOverlay_tsb .mediaOverlay-panel-hdg {
    
}

.mediaOverlay_tsb .mediaOverlay-panel-hdg_headline {
    
}

.mediaOverlay_tsb .mediaOverlay-panel-cta {
    text-align: left;
}

.mediaOverlay_tsb .mediaOverlay-panel-cta > * {
    padding: 11px;
}

/* ---------------------------------------------------------------------
 TSB Slide: This styles markup directly controlled within CMS for this slide
------------------------------------------------------------------------ */
.tsbSlide-intro {
    font-size: 13px;
    margin-bottom: 6px;
    letter-spacing: .09em;
}

.tsbSlide-intro sup {
    font-size: 9px;
    display: inline-block;
    vertical-align: top;
}

.tsbSlide-heading {
    font-size: 34px;
    letter-spacing: .05em;
    white-space: nowrap;
}

.tsbSlide-copy {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 27px;
}

/* ---------------------------------------------------------------------
 Quote Block
------------------------------------------------------------------------ */
.quoteBlock {
    font-size: 0;
}

.quoteBlock > * {
    display: inline-block;
    vertical-align: top;
}

/* ---------------------------------------------------------------------
 Theme-based break tags
------------------------------------------------------------------------ */
.mix-brDog_medium {
    display: inline;
}

/* ---------------------------------------------------------------------
 productCarousel - small breakpoint
------------------------------------------------------------------------ */

.productCarousel {
    position: relative;
    width: 80%;
    margin: 0 10%;
}

.productCarousel-btn {
    display: block;
}

.productCarousel-btn_prev {
    left: -60px;
}

.productCarousel-btn_next {
    right: -60px;
}

.productBlock {
    display: inline-block;
    width: 17.5%;
}

.productBlock + .productBlock {
    margin-left: 3%;
}

.productBlock {
    width: 17.5%;
    padding-top: 50px;
    opacity: 0.5;
}

.productBlock_active {
    width: 60%;
    padding-top: 0;
    opacity: 1;
}

.productBlock-img {
    float: none;
    width: 100%;
}

.productBlock_active .productBlock-img {
    width: 32%;
}

.productBlock-bd {
    display: none;
}

.productBlock-bd_active {
  display: block;
}

.mix-productBlock_double {
    width: 48.5%;
}

.mix-productBlock_single {
    width: 60%;
    margin: 0 20%;
}

/* ---------------------------------------------------------------------
 productCarousel - medium breakpoint
------------------------------------------------------------------------ */
.productCarousel {
    position: relative;
    width: 78%;
    margin: 0 11%;
}

.productCarousel-window {
    padding-bottom: 40px;
}

.productCarousel-btn {
    width: 23px;
    background-size: contain;
}

.productCarousel-btn_prev {
    left: -70px;
}

.productCarousel-btn_next {
    right: -70px;
}

.productBlock-bd {
    padding-left: 0;
}

.productCarousel-ft {
    display: block;
}

.productCarousel-ft .btn_cta {
    padding: 10px 22px;
    font-size: 12px;
    letter-spacing: normal;
}

.productBlock {
    width: 18%;
    padding-top: 40px;
}

.productBlock + .productBlock {
    margin-left: 2%;
}

.productBlock_active .productBlock-img {
    width: 44%;
}

.productBlock_active {
    width: 60%;
    padding-top: 0;
}


/* ---------------------------------------------------------------------
 Full Width Article Carousel
------------------------------------------------------------------------ */

.articleCarousel-btn {
    width: 23px;
    display: block;
    background-size: contain;
}

.slide .placard_shelter {
    padding: 50px 82px;
}

.placard_shelter .placard-img {
    /*padding-left: 64px;*/
    display: table-cell;
    float: none;
    width: 50%;
    vertical-align: middle;
    box-sizing: border-box;
}

.placard_shelter .placard-bd {
    display: table-cell;
    vertical-align: middle;
    height: 100%;
    float: none;
    width: 50%;
}

.placard_shelter .placard-img img {
    width: 100%;
    max-width: 227px;
}


/* ---------------------------------------------------------------------
 Attention
------------------------------------------------------------------------ */
.attention {
    margin: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.attention-img {
    width: 100%;
    border-bottom: 1px solid #aaa6a3;
    float: none;
}

.attention-inner { padding-top: 16px; }

.attention-inner-hd {
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 300;
}

.attention-inner-supHd {
    margin-bottom: 10px;
    font-size: 9px;
    color: #564e47;
}

.attention-inner-bd {
    font-size: 10px;
    line-height: 1.3;
}

/* ---------------------------------------------------------------------
 Headings
------------------------------------------------------------------------ */
.mix-hdg_product,
.mix-hdg_difference {
    font-size: 28px;
    line-height: 1.1;
    letter-spacing: normal;
}

.mix-hdg_product {
    padding-bottom: 5px;
}

.mix-hdg_productSub {
    font-size: 13px;
}

/* ---------------------------------------------------------------------
 Difference Blocks
------------------------------------------------------------------------ */
.differenceBlock-overlay-hd {
    font-size: 14px;
}

.differenceBlock-desc {
    font-size: 22px;
}

/* ---------------------------------------------------------------------
 Category Blocks
------------------------------------------------------------------------ */
.categoryBlocks-block-icn_light {
    height: 67px;
}

/* ---------------------------------------------------------------------
 Carousel
------------------------------------------------------------------------ */
.differenceCarousel-slides {
    margin-left: -2%;
}

.carousel-slides_1to2to3 > * {
    width: 31.3333%;
    margin-left: 2%;
}

/* ---------------------------------------------------------------------
 differenceCarousel
------------------------------------------------------------------------ */
.differenceCarousel-btn { top: 22%; }
/* ---------------------------------------------------------------------
Select Display: Medium breakpoint
------------------------------------------------------------------------ */
.selectDisplay-container {
    margin: 0 auto;
    max-width: 515px;
}

.selectDisplay-container_alignCenter  {
    text-align: center;
}

.selectDisplay-container > * {
    display: inline-block;
    vertical-align: middle;
}

.selectDisplay-container-media {
    margin-bottom: 0;
    width: 25%;
}

.selectDisplay-container-options {
    width: 68%;
    margin-left: 7%; /* Margin + padding = 75% */
}

.selectDisplay-container-options_single {
    width: auto;
    margin-left: 0;
}

.selectDisplay-container-options > * + * {
    margin-top: 30px;
}

/* ---------------------------------------------------------------------
 hubSplit:
 An object with head and body. body's children have divider. Does apply
 copy styling.
------------------------------------------------------------------------ */
.hubSplit {
    padding-bottom: 30px;
}

.hubSplit-container-hd {
    margin-bottom: 24px;
}

.hubSplit-container-hd .legend {
    width: 100%;
    text-align: center;
    font-size: 18px;
}

.hubSplit-container-bd {
    font-size: 0;
}

.hubSplit-container-bd > * {
    display: inline-block;
    width: 50%;
    padding: 0 50px 0 0;
    font-size: initial;
    box-sizing: border-box;
    vertical-align: top;
    text-align: center;
}

.hubSplit-container-bd > * + * {
    padding: 0 0 0 50px;
    border-left: 1px solid #cccbc8;
}

/* ---------------------------------------------------------------------
 hubStack: medium breakpoint styles
------------------------------------------------------------------------ */
.hubStack {
    margin: 0 auto;
    max-width: 156px;
}

.hubStack-hd {
    margin-bottom: 4px;
    font-size: 26px;
}

.hubStack-bd {
    margin-bottom: 15px;
}

.hubStack-bd > * > .label {
    display: block;
    font-size: 13px;
}

.hubStack-bd_2up > * > select,
.hubStack-bd_2up > * > input {
    width: 94%;
}

.hubStack-ft .fusePump {
    text-align: center;
}

.hubStack-ft .btn {
    min-width: 154px;
    padding: 12px 5px;
    font-size: 14px;
}

.hubStack-bd-copy {
    max-width: 120px;
    margin: 9px auto 17px auto;
    font-size: 13px;
}

/*----------------------------------------------------------------------
Mixin classes
------------------------------------------------------------------------*/
.tanBg_MD { background-color: #f0ece2; }

/* ---------------------------------------------------------------------
 Vertical Rhythm: Medium breakpoint styles
------------------------------------------------------------------------ */
.vr_resetMD { margin-bottom: 0; }

.vr_MD { margin-bottom: 4px; }

.vr_x2MD { margin-bottom: 8px; }

.vr_x3MD { margin-bottom: 12px; }

.vr_x4MD { margin-bottom: 16px; }

.vr_x5MD { margin-bottom: 20px; }

.vr_x6MD { margin-bottom: 24px; }

/* ---------------------------------------------------------------------
Constrain: medium breakpoint styles
------------------------------------------------------------------------ */
.constrain_600MD {
    max-width: 600px;
}

.mix-constrain_centerBlockMD {
    margin: 0 auto;
}

/* ---------------------------------------------------------------------
USER CONTENT
Original Author: Anthony Ticknor
Contributors: Michael Start, Chris Cheney, Tad Runkle,
Anthony Lukes

Target Browsers: All
Media Type: Screen
------------------------------------------------------------------------ */
.userContent { font-size: 16px; }

.userContent h1 {}

.userContent h2 {
    font-size: 37px;
    margin-bottom: 5px;
}

.userContent h3 {
    font-size: 27px;
    line-height: 24px;
}

.userContent h4 { line-height: 24px; }

.userContent h5 { line-height: 24px; }

.userContent h6 { line-height: 24px; }

.userContent li {
    margin-left: 0px;
    line-height: 24px;
}

.userContent .media-hd_full {
    padding-top: 18px;
    clear: both;
}
