.item-card .product-card a.asset img {object-fit:contain;} 
.cardsContainer .content-card .asset {aspect-ratio:unset;}   /* fx for cnavs with short images */

.noImagePadding .bannerBlock .mod-hero-product .asset {padding:0px;} 
.noImagePadding.bannerBlock .mod-hero-product .asset {padding:0px;} 

.variant-selector .alloy {visibility:hidden!important;} 
.product-container .icon svg {width:26px;height:26px;}

/*-- make page partials behave like cnavs ---*/ 

.contentNavBlock .content-card a.asset:after,.contentNavBlock .content-card a.asset:hover:after {display:none;}
.articlePage .content-card a.asset:after,.articlePage .content-card a.asset:hover:after {display:none;}

/*----------------------------------------------------*/
 
.ss360-data-point__cell--value {
    word-break: break-word!important;
}

.ss360-data-points--column {
    max-width: 100%!important;
    width: 100%;
}

body.hideSearchBoxes .search-container {display:none!important;}
body.hideSearchBoxes ul.utilities li.search-utility {display:none!important;}

/*----------------------------------------------------*/

.bannerAnimated .background.background-overlay picture {
    animation: zoom-in-zoom-out 8s ease-in-out infinite
}

.bannerAnimated .asset picture img {
    animation: zoom-in-zoom-out 8s ease-in-out infinite
}

@keyframes zoom-in-zoom-out {
    0% {
        transform: perspective(100px) translateZ(0)
    }

    70% {
        transform: perspective(100px) translateZ(6px)
    }

    100% {
        transform: perspective(100px) translateZ(0)
    }
}


/*----------------------------------------*/ 

.btn.btn-transparent { 
    background-color:transparent!important;
} 

.text-red {
    color: #f00
}

.text-green {
    color: lime-green
}


.btn-gold-ww {
    min-height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background-color: #726d7f;
    border-color: #726d7f
}

.bg-white {
    background-color: #fff
}

.bg-grey {
    background-color: #696969
}


.bg-LightGold {
    background-color: #b99c5d
}

.bg-DarkSilver {
    background-color: #626a74
}

.bg-LightSilver {
    background-color: #9c9b9b
}

.bg-DarkGold {
    background-color: #957f4e
}

.bg-OffWhite {
    background-color: #fafafa
}

.text-LightGold {
    color: #b99c5d
}

.text-DarkSilver {
    color: #626a74
}

.text-LightSilver {
    color: #9c9b9b
}

.text-DarkGold {
    color: #957f4e
}

.btn-white {
    background-color: #fff !important;
    color: #666 !important
}

.btn-gold {
    color: #fff !important;
    background-color: #726d7f !important;
    border-color: #726d7f !important
}

.btn-slateblue {
    color: #fff !important;
    background-color: #726d7f !important;
    border-color: #726d7f !important
}

.btn-gold,
.btn-slateblue {
    min-height: 60px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center
}


/*----------------------------------------*/ 

.bigTitle {
    font-size: 4.375rem
}


.bigTitle .header-title {
    font-size: 4.75rem !important
}

.share-container .print {
    display: none !important
}

.mod-header-message.bg-purple-mid {
    color: #fff !important;
    background: #595378 !important
}

em {
    text-decoration: none
}

#filterAccordian div.border-bottom button {
    background-color: transparent
}

.mod-hero-grid .grid-row .grid .background:before {
    content: none !important;
    background-image: unset !important
}

.carouselNewsletter .mod-carousel {
    margin-bottom: 0 !important
}

.coin_image_fix {
    min-width: unset !important;
    min-height: unset !important;
    top: -50% !important;
    height: auto !important
}

/*----------------------------------------*/ 

.panelBlock .grid.asset a picture {
    width: 100%;
    height: 100%
}

