.references-hero{

    background-color: #d4cbc8;

    color: white;

    text-align: center;

    padding: 50px 20px 30px 20px;

}

.references-hero h1{

    font-size: 60px;

    margin-bottom: 20px;

    font-family: "Times New Roman", serif;

}

.references-hero p{

    font-size: 24px;

}

.nav-center{
    position: absolute;
    left: 50%;
    transform: translateX(-20%);
}

.products{

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 40px;

    padding: 40px;

    background-color: #f5efe7;

}

.product-card{

    background-color: white;

    border-radius: 20px;

    overflow: hidden;

    box-shadow: 0 5px 20px rgba(0,0,0,0.15);

    transition: 0.3s;

}

.product-card:hover{

    transform: translateY(-10px);

}

.product-card img{

    width: 100%;

    height: 320px;

    object-fit: cover;

}

.product-card h3{

    font-size: 28px;

    padding: 20px 20px 10px 20px;

    color: #2b1b12;

    position: relative;
    top: -0px;

}

.product-card p{

    padding: 0 20px 20px 20px;

    color: #000000;

    font-size: 18px;

}

.product-slider{

    display: flex;

    justify-content: center;

    padding: 0;

}

.product-slider img{

    width: 100%;

    height: 320px;

    object-fit: cover;

    border-radius: 0px;

}

.color-buttons{

    display: flex;

    justify-content: center;

    gap: 15px;

    margin-top: 30px;

    margin-bottom: 20px;

}

.color-buttons button{

    width: 22px;

    height: 22px;

    border-radius: 50%;

    border: none;

    cursor: pointer;

    transition: 0.3s;

}

.color-buttons button:hover{

    transform: scale(1.2);

}

.gold{
    background-color: #bfc1c2;
}

.pink{
    background-color: #d4af37;
}

.silver{
    background-color: #d98ca4;
}

.arrow{
    border: none;
    background-color: #4a3428;
    color: white;
    font-size: 32px;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    cursor: pointer;
}

.arrow:hover{
    background-color: #c89b6d;
}

.product-details{

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 40px;

    padding: 0 20px 20px 20px;

    font-weight: bold;

}

.product-details p{

    margin: 0;

}

.product-details span{

    font-weight: bold;

    color: #4a3428;

    font-size: 18px;

}

.product-line{

    font-weight: bold;

    text-align: center;

    font-size: 18px;

    position: relative;

    top: -55px;

}

.product-line span{

    margin-left: 260px;

    font-size: 24px;

}

.product-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    position: relative;
    top: -15px;
    margin: 0;
    padding-top: 0 !important;
    margin-top: -15px !important;
    position: relative;
    left: -140px;
}

.artisanale-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;
}

.artisanale-line span{

    margin-left: 260px;

    font-size: 24px;

}

.artisanale-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0 !important;
    margin-top: -15px !important;
    position: relative !important;
    left: -151px !important;
}

.artisanale-details{

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 25px;

    position: relative !important;

}

.artisanale-ref{

    font-size: 24px;

    font-weight: bold;

    position: relative;

    left: 15px;

    top: -12px;

}

.portemonnaie-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;
}

.portemonnaie-line span{

    margin-left: 260px;

    font-size: 24px;

}

.portemonnaie-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -32px;
    position: relative;
    left: -192px;
}

.portemonnaie-details{

    display: flex;

    justify-content: center;

    align-items: center;

    gap: 25px;

    position: relative !important;

}

.portemonnaie-ref{

    font-size: 24px;

    font-weight: bold;

    position: relative;

    left: 15px;

    top: -12px;

}

.color-buttons{
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 20px;
}

.color-buttons button{
    width: 22px;
    height: 22px;
}

/* couleurs */

.red{
    background: #8b1e1e;
}

.cuivre{
    background: #77711c;
}

.brown{
    background: #724f2d;
}

.beige{
    background: #ebb583;
}

.petrol{
    background: #0facac;
}

.flower{
    background: #f1d7b4;
}

.navy{
    background: #1f3c88;
}

.orange{
    background: #f06c20;
}

.black{
    background: #111;
}

.jaspe{
    background: linear-gradient(135deg, #f8993b, #c28245);
}

.reference-boxes{

    display: flex;

    justify-content: center;

    gap: 35px;

    margin-top: 60px;

    margin-bottom: 80px;

}

.reference-square{

    width: 320px;

    height: 320px;

    background-color: white;

    border-radius: 20px;

    box-shadow: 0 5px 20px rgba(0,0,0,0.12);

}

.second-products{

    margin-top: 10px;

}

.ref225-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref225-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref225-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -184px;
}

.ref225-card img{

    object-position: center -62px;

}

.ref139-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref139-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref139-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -184px;
}

.ref139-card img{

    object-position: center -62px;

}

.ref15-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref15-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref15-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -142px;
}

.ref15-card img{

    object-position: center -48px;
        position: relative;

    top: 0px;


}

.third-products{

    margin-top: 20px;

}

