/*
Theme Name: Citepa v1
Author: AG
Description: Our 2019 default theme is designed to show off the power of the block editor. It features custom styles for all the default blocks, and is built so that what you see in the editor looks like what you'll see on your website. Twenty Nineteen is designed to be adaptable to a wide range of websites, whether you’re running a photo blog, launching a new business, or supporting a non-profit. Featuring ample whitespace and modern sans-serif headlines paired with classic serif body text, it's built to be beautiful on all screen sizes.
Text Domain: citepa_v1
*/

/* Reset CSS */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.mobile {
  display: none;
}
.desktop {
}
.buttonsize5 {
  display: none;
}
.buttonsize3 {
  display: block;
}
input {
  border: none;
}

/* HTML et body*/
/* Le font-size à 62.5% permet d'utiliser l'unité de mesure rem ensuite, avec 1rem = 10px */
html {
  background-color: #ffffff;
  font-size: 62.5%;
}
body {
  width: 100%;
  background-color: #fcfcfc;
  font-family: "Source Sans Pro", sans-serif;
}

/* Structure principale header, nav, main, footer */
header {
  display: flex;
  flex-flow: row nowrap;
  border-bottom: 1px solid #cccccc;
  height: 80px;
  background-color: #ffffff;
}
nav#desktop {
  background-color: #ffffff;
}
main {
  width: 1280px;
  margin: 10px auto;
  padding: 0 10px;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
  align-content: flex-start;
  text-align: justify;
}
main > h1 {
  font-size: 2.6rem;
  margin-bottom: 30px;
  text-transform: uppercase;
  color: #707070;
  text-align: left;
}
main > h1 > hr {
  width: 30px;
  border: 1px solid #63b9d8;
  margin-top: 5px;
}
footer {
  min-height: 80px;
  display: flex;
  flex-flow: row nowrap;
  color: #ffffff;
}

/*****************************************************************************************************/
/* Logo du site */
header h1 {
  flex: 0 0;
  padding: 0 20px;
  display: flex;
  align-items: center;
}


header h1 a {
  font-size: 3.2rem;
  text-decoration: none;
  color: #667b9f;
  letter-spacing: 1rem;
}

header h1 a:hover {
  text-decoration: none;
}

/*Correction pour image du logo*/
header h1 a img {
  max-width: initial;
}

/* Barre de recherche */
header #search {
  flex: 1 1;
  padding: 0 20px;
  display: flex;
  align-items: center;
}
header #search #search-form {
  width: 400px;
  border: 1px solid #cccccc;
  padding: 10px 20px;
  border-radius: 20px;
}
header #search-form input {
  height: 2rem;
  border-left: 1px solid #cccccc;
  padding: 5px;
  font-size: 1.3rem;
  font-family: "Source Sans Pro", sans-serif;
  color: #707070;
}
header #search-form button {
  background-color: #ffffff;
  border: none;
  margin-right: 5px;
}
header #search-form button img {
}
/* Menu mobile */
nav#mobile {
  display: none;
}
/* Lien Contact */
header #contact {
  flex: 0 0;
  padding: 0 20px;
  display: flex;
  align-items: center;
}
header #contact a {
  font-size: 1.6rem;
  text-decoration: none;
  color: #aaaaaa;
  font-weight: 700;
}
header #contact a:hover {
  color: #666666;
}
/* Barre de langue */
header #lang {
  flex: 0 0;
  padding: 0 30px;
  display: flex;
  align-items: center;
  background-image: linear-gradient(to right, #5f8ed8, #1ba9c5);
}
header #lang ul {
  white-space: nowrap;
}
header #lang .lang-item {
  display: inline;
  list-style: none;
  margin-right: 5px;
  text-transform: uppercase;
}
header #lang .lang-item a {
  font-size: 1.6rem;
  color: #ffffff;
  text-decoration: none;
}
header #lang .lang-item:nth-child(2) a:before {
  content: "| ";
  margin-right: 5pxrem;
}

/*****************************************************************************************************/
/* Menu horizontal principal du site */
div#mega-menu-wrap-h-menu {
  width: 1280px;
  margin: auto;
}

