/* COLORS SETUP */
:root{
  --primary: #63CC70;
  --primary-lighter: #8BF592;
  --primary-lightest: #EAF9EB;

  --secondary: #5F8AFB;
  --secondary-lighter: #9EB9FF;
  --secondary-lightest: #D2DDFA;

  --black: #031D16;
  --black-lighter: #06261e;
}

/* FONTS SETUP */
@font-face {
  font-family: "Albert Sans";
  src: url("../fonts/AlbertSans-Regular.ttf") format('ttf');

  font-weight: 400;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../fonts/AlbertSans-Italic.ttf") format('ttf');

  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../fonts/AlbertSans-SemiBold.ttf") format('ttf');

  font-weight: 600;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../fonts/AlbertSans-SemiBoldItalic.ttf") format('ttf');

  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../fonts/AlbertSans-Bold.ttf") format('ttf');

  font-weight: 700;
}

@font-face {
  font-family: "Albert Sans";
  src: url("../fonts/AlbertSans-BoldItalic.ttf") format('ttf');

  font-weight: 700;
  font-style: italic;
}

/* GENERAL */
*{
	font-family: 'Albert Sans', sans-serif;
}

body{
  margin: 0;
  color: var(--black);
  overflow-x: hidden;
}

.container,
.small-container{
	margin: 0 auto;
	padding: 0 32px;
}

ul.no-list-style{
	margin: 0;
	padding: 0;
}

ul.no-list-style li{
	list-style: none;
}

/* icons */
.icon{
	display: inline-flex;
	align-items: baseline;
}

.icon-l i{
	margin-right: 4px;
}

.icon-r i{
	margin-left: 4px;
}

.icon-l i.ri-2x{
	margin-right: 10px;
}

.icon-r i.ri-2x{
	margin-left: 10px;
}

/* titles */
h1,
.h1{
  font-size: 40px;
}

h1,
.h1,
h2,
.h2{
  font-weight: 700;
  line-height: 1.5;
}

h3,
.h3,
h4,
.h4,
h5,
.h5{
  font-weight: 600;
  line-height: 1.5;
}

h2,
.h2{
  font-size: 32px;
}

h3,
.h3{
  font-size: 24px;
}

h4,
.h4{
  font-size: 20px;
}

h5,
.h5{
  font-size: 16px;
}

.section-title{
  margin-top: 0;
}

.section-title::after{
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  background: var(--primary);
  margin-top: 16px;
  margin-bottom: 48px;
}

/* text */
p{
  font-size: 18px;
  line-height: 1.618;
}

.text-center{
  text-align: center;
}

/* links */
a{
  color: var(--secondary);
}

/* Images */
img{
  max-width: 100%;
  height: auto;
}

/* Buttons */
.btn{
  display: inline-block;
  box-sizing: border-box;
  text-align: center;
  padding: 12px 36px;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 8px;
  border-width: 0;
  cursor:pointer;
}

.btn-primary{
  background: var(--secondary);
  color: white;
}

.btn-secondary{
  border: 1px solid var(--black);
  color: var(--black);
}

.btn-tertiary{
  font-weight: 700;
  text-decoration: none;
}

/* Forms */
label{
  cursor: text;
  font-size: 16px;
}

input:not([type=submit]),
textarea{
  border: 0;
  background: #eee;
  padding: 12px;
  font-size: 16px;
  border-radius: 4px;
  border-left: 2px solid #eee;
  transition: border-color .64s ease-out;
}

input:not([type=submit]):hover,
textarea:hover{
  border-color: var(--primary-lighter);
}

input:not([type=submit]):focus,
textarea:focus{
  outline: none;
  border-color: var(--primary);
}

button,
input[type=submit],
input[type=checkbox]{
  cursor: pointer;
}

.form-field{

}

.form-field label,
.form-field input,
.form-field textarea{
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
}

.form-field label{
  margin-bottom: 4px;
}

/* Color classes */
.primary-color{
  color: var(--primary);
}

/* */
.hidden{
  display: none;
}


/* HEADER */
.site-header{
  border-bottom: 1px solid #ccc;
}

.site-header .site-header__content{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 32px;
  padding-bottom: 32px;
}

