/*
Liberty London custom CSS - CSS for changing global styles
Any styles here that need to be added to the core style.css should be removed from here at time of release to prevent duplication.
Author: James Finch
*/

/* Inspire me content on PDPs */
.product-additional-content.beauty-content .inspire-me-container {
    width: 100%;
}

.custom-overlay.overlay-modal.open.overlay-personalisation .overlay-content .personalise-footer {
    color: #999;
}

/*Filter by category visable SALE*/

.category-landing.sale .category-refinement {
    display: block !important;
}

/* Christmas Category Landing PLP AD fix */
body.category-landing.christmas .hero-banner {
    display: none !important;
}

/*Hidding Christmas Drop down and arrow button*/
li.has-sub.nav-item-10.Christmas .section-menu{
    display: none;
}

li.has-sub.nav-item-10.Christmas span.arrow {
    display: none;
}
/*END Hidding Christmas*/

.category-landing.sale-preview .category-refinement, .category-landing.women .category-refinement, .category-landing.men .category-refinement {
    display: block;
}

.category-landing .refinement-back-link {
    display: none;
}

.footer h4 {
    text-transform: uppercase;
    font-family: "Avenir LT W01_85 Heavy1475544",sans-serif;
    letter-spacing: 1px;
}


/* Move roundel for accessories > jewellery only */
body.category-listing.accessories-jewellery .product-tile {
    overflow: visible;
    padding-top: 24px;
}

body.category-listing.accessories-jewellery .product-tile .roundel {
    margin-top: -24px;
}

/*Expose 2 panels Homepage*/
.homepage .row.more-content.grid-panel-two {
    overflow: visible;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    max-height: none;
}

.homepage-grid .ghost-button.show-more {
    display: none !important;
}
/*END Expose 2 panels Homepage*/

/*Department Landing Pages*/
/*Expose 2 panels - DLP's*/
.category-landing:not(.gifts) .ghost-button.show-more {
    display: none;
}

.category-landing:not(.gifts) .grid-panel-two.more-content {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    max-height: none;
}

/* Fashion PDP slider colour - need solution for css based on if product imagery shot on grey - flag in AX */
.women-clothing:not(.women-clothing-sleepwear) .product-image-container .slick-track,
.womenswear .product-image-container .slick-track,
.men-clothing .product-image-container .slick-track,
.liberty-collections-men-sleepwear .product-image-container .slick-track {
    background-color: #dad9d5;
}

.category-listing.men-clothing-socks-and-underwear .product-image-container .slick-track,
.product-page.men-clothing-socks-and-underwear .product-image-container .slick-track,
.category-listing.women-clothing-liberty-shirts .product-image-container .slick-track,
.product-page.women-clothing-liberty-shirts .product-image-container .slick-track,
.category-listing.men-clothing-liberty-shirts .product-image-container .slick-track,
.product-page.men-clothing-liberty-shirts .product-image-container .slick-track {
    background-color: #ffffff;
}

/* END Fashion PDP slider colour */

/* Hide crest when promo banner exists on sign in page */
.pt_login .liberty-london-crest-ffffff {
    display: none;
}

/*Features page styles*/
.article-listing .read-more-content .row .content-asset {
    justify-content: unset;
}

.article-listing .read-category-block:last-child {
    display: block !important;
}

@media screen and (min-width: 960px) {
    .article-listing .read-category-block {
        width: 16%;
    }
}

@media screen and (min-width: 769px) {
    .read-category-block {
        width: 33%;
    }
}

/* Beauty Icons */
.beauty-content-wrapper p em {
    font-family: "ITC Caslon_224 W01 Book1551458", Georgia, serif;
}

.beauty-icons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.beauty-icons li {
    display: inline-block;
    width: 80px;
    margin: 10px;
    text-align: center;
    line-height: 1.1;
}

.beauty-icons li span {
    font-family: "Avenir LT W01_65 Medium1475532", sans-serif;
    font-size: 12px;
    line-height: 1.2;
    letter-spacing: normal;
}

.beauty-icons li:before {
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    margin: 0 auto;
}

.vegan-icon:before {
    background-image: url(../images/vegan-icon.svg);
}

.cruelty-free-icon:before {
    background-image: url(../images/cruelty-free-icon.svg);
}

.spf-icon:before {
    background-image: url(../images/spf-icon-v3.svg);
}

.natural-icon:before {
    background-image: url(../images/natural-icon-v2.svg);
}

.sustainable-packaging-icon:before {
    background-image: url(../images/sustainable-packaging-icon.svg);
}

.brightening-icon:before {
    background-image: url(../images/brightening-icon.svg);
}

.antioxidant-icon:before {
    background-image: url(../images/antioxidant-icon.svg);
}

.fragrance-free-icon:before {
    background-image: url(../images/fragrance-free-icon.svg);
}

.hydrating-icon:before {
    background-image: url(../images/hydrating-icon.svg);
}

.long-lasting-icon:before {
    background-image: url(../images/long-lasting-icon-v3.svg);
}

.smoothing-icon:before {
    background-image: url(../images/smoothing-icon.svg);
}

.oil-free-icon:before {
    background-image: url(../images/oil-free-icon.svg);
}

