html {
    height: 100%;
}

body {
    min-height: 100%;
    margin-top: 0%;
    font-family: 'Open Sans', sans-serif;
}

/* Apply the font to specific elements as needed */
h1, h2, h3 {
    font-family: 'Open Sans', sans-serif;
}


#modal2 .modal-dialog {
    max-width: 50%;
}

.dashed-2 {
    border: none;
    height: 5px;
    background: #000;
    width: 98%;
    margin-left: 1%;
    background: repeating-linear-gradient(90deg, #000, #000 6px, transparent 6px, transparent 12px);
}

hr {
    border: none;
    width: 98%;
    margin-left: 1%;
    height: 15px;
    background: #000;
}

.soumettre,
.addButton {
    background-color: #0669A0;
    color: white;
    float: right;
    border-radius: 0.35rem;


}

.soumettre {

    font-weight: bolder;


}


/* Bootstrap 4 text input with search icon */

.has-search .form-control {
    padding-left: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}

.secondSearch {
    margin-left: -80px;
}

.searchButton {
    margin-left: -80px;
}

.searchBox {
    padding-top: 15px;
    padding-bottom: 15px;
    border-top: 2px solid whitesmoke;
    border-bottom: 2px solid whitesmoke;
}

.producteurBox {
    margin-top: 1.5ch;
    justify-content: space-between;
    border: 1px solid rgb(223, 223, 223);
    border-radius: 0.5ch;
    padding: 2ch;
}

.loginInput {
    height: 80px;
}

.logoBox {
    height: 54px;
    border-bottom: 2px solid rgb(251, 243, 243);
    width: 300px;

}

.pageTitle {
    color: #0669A0;
    font-weight: bolder;
    font-size: 150%;
}

.bi-chevron-right {
    font-weight: bolder;
    font-family: 'Courier New', Courier, monospace;
}

.thead-bg{
    background-color: #0669A0;
}

.card {
    background-color: white;
    border-radius: 1ch;
    padding: 2ch;
}

.card h1 {
    font-weight: bolder;
}

.card .cardbutton {
    border: 1px solid #0669A0;
    margin-top: 1ch;
    font-size: 100%;
    border-radius: 1ch;
}

.card:hover, #menuh {
    background-color: #0669A0;
    color: white;
}
#menuh{
margin-top: 2ch;
}

.card:hover .fa-fire,
.card:hover h1,
.card:hover .cardbutton {
    color: white;
}

.card img {
    color: #0669A0;

}

#iconecard {
    max-width: 15%;
    color: #0669A0;
    z-index: 2;

}

.iconContainer {
    background-color: #ebecf0;
    border-radius: 1ch;
    width: 6ch;
    max-height: 6ch;
    text-align: center;
    padding-top: 1ch;
}

.card:hover .iconContainer {
    background-color: #0669A0;
}

.card:hover .cardbutton {
    border: 2px solid white;
}

.fa-fire {
    color: #0669A0;
}

.loginCard:hover {
    background-color: white;
    color: black;
}

.exportButton {
    color: #0669A0;
    border: 2px solid #edeff0;
    border-radius: 1ch;
}

.serchInputBody {
    background-color: white;
    border-right: 0px;

}

#search-BodyIcon {
    border-left: 0px;
    background-color: white;
    color: #aabcc5
}

.modal-content {
    box-shadow: none;
}

#avatar-preview {
    display: none;
    height: 120px;
    width: 120px;
    padding: 0.5ch;
    text-align: center;
    border: 1px solid #d8d7d7;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 2%;

}

.categoriFaImage {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 200px;
    /* set a height for the header */
}

.categoriFaCard:hover {
    background-color: white;
}

.tailleClasse {
    background-color: #e0ebf1;
    padding-left: 4%;
    padding-right: 4%;
    border-radius: 1ch;
    border: 2px solid #eaeef0;

}

.optionsForm {
    font-size: 16px;
}

.optionsForm label {
    padding: 2ch;   

}
.tdHover:hover{
    background-color: #b8daff;
    transition: background-color 0.5s ease-out;
<<<<<<< HEAD
  }
  .bi{
    cursor: pointer;
=======
>>>>>>> dev
  }