* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.navbar {
  background-color: #182F5D;
  padding-bottom: 30px;
  padding-top: 20px;
}

#logo {
  margin-bottom: 5px;
}
#logo navbar-brand img {
  text-align: left;
}

#HeaderMenuBurger {
  margin-bottom: 15px;
}
#HeaderMenuBurger button {
  border-color: #FFFFFF;
}
#HeaderMenuBurger button svg {
  color: #FFFFFF;
}

.nav-item {
  vertical-align: middle;
  color: #FFFFFF !important;
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 5px;
}

.nav-link {
  color: #d6d5d4 !important;
  cursor: default;
  text-align: center;
  padding-left: 10px;
  padding-right: 10px;
  padding: 10px;
  border-radius: 5px;
  cursor: pointer;
}
.nav-link span {
  padding-left: 0px;
  padding-right: 0px;
  cursor: pointer;
  text-align: center;
}

.active {
  color: #FFFFFF !important;
  background-color: #4C8BF5;
  border-radius: 5px;
  padding: 10px;
  padding-left: 10px;
  padding-right: 10px;
}

.nav-link:hover {
  color: #FFFFFF !important;
  background-color: #4C8BF5;
  border-radius: 5px;
  padding: 10px;
  padding-left: 10px;
  padding-right: 10px;
  transition: 0.1s;
}

.dropdown-toggle {
  cursor: pointer;
}

#NavFirstItem {
  text-align: center;
}

#NavLastItem {
  text-align: center;
}

#containerLogin {
  padding-top: 30px;
  padding-bottom: 30px;
}
#containerLogin #VignetteLogin {
  background-color: #FFFFFF;
  border-radius: 15px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
#containerLogin #VignetteLogin #HeaderLogin {
  text-align: center;
}
#containerLogin #VignetteLogin #HeaderLogin h2 {
  padding-top: 30px;
  color: #182F5D;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #d6d5d4;
}
#containerLogin #VignetteLogin form div div label {
  color: #182F5D;
}
#containerLogin #VignetteLogin form #buttonLogin {
  padding-bottom: 40px;
}
#containerLogin #VignetteLogin form #buttonLogin button {
  background-color: #182F5D;
  border-color: #182F5D;
}

form div button {
  width: 100%;
  text-align: center;
}

nav div div ul li {
  width: 100%;
  text-align: center;
}

html, body {
  height: 100%;
  margin: 0;
}

body {
  display: flex;
  flex-direction: column;
}

#main-navbar {
  flex-shrink: 0;
}

main.full-height {
  flex-grow: 1;
  background-color: #f0f0f0;
}