.site-header .logo img{
  max-height: 56px;
  width: auto;
}

.custom-form{
  background: #F1F1F1;
  display: inline-flex;
  align-items: center;
  width: 100%;
  border-radius: 8px;
}

.custom-form input{
  background: none;
  border: none;
  outline: none;
  padding: 16px 20px;
  font-size: 16px;
  width: 100%;
}

.custom-form button{
  border: none;
  font-size: 20px;
  padding: 4px 16px;
  border-left: 1px solid #ccc;
}

/* PAGE HEADER */
.page-header{
  background: var(--primary-lightest);
  padding-top: 72px;
  padding-bottom: 72px;
  margin-bottom: 64px;
}

.single-post .page-header{
  padding-bottom: 88px;
  margin-bottom: -32px;
}

.page-header h1{
  margin-top: 0;
}

.page-header #breadcrumbs{
  margin: 0;
}

/* FOOTER */
.site-footer{
	background: var(--black);
	color: #eee;
  margin-top: 96px;
}

.site-footer a{
	color: #eee;
	text-decoration: none;
}

/* Footer lists*/
.site-footer .footer-lists{

}

.site-footer .footer-lists .footer-item#contact-infos img{
	width: 128px;
	margin-bottom: 8px;
}

.site-footer .footer-lists .footer-item#contact-infos a{
  display: inline-block;
}

.site-footer .footer-lists .footer-item#contact-infos a::after{
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  background: var(--primary);
  margin-top: 16px;
  margin-bottom: 16px;
}

.site-footer .footer-lists .footer-item .footer-links ul{
	margin: 0;
	padding: 0;
}

.site-footer .footer-lists .footer-item .footer-links ul li{
	list-style: none;
}

/* Copyright */
.site-footer .copyright p{
	margin: 0;
	border-top: 1px solid var(--black-lighter);
	padding: 16px 0;
	text-align: center;
  font-size: 14px;
}

.site-footer .copyright p a{
	font-weight: 700;
}

/* ---- */

/* HOMEPAGE */
.home #latest-post{
  margin-bottom: 64px;
}

.home .latest-post{
  min-height: 400px;
  border-radius: 24px;
  padding: 48px;
  position: relative;
  color: white;
  display: flex;
  align-items: flex-end;
  text-decoration: none;
}

.home .latest-post::after{
  content: "";
  display: block;
  width: 100%;
  height: 40%;
  background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.72));
  position: absolute;
  left: 0;
  bottom: 0;
  border-radius: 0 0 24px 24px;
}

.home .latest-post__content{
  position: relative;
  z-index: 1;
}

.home .latest-post__content p{
  margin-bottom: 8px;
  text-shadow: 1px 1px 2px rgba(0,0,0,.4);
}

.home .latest-post__content h1{
  margin: 0;
  color: var(--black);
}

.post{
  margin-bottom: 40px;
}

.post .post__thumbnail{
  border-radius: 16px;
}

.post .post__content a:not(.read-more){
  color: var(--black);
  text-decoration: none;
}

.post .post__content .post__date{
  font-size: 16px;
}

.post .post__content .post__title{
  font-size: 20px;
}

.post .post__content a.read-more{
  padding: 12px 0;
}

.home #recent-posts .see-more-news{
  text-align: center;
}

/* SIDEBAR */
aside.sidebar > div{
  margin-bottom: 48px;
  padding: 32px 40px;
  border: 1px solid #eee;
  border-radius: 24px;
}

aside.sidebar div h3.section-title::after{
  margin-bottom: 0;
}

aside.sidebar div ul{
  margin: 0;
  padding: 0;
}

aside.sidebar div ul li{
  list-style: none;
}

aside.sidebar div ul li a{
  text-decoration: none;
  color: var(--black);
}

/* Catgégories */
aside.sidebar div.categories h3.section-title{
  margin-bottom: 12px;
}

aside.sidebar div.categories ul li a{
  padding: 20px 0;
  border-bottom: 1px solid #eee;
  display: inline-block;
  width: 100%;
}

aside.sidebar div.categories ul li:last-child a{
  border: none;
  padding-bottom: 0;
}

