#search_form_contener {
    display:flex;
    gap:16px;
    margin:0 auto 10px auto;
    align-items:center;
    padding:10px 14px;
    border:1px solid var(--neutral-shade-3);
    border-radius:10px;
    background-color:var(--neutral-shade-3);
}
#search_form_contener form {
    width:100%;
}
#search_form {
    display:flex;
    gap:16px;
    justify-content:space-between;
    width:100%;
}

#search_form input {
    border:0;
    padding:6px;
    font-family: var(--font-ff-body);
    font-size: var(--font-fs-body-lg);    
    
}
#search_form input[type=text] {
    background-color: #fff;
    flex:5;
    color: var(--neutral-shade-3);
}
#search_form input[type=submit] {
    cursor:pointer;
    background-color: var(--neutral-shade-3);
    color:#fff;
    border-top-right-radius:6px;
    border-bottom-right-radius:6px;
    flex:1;    
}
#search_form input[type=submit]:hover {
    background-color: var(--neutral-shade-2);
    color:#fff;
}

#search_form_contener:before {
    content:'';
    width: 38px;
    height: 36px;
    background-image: url(../assets/icons/loupe-white.svg);
    background-size:cover;
}

#search_nb_resultats {
    font-weight:700;
    margin:0 auto 10px auto;
}

#search_liste {
    display:flex;
    gap:16px;
    justify-content:space-between;
    flex-wrap:wrap;
}

.search_item {
    width:calc(33% - 16px);
    margin-bottom:16px;
    padding:8px;
    /*border:1px solid var(--neutral-shade-3);*/
    display:flex;
    gap:16px; 
    transition:0.2s ease-in all;   
}

.search_item > * {
    color:#000;
}

.search_item:hover {
    background-color:#fafafa;
}

.search_item:hover > * {
    color:var(--neutral-shade-3);
}


.search_item h3 {
    margin: 0;
}

.search_item_img {
    height:100px;
    background-image: url(../assets/img/spectacle-default.jpg);
    background-size:cover;
    background-position:center;
    flex:1;
}
.search_item_img img {
    object-fit:cover;
    width:100%;
    height:100%;    
}

.search_item_infos {
    flex:3;
}

.search_item_type {
    font-size:14px;
    color:#777;
    text-transform:uppercase;
}

@media (max-width: 1500px) {
  .search_item {
    width:calc(50% - 16px);
  }
  .search_item_infos {
      flex:2;
  }  
}

@media (max-width: 700px) {
  .search_item {
    width:100%;
  }
  .search_item_infos {
      flex:3;
  }  
}