body {background-color: #c5c5c5;}
body {background-image: linear-gradient(#eaeaea, #a5a5a5);}

/*
body {
	background-color: #e6ebe0;
	background-image: -moz-linear-gradient(45deg, #e6ebe0 15%, #5f4d93 85%);
	background-image: -webkit-linear-gradient(45deg, #e6ebe0 15%, #5f4d93 85%);
	background-image: -ms-linear-gradient(deg, #e6ebe0 15%, #5f4d93 85%);
	background-image: linear-gradient(#e6ebe0 15%, #414e32 85%);
}
*/

/* Titres */
h1.word_title {font-size: 2.5em; font-weight: bold;}
h2 {font-weight: bold; margin-top:1em;}


/* Liens */
a {
	text-decoration: none;
}
a, a:visited {color:#060; }

	a:hover {
		border-bottom-color: #ff8000;
		color: #ff8000 ;
	}

/* Paragraphes */
p,
.p,
ul,
ol,
dl,
dd,
blockquote,
address,
pre,
.table,
fieldset {
  margin-bottom: 1em;
}

ul ul {
    list-style-type: none;
}

/* Habillage des podcasts
-----------------------------------------*/

.podcast .titre_podcast {font-size: 1.5em; font-weight: normal; line-height: 1.2; margin: 5px 0;}
.podcast .info_podcast {margin: 5px 0; padding: 0px; line-height: 1.3; font-weight: bold; font-size: 0.9em; color:#333;}
.podcast .intro_podcast p {text-align: justify;}
.podcast .info_podcast .sep {font-weight: normal; color:#030; top: -5px;}
.podcast .tinyplayer .audio {margin: 5px 0 10px; padding: 0;}
.liens_podcast {font-size: 1em; text-align: right;}

.tinyplayer {display: flex; width: 100%;}
.tinyplayer .progress_bar{display: flex; background-color:red}
.tinyplayer .progress_bar .loading {
	background-color:transparent;
}

.tinyplayer .progress_bar .position {
	background-color: rgba(21, 29, 31, 1) ;
}


.tinyplayer .track {display : none;}
.tinyplayer .player_info {width : 100%; display: flex; align-items: center;}
.tinyplayer .timer {width: 100%; text-align: right;}






.podcast .texte_podcast p {font-size: 1em; margin: 5px 0;}

.podcast .texte_podcast a {display: block;}
.podcast .texte_podcast a,
.podcast .texte_podcast a:visited,
.podcast .texte_podcast a:hover,
.podcast .texte_podcast a:focus,#ecf4ec
.podcast .texte_podcast a:active {color:#000; text-decoration:none;}
.podcast .texte_podcast a:hover P.titre_podcast .titre,
.podcast .texte_podcast a:hover p.intro_podcast .suite {color:#FF8000;}


.podcast .texte_podcast .titre {font-size: 1.5em; font-weight: normal; line-height: 1.2; color:#060;}
.podcast .texte_podcast .format {padding:.5em; margin-bottom: 10px; margin: 0em; border-radius:.25em; background: #e6ebe0; color: #060; text-decoration: none; font-weight: bold; }
.podcast .texte_podcast .format {background: #060; color: #fff;}
.podcast .texte_podcast .intro_podcast {font-size:1em}
.podcast .texte_podcast .intro_podcast .suite {text-align: right; font-size: 1.3em; display:none;}

.texte_dvpt a {border-bottom: dotted 1px; }

.info_dvpt .themes ul li {font-size:1em;}

.info_dvpt .sharing {text-align: right;}
a.icon.alt {color: #040;}


@media screen and (max-width: 767px) {
	.podcast .texte_podcast .titre {font-size: 1.4em; }
	.podcast .texte_podcast .intro_podcast {font-size:1em; }
	.podcast .texte_podcast p.info_podcast {font-size: 0.9em;}
	.dvpt .texte_dvpt {font-size: 0.9em;}
	.liens_podcast {font-size: 1em; padding-right: 0; text-align: center;}
}



/* ARTICLES
----------------------------------------------------*/
.cartouche {text-align: left; font-size: 1.1em; margin-bottom: 1.5em;}
.cartouche p {margin-bottom:1em;}
.chapo {font-size:1.15em}
.entry-title {font-size:2em; line-height: 1; color:#060; margin-bottom: 0.5em; text-align: left;}


/* RECHERCHE, ARCHIVES, MOTS
-------------------------------------------------------*/
.cartouche .formulaire_archives,
.cartouche .resultats {text-align: left; font-size: 1.1em; }

h1.theme {display: inline-block; margin-bottom: 0; padding: 0 10px; color:#070;  border:2px solid #070;}

.cartouche .formulaire_recherche input.submit { width: 55px; height: 55px;}
.cartouche .formulaire_recherche input.text,
.cartouche .formulaire_recherche textarea {height: 55px;  max-width: 600px; border: 2px solid #e6ebe0; font-size: 1.8em; font-weight: bold; color: #e6ebe0; }


@media screen and (max-width: 767px) {
	.cartouche .formulaire_archives,
	.cartouche .resultats {font-size: 0.9em;}
	.cartouche .formulaire_recherche input.submit { width: 45px; height: 45px; }
	.cartouche .formulaire_recherche input.text,
	.cartouche .formulaire_recherche textarea {height: 45px;font-size: 1.5em;}
}

/* MENUS ET NAVS
----------------------------------------------------*/

/* Themes
------------------------------------*/
.themes li a {display: inline-block; text-decoration: none; color:#060 ; background: #FFF; padding: 0.20em 0.4em; margin: 0.15em 0; border-radius: 0.25em; border:2px solid #070;}
.themes li a:focus,
.themes li a:hover,
.themes li a:active  {color:#FF8000 ; border-color: #FF8000;}
/

@media screen and (max-width: 767px) {
	.themes {font-size:0.9em; display: inline; }
}

@media screen and (max-width: 540px) {
	.themes_article ul li {display: inline-block;}
}

/* Pagination et boutons
----------------------------------*/
.pagination a, .bouton-affichage { padding:.5em; margin: 0em; border-radius:.25em; border: 0;}
.pagination a, .bouton-affichage {color: #040; background: #e6ebe0; text-decoration: none; }
.pagination a:hover, .bouton-affichage:hover {background: #040;  color:#e6ebe0;}
.pagination .sep { visibility: hidden; }


@media screen and (max-width: 767px) {
	.menu_themes ul li {font-size: 0.9em;}
	.pagination {font-size: 0.9em;}
}

@media screen and (max-width: 540px) {
	/*.pagination .pages {display: none;}*/
}


/* formulaires
----------------------------------------------------*/
.formulaire_recherche { clear: both; margin: 0; padding: 0; text-align: right; }
.formulaire_recherche input.submit {background: url('images/loupe.svg') no-repeat center center #e6ebe0; background-size: 60%; color: transparent; border: 0; width: 40px; height: 40px; }
.formulaire_recherche input.text,
.formulaire_recherche textarea {height: 40px; border: 1px solid #e6ebe0; background-color: #FFF;}


.formulaire_archives {margin-top: 10px;}
.formulaire_archives .boutons {margin-bottom: 10px;}
.formulaire_archives .annees, .formulaire_archives .themes {display: none;}
input.checkbox-archives {display: none;}
label.bouton-annee,
label.bouton-theme {color: #060;}
label.bouton-annee:hover,
label.bouton-theme:hover {color: #ff8000;}
input.checkbox-archives:checked + .bouton-annee,
input.checkbox-archives:checked + .bouton-theme {color: #ff8000;}





/* MENU NAV
---------------------------------------------------*/
/*THEME: */


.page-nav a,
.page-nav .menu-entree a,
.page-nav .menu-entree span,
.page-nav-rfpp a {
  text-transform: uppercase;
  text-decoration: none;
  color: #000;
  cursor: pointer; }


  .page-nav,
  .page-nav-header  {
    height: 40px; }

.page-nav .menu-entree a,
.page-nav .menu-entree .texte_libre {
    padding: 8px 16px;
    display: block; }

    .page-nav-rfpp .lien-rfpp,
    .page-nav-header .lien-rfpp{
        padding: 7px 15px;
        display: inline-block; }

.page-nav .menu-entree .formulaire_recherche {
    padding: 0;
    display: block; }

    .page-nav li,
    .page-nav-rfpp a {
     text-decoration: none;
     text-align: left;
     transition: all ease 0.3s;
   }

@media screen and (max-width: 767px) {
   .page-nav .menu-entree a,
   .page-nav .menu-entree .texte_libre,
   .page-nav .menu-entree form
    {
       padding-left: 8px; padding-right: 8px;}
 }

 @media screen and (max-width: 540px) {
    .page-nav .menu-entree a,
    .page-nav .menu-entree .texte_libre,
    .page-nav .menu-entree form
     {
        padding-left: 16px; padding-right: 16px;}
  }

  /******* default light *******/




.page-nav-light,
.page-nav-light .sous-menu ul {
  background-color: #fff;
  color: #000; }

.page-nav-light .sous-menu > ul {
  border: 1px solid #e6ebe0;
  }

.page-nav-light .active,
.page-nav-light .menu-entree:hover {
  background-color: #e6ebe0;}

.menu-items__item_recherche:hover {
  background-color: transparent;}

.page-nav-rfpp .lien-rfpp,
.page-nav-header .lien-rfpp {
    border: solid 1px #FF8000;
    color:  #FF8000;}

.page-nav-rfpp:hover > a
{ background-color: #FF8000;
    color: #fff;}

@media screen and (max-width: 540px) {
    .page-nav {height: auto;}
    .page-nav-light .sous-menu > ul {border: 0;}
    .page-nav-light .sous-menu > ul li {border: 0; padding-left: 16px;}
  }


@media screen and (min-width: 767px) {
  .page-nav-light .menu-items__item_recherche .formulaire_recherche input.submit {background-color: #fff;}
  .page-nav-light .menu-items__item_recherche .formulaire_recherche input.text {display: none; min-width: 200px;}
  .page-nav-light .menu-items__item_recherche:hover .formulaire_recherche input.submit {background-color: #e6ebe0;}
  .page-nav-light .menu-items__item_recherche:hover .formulaire_recherche input.text { display: inline-block; }
  .page-nav-light .menu-items__item_recherche .formulaire_recherche input.text:focus { display: inline-block; }
  .page-nav-light .menu-items__item_recherche .formulaire_recherche input.text:focus ~ .submit {background-color: #e6ebe0;}
}





/*LAYOUT*/
.page-nav-wrap {
    width: 100%;
    padding: 10px 30px 10px 15px;
    display: flex;
    flex-direction: row; }

@media (max-width: 767px) {
     .page-nav-wrap {padding-left: 0px; padding-right: 15px;}
}



.page-nav-rfpp {
	margin-left: auto;
}





/* [ON THE BIG SCREEN] */
/* HAMBURGER ICON */
label.hamburger {
  display: inline-block;
  color: #000;
  font-size: 45px;
  margin-top: -20px;
  cursor: pointer;
}



.page-nav-header {
  /* Hide the hamburger icon */
  display: none;
}

.hamburger-checkbox {display: none;}

/* NAVIGATION BAR */

.page-nav ul {
  display: flex;
  flex-direction: row;
  margin: 0;
}



/* [ON THE SMALL SCREEN] */
@media only screen and (max-width: 540px) {

  .page-nav-wrap {
    margin-top: 16px;
      flex-direction: column;
        padding: 0;}


  /* Show hamburger icon */
  .page-nav-header {
    display: flex;
    margin: 0px 16px;
  }
  /* Collapse menu */
  .page-nav ul {
    flex-direction: column;
    width: 100%;
  }

.page-nav-header .lien-rfpp {margin-left: auto;}

  /* Show/hide menu on checkbox click */
  .page-nav {
    display: none;
  }
  .page-nav-wrap input:checked ~ .page-nav {
    display: flex;
  }

  .page-nav-rfpp {
    display: none;
  }
}

@media only screen and (min-width: 540px) {
.page-nav .sous-menu {position: relative; height: auto; min-height: 40px;}
.page-nav .sous-menu > ul {position: absolute; display: none; flex-flow: column; z-index: 1000; width: auto; white-space: nowrap;}
.page-nav .sous-menu:hover > ul {display: flex;}
}

/* Icon
---------------------------------------------------*/

/* socialshare */

.sharing .socialshare a:hover, .sharing .socialshare a:link, .sharing .socialshare a:focus, .sharing .socialshare a:active, .sharing .socialshare a:visited {
    color: #040;
    background-color: transparent;
}

.sharing .socialshare a:hover, .sharing .socialshare a:focus {
				background: #e6ebe0;
			}

.sharing .network_label {display: none;}

	ul.socialshare {
		color: #060;
		cursor: default;
		list-style: none;
		padding-left: 0;
	}

		ul.socialshare li {
			padding: 0 ;
			padding-bottom: 5px;
		}


			ul.socialshare li:last-child {
				padding-right: 0;
			}

				ul.socialshare li .icon:before {
					font-size: 1.1em;
				}


	.icon {
		text-decoration: none;
		-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
		transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
		border-bottom: none;
		position: relative;
	}

		.icon:before {
			display: inline-block;
			font-style: normal;
			font-variant: normal;
			line-height: 1;
			text-transform: none !important;
		}

		.icon:before {
			line-height: solid;
		}



		.icon > .label {
			display: none;
		}


	.icon.alt {
		display: inline-block;
		border: solid 1px;
		border-radius: 100%;
	}


	.icon.alt:before {
		display: block;
		font-size: 1.25em;
		width: 2em;
		height: 2em;
		text-align: center;
		line-height: 2em;
		}


		.icon.alt:hover,
		.icon.alt:active {
				background: #e6ebe0;
			}

@media screen and (max-width: 540px) {
	ul.socialshare li .icon:before {
					font-size: 1em;
				}
}
