@font-face {
  font-family: 'N27';
  src: url('/wp-content/themes/yatatheme/fonts/N27-Regular.otf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'N27';
  src: url('/wp-content/themes/yatatheme/fonts/N27-Medium.otf') format('truetype');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'N27';
  src: url('/wp-content/themes/yatatheme/fonts/N27-Bold.otf') format('truetype');
  font-weight: 700;
  font-style: normal;
}
.section-homecards {
  padding: 166px 0 120px;
  background-color: #FFFEF1;
}
.section-homecards .container-fluid {
  max-width: 1640px;
}
.section-homecards .container-fluid span.surtitre {
  font-size: 6.8rem;
  line-height: 7rem;
  color: #4C00FF;
  text-transform: uppercase;
  font-weight: 700;
  display: block;
  text-align: center;
}
.section-homecards .container-fluid h2 {
  font-size: 15.8rem;
  line-height: 16rem;
  color: #00F000;
  text-transform: uppercase;
  font-weight: 700;
  display: block;
  text-align: center;
  margin-bottom: 10px;
}
.section-homecards .cards {
  display: flex;
  position: relative;
}
.section-homecards .cards .colonne {
  width: 20%;
  padding: 0 15px;
}
.section-homecards .cards .colonne .bloc {
  -webkit-transition: 300ms;
  -moz-transition: 300ms;
  -ms-transition: 300ms;
  -o-transition: 300ms;
  transition: 300ms;
  position: relative;
}
.section-homecards .cards .colonne .bloc:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 210px;
  bottom: -35px;
  left: 0;
  background-image: radial-gradient(closest-side,#535351 0%,rgba(255,254,242,0) 100%);
}
.section-homecards .cards .colonne2 {
  margin-top: 176px;
}
.section-homecards .cards .colonne3 {
  margin-top: 52px;
}
.section-homecards .cards .colonne4 {
  margin-top: 118px;
}
.section-homecards .cards .suivezleguide {
  position: absolute;
  top: -70px;
  right: 14%;
  z-index: 10;
}
.section-homecards .imgcropCtn {
  height: 370px;
  border-radius: 16px;
  margin-bottom: 30px;
}
.section-homecards a.divpage {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 30px 20px;
  min-height: 315px;
  border-radius: 16px;
  position: relative;
  margin-bottom: 30px;
}
.section-homecards a.divpage svg {
  height: 93px;
  margin-bottom: 20px;
}
.section-homecards a.divpage h3 {
  font-size: 2.8rem;
  line-height: 3.4rem;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.section-homecards a.divpage.vert {
  background-color: #00F000;
}
.section-homecards a.divpage.vert svg path.cls-1,
.section-homecards a.divpage.vert svg path.cls-3,
.section-homecards a.divpage.vert svg rect.cls-1,
.section-homecards a.divpage.vert svg rect.cls-3,
.section-homecards a.divpage.vert svg circle.cls-1,
.section-homecards a.divpage.vert svg circle.cls-3 {
  fill: #FFFEF1;
}
.section-homecards a.divpage.vert h3 {
  color: #4C00FF;
}
.section-homecards a.divpage.violet {
  background-color: #4C00FF;
}
.section-homecards a.divpage.violet svg path.cls-2,
.section-homecards a.divpage.violet svg path.cls-4,
.section-homecards a.divpage.violet svg rect.cls-2,
.section-homecards a.divpage.violet svg rect.cls-4,
.section-homecards a.divpage.violet svg circle.cls-2,
.section-homecards a.divpage.violet svg circle.cls-4 {
  fill: #FFFEF1;
}
.section-homecards a.divpage.violet h3 {
  color: #FFFEF1;
}
.section-homecards a.divpage:hover {
  transform: scale(1.06);
}
@media (max-width: 1599px) {
  .section-homecards a.divpage h3 {
    font-size: 2.2rem;
    line-height: 2.6rem;
  }
}
@media (max-width: 1399px) {
  .section-homecards .container-fluid h2 {
    font-size: 12.8rem;
    line-height: 13rem;
  }
  .section-homecards .container-fluid span.surtitre {
    font-size: 5.8rem;
    line-height: 6rem;
  }
  .section-homecards .cards .suivezleguide {
    width: 220px;
  }
}
@media (max-width: 1199px) {
  .section-homecards .cards .colonne {
    width: 25%;
  }
  .section-homecards .cards .colonne1 {
    display: none;
  }
  .section-homecards .container-fluid h2 {
    font-size: 10.8rem;
    line-height: 11rem;
  }
  .section-homecards .container-fluid span.surtitre {
    font-size: 4.8rem;
    line-height: 5rem;
  }
  .section-homecards {
    padding-top: 120px;
  }
}
@media (max-width: 991px) {
  .section-homecards .cards {
    flex-wrap: wrap;
    margin: 0 -8px;
  }
  .section-homecards .cards .colonne {
    width: 50%;
    padding: 0 7.5px;
  }
  .section-homecards .colonne2,
  .section-homecards .colonne3,
  .section-homecards .colonne4 {
    margin-top: 0px !important;
  }
  .section-homecards .colonne.mobshow:nth-of-type(even) {
    margin-top: 50px !important;
  }
  .section-homecards a.divpage,
  .section-homecards .imgcropCtn {
    margin-bottom: 15px;
  }
  .section-homecards .cards .suivezleguide {
    display: none;
  }
  .section-homecards .mobhide {
    display: none;
  }
}
@media (max-width: 767px) {
  .section-homecards .container-fluid h2 {
    font-size: 5.8rem;
    line-height: 6rem;
  }
  .section-homecards .container-fluid span.surtitre {
    font-size: 4.4rem;
    line-height: 4.5rem;
  }
  .section-homecards a.divpage h3 {
    font-size: 1.6rem;
    line-height: 2rem;
  }
  .section-homecards a.divpage {
    min-height: 227px;
    padding: 25px 15px;
  }
  .section-homecards a.divpage svg {
    height: 55px;
  }
  .section-homecards .imgcropCtn {
    height: 45vw;
  }
}
@media (max-width: 575px) {
  .section-homecards .imgcropCtn {
    height: 55vw;
  }
  .section-homecards a.divpage {
    min-height: 207px;
  }
}