/************************************************
        Common start
************************************************/
@media (min-width:1200px){
    .uk-home-page .section{ padding: 40px 0; }
    .uk-home-page .joinus{
        padding-top: 32px!important;
    }
    .uk-home-page .review-badges-container{
        margin-top: 20px!important;
    }
}
.uk-home-page .pt-0 { padding-top: 0; }
.uk-home-page .pb-0 { padding-bottom: 0; }
.uk-home-page .pl-0 { padding-left: 0; }
.uk-home-page .pr-0 { padding-right: 0; }
.uk-home-page .hdrheight{height: 0!important; }

/************************************************
        Common end
************************************************/


/************************************************
        Header start
************************************************/
.uk-home-page #header{
    position: fixed;
    top: 0!important;
    left: 0;
    right: 0;
    background: linear-gradient(360deg, rgba(0, 0, 0, 0) 13.94%, rgba(0, 0, 0, 0.35) 100%);
}
.uk-home-page #header .header-top{
    display: none !important;
}
.uk-home-page #header:hover{
    background: var(--color-white);
    transition: none!important;
}
.uk-home-page #header.fixed{
    background: var(--color-white);
}
.uk-home-page #header:not(:hover):not(.fixed) .header-logo-icons .icons{
    filter: invert(1);
}
.uk-home-page #header:not(:hover):not(.fixed) .header-logo-icons .logo > a > img{
     content: url('/catalog/view/theme/default/image/homepage-uk/logonew-uk.svg');
}
.uk-home-page .mainMenu{
    background:transparent;
    border: 0;
}
.uk-home-page #header:not(:hover):not(.fixed) .navbar-nav > li > a{
    color: var(--color-white)!important;
}
.uk-home-page #header:not(:hover):not(.fixed) .navbar-nav > li > a.hassubmenu:after{
    filter: invert(1);
    transition: none!important;
}
.uk-home-page #header:not(:hover):not(.fixed) .logo .nav-toggle .icon-bar {
    background-color: var(--color-white);
}

@media (max-width:767px){
    .uk-home-page #header {
        background: linear-gradient(0deg, rgba(0, 0, 0, 0) 14%, rgba(0, 0, 0, 0.35) 100%);
    }
}

/************************************************
        Header end
************************************************/



/************************************************
        USP Bar start
************************************************/

.uk-home-page #uspBar{
    padding: 16px;
    background-color: var(--color-milk);
}
.uk-home-page #header-top-carousel-uk{
    max-width: 669px;
    margin:0 auto;
    padding:0 24px;
    text-align: center;
}
.uk-home-page #header-top-carousel-uk a{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    color: var(--color-jet);
    font-weight: 700;
    font-size: var(--font-libre-14);
    line-height: var(--font-libre-14-line-height);
}
.uk-home-page #header-top-carousel-uk a img{
    width: auto !important;
}
.uk-home-page #header-top-carousel-uk .owl-nav{
    margin:0;
}
.uk-home-page #header-top-carousel-uk .owl-nav [class*="owl-"]{
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 12px;
    height: 12px;
}
.uk-home-page #header-top-carousel-uk .owl-prev{ left: 0; } 
.uk-home-page #header-top-carousel-uk .owl-next{ right: 0; }
.uk-home-page #header-top-carousel-uk .trustpilot-widget{
    margin:0!important;
}
.uk-home-page #header-top-carousel-uk .owl-stage{
    display: flex;
    justify-content: center;
    align-items: center;
}
.uk-home-page #header-top-carousel-uk li img{
    height: 24px !important; margin-right: 8px;
}
.uk-home-page #header-top-carousel-uk li span{
    text-decoration: underline;
}
.uk-home-page #header-top-carousel-uk .klarna img{
    margin: 0 8px;
}
@media (max-width:767px){
    .uk-home-page #uspBar {
        padding-top:9px; padding-bottom:9px;
    }
    .uk-home-page #header-top-carousel-uk .klarna img{
        height: 30px !important; margin: 0 4px;
    }
}
/************************************************
        USP Bar end
************************************************/