/*****************************************************************************************************/
/******** Footer du site ***********/
footer .col-left {
  flex: 0 0 50%;
  text-align: left;
  background-image: linear-gradient(to right, #1ca9c5, #5b90d6);
  padding-left: 20px;
  display: flex;
  align-items: center;
  flex-flow: row wrap;
}
footer .col-right {
  flex: 0 0 50%;
  text-align: right;
  background-color: #5b90d6;
  padding-right: 20px;
  display: flex;
  align-items: center;
  flex-flow: row wrap;
  justify-content: flex-end;
}
footer .col-left > div {
  white-space: nowrap;
  color: #ffffff;
  font-size: 1.4rem;
  margin-right: 15px;
}
footer .col-right > div {
  white-space: nowrap;
  color: #ffffff;
  font-size: 1.4rem;
  margin-right: 15px;
}
footer .col-left > div.citepa {
  font-size: 2rem;
  font-weight: 700;
}
footer a {
  color: #ffffff;
  text-decoration: none;
}
footer a:hover {
  text-decoration: underline;
}

/*****************************************************************************************************/
/******** Page d'accueil ***********/
main #front-articles {
  margin: 30px 0 60px 0;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
  align-content: flex-start;
  margin-bottom: 125px;
}
main #front-articles h1 {
  flex: 0 0 100%;
  margin-bottom: 4rem;
  font-size: 2.6rem;
  color: #707070;
  text-transform: uppercase;
  text-align: left;
}
main #front-articles h1 > hr {
  width: 2%;
  border: 1px solid #707070;
  margin-top: 5px;
}
main #front-articles .front-cat {
  margin-bottom: 3rem;
  flex: 0 0 624px;
  background-color: #ffffff;
}
main #front-articles .front-cat > h2 {
  height: 118px;
  display: flex;
  align-items: flex-end;
  margin-bottom: 30px;
}
main #front-articles .front-cat > h2 > span {
  flex: 0 0 330px;
  margin-left: 20px;
  background-color: #ffffff;
  height: 54px;
  padding: 10px 10px 0 10px;
  font-size: 1.8rem;
  text-transform: uppercase;
}
main #front-articles .front-cat > h2 > span > img {
  float: left;
  margin-right: 10px;
}
main #front-articles .front-cat .list-articles {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
  align-content: flex-start;
  margin-bottom: 20px;
}
main #front-articles .front-cat .list-articles > article {
  flex: 0 0 50%;
  padding: 0 20px;
}
main #front-articles .front-cat .list-articles > article > .meta {
  margin-bottom: 20px;
}
main #front-articles .front-cat .list-articles > article > .meta > .format {
  margin-right: 10px;
  font-size: 1.3rem;
  text-transform: uppercase;
  font-weight: 700;
  color: #707070;
}
main #front-articles .front-cat .list-articles > article > .meta > .date {
  font-size: 1.4rem;
}
main #front-articles .front-cat .list-articles > article > h3 {
  height: 70px;
  font-size: 1.6rem;
  color: #707070;
}
main #front-articles .front-cat .list-articles > article > .excerpt {
  height: 170px;
  font-size: 1.3rem;
  color: #707070;
}
main #front-articles .front-cat .list-articles > article > a.read {
  font-size: 1.1rem;
  color: #707070;
  text-transform: uppercase;
  font-weight: bold;
  text-decoration: none;
}
main #front-articles .front-cat .list-articles > article > a.read > img {
  margin-left: 5px;
}
main #front-articles .front-cat > a.more {
  float: right;
  margin: 0 20px 15px 0;
  padding: 5px 10px;
  border-radius: 20px;
  text-decoration: none;
  background-image: linear-gradient(to left, #1ca9c5, #5b90d6);
  color: #ffffff;
  font-weight: 700;
  text-transform: uppercase;
}
main #front-articles .front-cat > a.more > img {
  margin-left: 20px;
}

main #front-pres-main {
  margin-bottom: 60px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: flex-start;
  align-content: flex-start;
  text-align: justify;
}
main #front-pres-main > .image {
  margin-right: 50px;
}
main #front-pres-main > .image > img {
}
main #front-pres-main > .text > h1 {
  margin-bottom: 30px;
  font-size: 1.8rem;
  color: #707070;
  text-transform: uppercase;
  text-align: left;
}
main #front-pres-main > .text > h1 > hr {
  width: 2%;
  border: 1px solid #707070;
  margin-top: 5px;
}
main #front-pres-main > .text > p {
  margin-bottom: 20px;
  font-size: 1.3rem;
  color: #707070;
}
main #front-pres-main > .text > a.more {
  float: left;
  padding: 5px 10px;
  border-radius: 20px;
  text-decoration: none;
  background-image: linear-gradient(to left, #1ca9c5, #5b90d6);
  color: #ffffff;
  font-weight: 700;
  text-transform: uppercase;
}
main #front-pres-main > .text > a.more > img {
  margin-left: 20px;
}

main #front-pres-blocs {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
  align-content: flex-start;
  margin-bottom: 120px;
}
main #front-pres-blocs > .single {
  flex: 0 0 280px;
}
main #front-pres-blocs > .single > a > img {
  margin-bottom: 20px;
  border: 1px solid #bbbabb;
}
main #front-pres-blocs > .single > h2 {
  margin-bottom: 20px;
  font-size: 1.6rem;
  font-weight: 700;
  color: #707070;
  text-transform: uppercase;
}
main #front-pres-blocs > .single > .text {
  height: 70px;
  font-size: 1.3rem;
  color: #707070;
}
main #front-pres-blocs > .single > a.read {
  margin-top: 20px;
  font-size: 1.1rem;
  font-weight: 700;
  color: #707070;
  text-transform: uppercase;
  text-decoration: none;
}
main #front-pres-blocs > .single > a.read > img {
  margin-bottom: 0;
  border: 0;
  margin-left: 5px;
}

/*****************************************************************************************************/
/******** Page single par défaut ***********/
main article.single {
  flex-basis: 71.875%;
  font-size: 1.4rem;
  color: #505050;
}
main article.single > h1 {
  font-size: 2.6rem;
  margin-bottom: 30px;
  text-transform: uppercase;
  color: #707070;
  text-align: left;
}
main article.single > h1 > hr {
  width: 30px;
  border: 1px solid #63b9d8;
  margin-top: 5px;
}
main article.single .content {
  margin-bottom: 20px;
}
main article.single .content h2 {
  margin-top: 4rem;
  margin-bottom: 2rem;
  background-color: #ffffff;
  font-size: 1.8rem;
  border-top: 1px solid #63b9d8;
  padding: 20px;
  color: #707070;
  clear: both;
}
main article.single .content h3 {
  font-size: 1.6rem;
  border-bottom: 1px solid #63b9d8;
  padding-bottom: 5px;
  margin-bottom: 14px;
  clear: both;
}
main article.single .content p {
  margin-bottom: 1rem;
  line-height: 2.2rem;
}
main article.single .content p a {
  text-decoration: none;
  color: #0657bb;
}
main article.single .content p a:hover {
  text-decoration: underline;
}
main article.single .content ul {
  margin-bottom: 1rem;
  margin-left: 2rem;
  margin-top: -1rem;
  list-style-type: none;
}
main article.single .content ul li {
  margin-bottom: 0.5rem;
}
/* Triangle en tant que Bullet Point
main article.single .content ul li:before {
  content: "";
  border-color: transparent #b8d35d;
  border-style: solid;
  border-width: 0.6em 0 0.6em 0.5em;
  display: block;
  height: 0;
  width: 0;
  left: -1.5em;
  top: 1.3em;
  position: relative;
}
*/