main {
  padding: 0 !important;
  background-color: #F5F5F5;
}
main #ContainerMessageAccueil {
  background-color: #182F5D;
  padding-bottom: 50px;
}
main #ContainerMessageAccueil h1 {
  text-align: center;
  color: #FFFFFF;
  margin-top: 30px;
  margin-bottom: 30px;
}
main #ContainerMessageAccueil h2 {
  text-align: center;
  color: #d6d5d4;
  margin-bottom: 30px;
  font-size: 1.25rem;
}
main #ContainerMessageAccueil div {
  text-align: center;
}
main #ContainerMessageAccueil div a {
  color: #FFFFFF !important;
  background-color: #4C8BF5;
  border-radius: 5px;
  padding: 5px;
  padding-left: 10px;
  padding-right: 10px;
  text-decoration: none;
  color: inherit;
}
main #ContainerMessageAccueil div a span svg {
  margin-top: -2px;
}
main #ContainerVignette div {
  margin-top: 30px;
  margin-bottom: 30px;
}
main #ContainerVignette div div {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text-align: center;
}
main #ContainerVignette div div div {
  display: flex;
  justify-content: center;
  height: 100%;
  width: 100%;
}
main #ContainerVignette div div div a {
  display: flex;
  justify-content: center;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  width: 100%;
}
main #ContainerVignette div div div a div {
  background-color: #FFFFFF;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
  width: 100%;
}
main #ContainerVignette div div div a div div {
  background-color: #4C8BF5;
  border-radius: 100%;
  width: 50px;
  height: 50px;
}
main #ContainerVignette div div div a div div svg {
  color: #FFFFFF;
  width: 30px;
  height: 30px;
}
#ContainerStats {
  padding-bottom: 50px;
}
#ContainerStats div {
  margin-right: 0px;
  margin-left: 0px;
}
#ContainerStats div .paddingVignette {
  padding: 10px;
}
#ContainerStats div div .vignetteStat {
  padding-top: 15px;
  padding-bottom: 15px;
  background-color: #FFFFFF;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
}
#ContainerStats div div .vignetteStat .imgstats {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 0px;
  padding: inherit;
}
#ContainerStats div div .vignetteStat .imgstats div {
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 100%;
}
#ContainerStats div div .vignetteStat .imgstats div svg {
  padding: 0;
}
#ContainerStats div div .vignetteStat .imgstats div svg path {
  padding: 0;
}
#ContainerStats div div .vignetteStat .imgstats #Ouvert {
  color: #182F5D;
}
#ContainerStats div div .vignetteStat .imgstats #Resolue {
  background-color: green;
  color: white;
}
#ContainerStats div div .vignetteStat .imgstats #EnCours {
  background-color: orange;
  color: white;
}
#ContainerStats div div .vignetteStat .imgstats #Reponse {
  background-color: #4C8BF5;
  color: yellow;
}
#ContainerStats div div .vignetteStat .stats {
  display: block;
  justify-content: center;
}
#ContainerStats div div .vignetteStat .stats h3 {
  font-size: 0.875rem;
  justify-content: center;
  margin-bottom: 0px;
  margin-top: 10px;
}
#ContainerStats div div .vignetteStat .stats p {
  font-size: 1.5rem;
  justify-content: center;
  margin-bottom: 0px;
}

main {
  background-color: #F5F5F5;
  padding-top: 30px;
  padding-bottom: 30px;
}
main #headerListTicket {
  padding-top: 30px;
}
main #headerListTicket div div h1 {
  color: #182F5D;
  font-size: 26.25px;
  font-weight: bold;
  margin-bottom: 0px;
}
main #headerListTicket div div p {
  color: #4a5565;
  font-size: 14px;
  font-weight: 500;
}
main #headerListTicket div div a {
  color: #FFFFFF !important;
  background-color: #4C8BF5;
  border-radius: 5px;
  padding: 5px;
  padding-left: 10px;
  padding-right: 10px;
  text-decoration: none;
  color: inherit;
}
main #headerListTicket div div a span {
  font-size: 12.25px;
  font-weight: 500;
}
main #headerListTicket div div a span svg {
  margin-top: -2px;
}
main #headerListTicket div div:last-child {
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
main #ContainerListTickets {
  padding-top: 30px;
  padding-bottom: 30px;
}
main #ContainerListTickets #SubContainerListTickets {
  padding-top: 30px;
  padding-right: 42px;
  padding-left: 42px;
  padding-bottom: 30px;
  border-radius: 15px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