.panelBlock .grid.asset a:not(.btn) {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.panelBlock .grid.asset a:not(.btn) img {
    object-fit: cover;
    width: 100%;
    height: 100%
}
/*----------------------------------------*/ 

.thinbanner .background .img {
    min-height: unset
}

.thinBanner .mod-masthead .masthead-container {
    min-height: unset !important
}

/*----------------------------------------*/ 

.image_top_panel>div.grid.asset {
    display: inline-grid
}

.image_top_panel>div.grid.asset .content {
    order: 2;
    margin-top: 20px
}

.image_top_panel>div.grid.background .content {
    order: 1
}

/*----------------------------------------*/ 

.hideThis {
    display: none !important
}

.hideThisImportant {
    display: none !important;
    visibility: hidden !important;
    width: 0;
    height: 0
}

/*----------------------------------------*/ 

.rm_table {
    text-transform: uppercase !important;
    font-family: brandon-grotesque, sans-serif !important
}

.rm_table thead th {
    text-transform: uppercase;
    font-weight: 1000;
    text-align: center;
    line-height: 1.25rem;
    padding: 20px
}

.rm_table thead th.highlighted {
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    background-color: #211c35;
    padding: 20px
}

.rm_table tbody tr {
    border-bottom: 1px solid #211c35
}

.rm_table tbody td {
    text-transform: uppercase;
    text-align: center;
    line-height: 1.25rem;
    padding: 20px
}

.rm_table tbody td.highlighted {
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    background-color: #211c35;
    padding: 20px
}

.rm_table tfoot td {
    text-transform: uppercase;
    text-align: center;
    line-height: 1.25rem;
    padding: 20px
}

.rm_table tfoot td.highlighted {
    text-transform: uppercase;
    text-align: center;
    color: #fff;
    background-color: #211c35;
    padding: 20px
}

.rm_table_striped tbody tr:nth-child(even) {
    background-color: #f2f2f2
}

table.table-white {
    background-color: #fff
}


/*----------------------------------------*/ 

.modal-dialog {
    max-width: 800px !important
}

.fullWidthVideo .grid .content {
    max-width: unset !important;
    padding: 0 !important
}

.fullWidthVideo .grid {
    padding: 0 !important
}

.eb_flush {
    margin-left: -10px !important;
    margin-right: -10px !important
}

.cont_flush>div {
    margin-left: -10px !important;
    margin-right: -10px !important
}

.rme_rooms .mod-hero.mod-hero-product.flush {
    margin-bottom: 0
}

.bannerGroup .mod-hero.mod-hero-product.flush {
    margin-bottom: 0
}

.split_banner_group .mod-hero.mod-hero-product.flush {
    margin-bottom: 0
}

.small_logo_wrapper .small_logo img {
    max-width: 250px
}

ul.dashed {
    list-style-type: none
}

ul.dashed>li:before {
    content: "–";
    position: absolute;
    margin-left: -1.1em
}

.margins {
    margin: 0 auto
}

/*----------------------------------------*/ 

.img-responsive {
    max-width: 100%
}

.img-100 {
    width: 100%
}

.page-account .mod-section {
    padding-bottom: 0
}

.product-card .product-data .additional p .datetime {
    text-align: right
}

.trust-bar {
    background: #484545 !important
}

li.account-management .funds-available {
    display: none !important
}

/*----------------------------------------*/ 

.side-button,
.side-button:active,
.side-button:hover,
.side-button:visited {
    background: #000;
    border: 0;
    margin: 0;
    width: 115px;
    -webkit-transform: rotate(-90deg);
    color: #fff;
    transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    text-align: center;
    font-size: 13px;
    padding: .75em 1.25em;
    position: fixed;
    right: -40px;
    bottom: 50%;
    font-family: brandon-grotesque;
    text-transform: uppercase;
    z-index: 15;
    cursor: pointer
}

.side-button.feedback {
    background: #726d7f !important;
    color: #fff !important;
    bottom: 55% !important
}

/*----------------------------------------*/ 

.button-row-container .payment-options-w-barclays a.btn.btn-primary {
    margin-left: auto !important;
    margin-right: auto !important
}

.form-spacing.border-top {
    padding-bottom: 0;
    margin-bottom: 0
}

#barclaysPaymentiFrame {
    height: 850px !important
}

.iframe-box {
    height: 850px !important
}

.order-summary .button-row-container.CK_step4 div.payment-options-w-barclays {
    margin-bottom: 2rem !important;
    padding-bottom: 0
}

.order-summary .button-row-container.CK_step4>div {
    margin-bottom: 0 !important;
    padding-bottom: 0;
    margin-top: 0 !important
}

/*----------------------------------------*/ 

#header.noPadding {
    padding-top: 0 !important
}

.xy {
    margin: 0 -10px !important
}


#content div.mod-section.mod-section-copy:not(.mod-section-first) {
    padding-bottom: 0
}

.ryi_month h4.text-left {
    margin: 2rem 0
}

.newsletterPanel .editorialBlock h1,
.newsletterPanel .editorialBlock h2,
.newsletterPanel .editorialBlock h3,
.newsletterPanel .editorialBlock h4 {
    color: #fff !important
}

.content-card .asset img {
    aspect-ratio:unset!important;
}

.britanniaBullionArticles .content-card .copy a {
    color: #fff !important
}

.new-message-colour .mod-header-message {
    background: #595378;
    font-size: 1.2rem;
    text-transform: unset
}

.product-listing .section-head,
#content>h2.section-head {
    display: none !important
}

/*----------------------------------------*/ 

.pjBanner .mod-masthead {
    margin-bottom: 3.125rem
}

.pjBanner .mod-masthead .background picture {
    height: 50%;
    margin-top: 0
}