/* Bullet Point classique mais vert*/
main article.single .content ul li:before {
  content: "\2022";
  color: #b8d35d;
  font-weight: bold;
  display: inline-block;
  width: 1em;
}


main article.single .content ul li a {
  text-decoration: none;
  color: #0657bb;
}

main article.single .content ul li a:hover {
  text-decoration: underline;
}

main article.single .content ul li > ul {
  margin-top: 0rem;
  list-style-type: disc;
  margin-bottom: 1rem;
  margin-left: 3rem;
}
main article.single .content ul li > ul {
  margin-top: 0.5rem;
}
main article.single .content ul li > ul > li:before {
  content: none;
}

main article.single .content ol {
  margin-bottom: 2rem;
  margin-left: 1rem;
  font-weight: 700;
}
main article.single .content ol > li * {
  font-weight: normal; /* Tout ça pour avoir... */
}
main article.single .content ol > li strong {
  font-weight: 700; /* ...des chiffres de listes en gras */ 
}
main article.single .content .img-adherents img {
  display: inline-block;
  margin: 5px;
  border: 1px solid #707070;
}

/* Spécifique pour les items de la veille */
.cdl-meta {
  margin-bottom: 20px;
  color: #63b9d8;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}
.cdl-meta > ul > li {
  list-style-type: none;
  display: inline;
}
.cdl-meta > ul > li:before {
  content: "|";
  margin-left: 5px;
  margin-right: 5px;
}
.cdl-meta > ul > li:first-child:before{
  content:none;
  margin-left: 0;
  margin-right: 0;
}
.cdl-meta > ul.niveau > li {
  color: #ffffff;
  font-size: 1.2rem;
  padding: 2px 10px;
  border-radius: 5px;
  margin-right: 5px;
}
.cdl-meta > ul.niveau > li:before {
  content: none;
}
.cdl-cats {
  margin: 40px 0 40px 0;
  font-weight: 700;
  text-align: left;
}
.cdl-cats-format {
  color: #63b9d8;
}
.cdl-cats-niveau {
  color: #b8d35d;
}
.cdl-cats-theme {
  color: #1ca9c5;
}
.cdl-cats-keyword {
  color: #707070;
}
/***Contextual Related Posts (articles liés ***/
main article.single .crp_related {
  background-color: #ffffff;
  margin-bottom: 20px;
}
main article.single .crp_related h4 {
  font-weight: 700;
  color: #ffffff;
  font-size: 1.6rem;
  padding: 10px;
  border-bottom: 1px solid #bbbabb;
  text-transform: uppercase;
  background-color: #5b90d6;
}
main article.single .crp_related .crp_item {
  border-bottom: 1px solid #bbbabb;
  border-right: 1px solid #bbbabb;
  border-left: 1px solid #bbbabb;
  padding: 5px 10px;
}
main article.single .crp_related .crp_item a.crp_link {
  display: block;
  font-size: 1.4rem;
  text-decoration: none;
  color: #0657bb;
}
main article.single .crp_related .crp_item a.crp_link span.crp_title {
}
main article.single .crp_related .crp_item span.crp_date {
  display: block;
  font-size: 1.3rem;
}

/* Spécifique pour la page équipe */
.team-member {
  clear: both;
  margin-bottom: 20px;
}
.team-member > img {
  float: left;
  margin: 0 10px 10px 0;
}
.team-member p.team-member-name {
  font-size: 1.8rem;
  font-weight: 700;
}
.team-member div.team-member-descr {
  margin-left: 160px;
}
/* Spécifique pour les pages des polluants */
/*Landing page */
main article.single .content > div.data-complement {
  display: flex;
  flex-flow: row wrap;
  margin-bottom: 20px;
  justify-content: space-between;
}
main article.single .content > div.data-complement div.data-complement-item {
  width: 24%;
  border: 1px solid #707070;
  background-color: #ffffff;
  padding: 10px 5px;
}
main article.single .content > div.data-complement div.data-complement-item p {
  text-align: center;
  font-size: 1.6rem;
  font-weight: 700;
}

/***************************/
main article.single .content > .item-barometre {
  margin-bottom: 20px;
}
main article.single .content > .item-barometre > a {
  display: inline-block;
  margin: 10px 10px 10px 0;
  border: 1px solid #707070;
  text-decoration: none;
  width: 302px; /* On ajoute deux pixels pour éviter le redimensionnement de l'image */ 
  height: 222px; /* On ajoute deux pixels pour éviter le redimensionnement de l'image */

}
main article.single .content > .item-barometre > a > p {
  text-align: center;
  color: #ffffff;
  font-size: 1.4rem;
  padding: 3px;
  background-color: #63b9d8;
  font-weight: bold;
  letter-spacing: 1px;
}
/***************************/

main article.single .content > div.item-polluants {
  display: flex;
  flex-flow: row wrap;
  margin: 0;
}
main article.single .content > div.item-polluants > a {
  display: block;
  width: 100px;
  height: 100px;
  border: 1px solid #707070;
  margin: 10px 10px 10px 0;
  text-decoration: none;
}

main article.single .content > div.item-polluants > a > p {
  height: 28px;
  padding: 2px 5px 0 5px;
  background-color: #63b9d8;
  text-align: center;
  font-size: 1.4rem;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 1px;
}

/* Graphique */
main article.single div.emission-graph {
  margin: 0 0 3rem 0;
}

/* Spécifique page des publications */
.items-publications {
  text-align: center;
  margin-bottom: 20px;
}
.items-publications > a {
  display: inline-block;
  margin: 10px 10px 10px 0;
  border: 1px solid #707070;
  text-decoration: none;
}
.items-publications > a.essentiel {
  width: 152px; /* On ajoute deux pixels pour éviter le redimensionnement de l'image */
  height: 182px;/* On ajoute deux pixels pour éviter le redimensionnement de l'image */
}
.items-publications > a.experts {
  width: 102px;/* On ajoute deux pixels pour éviter le redimensionnement de l'image */
  height: 127px;/* On ajoute deux pixels pour éviter le redimensionnement de l'image */
}
.items-publications > a > p {
  text-align: center;
  color: #ffffff;
  font-size: 1.4rem;
  padding: 3px;
  background-color: #63b9d8;
  font-weight: bold;
  letter-spacing: 1px;
}

/* Spécifique aux pages singles "Formations" */
main article.single .formation-meta {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-start;
  align-content: flex-start;
}
main article.single .formation-meta-item {
  display: flex;
  padding: 10px;
  line-height: 25px;
}
/* Page d'inscription aux formations */
main article.single .content .wpcf7 form .ch {
  margin-bottom: 20px;
}
main article.single .content .wpcf7 form .ch h2 {
  border: none;
  padding: 0;
  margin: 0;
  padding-bottom: 10px;
  font-size: 1.6rem;
  font-weight: bold;
}
main article.single .content .wpcf7 form .ch select.wpcf7-select {
  border: 1px solid #63b9d8;
  background-color: #f7f7f7;
  padding: 5px;
}
main article.single .content .wpcf7 form .ch input.wpcf7-text {
  background-color: #f7f7f7;
  margin-top: 1rem;
  margin-bottom: 2rem;
  padding: 5px 10px;
  border: 1px solid #63b9d8;
  border-radius: 10px;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.3rem;
}
main article.single .content .wpcf7 form .ch input.wpcf7-text:focus {
  border: 1px solid #b8d35d;
}
main article.single .content .wpcf7 form .ch textarea.wpcf7-textarea {
  width: 50%;
  border: none;
  padding: 5px 10px;
  margin-top: 1rem;
  margin-bottom: 2rem;
  background-color: #f7f7f7;
  border: 1px solid #63b9d8;
  border-radius: 10px;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.3rem;
}
main article.single .content .wpcf7 form .ch textarea.wpcf7-textarea:focus {
  border: 1px solid #b8d35d;
}
main article.single .content .wpcf7 form input.wpcf7-submit:hover {
  cursor: pointer;
}

/*****************************************************************************************************/
/******** Page Contact ***********/
main article.single div.wpcf7 form.wpcf7-form {
  padding: 20px;
  background-color: #ffffff;
}
main article.single div.wpcf7 form.wpcf7-form p {
}
main article.single div.wpcf7 form.wpcf7-form p label {
  font-size: 1.6rem;
  font-weight: bold;
}
main article.single div.wpcf7 form.wpcf7-form p label span {
}
main article.single div.wpcf7 form.wpcf7-form p label span input {
  background-color: #f7f7f7;
  margin-top: 1rem;
  margin-bottom: 2rem;
  padding: 5px 10px;
  border: 1px solid #63b9d8;
  border-radius: 10px;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.3rem;
}
main article.single div.wpcf7 form.wpcf7-form p label span input:focus {
  border: 1px solid #b8d35d;
}
main article.single div.wpcf7 form.wpcf7-form select.wpcf7-select {
  margin-top: 1rem;
  border: 1px solid #63b9d8;
  background-color: #f7f7f7;
  padding: 5px;
}
main article.single div.wpcf7 form.wpcf7-form p label span textarea {
  width: 100%;
  border: none;
  padding: 5px 10px;
  margin-top: 1rem;
  margin-bottom: 2rem;
  background-color: #f7f7f7;
  border: 1px solid #63b9d8;
  border-radius: 10px;
  font-family: "Source Sans Pro", sans-serif;
  font-size: 1.3rem;
}
main article.single div.wpcf7 form.wpcf7-form p label span textarea:focus {
  border: 1px solid #b8d35d;
}
main article.single div.wpcf7 form.wpcf7-form p input.wpcf7-submit {
  background-image: linear-gradient(to left, #1ca9c5, #5b90d6);
  padding: 5px 20px;
  border-radius: 20px;
  text-decoration: none;
  color: #ffffff;
  font-weight: 700;
  text-transform: uppercase;
}
main article.single div.wpcf7 form.wpcf7-form .wpcf7-list-item {
  display: block;
}
/*Spécifique au formulaire d'inscription de la journée d'étude*/
.tarifs-non-adherent .wpcf7-list-item {display: block;}
.tarifs-adherent .wpcf7-list-item {display: block;}
/*****************************************************************************************************/
/******** Fichier tag.php par défaut, pour les blocs ***********/
main #prestations {
  flex-basis: 71.875%;
  margin-bottom: 20px;
}
main #prestations > h1 {
  font-size: 2.6rem;
  margin-bottom: 30px;
  text-transform: uppercase;
  color: #707070;
  text-align: left;
}
main #prestations > h1 > hr {
  width: 30px;
  border: 1px solid #63b9d8;
  margin-top: 5px;
}
img.tag-img {
  margin-bottom: 2rem;
  margin-top: -10px;
  width: 100%;
  height: auto;
}
main #prestations div.tag-description {
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #707070;
  margin-bottom: 3rem;
}
main #prestations div.tag-description p {
  margin-bottom: 1rem;
  line-height: 2.2rem;
}
main #prestations div.tag-description p a {
  text-decoration: none;
  color: #0657bb;
}
main #prestations div.tag-description p a:hover {
  text-decoration: underline;
}
main #prestations div.tag-description ul {
  margin-bottom: 2rem;
  margin-left: 2rem;
  margin-top: -1rem;
  list-style-type: none;
}
main #prestations div.tag-description ul li {
}
main #prestations div.tag-description ul li:before {
  content: "";
  border-color: transparent #b8d35d;
  border-style: solid;
  border-width: 0.6em 0 0.6em 0.5em;
  display: block;
  height: 0;
  width: 0;
  left: -1.5em;
  top: 1.3em;
  position: relative;
}