aside.sidebar div.categories ul li a span{
  padding-left: 6px;
}

/* Tags */
aside.sidebar div.tags ul{
  display: inline-flex;
  flex-wrap: wrap;
  margin-top: 12px;
}

aside.sidebar div.tags ul li a{
  display: inline-block;
  padding: 6px 12px;
  background: var(--primary-lightest);
  border-radius: 4px;
  margin-right: 8px;
  margin-bottom: 8px;
}

/* Newsletter */
aside.sidebar .newsletter form .rgpd{
  font-size: 12px;
}

/* SINGLE POST */
.single-post{

}

.single-post__header{

}

.single-post__content{

}

.single-post__content .single-post__thumbnail{
  border-radius: 24px;
  margin-bottom: 16px;
  aspect-ratio: 5/3;
  object-fit: cover;
  width: 100%;
}

.single-post__content figure:not(.post-thumbnail){
  margin-top: 48px;
}

.single-post__content figure:not(.post-thumbnail) figcaption{
  margin-bottom: 32px;
  margin-top: 32px;
  border-top: 1px solid #eee;
  padding-top: 16px;

  line-height: 1.618;
}

.single-post__footer .tags-list{
  margin-top: 32px;
  border-top: 1px solid #eee;
  padding-top: 32px;
  padding-left: 0;
  display: flex;
  flex-wrap: wrap;
  list-style: none;

  font-size: 18px;
  font-style: italic;
  line-height: 1.618;
  text-transform: lowercase;
}

.single-post__footer .tags-list li:before{
  content: '#';
  color: #7A7A7A;
}

.single-post__footer .tags-list li{
  margin-right: 4px;
}

.single-post__footer .tags-list li:not(:last-child):after{
  content: ',';
  color: #7A7A7A;
}

.single-post__footer .tags-list li a{
  color: #7A7A7A;
  text-decoration: none;
}

.single-post__footer .author-infos{
  background: var(--primary-lightest);
  border-radius: 24px;
  padding: 32px;
  margin-top: 32px;
}

.single-post__footer .author-infos img{
  border-radius: 100%;
}

.single-post__footer .author-infos .author-infos__content p{
  margin: 0;
}

.single-post__footer .author-infos .author-infos__content .author-name{
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 8px;
}

.single-post__footer .post-navigation{
  margin-top: 32px;
}

.single-post__footer .post-navigation .next-post{
  text-align: right;
}

.single-post__footer .post-navigation .post-navigation__links span{
  display: inline-block;
  width: 100%;
  font-size: 18px;
  line-height: 1.618;
  font-weight: 600;
}

.single-post__footer .post-navigation .post-navigation__links span.link-type{
  color: var(--black);
  margin-bottom: 8px;
}

.single-post__footer .post-navigation .post-navigation__links span.previous-post__title,
.single-post__footer .post-navigation .post-navigation__links span.next-post__title{
  text-decoration: underline;
}

/* Inline post */
.irp-shortcode > div{
  padding: 12px 20px;
  border: 1px solid #eee;
  border-radius: 12px;
  box-shadow: 0 8px 16px #eee;
}

.irp-shortcode > div a{
  line-height: 1.618;
  border: 0 !important;
  font-weight: 600;
}

.irp-shortcode > div a div span{
  display: block;
}

.irp-shortcode > div a div span.ctaText{
  font-size: 20px;
}

.irp-shortcode > div a div span.ctaText::after{
  content: "";
  display: block;
  width: 32px;
  height: 3px;
  background: var(--primary);
  margin-top: 12px;
  margin-bottom: 0;
}

.irp-shortcode > div a div span.postTitle{
  color: var(--secondary);
  font-size: 18px;
}

/* ARCHIVES */
.archive__desc{
  padding-bottom: 16px;
  border-bottom: 1px solid #eee;
  margin-bottom: 48px;
}

.archive__desc h2.section-title::after{
  margin-bottom: 32px;
}

/* 404 PAGE */
.error-content__redirection{
  margin-top: 40px;
}

.error-content__redirection > div {
  padding: 32px 40px;
  border: 1px solid #eee;
  border-radius: 24px;
}

.error-content__redirection .error-content__home a{
  width: 100%;
}