/************************************************
        Promotional Cards start
************************************************/
.promotional-cards .card{
    position: relative;
    color:var(--color-white);
}
.promotional-cards .content {
    position: absolute;
    left: 16px; right: 16px; top: 0; bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    line-height:54px;
}
.promotional-cards .content h3 {
    font-family: var(--font-family-ivy);
    font-size: var(--font-ivy-24);
    margin: 0;
}
.promotional-cards .content h2 {
    font-family: var(--font-family-ivy);
    font-size:46px;    
    margin: 0;
}
.promotional-cards .content a{
    margin-top: 16px;
    padding-left:35.5px; padding-right:35.5px;
    font-size: var(--font-libre-16);
}
@media (max-width:767px){
    .promotional-cards{
        padding-bottom: 30px!important;
    }
}
@media (max-width:991px){
    .promotional-cards [class*="col-"] +  [class*="col-"]{
        margin-top:24px;
    }
    .promotional-cards .content h2 {
        font-size:42px;    
    }
}

/************************************************
        Promotional Cards end
************************************************/


/************************************************
        Explore Our Categories start
************************************************/
.explore-categories{

}
.categories-tabs{
    display: flex;
    align-items: center;
    justify-content: center;
}
.categories-tabs a{
    color: #1D1F1E !important;
    font-size: var(--font-libre-20);
    line-height: var(--font-libre-20-line-height);
}
.categories-tabs a + a{
    margin-left:40px;
}
.categories-tabs a.active{
    text-decoration: underline!important;
    color: var(--color-brown) !important;
    font-weight: var(--font-weight-semi-bold);
}
.categories-tabs-body .section-header{
    display: none!important;
}
.categories-tabs-body .owl-carousel{
    margin: 0 -12px;
    width: calc(100% + 24px);
}
.categories-tabs-body .item{
    padding:40px 12px 0;
}
.categories-tabs-body figure{
    margin: 0;
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 6px 32px 0px #79797914;
}
.categories-tabs-body figure img{
    max-width: 230px;
    width: initial !important;
    transition: all 0.3s ease-in-out;
}
.categories-tabs-body a:hover figure img{
    transform: scale(1.1);
}
.categories-tabs-body #categories h4{
    font-family: var(--font-family-ivy);
    font-size: var(--font-ivy-24);
    line-height: var(--font-ivy-24-line-height);
    color: var(--color-jet);
    margin:20px 0 0;
    text-align: center;
}
#newArrivals .container, #mostPopular .container{
    padding:0;
}
#newArrivals .section.pdp-carousel-container,
#mostPopular .section.pdp-carousel-container{
    padding-bottom:0!important;
}
@media (max-width:767px){
    .explore-categories.section{
        padding-bottom:50px;
    }
    .explore-categories .section-header {
        margin-bottom: 30px;
    }
    .categories-tabs a{
        font-size: var(--font-libre-14);
        line-height: var(--font-libre-14-line-height);
    }
    .categories-tabs-body .item{
        padding: 30px 12px 0 !important;
    }
    .categories-tabs-body figure{
        height: 200px;
    }
    .categories-tabs-body figure img{
        max-width: 100%!important;
        max-height: 100% !important;
    }
    .categories-tabs-body .owl-nav.disabled+.owl-dots{
        margin-top: 30px!important;
    }
}
@media (min-width:1200px){
    .explore-categories.section{
        padding-bottom:64px;
    }

}
/************************************************
        Explore Our Categories end
************************************************/


/************************************************
        Bespoke Jewellery start
************************************************/
.bespoke-jewellery{
    position: relative;
}
.bespoke-jewellery .content {
    position: absolute;
    left: 122px;  top: 0; bottom: 0;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    max-width: 600px;
    color:var(--color-white);
}
.bespoke-jewellery .content h2 {
    font-family: var(--font-family-ivy);
    font-size:46px;    
    line-height: 54px;
    margin: 0 0 8px;
}
.bespoke-jewellery .content p {    
    line-height: 19px;
    margin-bottom: 24px;
}
.bespoke-jewellery .content a{
    padding-left:30px; padding-right:30px;
    font-size: var(--font-libre-16);
}
@media (max-width:767px){
    .bespoke-jewellery .content{
        align-items: center;
        text-align: center;
        left: 32px; right:32px; top: 40px; bottom: initial;
    }
    .bespoke-jewellery .content h2 {
        font-size: var(--font-ivy-28);
        line-height: var(--font-ivy-28-line-height);
    }
    .bespoke-jewellery .content p {    
        line-height: inherit;
    }
}
/************************************************
        Bespoke Jewellery end
************************************************/


