/**********************************/
/*   Default variables override   */
/**********************************/

/* Custom font import -> https://fonts.google.com */
/* for a full primary font swap, add the same font to the archeevoConfigs.json, under typography */
/*@import url("https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,700;1,400&display=swap");*/

:root {
  /* You can overwrite just the font or the whole family */
  /*--header-font: "Noto Serif";*/
  /*--primary-font: "Noto Serif";*/
  /*--font-family-header: var(--header-font), "Georgia", "Times New Roman", serif;*/
  /*--font-family: var(--primary-font), "Georgia", "Times New Roman", serif;*/

  /* Navbar */
  --navbar-height: 100px;
  --navbar-bg-color: #344051;
  /*--navbar-text-color: rgba(0, 0, 0, 1);*/
  /*--navbar-active-border-color: var(--navbar-text-color);*/
  /*--navbar-hover-color: rgba(255, 255, 255, 0.2);*/
  /*--navbar-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);*/
  --navbar-logo-height: 60px;
  --navbar-logo-mini-height: var(--navbar-logo-height);

  /* Footer */
  --footer-bg-color: var(--primary);
  /*--footer-text-color: white;*/
  /*--footer-title-color: var(--footer-text-color);*/
  --footer-link-color: var(--footer-text-color);
  --footer-fixed-bg-color: var(--primary);
  /*--footer-fixed-text-color: var(--footer-text-color);*/

  /* Highlights page */
  /*--highlighted-primary-text: white;*/
  /*--highlighted-primary-background: hsl(207, 10%, 23%);*/
  /*--highlighted-secondary-text: rgba(0, 0, 0, 0.87);*/
  /*--highlighted-secondary-background: #baab68;*/
}

/******************************/
/*   Client's custom styles   */
/******************************/

.simple-search a {
  color: white;
}

.FFIntro {
  margin: 35px auto 40px;
}

.FFIntro p {
  line-height: 1.5em;
}

.FFThumbs {
  text-align: center;
}

.FFThumbs .FFImage-01 {
  background-image: url("/assets/img/welcome_fonds_thumb_01.jpg");
}

.FFThumbs .FFImage-02 {
  background-image: url("/assets/img/welcome_fonds_thumb_02.jpg");
}

.FFThumbs .FFImage-03 {
  background-image: url("/assets/img/welcome_fonds_thumb_03.jpg");
}

.FFThumbs .FFImage-04 {
  background-image: url("/assets/img/welcome_fonds_thumb_04.jpg");
}

.FFThumbs .FFImage,
.FFThumbs .FFImage a {
  border-radius: 105px;
}

.FFThumbs .FFImage {
  position: relative;
  width: 210px;
  border-radius: 105px;
  background-size: cover;
  margin: auto;
}

.FFThumbs .FFImage a {
  display: block;
  width: 210px;
  height: 210px;
  margin: 0;
  transition: background-color 0.5s, box-shadow 0.5s, border-radius 0s;
}

.FFThumbs .FFImage a:hover {
  background: rgba(0, 102, 153, 0.8) url("/assets/img/search.png") no-repeat center;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
  transition: background-color 0.5s, box-shadow 0.5s, border-radius 0s;
}

.FFThumbs h2 {
  text-align: center;
  color: white;
  margin: 20px 0;
}

.FF a.FFCTA {
  display: inline-block;
  padding: 13px 30px;
  color: white;
  background: var(--primary);
  border-radius: 100px;
  margin-bottom: 60px;
  transition: box-shadow 0.3s, border-radius 0s;
  text-decoration: none;
}

.FF a.FFCTA:hover {
  text-decoration: none;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
  transition: box-shadow 0.3s;
}

/************************************/
/* Custom Fonds page (search forms) */
/************************************/

.FFSearchImage {
  width: 100%;
  margin: auto;
  object-fit: cover;
  border-radius: 100%;
  aspect-ratio: 1 / 1;
}

.CustomSearchFormControl .col-xs-6.col-sm-4,
.CustomSearchFormControl .col-sm-8 {
  align-self: center;
  display: flex;
}