/* CONTACT FORM */
.default form .form-field{
  margin-top: 0;
  margin-bottom: 32px;
}

.default form br{
  display: none;
}

.default form .rgpd .wpcf7-list-item{
  margin: 0;
}

.default form input:not([type=submit]):not([type=checkbox]),
.default form textarea{
  margin-top: 4px;
}

.default form .submit{
  margin-top: 32px;
}

.default .wpcf7 form .wpcf7-response-output{
  padding: 32px;
  margin: 0;
  margin-top: 32px;
  border-radius: 8px;
  line-height: 1.618;
}

.default .wpcf7 form.invalid .wpcf7-response-output,
.default .wpcf7 form.unaccepted .wpcf7-response-output,
.default .wpcf7 form.payment-required .wpcf7-response-output{
  background: #FFE6E6;
  border-color: #FFADAD;
}

.default .wpcf7 form.sent .wpcf7-response-output{
  background:#E6FFEE;
  border-color: #ADFFC6;
}


/* --- */

/* RESPONSIVE */
@media (max-width: 575px){

}

@media (min-width: 576px){

}

@media (max-width: 767px){
  /* titles */
  h1,
  .h1{
    font-size: 32px;
  }

  h2,
  .h2{
    font-size: 24px;
  }

  h3,
  .h3{
    font-size: 20px;
  }

  h4,
  .h4{
    font-size: 16px;
  }

  /* Border radius */
  .error-content__redirection > div,
  .single-post__footer .post-navigation > div,
  .home .latest-post,
  .post .post__thumbnail,
  aside.sidebar > div,
  .single-post__content .single-post__thumbnail,
  .single-post__footer .author-infos{
    border-radius: 12px;
  }

  .home .latest-post::after{
    border-radius: 0 0 12px 12px;
  }

  /* Home - Recent posts */
  .news{
    margin-bottom: 64px;
  }

  .home .latest-post{
    padding-left: 40px;
    padding-right: 40px;
  }

  /* Posts list */
  .post{
    padding-bottom: 32px;
    border-bottom: 1px solid #eee;
    margin-bottom: 48px;
  }

  .post > a .post__thumbnail{
    margin-bottom: 16px;
    aspect-ratio: 4 / 3;
    object-fit: cover;
  }

  /* SINGLE POST */
  .single-post__content .single-post__thumbnail{
    aspect-ratio: 4/3;
  }

  .single-post__footer .author-infos{
    text-align: center;
  }

  .single-post__footer .author-infos img{
    margin-bottom: 24px;
    width: 128px;
    height: auto;
  }

  .single-post__footer .author-infos .author-infos__content .author-name{
    font-size: 18px;
  }

  .single-post__footer .post-navigation > div{
    border: 1px solid #eee;
    padding: 32px;
    margin-bottom: 32px;
  }

  /* 404 PAGE */
  .error-content__search{
    margin-bottom: 32px;
  }
}

@media (min-width: 768px){
  /* Home - Recent posts */
  .home #recent-posts .see-more-news{
    text-align: center;
    padding-top: 40px;
    border-top: 1px solid #eee;
  }

  /* Posts list */
  .post{
    display: flex;
    align-items: center;
  }

  .post > a{
    display: block;
    max-width: 30%;
  }

  .post > a .post__thumbnail{
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
  }

  .post .post__content{
    padding-left: 40px;
  }

  .post .post__content p,
  .post .post__content h3{
    margin: 0;
  }

  .post .post__content h3{
    margin: 4px 0 8px;
  }

  /* SINGLE POST - Footer */
  .single-post__footer .author-infos{
    display: flex;
    align-items: center;
  }

  .single-post__footer .author-infos .author-infos__content{
    padding-left: 32px;
  }

  .single-post__footer .post-navigation{
    display: flex;
    justify-content: space-between;
  }

  .single-post__footer .post-navigation > div{
    width: 45%;
  }

  /* 404 PAGE */
  .error-content__redirection{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .error-content__redirection > div{
    width: 38%;
  }
}