.ref16-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref16-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref16-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -162px;
}

.ref16-card img{

    object-position: center -62px;

}

.ref381-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref381-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref381-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -94px;
}

.ref381-card img{

    object-position: center -62px;

}

.ref382-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref382-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref382-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -102px;
}

.ref382-card img{

    object-position: center -62px;

}

.ref138-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref138-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref138-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -49px;
}

.ref138-card img{

    object-position: center -62px;

}

.ref137-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref137-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref137-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -58px;
}

.ref137-card img{

    object-position: center -45px;

}

.ref301-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref301-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref301-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -145px;
}

.ref301-card img{

    object-position: center -25px;

}

.ref391-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref391-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref391-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -150px;
}

.ref391-card img{

    object-position: center -25px;

}

.ref218-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref218-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref218-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -48px;
}

.ref218-card img{

    object-position: center -25px;

}

.ref969-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref969-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref969-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -35px;
    position: relative;
    left: -165px;
}

.ref969-card img{

    object-position: center -45px;

}

.ref02-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref02-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref02-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -58px;
}

.ref02-card img{

    object-position: center -52px;

}

.ref11-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref11-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref11-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -121px;
}

.ref11-card img{

    object-position: center -52px;

}

.ref383-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref383-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref383-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -94px;
}

.ref383-card img{

    object-position: center -52px;

}

.ref929-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref929-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref929-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -193px;
}

.ref929-card img{

    object-position: center -52px;

}

.ref17brillant-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref17brillant-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref17brillant-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -121px;
}

.ref17brillant-card img{

    object-position: center -52px;

}

.ref17-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref17-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref17-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -121px;
}

.ref17-card img{

    object-position: center -52px;

}

.ref210-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref210-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref210-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -49px;
}

.ref210-card img{

    object-position: center -52px;

}

.ref357-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref357-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref357-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -192px;
}

.ref357-card img{

    object-position: center -25px;

}

.ref305-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref305-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref305-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -138px;
}

.ref305-card img{

    object-position: center -45px;

}

.ref304-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref304-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref304-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -138px;
}

.ref304-card img{

    object-position: center -45px;

}

.ref973-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref973-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref973-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -192px;
}

.ref973-card img{

    object-position: center -45px;

}

.ref199-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref199-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref199-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -94px;
}

.ref199-card img{

    object-position: center -45px;

}

.ref155-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref155-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref155-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -138px;
}

.ref155-card img{

    object-position: center -45px;

}

.ref67-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref67-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref67-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -147px;
}

.ref67-card img{

    object-position: center -72px;

}

.ref07-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref07-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref07-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -95px;
}

.ref07-card img{

    object-position: center -45px;

}

.ref126-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref126-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref126-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -193px;
}

.ref126-card img{

    object-position: center -45px;

}

.ref979-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref979-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref979-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -184px;
}

.ref979-card img{

    object-position: center -62px;

}

.ref962-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref962-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref962-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -192px;
}

.ref962-card img{

    object-position: center -45px;

}

.ref66-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref66-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref66-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -66px;
}

.ref66-card img{

    object-position: center -80px;

}

.ref958-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref958-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref958-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -192px;
}

.ref958-card img{

    object-position: center -80px;

}

.ref1401-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref1401-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref1401-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -120px;
}

.ref1401-card img{

    object-position: center -80px;

}

.product-card {
  position: relative;
}

.card-click {
  position: absolute;
  inset: 0;
  z-index: 1;
  text-decoration: none;
}

.product-card button,
.color-buttons {
  position: relative;
  z-index: 2;
}

.ref19-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref19-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref19-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -81px;
}

.ref19-card img{

    object-position: center -60px;

}

.ref310-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref310-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref310-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -48px;
}

.ref310-card img{

    object-position: center -15px;

}

.ref392-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref392-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref392-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -97px;
}

.ref392-card img{

    object-position: center -25px;

}

.ref980-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref980-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref980-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -48px;
}

.ref980-card img{

    object-position: center -65px;

}

.ref203-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref203-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref203-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -48px;
}

.ref203-card img{

    object-position: center -48px;

}

.ref313-line{

    font-weight: normal;;

    font-size: 18px;

    margin: 0;

    position: relative;

    top: 0px;

    left: -75px;

}

.ref313-line span{

    margin-left: 25px;

    font-size: 24px;

    position: relative;

    left: 400px;

    top: -55px;

    font-weight: bold;
}

.ref313-subtitle{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    color: #2b1b12;
    top: -15px;
    margin: 0;
    padding-top: 0;
    margin-top: -45px;
    position: relative;
    left: -71px;
}

.ref313-card img{

    object-position: center -78px;

}

.references-page,
.products {
    padding-bottom: 110px;
}

.search-bar{
    position: absolute;
    right: 55px;
}