/* Dans la boucle while*/
main #prestations article.bloc {
  margin: 0 0 30px 0;
}
main #prestations article.bloc > h1 {
  margin: 0 0 20px 0;
  background-color: #ffffff;
  font-size: 1.8rem;
  border-top: 1px solid #63b9d8;
  padding: 20px;
  color: #707070;
}
main #prestations article.bloc .content h2 {
  margin-bottom: 10px;
  font-size: 1.6rem;
  font-style: italic;
  color: #707070;
}
main #prestations article.bloc .content h3 {
  margin-bottom: 5px;
  font-size: 1.4rem;
  color: #707070;
}
main #prestations article.bloc .content p {
  font-size: 1.4rem;
  color: #707070;
  line-height: 2.2rem;
  margin-bottom: 1rem;
}
main #prestations article.bloc .content p a {
  text-decoration: none;
  color: #0657bb;
}
main #prestations article.bloc .content p a:hover {
  text-decoration: underline;
}
main #prestations article.bloc .content ul {
  margin-bottom: 3rem;
  margin-left: 2rem;
  margin-top: -2rem;
  list-style-type: none;
  font-size: 1.4rem;
}
main #prestations article.bloc .content ul li {
}
main #prestations article.bloc .content ul li:before {
  content: "";
  border-color: transparent #b8d35d;
  border-style: solid;
  border-width: 0.6em 0 0.6em 0.5em;
  display: block;
  height: 0;
  width: 0;
  left: -1.5em;
  top: 1.3em;
  position: relative;
}
main #prestations article.bloc .content ul li a {
  text-decoration: none;
  color: #0657bb;
}
main #prestations article.bloc .content ul li a:hover {
  text-decoration: underline;
}