.pjBanner .mod-masthead .content {
    position: relative;
    z-index: 2;
    margin: 0 auto;
    justify-content: center;
    top: -5rem
}

.pjBanner .mod-masthead .background picture img {
    min-width: 10%;
    min-height: 10%;
    -o-object-fit: fill;
    object-fit: fill;
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%
}

.pjBanner p {
    color: #4a4a49;
    font-family: freight-text-pro, serif !important
}

.pjBanner h1 {
    color: #0e072c !important
}

.pjBanner .btn {
    letter-spacing: 1px
}


.pjBanner .mod-masthead .background-overlay picture:before {
    background-image: none
}

.pjBanner .mod-masthead .content .copy {
    background: #f4f1eb;
    color: #000;
    border: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px)
}



/*----------------------------------------*/ 

.copyright p {
    color: #fff !important
}

.quick_cta_black a {
    min-width: 30%;
    color: #171232 !important
}

.mod-hero-product .title {
    font-size: 2.625rem !important
}

/*----------------------------------------*/ 

.beta_nav_carousel_wrapper.bg-white {
    background-color: #edeae5 !important
}

.beta_nav_carousel_wrapper {
    background-color: #edeae5 !important
}

.beta_nav_carousel_wrapper {margin-bottom:1rem;} 

.carouselFilter .cf_header {
    text-transform: capitalize
}

/*----------------------------------------*/ 

.newAtoB {
    background-color: #1e774f !important;
    border: 0
}

.product-data .col.price {
    text-align: right !important
}

.editorialBlock h2,
.editorialBlock h1,
.editorialBlock h3,
.editorialBlock h4 {
    color: #0e072c !important
}

.content-card .copy .title {
    letter-spacing: 1 !important;
    color: #0e072c;
    font-family: brandon-grotesque, sans-serif !important
}

.content-card .copy a {
    font-family: brandon-grotesque, sans-serif !important
}

/*----------------------------------------*/ 

#buttonoutline,.buttonoutline {
    display: flex;
    flex-direction: row
}

#buttonoutline:before,
#buttonoutline:after {
    content: "";
    flex: 1 1;
    border-bottom: .5px solid #a9a7b1;
    position: relative;
    height: 0;
    margin: 20px
}

.buttonoutline:before,
.buttonoutline:after {
    content: "";
    flex: 1 1;
    border-bottom: .5px solid #a9a7b1;
    position: relative;
    height: 0;
    margin: 20px
}

.buttonoutlinedouble {
    display: flex;
    flex-direction: row
}

.buttonoutlinedouble:before,
.buttonoutlinedouble:after {
    content: "";
    flex: 1 1;
    border-bottom: .5px solid #a9a7b1;
    position: relative;
    height: 32px;
    margin: 20px
}

/*----------------------------------------*/ 

.mmMesage {
    display: none !important
}

/*---------------------------------------------------------------------*/ 
/*---------------------------------------------------------------------*/ 

@media(max-width:280px) {
    .pjBanner .btn {
        margin: 0 auto 10rem !important
    }
}

/* - - - - - - - - -*/ 

@media only screen and (min-width:401px) {
    #content div.mod-filters.mod-filters--sidemenu {
        background-color: #373347 !important
    }
}

/* - - - - - - - - -*/ 

@media screen and (max-width:600px) {

    .copyright img {
        margin: 0 auto 2.25rem;
        height: auto !important;
        width: 5rem !important;
        aspect-ratio: 1/1 !important;
        margin-top: 2rem
    }

    .mobileShrink .btn.btn-primary.add-to-basket {
        bottom: -88px;
        font-size: .9rem
    }

    .mobileShrink .add-to-basket.activeHover {
        bottom: -24px !important
    }

    section.mt_slider__container.row.justify-content-center {
        max-width: 100vw;
        overflow: hidden
    }

    .pjBanner .mod-section.mod-section-copy.mod-section-first {
        padding-top: 0;
        padding-bottom: 0
    }

    .filter-modal-trigger {
        font-size: 1rem !important
    }

    .pjBanner p {
        font-size: 1rem
    }

    .pjBanner .mod-masthead .background picture img {
        min-width: 100%;
        min-height: unset;
        -o-object-fit: fill;
        object-fit: fill;
        position: absolute;
        top: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 100%
    }

    .pjBanner .mod-masthead .content .copy {
        background: #f4f1eb;
        color: #000;
        border: 0;
        -webkit-transform: translateY(-43%);
        transform: translateY(-43%);
        padding-top: 1rem;
        left: 0
    }

    .pjBanner .copy div.row div.d-none.d-md-block {
        display: block !important
    }

    .pjBanner h1 {
        color: #0e072c !important;
        font-size: 2.4rem
    }

   
    .pjBanner .mod-masthead .masthead-container {
        min-height: calc(90vh) !important
    }

    .pjBanner .mod-masthead .content {
        position: relative;
        z-index: 2;
        margin: 0 auto;
        justify-content: center;
        top: -7rem !important
    }

    .pjBanner .copy {
        width: 100%
    }

    .pjBanner .btn {
        width: 100%;
        max-width: 18.125 rem;
        margin: 0 auto 4.5rem
    }

    .editorialBlock h1 {
        font-size: 2rem
    }

    .mod-filters--mobile {
        margin-bottom: 1rem !important
    }

    .mod-filters--mobile a {
        border-bottom: 0
    }

    .product-listing .product-range h2.section-head {
        display: none !important
    }

    #breadcrumb .breadcrumb li.active {
        display: none
    }

    .trust-bar {
        padding: 0 0 !important;
        background: #484545
    }

    .trust-bar-feefo-container {
        background: #484545 !important
    }

    .search_filter.mod-filters.mod-filters--mobile {
        background-color: #f4f1eb !important
    }

    .mod-filters.mod-filters--mobile {
        background-color: #f4f1eb !important
    }

    .mod-masthead .content .copy {
        display: block;
        position: absolute;
        left: -9999px
    }

    .thinBanner .masthead-container {
        display: none
    }

    .side-button.feedback {
        bottom: 25% !important
    }

    .coin_image_fix {
        min-width: unset !important;
        min-height: unset !important;
        top: -100% !important;
        height: auto !important
    }
}


