@font-face {
    font-family: 'Bicyclette';
    src: url('../fonts/Bicyclette/Bicyclette-Thin.eot');
    src: local('Bicyclette Thin'), local('fonts/Bicyclette/Bicyclette-Thin'),
    url('../fonts/Bicyclette/Bicyclette-Thin.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Bicyclette/Bicyclette-Thin.woff2') format('woff2'),
    url('../fonts/Bicyclette/Bicyclette-Thin.woff') format('woff'),
    url('../fonts/Bicyclette/Bicyclette-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Bicyclette';
    src: url('../fonts/Bicyclette/Bicyclette-Bold.eot');
    src: local('Bicyclette Bold'), local('Bicyclette-Bold'),
    url('../fonts/Bicyclette/Bicyclette-Bold.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Bicyclette/Bicyclette-Bold.woff2') format('woff2'),
    url('../fonts/Bicyclette/Bicyclette-Bold.woff') format('woff'),
    url('../fonts/Bicyclette/Bicyclette-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Bicyclette';
    src: url('../fonts/Bicyclette/Bicyclette-Regular.eot');
    src: local('Bicyclette Regular'), local('Bicyclette-Regular'),
    url('../fonts/Bicyclette/Bicyclette-Regular.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Bicyclette/Bicyclette-Regular.woff2') format('woff2'),
    url('../fonts/Bicyclette/Bicyclette-Regular.woff') format('woff'),
    url('../fonts/Bicyclette/Bicyclette-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Bicyclette Ultra';
    src: url('../fonts/Bicyclette/Bicyclette-Ultra.eot');
    src: local('Bicyclette Ultra'), local('Bicyclette-Ultra'),
    url('../fonts/Bicyclette/Bicyclette-Ultra.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Bicyclette/Bicyclette-Ultra.woff2') format('woff2'),
    url('../fonts/Bicyclette/Bicyclette-Ultra.woff') format('woff'),
    url('../fonts/Bicyclette/Bicyclette-Ultra.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Bicyclette';
    src: url('../fonts/Bicyclette/Bicyclette-Black.eot');
    src: local('Bicyclette Black'), local('Bicyclette-Black'),
    url('../fonts/Bicyclette/Bicyclette-Black.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Bicyclette/Bicyclette-Black.woff2') format('woff2'),
    url('../fonts/Bicyclette/Bicyclette-Black.woff') format('woff'),
    url('../fonts/Bicyclette/Bicyclette-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Bicyclette';
    src: url('../fonts/Bicyclette/Bicyclette-Italic.eot');
    src: local('Bicyclette Italic'), local('Bicyclette-Italic'),
    url('../fonts/Bicyclette/Bicyclette-Italic.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Bicyclette/Bicyclette-Italic.woff2') format('woff2'),
    url('../fonts/Bicyclette/Bicyclette-Italic.woff') format('woff'),
    url('../fonts/Bicyclette/Bicyclette-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Bicyclette';
    src: url('../fonts/Bicyclette/Bicyclette-Light.eot');
    src: local('Bicyclette Light'), local('Bicyclette-Light'),
    url('../fonts/Bicyclette/Bicyclette-Light.eot?#iefix') format('embedded-opentype'),
    url('../fonts/Bicyclette/Bicyclette-Light.woff2') format('woff2'),
    url('../fonts/Bicyclette/Bicyclette-Light.woff') format('woff'),
    url('../fonts/Bicyclette/Bicyclette-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}



@font-face {
    font-family: 'TAN-PEARL';
    src: url('../fonts/TAN-PEARL-Regular.eot');
    src: url('../fonts/TAN-PEARL-Regular.eot?#iefix') format('embedded-opentype'),
    url('../fonts/TAN-PEARL-Regular.woff2') format('woff2'),
    url('../fonts/TAN-PEARL-Regular.woff') format('woff'),
    url('../fonts/TAN-PEARL-Regular.ttf') format('truetype'),
    url('../fonts/TAN-PEARL-Regular.svg#TAN-PEARL-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body{
    font-family: 'Bicyclette';
}

body h1 {
    font-family: Tan-pearl;
    font-size: 38px;
    line-height: 45px;
}
.bespoke_btn a {
    padding: 10px 40px;
    text-transform: uppercase;
    border-radius: 30px;
    background: #141414;
    color: #fff;
}
.header {
    border-bottom: 1px solid #efefef;
}
header nav a {
    font-size: 16px;
    text-transform: uppercase;

}
.cart_count {
    position: absolute;
    right: 0;
    top: -12px;
    background: #000;
    color: #fff;
    width: 20px;
    height: 20px;
    font-size: 15px;
    text-align: center;
    border-radius: 100%;
}

.cart_icon {
    position: relative;
    padding: 0 20px;
}

.user_icon i {
    font-size: 24px;
    margin-bottom: 0;
}

.bespoke_btn {
    margin-right: 20px;
}


.design_form h1 {
    text-align: center;
    font-size: 38px;
    text-transform: uppercase;
    margin-bottom:40px;
}

section.design_form {
    padding: 60px 0;
    background-color: #141414;
}

.card-elegant h3 {
    text-transform: uppercase;
    font-size: 18px;
    margin-bottom: 25px;
}
.jewellery_type_box, .choose_metal_box {
    border: 1px solid #e5e7eb;
    padding: 40px 20px;
    text-align: center;
    border-radius: 7px;
}

.jewellery_type_box .jewellery_icon {
    display: inline-block;

}
.jewellery_type_box.selected, .choose_metal_box.selected, .jewellery_type_box:hover, .choose_metal_box:hover{
    border: 1px solid #b99e6c;
}
.create_own_form {
    max-width: 1000px;
    margin: auto;
}

.card-elegant {
    padding: 10px 0;
}
.card-elegant label {
    text-transform: uppercase;
}

.create_own_form button.btn-tiffany {
    background: #fff;
    color: #141414;
    width: 100%;
    padding: 15px;
    font-size: 17px;
    text-transform: uppercase;
    border-radius: 30px;
}


/** footer **/

footer h4{
    font-family: Bicyclette;
    font-weight: bold;
    font-style: normal;
    font-size: 15px;
    letter-spacing: 4px;

}

footer.footer {
    padding-top: 60px;
    margin-top: 150px;
    font-weight:100;
}

.footer_subscription_form input {
    border-top-width: initial;
    border-right-width: initial;
    border-left-width: initial;
    border-top-color: initial;
    border-right-color: initial;
    border-left-color: initial;
    color: rgb(255, 255, 255) !important;
    background: transparent;
    border-style: none none solid;
    border-image: initial;
    border-bottom: 1px solid rgb(255, 255, 255);
}

.follow_social {
    flex-direction: column;
}
.footer_watermark {
    margin-top: 60px;
}

.footer_watermark img {
    width: 100%;
}


/*
section.parallax-banner {
    height: 70vh;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;

    text-align: center;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 40px;
}
*/
section{
    padding: 60px 0;

}
section.parallax-banner {

    text-align: center;
    position: relative;
    display: flex;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    flex-direction: column;
    justify-content: flex-end;
}
section.design_your_own {
    text-align: center;
}

section.parallax-banner.bespoke_banner1 {
    /*  background-image: linear-gradient(180deg, rgb(255 255 255 / 0%) 70%, rgb(241 250 252) 100%), url(images/ring.png);*/
    background-image: linear-gradient(180deg, rgb(255 255 255 / 0%) 70%, rgb(241 250 252) 100%);
    padding: 40px 0 80px;
}

.banner_img {
    width: 100%;

}

.banner_img img {
    width: 100%;
}

.parallax-banner  h1 {
    line-height: 40px;
    font-size: 38px;
}
.bespoke_banner1 h4 {
    font-size: 20px;
    font-weight: 100;
}

.banner_buttons {
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 25px;
}

.banner_buttons .header_button {
    border: 1px solid #141414;
    border-radius: 30px;
    font-size: 20px;
    padding: 10px 20px;
    flex: 0 0 20%;
}
.header_button.header_button_black {
    background: #000;
    color: #fff;
}


section.online_customization_section1.parallax-banner {
    background-image: url('../../../../../assets/images/bespoke-banner-img1.jpg');
    color: #fff;
    height: 100vh;
}


section.online_customization_section2.parallax-banner {
    background-image: url('../../../../../assets/images/bespoke-banner-img2.jpg');
    color: #fff;
    height: 100vh;
}

section.online_customization_section3.parallax-banner {
    background-image: url('../../../../../assets/images/bespoke-banner-img3.jpg');
    color: #fff;
    height: 100vh;
}
section.online_customization_section1.parallax-banner h4 , section.online_customization_section2.parallax-banner h4  , section.online_customization_section3.parallax-banner h4{
    font-size: 22px;
    max-width: 800px;
    margin: auto;
    font-weight: 300;
    line-height: 28px;
}
section.rings_carousel_section {
    padding: 60px 0;
    text-align: center;
    overflow: hidden;

    position: relative;
}

.slick-slide {
    float: left;
}
.diamond_ring_carousel, .diamond_ring_carousel2 {
    width: 100%;
    overflow: hidden;
    margin-top: 40px;
    padding: 0 60px;
    position: relative;
}

.slick-slide {
    display: block;
}

.ring_carousel_item img {
    width: 100%;
    padding-right: 10px;
}
.rings_carousel_section h4 {
    font-size: 30px;
    color: #545454;
    font-weight: 300;
    letter-spacing: 3px;
}

.ring_carousel_item h3 {
    font-size: 20px;
    text-transform: uppercase;
    margin-top: 10px;
}

.rings_carousel_section .slick-prev, .rings_carousel_section .slick-next, .slick-arrow:hover {
    border: 1px solid #e4e4e4;
    background: #f7f7f7;
    width: 56px;
    height: 56px;
    z-index: 1;
    border-radius: 100%;
}
.rings_carousel_section .slick-prev:before, .rings_carousel_section .slick-next:before {
    content: "\f104";
    color: #909090;

    font-family: "Font Awesome 7 free";
    font-weight: 900;
}
.rings_carousel_section .slick-next:before {
    content: "\f105";
}
.rings_carousel_section .slick-next {
    right: 30px;
}
.rings_carousel_section .slick-prev{

    left:30px;
}

.section_customize_ring {
    text-align: center;
    text-transform: uppercase;
}

.testimonial_carousel {
    max-width:800px;
    overflow: hidden;

    margin: 0 auto !important;
    position: relative;
}

section.testimonial {
    background: #f3f9fc;
    text-align: center;
}

.testimonial_items .testimonial_content {
    font-size: 24px;
    font-weight: 300;
}

.testimonial_items .testimonial_author {
    font-size: 26px;
}
section.faq {
    text-align: center;
}
.faq_question {
    font-size: 20px;
    padding: 10px;
    text-align: left;
}

.faq_answer {
    FONT-WEIGHT: 300;
    font-size: 18px;
    text-align:left;
}
.slick-dots li button:before {
    content: "";
    width: 50px;
    background: #000;
    height: 7px;
    border-radius: 2px;
}

.slick-dots li button {
    font-size: 100px;
    width: 50px;
    height: 7px;
    line-height: 7px;
    padding: 0;
    /* background: red; */
}

.slick-dots li {
    width: 50px;
    height: 7px;
    /* background: #2bcb51; */
}
@media only screen and ( max-width:1280px){


    .main_navigation a {

        margin: 0 12px !important;
    }
    .bespoke_btn {
        margin: 0;
    }
    .bespoke_btn button {
        padding: 12px;
    }
    .banner_buttons .header_button {
        flex: 0 0 35%;
    }
}
@media only screen and ( max-width:767px){
    body h1 {
        font-size: 30px;
        line-height: 35px;
    }
    .bespoke_btn {
        display: none;
    }
    .design_form h1 {
        font-size: 30px;
        line-height: 40px;
    }

    .design_form h1 br {
        display: none;
    }
    .main_navigation {order: 1;}
    div#mobile-menu {
        position: fixed;
        top: 0px;
        width: 80%;
        height: 100%;
    }

    div#mobile-menu li a {
        padding: 10px 20px;
        text-align: left;
        font-family: 'Bicyclette';
        font-size: 25px;
        letter-spacing: 4px;
    }

    .banner_buttons .header_button {
        flex: 0 0 45%;
        padding: 10px;
        font-size: 18px;
    }


    .ring_carousel_item h3 {
        font-size: 16px;
    }

    .parallax-banner h1 {
        font-size: 30px;
        line-height: 40px;
    }

    section.online_customization_section1.parallax-banner h4, section.online_customization_section2.parallax-banner h4, section.online_customization_section3.parallax-banner h4 {
        font-size: 20px;
    }

}
@media (min-width: 768px) {
    .md\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}


/** 19/09/2025 **/
.modal_box.modal_box_white {
    background-color: #ffffff;
    background-image: url('/public/images/DCA-Monogram-LOGO_Charcoal2.png');
}

.modal_box
{
    background-image: url('/public/images/Group 982.png');
    background-color: #141414;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 70px;
}


.modal_box h2 {
    font-family: 'TAN-PEARL';
    font-size: 58px;
    line-height: 80px;
}

.modal_box p {
    font-size: 15px;
    /* font-family: 'Bicyclette'; */
    font-weight: bold;
    letter-spacing: 4px;
}
.modal_box p a {
    color: #ffffff80;
}
.modal_box input, .modal_box textarea {
    background: transparent;
    border-bottom: 1px solid hsl(0deg 0% 100% / 50%);
    font-size: 15px;
}

.modal_box .submit_btn{
    font-size: 15px;
    font-family: 'Bicyclette';
    letter-spacing: 3px;
}


.text-center.application_popup_heading:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    background-image: url('/public/images/plus_icon.png');
    background-repeat: no-repeat;
    right: 0;
    width: 30px;
    background-size: 100%;
}

.text-center.application_popup_heading {
    position: relative;
}

.text-center.application_popup_heading:before {
    left: 0;
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    background-image: url('/public/images/plus_icon.png');
    background-repeat: no-repeat;

    width: 30px;
    background-size: 100%;
}

.modal_box_white input ,.modal_box_white textarea{
    border-bottom: 1px solid #1414148a;
}

.site-checkbox-filter > li {
    display: inline-block;
}
.ml-auto {
    margin-left: auto !important;
}
.pr-10{
    padding-right: 10px;
}
.color-swatch:hover{
    cursor: pointer;
    border: 2px solid black;

}
.selected_categories_description {
    font-family: Tan-pearl;
    font-size: 18px;
    margin-top: 15px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: TAN-PEARL;
}
.pr-10{
    padding-right: 10px;
}
.secondary-button:hover {
    background-color: #050e3a0d;
    color: black !important;
}