custom.css

@import url("variables.css");
@import url("fonts.css");
@import url("footer.css");
@import url("dark-theme.css");
@import url("matomo.css");


html, body {
  margin: 0;
  padding: 0;
}

.docusaurus-highlight-code-line {
  background-color: rgba(0, 0, 0, 0.9);
  display: block;
  margin: 0 calc(-1 * var(--ifm-pre-padding));
  padding: 0 var(--ifm-pre-padding);
}

hgroup {
  font-family: var(--ifm-font-family-base);
  font-weight: 700;
  font-size: larger;
}

p {
  font-family: var(--ifm-font-family);
  font-weight: 500;
}

/****** LINK a ******/
a:hover {
  transition: 0.3s;
}

p a {
  color: var(--ifm-color-warning);
}

/* FORM & INPUT */
form > p {
  font-size: small;
  margin-top: 2em;
}

input {
  width: 95%;
  display: block;
  margin-top: 2em;
  margin-bottom: 2em;
  margin-left: 1em;
  padding: 10px;
  border-radius: var(--ifm-button-border-radius);
  border-style: solid;
  border-width: 2px;
  border-color: var(--ifm-color-success);
  font-family: var(--ifm-font-family-base);
}

.heroBanner_src-pages-index-module {
  padding: 0.5rem !important;
  padding-bottom: 2.5rem !important;
}

/********* TABLE OF CONTENT ********/
.table-of-contents__link:hover, .table-of-contents__link--active {
  color: var(--ifm-color-warning);
}

.clean-btn {
  color: var(--ifm-color-success);
}

.clean-btn :hover {
  color: var(--ifm-color-light-green);
}

/* table & ul montserra font */
table td {
  font-family: var(--ifm-font-family);
}

ul {
  font-family: var(--ifm-font-family);
}

/* Navbar style */
.navbar {
  background-color: var(--ifm-color-light-green);
  --ifm-navbar-link-hover-color: var(--ifm-color-frame);
  font-family: var(--ifm-font-family-base);
  font-weight: 700; 
  font-size: 16px;
}

.navbar__items :hover {
  color: var(--ifm-color-info);
}

.navbar__title {
  font-size: 18px;
} 

.navbar__link {
  color: var(--ifm-color-secondary);
}

.navbar--fixed-top {
  position: sticky; 
  top: 0;
  z-index: 1; 
} 

/****** HERO TITLE ******/
.hero__title {
  color: var(--ifm-color-white);
}

.hero__subtitle {
  color: var(--ifm-color-white);
  width: 90%;
  text-align: center;
  margin: auto;
  padding-bottom: 20px;
}

/***** BUTTON *****/
.button {
  margin: 10px;
  border-color: var(--ifm-color-success);
  color: var(--ifm-color-frame);
  border-style: none;
  white-space : initial;
  font-family: var(--ifm-font-family-base);
}

.button--beta {
  background-color: var(--ifm-color-success);
  border-color: var(--ifm-color-success);
  color: var(--ifm-color-frame);
  border-style: none;
}

.button--beta:hover {
  color: var(--ifm-color-secondary);
  background-color: var(--ifm-color-info);
  border-style: none;
}

.button--warning {
  color: var(--ifm-color-success);
  border-style: none;
}

.button--warning:hover, .button--warning:not(.button--outline):hover {
  color: var(--ifm-color-secondary);
  background-color: var(--ifm-color-info);
  border-style: none;
}

.button--warning:not(.button--outline) {
  background-color: var(--ifm-color-frame);
}

/******* MAIN ELEM *******/
.section-promises {
  padding: 4rem 0;
  width: 100%;
}

.sections {
  padding: 4rem 0;
  width: var(--ifm-container-max-width);
}
.sectionsReverse {
  margin: 0 16px 0 16px;
  padding: 4rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sectionsReverse:nth-of-type(odd) {
  flex-direction: row-reverse;
}

/******* ADMONITIONS *******/
.admonition a {
  color: var(--ifm-color-white);
}

.alert--secondary, .alert--secondary a, .alert--secondary svg {
  --ifm-alert-border-color: var(--ifm-color-gray-500);
  --ifm-alert-background-color: var(--ifm-color-gray-100);
  color: var(--ifm-color-gray-800);
  fill: var(--ifm-color-gray-600);
}

.alert--success {
  --ifm-alert-border-color: var(--ifm-color-light-green);
}

.alert--info {
  --ifm-alert-border-color: var(--ifm-color-info-lightest);
}

.alert--warning {
  --ifm-alert-border-color: var(--ifm-color-frame);
}

.alert--danger {
  --ifm-alert-border-color: var(--ifm-color-warning);
}

/******* DOC PAGE *******/
/* lateral text */
.menu__link {
  background: none;
}

/* text mouse hover */
.menu__link:hover {
  color: var(--ifm-color-info);
}

/* text on click */
.navbar__link:hover, .navbar__link--active {
  color: var(--ifm-color-frame);
  transition: 0.3s;
}

.menu__link--active {
  color: var(--ifm-color-warning);
}

/* button "La doc de Froggit" */
.breadcrumbs__item--active .breadcrumbs__link {
  background: var(--ifm-breadcrumb-item-background-active);
  color: var(--ifm-color-warning);
}

/****** MEDIA SCREEN *******/
@media screen and (max-width:330px) {
  .navbar {
      width: 330px;
  }
}