/* - - - - - - - - -*/ 

@media screen and (max-width:700px) {

    #content div.mod-filters.mod-filters--sidemenu {
        background-color: #373347
    }

    .d_only_button {
        display: none
    }
}

/* - - - - - - - - -*/ 

@media screen and (max-width: 767px) 
{
    .modal.striking-standard-modal .btn.btn-secondary:hover{width:100%;}
    body #hubspot-messages-iframe-container.widget-align-right
    {       
        top:unset!important;
        bottom: 0px!important;
    }

    body #hubspot-messages-iframe-container.widget-align-right .hs-shadow-container.active  {
    top:0px!important;        
    bottom:unset!important;
        }

    #hubspot-messages-iframe-container .shadow-container.active+iframe {
    height: calc(100% - 80px)!important;
    }

    #content {
        max-width: 100vw;
        overflow-x: hidden;
    }
}

/* - - - - - - - - -*/ 
@media screen and (device-width:768px) {
    .pjBanner .mod-masthead .masthead-container {
        min-height: calc(70vh - 159px)
    }

    .pjBanner .mod-masthead {
        margin-bottom: 0
    }
}

/* - - - - - - - - -*/ 

@media screen and (min-width:768px) {
    .pjBanner .mod-masthead .content .copy {
        padding: 1.625rem
    }
}

/* - - - - - - - - -*/

@media(min-width:768px) and (max-width:991.98px) {
    .pjBanner .mod-masthead .masthead-container {
        min-height: 50vh !important
    }
}

/* - - - - - - - - -*/ 

@media only screen and (min-width:800px) {
    .product-card .product-information {
        min-height: 100px
    }
}

/* - - - - - - - - -*/ 

@media screen and (max-width:992px) {
    
    #content {
        padding-top: 0 !important
    }

    .newBetaNav .menu.menu-list .featured {
        padding-top: 0 !important;
        padding-bottom: 0 !important
    }

    .newBetaNav .mega-menu.mega-menu--flat>li.featured {
        padding-bottom: 20px !important
    }

    .newBetaNav .menu.menu-list li a {
        padding-left: 0 !important
    }
}

/* - - - - - - - - -*/ 

@media(min-width:992px) {
    .pjBanner .mod-masthead .masthead-container {
        min-height: 36rem !important
    }

    .pjBanner .mod-masthead .content {
        position: absolute !important;
        z-index: 2 !important;
        margin: 0 auto !important;
        justify-content: center !important;
        -webkit-transform: translateY(-113%) !important;
        transform: translateY(-113%) !important;
        top: 0 !important;
        left: 0;
        width: 100%
    }
}

/* - - - - - - - - -*/ 
 
@media(max-width:767px) and (min-width:600px) {
    .pjBanner .copy .d-none.d-md-block {
        display: block !important
    }

    .pjBanner .mod-masthead .masthead-container {
        min-height: calc(90vh)
    }

    #content .pjBanner .mod-masthead .content .copy {
        transform: translateY(170px) !important;
        padding: 1.625rem 0
    }

    .pjBanner .mod-masthead .content .copy h1 {
        font-size: 2.5rem
    }
}


/* - - - - - - - - -*/ 

@media(min-width:1399.98px) {
    .pjBanner .mod-masthead .content .copy {
        -webkit-transform: translateY(90px);
        transform: translateY(90px)
    }
}

/* - - - - - - - - -*/