/*****************************************************************************************************/
/******** Fichier category-actus-citepa.php par défaut ***********/
main #actus-citepa {
  flex-basis: 71.875%;
  margin-bottom: 20px;
}
main #actus-citepa > h1 {
  font-size: 2.6rem;
  margin-bottom: 30px;
  text-transform: uppercase;
  color: #707070;
  text-align: left;
}
main #actus-citepa > h1 > hr {
  width: 30px;
  border: 1px solid #63b9d8;
  margin-top: 5px;
}

img.cat-img {
  margin-bottom: 2rem;
  margin-top: -10px;
  width: 100%;
  height: auto;
}
main #actus-citepa div.actus-citepa-description {
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #707070;
  margin-bottom: 3rem;
}

/* Dans la boucle while*/
main #actus-citepa article.item {
  margin: 0 0 60px 0;
}
main #actus-citepa article.item h1 {
  display: flex;
  flex-flow: row wrap;
  background-color: #ffffff;
  padding: 30px;
  margin-bottom: 20px;
  border-top: 1px solid #63b9d8;
}
main #actus-citepa article.item h1 a.title {
  display: block;
  flex-basis: 75%;
  text-decoration: none;
  font-size: 1.8rem;
  color: #707070;
}
main #actus-citepa article.item h1 .ref-date {
  flex-basis: 25%;
  font-weight: 400;
  font-size: 1.4rem;
  color: #63b9d8;
  text-align: right;
}
main #actus-citepa article.item p {
  font-size: 1.4rem;
  color: #707070;
  line-height: 2.2rem;
  margin-bottom: 1rem;
}
main #actus-citepa article.item a.more {
  float: right;
  padding: 5px 10px;
  border-radius: 20px;
  text-decoration: none;
  background-image: linear-gradient(to left, #1ca9c5, #5b90d6);
  color: #ffffff;
  font-weight: 700;
  text-transform: uppercase;
}
main #actus-citepa article.item a.more > img {
  margin-left: 20px;
}

/*****************************************************************************************************/
/******** Fichier search.php (résultats de recherche) ***********/
main #search-results {
  flex-basis: 71.875%;
  margin-bottom: 20px;
}

main #search-results div.search-results-intro {
  font-size: 1.4rem;
  line-height: 2.2rem;
  color: #707070;
  margin-bottom: 3rem;
}

/* Dans la boucle while*/
main #search-results > article.item {
  margin: 0 0 60px 0;
}
main #search-results > article.item > h1 {
  display: flex;
  flex-flow: row wrap;
  background-color: #ffffff;
  padding: 30px;
  margin-bottom: 20px;
  border-top: 1px solid #63b9d8;
}
main #search-results > article.item > h1 > a.title {
  display: block;
  flex-basis: 75%;
  text-decoration: none;
  font-size: 1.8rem;
  color: #707070;
}
main #search-results > article.item > h1 > .ref-date {
  flex-basis: 25%;
  font-weight: 400;
  font-size: 1.4rem;
  color: #63b9d8;
  text-align: right;
}
main #search-results > article.item > p {
  font-size: 1.4rem;
  color: #707070;
  line-height: 2.2rem;
  margin-bottom: 1rem;
}
main #search-results > article.item > a.more {
  float: right;
  padding: 5px 10px;
  border-radius: 20px;
  text-decoration: none;
  background-image: linear-gradient(to left, #1ca9c5, #5b90d6);
  color: #ffffff;
  font-weight: 700;
  text-transform: uppercase;
}
main #search-results > article.item > a.more > img {
  margin-left: 20px;
}