main #ContainerListTickets div {
  background-color: #FFFFFF;
}
main #ContainerListTickets div h2 {
  color: #182F5D;
  font-size: 14px;
}
main #ContainerListTickets div h3 {
  color: #4a5565;
  font-size: 14px;
  margin-bottom: 15px;
}
main #ContainerListTickets div #FirstRow {
  background-color: #182F5D;
  color: #FFFFFF;
}
main #ContainerListTickets div #FirstRow .caseTickets h4 {
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 0.875rem;
  margin-bottom: 0px;
}
main #ContainerListTickets div div {
  justify-content: center;
  align-items: stretch;
  text-align: center;
  background-color: inherit;
}
main #ContainerListTickets div div .caseTickets {
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: center;
}
main #ContainerListTickets div div .caseTickets .priorite {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 10.5px;
  font-weight: 500;
}
main #ContainerListTickets div div .caseTickets .statut {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 10.5px;
  font-weight: 500;
}
main #ContainerListTickets div div .caseTickets .badgeRouge {
  border-radius: 10px;
  background-color: #ffe2e2;
  color: #9f0712;
}
main #ContainerListTickets div div .caseTickets .badgeBleu {
  border-radius: 5px;
  background-color: #dbeafe;
  color: #193cb8;
}
main #ContainerListTickets div div .caseTickets .badgeGris {
  border-radius: 5px;
  background-color: #f6f3f4;
  color: #1e2939;
}
main #ContainerListTickets div div .caseTickets .badgeOrange {
  border-radius: 5px;
  background-color: #ffedd4;
  color: #9f2d00;
}
main #ContainerListTickets div div .caseTickets .badgeViolet {
  border-radius: 5px;
  background-color: #efdbfe;
  color: #5e19b8;
}
main #ContainerListTickets div div .caseTickets .badgeVert {
  border-radius: 5px;
  background-color: #dffedb;
  color: #21b819;
}
main #ContainerListTickets div div .caseTickets .badgeBleuClair {
  border-radius: 5px;
  background-color: #dbf6fe;
  color: #1998b8;
}
main #ContainerListTickets div div .caseTickets .badgeMarron {
  border-radius: 5px;
  background-color: #fee7db;
  color: #b85619;
}
main #ContainerListTickets div div .caseTickets p {
  margin-top: 5px;
  font-size: 12.25px;
  font-weight: 500;
  margin-bottom: 5px;
  color: #212121;
}
main #ContainerListTickets div div .caseTickets:last-child {
  border-right: none;
}
main #ContainerListTickets div div .caseTickets .buttonVoir {
  display: flex;
}
main #ContainerListTickets div div .caseTickets .buttonVoir .borderButtonVoir {
  border: 1px solid #e9e9e9;
  padding-left: 15px;
  padding-right: 15px;
  border-radius: 5px;
  display: flex;
  text-decoration: none;
  color: #212121;
}
main #ContainerListTickets div div .caseTickets .buttonVoir .borderButtonVoir div {
  display: flex;
  align-items: center;
}
main #ContainerListTickets div div .caseTickets .buttonVoir .borderButtonVoir div svg {
  margin-top: 2px;
  color: #212121;
}
main #ContainerListTickets div div .caseTickets .buttonVoir .borderButtonVoir p {
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 10px;
  margin-top: 0px;
  margin-bottom: 0px;
}
main #ContainerListTickets div .borderBottomRowTickets {
  border-bottom: 1px solid #e9e9e9;
  margin-top: 5px;
  margin-bottom: 5px;
}
main #ContainerListTickets div:last-child {
  border-bottom: none;
}

#ContainerHeaderDetailTicket {
  padding-top: 30px;
}
#ContainerHeaderDetailTicket div div #ImageContainerHeaderDetailTicket {
  color: #182F5D;
  display: flex;
  justify-content: flex-start;
  font-weight: 500;
  text-decoration: none;
  font-size: 12.25px;
}
#ContainerHeaderDetailTicket div div #ImageContainerHeaderDetailTicket div {
  font-weight: 500;
}
#ContainerHeaderDetailTicket div div #ImageContainerHeaderDetailTicket p {
  margin-top: 1.5px;
  padding-left: 10px;
  color: #182F5D;
}
#ContainerHeaderDetailTicket div #buttonTrash {
  text-align: right;
}
#ContainerHeaderDetailTicket div #buttonTrash div {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  align-content: center;
  flex-wrap: nowrap;
}
#ContainerHeaderDetailTicket div #buttonTrash div a {
  background-color: #dc3545;
  display: flex;
  padding-top: 5px;
  padding-left: 10px;
  padding-bottom: 5px;
  padding-right: 10px;
  text-decoration: none;
  color: #FFFFFF;
  border-radius: 5px;
}
#ContainerHeaderDetailTicket div #buttonTrash div a p {
  margin: 0;
  margin-top: -3px;
  padding-left: 5px;
  color: #FFFFFF;
}
#ContainerHeaderDetailTicket div h1 {
  color: #182F5D;
  font-size: 26.25px;
  font-weight: 700;
}
#ContainerHeaderDetailTicket div p {
  color: #212121;
  font-size: 14px;
  font-weight: 500;
}