@media (max-width: 991px){
	.mb-hidden{
		display: none;
	}

  /* Menu mobile */
  .overlay{
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,.4);
    position: fixed;
    top:0;
    right: 0;
    z-index: 9;

    display: none
  }

  .menu__content{
    width: calc(80% - 64px);
    height: calc(100vh - 64px);
    background: white;
    position: fixed;
    top: 0;
    right:0;
    z-index: 10;

    padding: 32px;

    transform: translateX(100vw);
  }

  .menu__content.open{
    display: block;
    transform: translateX(0);
  }

  .menu__content,
  .menu__content.open{
    transition: transform .4s ease-in-out;
    transition-delay: .24px;
  }

  .menu__content .close{
    text-align: right;
    margin-bottom: 32px;
  }

  .menu__content .search-form{
    margin-bottom: 24px;
  }

  .menu__content .categories{
    margin: 0;
    padding: 0;
    list-style: none;
    margin-bottom: 40px;
  }

  .menu__content .categories li a{
    color: var(--black);
    text-decoration: none;

    display: inline-block;
    width: 100%;
    padding: 16px 0;
    border-bottom: 1px solid #eee;
  }

  .menu__content .contact-us{
    text-align: center;
  }

  /* Header */
  .home .site-header{
    margin-bottom: 40px;
  }

  .site-header .logo img{
    max-height: 40px;
  }

  /* Footer */
  .site-footer{
		padding-top: 40px;
	}

	/* Footer lists */
	.site-footer .footer-lists .footer-item#contact-infos{
		padding: 24px 12px;
	}

	.site-footer .footer-lists .footer-item:not(#contact-infos) h3 {
  	cursor: pointer;
		padding: 16px 12px;
		border-top: 1px solid var(--light-black);
    margin: 0;
    font-size: 20px;
  }

	.site-footer .footer-lists .footer-item:not(#contact-infos) h3:after {
  	content: "+";
		display: inline-block;
		transform: rotate(0deg);
		float: right;
		transition: transform .64s ease-out;
    transition-delay: .48s;
  }

	.site-footer .footer-lists .footer-item.open:not(#contact-infos) h3:after {
		transform: rotate(45deg);
		transition: transform .64s ease-in;
    transition-delay: .48s;
  }

	.site-footer .footer-lists .footer-item:not(#contact-infos) .footer-links ul {
	  max-height: 0;
	  overflow:hidden;
	  transition: max-height 1s ease-out;
		padding: 0 12px;
	}

  .site-footer .footer-lists .footer-item.open:not(#contact-infos) .footer-links ul {
	  height:auto;
	  max-height: 100vh;
	  transition: max-height 1s ease-in;
		margin-bottom: 16px;
	}

  .site-footer .footer-lists .footer-item li a{
    display: inline-block;
    width: 100%;
    padding: 20px 0;
    border-bottom: 1px solid var(--black-lighter);
  }

	/* Copyright */
	.site-footer .copyright{
		margin-top: 40px;
	}
}

@media (min-width: 992px){
	.dk-hidden{
		display: none;
	}

  .small-container{
    max-width: 900px;
  }

  /* Header */
  .home .site-header{
    margin-bottom: 64px;
  }

  .site-header .search-form{
    width: 40%;
  }

  .page-content{
    display: flex;
    align-items: flex-start;
  }

  .page-content section{
    width: 70%;
    padding-right: 64px;
  }

  .page-content aside{
    width: 30%;
  }

  /* Footer */
	.site-footer .footer-lists{
		display: flex;
		padding: 80px 0;
	}

	.site-footer .footer-lists .footer-item{
		width: 25%;
	}

	.site-footer .footer-lists .footer-item:not(:last-child){
		padding-right: 64px;
	}

	.site-footer .footer-lists .footer-item h3{
    margin-top: 0;
		margin-bottom: 16px;
	}

  .site-footer .footer-lists .footer-item .footer-links ul li{
  	margin-bottom: 8px;
  }

	.site-footer .footer-lists .footer-item p,
	.site-footer .footer-lists .footer-item li,
	.site-footer .copyright{
		font-size: 14px;
	}
}

@media (min-width: 1200px){
	.container{
		max-width: 1080px;
	}
}

@media (min-width: 1500px){
	.container{
		max-width: 1200px;
	}
}