/*****************************************************************************************************/
/******** Sidebar ***********/
aside#sidebar {
  flex-basis: 25%;
  background-color: #ffffff;
  border: 1px solid #bbbabb;
  margin-bottom: 20px;
}
aside#sidebar div h4 {
  font-weight: 700;
  color: #ffffff;
  font-size: 1.6rem;
  padding: 10px 30px;
  text-transform: uppercase;
  background-color: #5b90d6;
}
/***Boutons de partage ***/
aside#sidebar .share {
  text-align: center;
}
aside#sidebar .share h4 {
  text-align: left;
}
aside#sidebar .share .addtoany_list a {
  padding: 10px;
}
/***Formations (individuelles) ***/
aside#sidebar .single-formation {
}
aside#sidebar .single-formation h4 {
  margin-bottom: 10px;
}
aside#sidebar .single-formation h5 {
  font-size: 1.4rem;
  margin-left: 10px;
}
aside#sidebar .single-formation ul {
  margin: 10px;
}
aside#sidebar .single-formation ul li {
  margin-bottom: 0.5rem;
  list-style-type: none;
  font-size: 1.3rem;
}
/***Formations (liste) ***/
aside#sidebar .formations-liste {
}
aside#sidebar .formations-liste ul {
  margin: 10px;
}
aside#sidebar .formations-liste ul li {
  margin-bottom: 0.5rem;
  list-style-type: none;
}
aside#sidebar .formations-liste a {
  font-size: 1.3rem;
  text-decoration: none;
  color: #0657bb;
}
aside#sidebar .formations-liste a:hover {
  color: #707070;
}
/***Dernières news ***/
aside#sidebar .last-news {
}
aside#sidebar .last-news ul {
  margin: 10px;
}
aside#sidebar .last-news ul li {
  margin-bottom: 0.5rem;
  list-style-type: none;
}
aside#sidebar .last-news ul li a {
  font-size: 1.3rem;
  text-decoration: none;
  color: #315d91;
}
aside#sidebar .last-news ul li a:hover {
  color: #707070;
}
aside#sidebar .last-news ul li span.date {
  display: block;
  font-size: 1.1rem;
}

/*** Liste des polluants ***/
aside#sidebar .menupol-aside {
}
aside#sidebar .menupol-aside h5 {
  margin: 10px;
  font-size: 1.4rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #707070;
}
aside#sidebar .menupol-aside div.listpol-aside {
  column-count: 4;
  margin: 0 10px;
}
aside#sidebar .menupol-aside div.listpol-aside p {
  font-size: 1.3rem;
  margin-bottom: 0.5rem;
}
aside#sidebar .menupol-aside div.listpol-aside p a {
  color: #0657bb;
  text-decoration: none;
}
aside#sidebar .menupol-aside div.listpol-aside p a:hover {
  color: #707070;
}
/*** Newsletter ***/
aside#sidebar .newsletter {
}
aside#sidebar .newsletter p {
  margin: 10px;
  font-size: 1.3rem;
}
aside#sidebar .newsletter p a {
  text-decoration: none;
  color: #0657bb;
}
aside#sidebar .newsletter p a:hover {
  color: #707070;
}

/*** Liens directs ***/
aside#sidebar .direct-links {
}
aside#sidebar .direct-links ul {
  margin: 10px;
}
aside#sidebar .direct-links ul li {
  margin-bottom: 0.5rem;
  list-style-type: none;
}
aside#sidebar .direct-links ul li a {
  font-size: 1.3rem;
  text-decoration: none;
  color: #0657bb;
}
aside#sidebar .direct-links ul li a:hover {
  color: #707070;
}

/******************** Shorcode Ultimate ********************/
/*Spoiler*/
.su-spoiler-citepa {}
.su-spoiler-citepa > .su-spoiler-title {
  /*background-color: #63b9d8;
  color: #ffffff;
  font-size: 1.4rem;*/
}
.su-spoiler-citepa > .su-spoiler-title > .su-spoiler-icon {}
.su-spoiler-citepa > .su-spoiler-content {}
/*Bouton de téléchargement*/
.su-button-dl {
  margin-bottom: 20px;
  margin-right: 20px;
}
.su-button-dl > span {
  font-weight: 700;
}
/*Bouton de lien*/
.su-button-link {
  margin-bottom: 20px;
  margin-right: 20px;
}
.su-button-link > span {
  font-weight: 700;
}
/*Zone avec titre FR*/
.su-box-fr > .su-box-title {}
.su-box-fr > .su-box-content {
  background-color: rgba(118,146,60,0.25);
  color: #76923c;
}
.su-box-fr > .su-box-content > ul > li:before {
  content: "\2022";
  color: #76923c !important;
  font-weight: bold;
  display: inline-block;
  width: 1em;
}
/*Zone avec titre UE*/
.su-box-ue > .su-box-title {}
.su-box-ue > .su-box-content {
  background-color: rgba(227,108,10,0.25);
  color: #e36c0a;
}
.su-box-ue > .su-box-content > ul > li:before {
  content: "\2022";
  color: #e36c0a !important;
  font-weight: bold;
  display: inline-block;
  width: 1em;
}
/*Zone avec titre INT*/
.su-box-int > .su-box-title {}
.su-box-int > .su-box-content {
  background-color: rgba(112,48,160,0.25);
  color: #7030a0;
}
.su-box-int > .su-box-content > ul > li:before {
  content: "\2022";
  color: #7030a0 !important;
  font-weight: bold;
  display: inline-block;
  width: 1em;
}
/*Zone avec titre Citepa*/
.su-box-cit > .su-box-title {}
.su-box-cit > .su-box-content {
  background-color: rgba(54,95,145,0.25);
  color: #365f91;
}
.su-box-cit > .su-box-content > ul > li:before {
  content: "\2022";
  color: #365f91 !important;
  font-weight: bold;
  display: inline-block;
  width: 1em;
}