#ContainerInfoDetailsTicket {
  background-color: #FFFFFF;
  border-radius: 15px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  padding: 20px;
}
#ContainerInfoDetailsTicket div h2 {
  font-size: 14px;
  font-weight: 500;
  color: #182F5D;
  margin-bottom: 30px;
}
#ContainerInfoDetailsTicket div div {
  margin-top: 10px;
}
#ContainerInfoDetailsTicket div div h3 {
  font-size: 14px;
  font-weight: 500;
  color: #212121;
}
#ContainerInfoDetailsTicket div div .libelle {
  text-align: left;
  color: #212121;
  margin: 0px;
  font-size: 14px;
}
#ContainerInfoDetailsTicket div div .donnee {
  text-align: right;
  color: #212121;
  font-weight: 500;
  margin: 0px;
  font-size: 14px;
}
#ContainerInfoDetailsTicket div .DetailStatut {
  display: flex;
  justify-content: flex-end;
}
#ContainerInfoDetailsTicket div .DetailStatut .donnee {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 10px;
  font-size: 10.5px;
  font-weight: 500;
}
#ContainerInfoDetailsTicket div .DetailStatut .badgeRouge {
  border-radius: 10px;
  background-color: #ffe2e2;
  color: #9f0712;
}
#ContainerInfoDetailsTicket div .DetailStatut .badgeBleu {
  border-radius: 5px;
  background-color: #dbeafe;
  color: #193cb8;
}
#ContainerInfoDetailsTicket div .DetailStatut .badgeGris {
  border-radius: 5px;
  background-color: #f6f3f4;
  color: #1e2939;
}
#ContainerInfoDetailsTicket div .DetailStatut .badgeOrange {
  border-radius: 5px;
  background-color: #ffedd4;
  color: #9f2d00;
}
#ContainerInfoDetailsTicket div .DetailStatut .badgeViolet {
  border-radius: 5px;
  background-color: #efdbfe;
  color: #5e19b8;
}
#ContainerInfoDetailsTicket div .DetailStatut .badgeVert {
  border-radius: 5px;
  background-color: #dffedb;
  color: #21b819;
}
#ContainerInfoDetailsTicket div .DetailStatut .badgeBleuClair {
  border-radius: 5px;
  background-color: #dbf6fe;
  color: #1998b8;
}
#ContainerInfoDetailsTicket div .DetailStatut .badgeMarron {
  border-radius: 5px;
  background-color: #fee7db;
  color: #b85619;
}
#ContainerInfoDetailsTicket div .DetailPriorite {
  display: flex;
  justify-content: flex-end;
}
#ContainerInfoDetailsTicket div .DetailPriorite .donnee {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
  border-radius: 10px;
  font-size: 10.5px;
  font-weight: 500;
}
#ContainerInfoDetailsTicket div .DetailPriorite .badgeRouge {
  border-radius: 10px;
  background-color: #ffe2e2;
  color: #9f0712;
}
#ContainerInfoDetailsTicket div .DetailPriorite .badgeBleu {
  border-radius: 5px;
  background-color: #dbeafe;
  color: #193cb8;
}
#ContainerInfoDetailsTicket div .DetailPriorite .badgeGris {
  border-radius: 5px;
  background-color: #f6f3f4;
  color: #1e2939;
}
#ContainerInfoDetailsTicket div .DetailPriorite .badgeOrange {
  border-radius: 5px;
  background-color: #ffedd4;
  color: #9f2d00;
}
#ContainerInfoDetailsTicket div .DetailPriorite .badgeViolet {
  border-radius: 5px;
  background-color: #efdbfe;
  color: #5e19b8;
}
#ContainerInfoDetailsTicket div .DetailPriorite .badgeVert {
  border-radius: 5px;
  background-color: #dffedb;
  color: #21b819;
}
#ContainerInfoDetailsTicket div .DetailPriorite .badgeBleuClair {
  border-radius: 5px;
  background-color: #dbf6fe;
  color: #1998b8;
}
#ContainerInfoDetailsTicket div .DetailPriorite .badgeMarron {
  border-radius: 5px;
  background-color: #fee7db;
  color: #b85619;
}
#ContainerInfoDetailsTicket #rowDescription {
  margin-top: 30px;
}