/************************************************
        Ring Styles start
************************************************/
.ring-styles a{
    position: relative;
}
.ring-styles a h4{
    font-family: var(--font-family-ivy);
    font-size: var(--font-ivy-24);
    line-height: var(--font-ivy-24-line-height);
    color: var(--color-white);
    margin:0;
    text-align: center;
    position: absolute;
    left:0; right:0; bottom:24px;
}
@media (max-width:767px){
    .ring-styles .container{
        padding-right: 0;
    }
    .ring-styles .section-header{
        margin-bottom: 24px;
    }
    #ringStyles .owl-stage-outer .owl-stage{
        padding-left: 0!important; 
    }
    #ringStyles .owl-nav.disabled+.owl-dots{
        display: none!important;
    }
}
/************************************************
        Ring Styles end
************************************************/


/************************************************
        Two-Tile Information start
************************************************/
.two-tile-info{
    text-align: center;
}
.two-tile-info .content h3 {
    font-family: var(--font-family-ivy);
    font-size: var(--font-ivy-36);
    line-height: var(--font-ivy-36-line-height); 
    margin: 24px 0 16px;
}
.two-tile-info .content p {
    margin-bottom: 16px;
}
.two-tile-info .content a{
    color:#1D1F1E;
    text-decoration: underline!important;
    font-size: var(--font-libre-20);
}
@media (max-width:991px){
    .two-tile-info .content h3{
        font-size: var(--font-ivy-28);
        line-height: var(--font-ivy-28-line-height);
    }
}
@media (max-width:767px){    
    .two-tile-info {
        padding-top: 30px !important;
    }
    .two-tile-info .row{
        display: flex;
        flex-direction: column-reverse;
    }
    .two-tile-info [class*="col-"] +  [class*="col-"]{
        margin-bottom:60px;
    }
    .two-tile-info .content h3{
        margin: 20px 0 8px;
    }
    .two-tile-info .content p{
        font-size: var(--font-libre-14);
        line-height: var(--font-libre-14-line-height);
    }
    .two-tile-info .content a{
        color:var(--color-jet);
        font-size: inherit;
        line-height:inherit;
    }
}
/************************************************
        Two-Tile Information end
************************************************/



/************************************************
        Our approach start
************************************************/
.our-approach{
    text-align: center;
}
.our-approach .section-header {
    margin-bottom: 30px;
}
.our-approach figure{
    width:70px; height:70px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}
.our-approach figure img{
    max-width: 100%;
}
.our-approach .content h4{
    font-weight: var(--font-weight-semi-bold); 
    margin: 16px 0 12px;
}
.our-approach .content p{
    margin: 0;
    font-size: var(--font-libre-14);
    line-height: var(--font-libre-14-line-height);
}
@media (max-width:767px){
    .our-approach .row [class*="col-"] + [class*="col-"]{
        margin-top:16px;
    }
    .our-approach .section-header{
        margin-bottom: 26px;
    }
    .our-approach .content h4{
        margin-top: 14px;
        line-height: normal;
    }
}
@media (max-width:991px){
    .our-approach .row [class*="col-"]:nth-child(3),
    .our-approach .row [class*="col-"]:nth-child(4){
        margin-top:16px;
    }
}
@media (min-width:1200px){
    .our-approach .container {
        padding-left: 80px;
        padding-right: 80px;
    }
    .our-approach .container .row{
        margin-left: -20px;
        margin-right: -20px;
    }
    .our-approach .container .row [class*="col-"]{
        padding-left: 20px; padding-right: 20px;
    }
}
/************************************************
        Our approach end
************************************************/




