@import url(https://fonts.googleapis.com/css?family=Nunito:400,600&display=swap);
@charset "UTF-8";
.basic-container {
  padding: 80px 0;
  min-height: 100vh;
  background-color: #252b36;
}

.basic-card {
  font-family: "Nunito", sans-serif;
  border-radius: 7px;
  background: #fff;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}

.basic-card__header {
  padding: 20px;
}

.basic-card__body {
  padding: 0 25px 25px;
}

.basic-card__footer {
  padding: 25px;
  border-radius: 0 0 7px 7px;
  box-shadow: inset 0 5px 3px -5px rgba(0, 0, 0, 0.1);
  background-color: #f9fafb;
}

.basic-card__title {
  margin: 0;
  text-align: center;
  font-size: 1.5rem;
  font-weight: 600;
}

.basic-card__sub_title {
  font-size: 1rem;
  font-weight: lighter;
  text-align: center;
  color: black;
}

.basic-card__label {
  margin-bottom: 6px;
  font-size: 0.85rem;
  font-weight: 600;
}

.basic-card__input {
  height: 35px;
  border-radius: 4px;
}

.basic-card__btn {
  border-radius: 4px;
}

.basic-card__btn--grey {
  background-color: #fdfdfd;
  border: 1px solid #e6e9ec;
  border-bottom: 1px solid #d7dce1;
  box-shadow: inset 0 -2px 3px #fafafa;
}

.basic-card__btn--grey:focus,
.basic-card__btn--grey.focus {
  box-shadow: 0 0 0 0.2rem rgba(217, 217, 217, 0.25);
}

/*=======================================================*/
/*================= FORM LABELS INPUTS ==================*/
.form-group label:not(.custom-control-label).is-required:after {
  content: " *";
  opacity: 0.6;
}

/*=======================================================*/
/*======================== TABLES =======================*/
th.td-xs,
td.td-xs {
  width: 1px;
  white-space: nowrap;
}

/*=======================================================*/
/*=================== OBFUSCATED LINKS ==================*/
/*<editor-fold desc="show">*/
.js-obflink:hover {
  text-decoration: underline;
  cursor: pointer;
}

/*</editor-fold>*/
/*=================================================================*/
/*                              VENDOR                             */
/*=================================================================*/
/*=======================================================*/
/*======================= BOOTSTRAP =====================*/
.custom-file-label {
  text-align: left;
}

:root {
  --primary-color:#be2226;
  --primary-color-hover: #ff4f57;
  --secondary-color:#232323;
  --fa-primary-color: #be2226;
  --fa-secondary-color: #232323;
  --body-bg: #F6F6F6;
  --bs-nav-link-color: white;
  --body-line-height-computed: calc(1375rem / 400);
}

.btn-primary {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

:root {
  --primary-color:#be2226;
  --primary-color-hover: #ff4f57;
  --secondary-color:#232323;
  --fa-primary-color: #be2226;
  --fa-secondary-color: #232323;
  --body-bg: #F6F6F6;
  --bs-nav-link-color: white;
  --body-line-height-computed: calc(1375rem / 400);
}

.btn-primary {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

/**
 * Générer des directives pour chaque breakpoint de responsive existant. eg.:
 *
 * @include responsive-directive('text', 'middle') {
 *    text-align: center;
 * }
 *
 * .text-middle: text-align: center;
 * .text-sm-middle: text-align: center;
 * .text-md-middle: text-align: center;
 * .text-lg-middle: text-align: center;
 * .text-xl-middle: text-align: center;
 */
/*!
 * Taille adaptative du texte selon la résolution de l'écran de l'utilisateur
 */
html {
  font-size: 0.88rem;
}
@media (min-width: 320px) {
  html {
    font-size: calc(0.88rem + 0.12 * (100vw - 320px) / 1046);
  }
}
@media (min-width: 1366px) {
  html {
    font-size: 1rem;
  }
}

/* Multiple properties with same values */
/*
h1 {
	@include fluid-type(padding-bottom padding-top, 20em, 70em, 2em, 4em);
}*/
:root {
  --primary-color:#be2226;
  --primary-color-hover: #ff4f57;
  --secondary-color:#232323;
  --fa-primary-color: #be2226;
  --fa-secondary-color: #232323;
  --body-bg: #F6F6F6;
  --bs-nav-link-color: white;
  --body-line-height-computed: calc(1375rem / 400);
}

.btn-primary {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

:root {
  --primary-color:#be2226;
  --primary-color-hover: #ff4f57;
  --secondary-color:#232323;
  --fa-primary-color: #be2226;
  --fa-secondary-color: #232323;
  --body-bg: #F6F6F6;
  --bs-nav-link-color: white;
  --body-line-height-computed: calc(1375rem / 400);
}

.btn-primary {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

/**
 * Générer des directives pour chaque breakpoint de responsive existant. eg.:
 *
 * @include responsive-directive('text', 'middle') {
 *    text-align: center;
 * }
 *
 * .text-middle: text-align: center;
 * .text-sm-middle: text-align: center;
 * .text-md-middle: text-align: center;
 * .text-lg-middle: text-align: center;
 * .text-xl-middle: text-align: center;
 */
.grid-container {
  display: grid;
  grid-template-columns: 15px 1fr 1fr 15px;
  grid-template-areas: "margin-lft body-lft body-rgt margin-rgt";
}

.gc--no-margin {
  grid-template-columns: 0 1fr 1fr 0;
}

@media screen and (min-width: 576px) {
  .grid-container {
    grid-template-columns: minmax(0, 1fr) repeat(2, 270px) minmax(0, 1fr);
  }
}

@media screen and (min-width: 768px) {
  .grid-container {
    grid-template-columns: minmax(0, 1fr) repeat(2, 360px) minmax(0, 1fr);
  }
}

@media screen and (min-width: 992px) {
  .grid-container {
    grid-template-columns: minmax(0, 1fr) repeat(2, 480px) minmax(0, 1fr);
  }
}

@media screen and (min-width: 1200px) {
  .grid-container {
    grid-template-columns: minmax(0, 1fr) repeat(2, 570px) minmax(0, 1fr);
  }
}

@media screen and (min-width: 1400px) {
  .grid-container {
    grid-template-columns: minmax(0, 1fr) repeat(2, 660px) minmax(0, 1fr);
  }
}

.gc-body {
  grid-column-start: body-lft;
  grid-column-end: body-rgt;
}
@media screen and (min-width: 576px) {
  .gc-sm-body {
    grid-column-start: body-lft;
    grid-column-end: body-rgt;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-body {
    grid-column-start: body-lft;
    grid-column-end: body-rgt;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-body {
    grid-column-start: body-lft;
    grid-column-end: body-rgt;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-body {
    grid-column-start: body-lft;
    grid-column-end: body-rgt;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-body {
    grid-column-start: body-lft;
    grid-column-end: body-rgt;
  }
}

.gc-margin-l {
  grid-column: margin-lft;
}
@media screen and (min-width: 576px) {
  .gc-sm-margin-l {
    grid-column: margin-lft;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-margin-l {
    grid-column: margin-lft;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-margin-l {
    grid-column: margin-lft;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-margin-l {
    grid-column: margin-lft;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-margin-l {
    grid-column: margin-lft;
  }
}

.gc-body-l {
  grid-column: body-lft;
}
@media screen and (min-width: 576px) {
  .gc-sm-body-l {
    grid-column: body-lft;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-body-l {
    grid-column: body-lft;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-body-l {
    grid-column: body-lft;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-body-l {
    grid-column: body-lft;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-body-l {
    grid-column: body-lft;
  }
}

.gc-body-r {
  grid-column: body-rgt;
}
@media screen and (min-width: 576px) {
  .gc-sm-body-r {
    grid-column: body-rgt;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-body-r {
    grid-column: body-rgt;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-body-r {
    grid-column: body-rgt;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-body-r {
    grid-column: body-rgt;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-body-r {
    grid-column: body-rgt;
  }
}

.gc-margin-r {
  grid-column: margin-rgt;
}
@media screen and (min-width: 576px) {
  .gc-sm-margin-r {
    grid-column: margin-rgt;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-margin-r {
    grid-column: margin-rgt;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-margin-r {
    grid-column: margin-rgt;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-margin-r {
    grid-column: margin-rgt;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-margin-r {
    grid-column: margin-rgt;
  }
}

.gc-start-margin-l {
  grid-column-start: margin-lft;
}
@media screen and (min-width: 576px) {
  .gc-sm-start-margin-l {
    grid-column-start: margin-lft;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-start-margin-l {
    grid-column-start: margin-lft;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-start-margin-l {
    grid-column-start: margin-lft;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-start-margin-l {
    grid-column-start: margin-lft;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-start-margin-l {
    grid-column-start: margin-lft;
  }
}

.gc-start-body-l {
  grid-column-start: body-lft;
}
@media screen and (min-width: 576px) {
  .gc-sm-start-body-l {
    grid-column-start: body-lft;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-start-body-l {
    grid-column-start: body-lft;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-start-body-l {
    grid-column-start: body-lft;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-start-body-l {
    grid-column-start: body-lft;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-start-body-l {
    grid-column-start: body-lft;
  }
}

.gc-start-body-r {
  grid-column-start: body-rgt;
}
@media screen and (min-width: 576px) {
  .gc-sm-start-body-r {
    grid-column-start: body-rgt;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-start-body-r {
    grid-column-start: body-rgt;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-start-body-r {
    grid-column-start: body-rgt;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-start-body-r {
    grid-column-start: body-rgt;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-start-body-r {
    grid-column-start: body-rgt;
  }
}

.gc-start-margin-r {
  grid-column-start: margin-rgt;
}
@media screen and (min-width: 576px) {
  .gc-sm-start-margin-r {
    grid-column-start: margin-rgt;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-start-margin-r {
    grid-column-start: margin-rgt;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-start-margin-r {
    grid-column-start: margin-rgt;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-start-margin-r {
    grid-column-start: margin-rgt;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-start-margin-r {
    grid-column-start: margin-rgt;
  }
}

.gc-end-margin-l {
  grid-column-end: margin-lft;
}
@media screen and (min-width: 576px) {
  .gc-sm-end-margin-l {
    grid-column-end: margin-lft;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-end-margin-l {
    grid-column-end: margin-lft;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-end-margin-l {
    grid-column-end: margin-lft;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-end-margin-l {
    grid-column-end: margin-lft;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-end-margin-l {
    grid-column-end: margin-lft;
  }
}

.gc-end-body-l {
  grid-column-end: body-lft;
}
@media screen and (min-width: 576px) {
  .gc-sm-end-body-l {
    grid-column-end: body-lft;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-end-body-l {
    grid-column-end: body-lft;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-end-body-l {
    grid-column-end: body-lft;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-end-body-l {
    grid-column-end: body-lft;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-end-body-l {
    grid-column-end: body-lft;
  }
}

.gc-end-body-r {
  grid-column-end: body-rgt;
}
@media screen and (min-width: 576px) {
  .gc-sm-end-body-r {
    grid-column-end: body-rgt;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-end-body-r {
    grid-column-end: body-rgt;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-end-body-r {
    grid-column-end: body-rgt;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-end-body-r {
    grid-column-end: body-rgt;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-end-body-r {
    grid-column-end: body-rgt;
  }
}

.gc-end-margin-r {
  grid-column-end: margin-rgt;
}
@media screen and (min-width: 576px) {
  .gc-sm-end-margin-r {
    grid-column-end: margin-rgt;
  }
}
@media screen and (min-width: 768px) {
  .gc-md-end-margin-r {
    grid-column-end: margin-rgt;
  }
}
@media screen and (min-width: 992px) {
  .gc-lg-end-margin-r {
    grid-column-end: margin-rgt;
  }
}
@media screen and (min-width: 1200px) {
  .gc-xl-end-margin-r {
    grid-column-end: margin-rgt;
  }
}
@media screen and (min-width: 1400px) {
  .gc-xxl-end-margin-r {
    grid-column-end: margin-rgt;
  }
}

/**
 * CSS custom lié au projet à appliquer aux pages CMS créées
 */
body {
  min-height: 100vh;
}

img {
  max-width: 100%;
}

/*=======================================================*/
/*======================== FORM =========================*/
.form-group {
  margin-bottom: 1rem;
}

/*=======================================================*/
/*======================== MODAL ========================*/
@media screen and (min-width: 576px) {
  .modal-content {
    box-shadow: 0 7px 14px 0 rgba(0, 0, 0, 0.05), 0 3px 6px 0 rgba(0, 0, 0, 0.05);
  }
}
/*=======================================================*/
/*======================= TOASTR ========================*/
/*<editor-fold desc="show">*/
#toast-container > div {
  margin-bottom: 10px;
  border-radius: 3px;
  border: none;
  background-size: 18px;
  opacity: 1;
}

#toast-container > div,
#toast-container > div:hover {
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
}

#toast-container .toast-info {
  background-color: #0d6efd;
}

#toast-container .toast-success {
  background-color: #198754;
}

#toast-container .toast-warning {
  background-color: #ffc107;
}

#toast-container .toast-error {
  background-color: #dc3545;
}

.logo-front-gf {
  background: #252b36;
  height: 150px;
  padding: 20px 0;
  display: flex;
  justify-content: center;
}

.logo-front-gf img {
  height: 100%;
}

/*</editor-fold>*/

/*# sourceMappingURL=app.css.map*/