/*Zone sans titre INT*/
.su-note-int {}
/*Zone sans titre UE*/
.su-note-ue {}
/*Zone sans titre FR*/
.su-note-fr {}

/*Zone sans titre phrase support formation*/
.su-note-support-formation {}

/* Lien "Afficher plus" pour les blocs */
.su-expand-link a {
  font-size: 1.4rem;
  line-height: 2.2rem;
}

/****************************************/

/**** Boutons standardisés Citepa ****/
.button-dl {
  display: inline-block;
  padding: 2px 20px;
  border-radius: 7px;
  margin: 0 10px 20px 0;
  background-color: #5b90d6;
  color: #ffffff;
  line-height: 3.2rem;
  font-size: 1.6rem;
  font-weight: 700;
  text-decoration: none;
}

.button-link {
  display: inline-block;
  padding: 2px 20px;
  border-radius: 7px;
  margin: 0 10px 20px 0;
  background-color: #63b9d8;
  color: #ffffff;
  line-height: 3.2rem;
  font-size: 1.6rem;
  font-weight: 700;
  text-decoration: none;
}

.button-return {
  display: inline-block;
  padding: 2px 20px;
  border-radius: 7px;
  margin: 0 10px 20px 0;
  background-color: #b8d35d;
  color: #ffffff;
  line-height: 3.2rem;
  font-size: 1.6rem;
  font-weight: 700;
  text-decoration: none;
}

.button-return > img {
  margin-right: 10px;
}
.button-sidebar {
  display: block;
  text-align: center;
  margin: 10px 75px 20px 75px;
}
/********/

/**** Page confirmation inscription newsletter ****/
form#mailjetSubscriptionForm {
  margin: 0 10px;
}
form#mailjetSubscriptionForm input[type="email"] {
  width: 100%;
  background: #f7f7f7;
  margin: 10px 0 0 0;
  padding: 5px 10px;
  border: 1px solid #63b9d8;
  border-radius: 7px;
  font-size: 1.4rem;
}
form#mailjetSubscriptionForm input[type="email"]:focus {
  border-color: #b8d35d;
}
form#mailjetSubscriptionForm input[type="submit"] {
  font-family: "Source Sans Pro", sans-serif;
  display: inline-block;
  padding: 2px 20px;
  border-radius: 7px;
  margin: 0 100px 10px 100px;
  background-color: #5b90d6;
  color: #ffffff;
  line-height: 3.2rem;
  font-size: 1.6rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}
form#mailjetSubscriptionForm input[type="submit"]:hover {
  background: #1ca9c5;
}
span.mailjet_widget_form_message {
  display: block;
  margin: 5px 10px;
  font-size: 1.2rem;
  color: green;
}
/********/


/*main = 1280px -> grand écran d’ordinateur (21″ et + en plein écran )
/*main = 960px -> tablette en paysage, écran d’ordinateur de taille petite et moyenne
/*main = 480px -> smartphone en paysage, tablette en portrait et petite tablette en paysage
/*main = 375px -> smartphone en portrait
*/

@media screen and (max-width: 1300px) {
  div#mega-menu-wrap-h-menu {
    width: 960px;
  }
  main {
    width: 960px;
  }
  /* Frontpage */
  main #front-articles .front-cat {
    flex: 0 0 464px;
  }
  main #front-articles .front-cat .list-articles {
    display: block;
  }
  main #front-articles .front-cat .list-articles > article {
    margin-bottom: 30px;
  }
  main #front-articles .front-cat .list-articles > article > .meta {
    margin-bottom: 10px;
  }
  main #front-articles .front-cat .list-articles > article > h3 {
    height: 50px;
  }
  main #front-articles .front-cat .list-articles > article > .excerpt {
    height: 115px;
  }
  main #front-articles .front-cat .list-articles > article > a.read {
    font-size: 1.1rem;
    color: #707070;
    text-transform: uppercase;
    font-weight: bold;
    text-decoration: none;
  }
  main #front-articles .front-cat > a.more {
    float: right;
    margin: 0 20px 15px 0;
    padding: 5px 10px;
    border-radius: 20px;
    text-decoration: none;
    background-image: linear-gradient(to left, #1ca9c5, #5b90d6);
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
  }
  main #front-pres-main > .image {
    flex: 0 0 50%;
    margin-right: 25px;
  }
  main #front-pres-main > .image > img {
    width: 100%;
    height: auto;
  }
  main #front-pres-blocs {
    margin: 0 150px;
  }
  main #front-pres-blocs > .single {
    flex: 0 0 200px;
    margin-bottom: 40px;
  }
  main #front-pres-blocs > .single > img {
    width: 100%;
    height: auto;
  }
  main #front-pres-blocs > .single > h2 {
    height: 20px;
  }
  main #front-pres-blocs > .single > .text {
    height: 70px;
  }
  main
    article.single
    .content
    > div.data-complement
    div.data-complement-item
    p {
    font-size: 1.4rem;
  }
  .buttonsize5 {
    display: none;
  }
  .buttonsize3 {
    display: block;
  }
  .button-sidebar {
    margin: 10px 40px 20px 40px;
  }
  form#mailjetSubscriptionForm input[type="submit"] {
    margin: 0 40px 10px 40px;
  }
}