#ContainerHeaderCreateTicket {
  padding-top: 30px;
}
#ContainerHeaderCreateTicket h1 {
  color: #182F5D;
  font-size: 26.25px;
  font-weight: 700;
}
#ContainerHeaderCreateTicket p {
  color: #212121;
  font-size: 14px;
  font-weight: 500;
}

#ContainerCreateTicket {
  background-color: #FFFFFF;
  border-radius: 15px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  padding: 20px;
}
#ContainerCreateTicket h2 {
  font-size: 14px;
  font-weight: 500;
  color: #182F5D;
}
#ContainerCreateTicket p {
  color: #4a5565;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 30px;
}
#ContainerCreateTicket form div {
  margin-top: 15px;
}
#ContainerCreateTicket form div div {
  margin-top: 0px;
}
#ContainerCreateTicket form div div label {
  margin-bottom: 5px;
  color: #212121;
  font-weight: 500;
  font-size: 14px;
}

#RowButtonCreateTicket {
  margin-top: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  align-content: center;
}
#RowButtonCreateTicket #ButtonCancelTicket {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  text-decoration: none;
}
#RowButtonCreateTicket #ButtonCancelTicket p {
  color: #212121;
  margin: 0px;
  vertical-align: middle;
}
#RowButtonCreateTicket #ButtonCreateTicket {
  background-color: #4C8BF5;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  border-radius: 5px;
  margin-left: 25px;
  padding-left: 15px;
  padding-right: 5px;
}
#RowButtonCreateTicket #ButtonCreateTicket svg {
  color: #FFFFFF;
}
#RowButtonCreateTicket #ButtonCreateTicket input {
  color: #FFFFFF;
}

#ContainerHeaderFAQ {
  background-color: #182F5D;
  padding-bottom: 30px;
}
#ContainerHeaderFAQ h1 {
  text-align: center;
  color: #FFFFFF;
  padding-top: 30px;
  padding-bottom: 30px;
}
#ContainerHeaderFAQ p {
  text-align: center;
  color: #d6d5d4;
  padding-bottom: 30px;
  font-size: 1.25rem;
}

#ContainerFAQ {
  padding-top: 30px;
}
#ContainerFAQ div {
  justify-content: center;
  align-items: stretch;
  align-content: stretch;
}
#ContainerFAQ div div {
  display: flex;
}
#ContainerFAQ div div a {
  text-decoration: none;
  margin: 5px;
  text-align: center;
  cursor: pointer;
  background-color: #FFFFFF;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
  width: 100%;
}
#ContainerFAQ div div a div {
  transition: 0.3s;
  padding-top: 15px;
  padding-bottom: 15px;
  display: block;
}
#ContainerFAQ div div a div .iconCategorie {
  color: #4C8BF5;
  margin-bottom: 15px;
}
#ContainerFAQ div div a div h2 {
  font-size: 18px;
  font-weight: 500;
  color: #182F5D;
  margin-bottom: 0px;
}
#ContainerFAQ div div a div p {
  color: #4a5565;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 0px;
}
#ContainerFAQ div div a:hover {
  transition: 0.3s;
  box-shadow: none;
}
#ContainerFAQ div div form {
  text-decoration: none;
  margin: 5px;
  text-align: center;
  cursor: pointer;
  transition: 0.3s;
  background-color: #FFFFFF;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
  display: flex;
  width: 100%;
}
#ContainerFAQ div div form div {
  padding: 15px;
  display: block;
}
#ContainerFAQ div div form div h2 {
  font-size: 18px;
  font-weight: 500;
  color: #182F5D;
  margin-bottom: 0px;
}
#ContainerFAQ div div form div p {
  margin-top: 15px;
  color: #4a5565;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 0px;
}
#ContainerFAQ div div form:hover {
  transition: 0.3s;
  box-shadow: none;
}

#headerDetailArticle {
  background-color: #FFFFFF;
  margin-top: 30px;
  padding: 30px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
}
#headerDetailArticle .titreHeaderDetailArticle h2 {
  text-align: center;
  margin-bottom: 30px;
}

/*h2 {
    width: 100%;
    text-align: center;
}*/