.content-asset-page .article.one-column .credits p {
    margin-bottom: 0;
}

/***** To remove for SP:24 release *****/

/* Video Header */
.one-column .video-hero,
.two-column .video-hero,
.lookbook .video-hero {
    height: 740px;
    position: relative;
    height: calc(100vh - 150px);
    z-index: 0;
    overflow: hidden;
}

.one-column .video-hero video,
.two-column .video-hero video,
.lookbook .video-hero video {
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
}

.one-column div#my-video,
.two-column div#my-video,
.lookbook div#my-video {
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
}

.one-column video#my-video_html5_api,
.two-column video#my-video_html5_api,
.lookbook video#my-video_html5_api {
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
}

.one-column .video-hero .center-vertical,
.two-column .video-hero .center-vertical,
.lookbook .video-hero .center-vertical {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1;
}

.one-column .video-hero .center-vertical .pre-heading,
.two-column .video-hero .center-vertical .pre-heading,
.lookbook .video-hero .center-vertical .pre-heading,
.one-column .video-hero .center-vertical .ghost-button,
.two-column .video-hero .center-vertical .ghost-button,
.lookbook .video-hero .center-vertical .ghost-button {
    color: #fff;
    border-color: #fff
}

.one-column .video-hero .center-vertical .ghost-button:hover,
.two-column .video-hero .center-vertical .ghost-button:hover,
.lookbook .video-hero .center-vertical .ghost-button:hover {
    background: #fff;
    color: #000;
}

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

    .one-column .video-js,
    .two-column .video-js,
    .lookbook .video-js {
        padding-bottom: 100% !important;
    }

    .one-column .video-js .vjs-tech,
    .two-column .video-js .vjs-tech,
    .lookbook .video-js .vjs-tech {
        width: 200%;
        margin-left: -50%;
    }

    .one-column video#my-video_html5_api,
    .two-column video#my-video_html5_api,
    .lookbook video#my-video_html5_api {
        left: 100%;
    }
}

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

    .one-column .video-hero .mute,
    .two-column .video-hero .mute,
    .lookbook .video-hero .mute {
        bottom: 0;
        left: 0;
    }
}


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

    .one-column .video-hero .mute,
    .two-column .video-hero .mute,
    .lookbook .video-hero .mute {
        display: none !important;
    }
}

/*Content Hub page padding*/
@media screen and (min-width: 960px) {

    .content-hub-index section,
    .content-hub-landing section {
        margin: 3.75rem auto;
    }
}

/* Personalise pop up footer */
.personalise-footer {
    width: 100%;
    position: relative;
    float: none;
    clear: both;
}

@media only screen and (max-width: 700px) {
    .custom-overlay.overlay-modal.overlay-personalisation .overlay-content .personalise-content-wrapper {
        width: 100%;
    }
}

/* Sitewide link */
.rotate-promo-wrap,
.rotate-promo-wrap-two {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

.rotate-promo-wrap-two {
    display: none;
}

/***** END to remove for SP:24 release *****/

/**************************** HEADERMENU CSS *******************************/

/* Departments dropdown banners */
.banner a {
    overflow: hidden;
}

/*Liberty Drop Down*/
.has-sub:not(.brand-nav-item):not(.Gifts) .banner {
    background: #bfb2d6;
}

.has-sub:not(.brand-nav-item):not(.Gifts) .center-vertical {
    text-align: left;
    width: 75%;
    color: #a32115;
}

.has-sub:not(.brand-nav-item):not(.Gifts) h4.heading {
    font-family: "Avenir LT W01_85 Heavy1475544", sans-serif;
    color: #a32116;
    border-bottom: solid 8px #a32116;
    padding-bottom: 8px;
}

.has-sub:not(.brand-nav-item):not(.Gifts) .sub-heading {
    display: block;
    font-family: "Avenir LT W01_85 Heavy1475544", sans-serif;
    margin-top: 11px;
    font-size: 22px;
    text-transform: uppercase;
}

.has-sub:not(.brand-nav-item):not(.Gifts) .ghost-button {
    border-color: #a32115;
    color: #bfb2d5;
    background: #a32115;
}

.has-sub:not(.brand-nav-item):not(.Gifts) .ghost-button:hover {
    background: #841209;
    border-color: #841209;
}

/* Gifts dropdown banner */
.Gifts .center-vertical {
    vertical-align: top;
    margin-top: 15px;
}

/* Brands dropdown banner */
.brand-nav-item .center-vertical {
    vertical-align: top;
    padding: 20px;
    text-align: left;
    width: 100%;
}

.brand-nav-item .pre-heading,
.brand-nav-item h4.heading,
.brand-nav-item .ghost-button {
    color: #000;
}

.brand-nav-item .ghost-button,
.brand-nav-item .pre-heading {
    border-color: #000;
}

.brand-nav-item .ghost-button:hover {
    color: #fff;
    background: #000;
}

@media screen and (max-width: 1350px){
    .brand-nav-item .center-vertical {
        background: rgba(229, 228, 226, 0.5);
    }
    .brand-nav-item .block-height {
        background-position: 88%;
    }
}

/*color picker fix for prodcut sets LP-1400*/
.product-set-item .colour-chart-link {
    display: none;
}