@media screen and (max-width: 979px) {
  .desktop {
    display: none;
  }
  header {
    height: 60px;
  }
  header > h1#title {
    display: none;
  }
  header #search {
    display: none;
  }
  nav#mobile {
    display: block;
    flex: 1 1;
  }
  div#mega-menu-wrap-h-menu {
    width: 100%;
  }
  header #contact {
    display: none;
  }
  header #lang {
    padding: 15px;
  }
  nav#desktop {
    display: none;
  }
  main {
    width: 624px;
  }
  /* Frontpage */
  main #front-articles .front-cat {
    flex: 0 0 624px;
  }
  main #front-articles .front-cat .list-articles {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    margin-bottom: 20px;
  }
  main #front-articles .front-cat .list-articles > article > h3 {
    height: 70px;
  }
  main #front-articles .front-cat .list-articles > article > .excerpt {
    height: 180px;
  }

  main #front-pres-main {
    margin-bottom: 60px;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    text-align: justify;
  }
  main #front-pres-main > .image {
    flex: 0 0 100%;
    margin: 0px;
  }
  main #front-pres-main > .image > img {
    width: 100%;
    height: auto;
  }
  main #front-pres-main > .text > h1 {
    margin-bottom: 30px;
    font-size: 1.8rem;
    color: #707070;
    text-transform: uppercase;
  }
  main #front-pres-main > .text > h1 > hr {
    width: 2%;
    border: 1px solid #707070;
    margin-top: 5px;
  }
  main #front-pres-main > .text > p {
    margin-bottom: 20px;
    font-size: 1.3rem;
    color: #707070;
  }
  main #front-pres-main > .text > a.more {
    float: left;
    padding: 5px 10px;
    border-radius: 20px;
    text-decoration: none;
    background-image: linear-gradient(to left, #1ca9c5, #5b90d6);
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
  }
  main #front-pres-blocs {
    margin: 0;
  }
  main #front-pres-blocs > .single {
    flex: 0 0 280px;
    margin-bottom: 40px;
  }
  main #front-pres-blocs > .single > h2 {
    height: 20px;
  }
  main #front-pres-blocs > .single > .text {
    height: 70px;
  }
  main article.single {
    flex-basis: 100%;
  }
  aside#sidebar {
    flex-basis: 100%;
    border: none;
    margin-bottom: 0;
  }
  aside#sidebar .share {
    text-align: left;
  }
  main article.single .content > div.data-complement div.data-complement-item {
    width: 48%;
    margin-bottom: 20px;
  }
  .buttonsize5 {
    display: block;
  }
  .buttonsize3 {
    display: none;
  }
  main #prestations {
    flex-basis: 100%;
  }
  main #actus-citepa {
    flex-basis: 100%;
  }
}

@media screen and (max-width: 644px) {
  main {
    width: 100%;
    padding: 0;
  }
  main #front-articles {
    margin: 20px 0;
  }
  main #front-articles h1 {
    padding: 0 10px;
  }
  main #front-articles .front-cat {
    flex: 0 0 100%;
  }
  main #front-articles .front-cat .list-articles {
    display: block;
  }
  main #front-articles .front-cat .list-articles > article > h3 {
    height: auto;
    margin-bottom: 10px;
  }
  main #front-articles .front-cat .list-articles > article > .excerpt {
    height: auto;
    margin-bottom: 10px;
  }
  main #front-articles .front-cat .list-articles > article > a.read {
    font-size: 1.6rem;
  }
  main #front-articles .front-cat > a.more {
    float: left;
    margin: 0 0 15px 20px;
    padding: 5px 10px;
    border-radius: 20px;
    text-decoration: none;
    background-image: linear-gradient(to left, #1ca9c5, #5b90d6);
    font-size: 1.2rem;
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
  }
  main #front-pres-main > .text {
    padding: 0 10px;
  }
  main #front-pres-blocs {
    justify-content: space-around;
  }
  main #front-pres-blocs > .single {
    flex: 0 0 45%;
    margin-bottom: 40px;
  }
  main #front-pres-blocs > .single > .text {
    height: 70px;
  }
  footer {
    flex-flow: wrap;
  }
  footer .col-left {
    flex: 100%;
    display: block;
    padding: 20px;
    order: 2;
  }
  footer .col-left > div {
    margin-bottom: 10px;
  }
  footer .col-right {
    order: 1;
    flex: 100%;
    display: block;
    background-image: linear-gradient(to right, #1ca9c5, #5b90d6);
    padding-top: 10px;
  }
  footer .col-right > div {
    display: block;
    text-align: left;
    padding: 0 20px 10px 20px;
  }
  main > h1 {
    padding: 0 10px;
  }
  main div.cat-description {
    padding: 0 10px;
  }
  main article.item {
    flex: 0 0 100%;
  }
  main article.item > .content {
    padding: 0 10px;
  }
  main article.single {
    padding: 0 10px;
  }
  main article.single .crp_related h4 {
    margin: 0 -10px;
  }
  .buttonsize5 {
    display: none;
  }
  .buttonsize3 {
    display: block;
  }
  main #actus-citepa,
  main #prestations {
    padding: 0 10px;
  }
  .team-member div.team-member-descr {
    margin-left: 0;
  }
  .cdl-meta {
    display: block;
  }
  .cdl-meta > ul > li {
    list-style-type: none;
    display: block;
  }
  .cdl-meta > ul > li:before {
    content: none;
    margin-left: 0;
    margin-right: 0;
  }
  .cdl-meta > ul.niveau > li {
    list-style-type: none;
    display: inline-block;
  }
}

@media screen and (max-width: 480px) {
  /* Faire quelque chose pour le formulaire de pré-inscription aux formations
  Il faut réduire les intitulés pour raccourcir le 1er champ de sélection
  */
  main article.single .content .wpcf7 form .ch textarea.wpcf7-textarea {
    width: 80%;
  }
}