#mainNavbar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 15px;
  border-radius: 10px;
}

#mainNavbar .menu-item.active .icon-container {
  background-color: #D36A54; /* Set your active background color */
}

#brand-logo img {
  max-height: 50px; /* Adjust as needed */
  width: 100%;
}

#brand-logo {
  order: 1;
}

.menu-group.center {
  order:2;
}

.menu-group.right {
  order:3;
}

.menu-group {
  display: flex;
  align-items: center;
}

.menu-group.center {
  justify-content: center;
  box-shadow: 3px 2px 10px #e0e0e0;
  border-radius: 15px;
}

.menu-group.right {
  justify-content: flex-end;
}

.menu-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #333; /* Set your text color */
  padding: 10px;
}

.icon-container img{
  width: 24px;
  height: auto;
}
  
.icon-container {
  background-color: #0A6C8A;
  padding: 10px;
  border-radius: 10px;
  margin-bottom: 5px;
}

.menu-group.center .icon-container {
 background-color: #0A6C8A;
}

.menu-group.right .icon-container {
 background-color: #032a3a;
}

.menu-item:hover .icon-container {
  transition: 300ms;
  background-color: #10c972; /* Set your hover background color */
}

/* Product Description page */
#product-preview-carousel {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  padding: 10px;
}

#product-preview-carousel div {
  width: 50px;
  height: 50px;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: 2px 2px 2px grey;
  margin-right: 15px;
}

.petitPreview {
  opacity: 0.5;
  cursor: pointer;
}

.petitPreview.active {
  opacity: 1;
}

.petitPreview:hover {
  opacity: 1;
}

#product-preview-carousel img {
  width: 50px;
  height: 50px;
  object-fit: cover;
}

#product-actual-image img:hover {
  opacity: 0.7;
}

#product-actual-image {
  width: 95%;
  height: 400px;
  margin: auto;
  overflow: hidden;
  cursor: pointer;
  transition: 0.3s;
  border-radius: 15px;
}

#product-actual-image img{
  object-fit: cover;
}

/* The Modal (background) */
.modalPreview {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 9999; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

.modalPreview .close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: 0.3s; 
}

.modalPreview .close:hover, .modalPreview .close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

/* Modal Content (image) */
.modalPreview-content {
  margin: auto;
  display: block;
  width: 80%;
}

/* Fin Product Description page */

@media (max-width: 600px) {
  #brand-logo,.menu-group.center,.menu-group.right {
    flex: 1 1 auto; /* Allow items to expand and shrink as needed */
  }

  #mainNavbar {
    flex-wrap: wrap;
  }

  #brand-logo {
    width: 47%;
  }

  .menu-group.center {
    width: 100%;
    margin: 0px;
    padding:0px;
    order:3;
  }

  .menu-group.right {
    margin: 10px 0px;
    order:2;
  }

}

/* Payement block */
#drop-area, #drop-area-card {
  width: 100%;
  height: 300px;
  padding: 30px;
  background-color: white;
  text-align: center;
  border-radius: 20px;
}

#img-view, #img-view-card {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  border: 2px dashed black;
  background-color: white;
  background-position: center;
  background-size: cover;
  overflow: hidden;
}

#img-view img, #img-view-card img {
  margin-top: 21px ;
}

.b-example-divider {
  height: 3rem;
  background-color: rgba(0, 0, 0, .1);
  border: solid rgba(0, 0, 0, .15);
  border-width: 1px 0;
  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}
/* FIN Payement block */

/* Cart page */
#pageCartBloc {
  max-width: 700px;
}
#pageCartBloc img{
  max-height: 80px;
  object-fit: cover;
}

/*Fin Cart page */

/* SERVICES */
#CVFileUploadTip {
  display: none;
}

.list-group {
  max-width: 460px;
  margin: 1rem auto;
}

.form-check-input:checked + .form-checked-content {
  opacity: .5;
}

.form-check-input-placeholder {
  border-style: dashed;
}
[contenteditable]:focus {
  outline: 0;
}

.list-group-checkable .list-group-item {
  cursor: pointer;
}
.list-group-item-check {
  position: absolute;
  clip: rect(0, 0, 0, 0);
}
.list-group-item-check:hover + .list-group-item {
  background-color: var(--bs-light);
}
.list-group-item-check:checked + .list-group-item {
  color: #fff;
  background-color: var(--bs-blue);
}
.list-group-item-check[disabled] + .list-group-item,
.list-group-item-check:disabled + .list-group-item {
  pointer-events: none;
  filter: none;
  opacity: .5;
}

.list-group-radio .list-group-item {
  cursor: pointer;
  border-radius: .5rem;
}
.list-group-radio .form-check-input {
  z-index: 2;
  margin-top: -.5em;
}
.list-group-radio .list-group-item:hover,
.list-group-radio .list-group-item:focus {
  background-color: var(--bs-light);
}

.list-group-radio .form-check-input:checked + .list-group-item {
  background-color: var(--bs-body);
  border-color: var(--bs-blue);
  box-shadow: 0 0 0 2px var(--bs-blue);
}
.list-group-radio .form-check-input[disabled] + .list-group-item,
.list-group-radio .form-check-input:disabled + .list-group-item {
  pointer-events: none;
  filter: none;
  opacity: .5;
}

/* Fin services */