@charset "UTF-8";
/* CSS Document */

.lessons_nav{  overflow:hidden; margin-top:6rem; border-top: solid 1px grey; padding-top:3rem; }

.lessons_nav ul, .lessons_nav li{list-style-type:none; padding:0; margin:0;}
.lessons_nav ul{display:flex; justify-content: space-between; gap:3rem;}
.lessons_nav ul.no_prev {justify-content: flex-end;}
.lessons_nav ul.no_next {justify-content: flex-start;}
.lessons_nav ul .next_lesson{ text-align:right;}
.lessons_nav ul a{display:flex; align-items:center; justify-content: space-between; color:white; text-decoration:none; background:#37058e; border-radius:5px; min-width:35rem; min-height:5rem; }
.lessons_nav ul a:hover{background:#b82792;}
.lessons_nav ul a strong{display:flex; justify-content:center; align-items:center; text-transform:uppercase; font-weight:normal; letter-spacing:.1em; font-size:.8em;  font-size:0; text-indent:-9000px; background:rgba(250, 250, 250, .3); width:3rem; align-self:stretch; transition:all .2s;}
.lessons_nav ul a span{padding:.5rem 2rem; font-weignt:normal; font-size:.9em; }
.next_lesson a strong:after, .prev_lesson a strong:before{font-family: "dashicons"; text-indent:0; font-size:2rem; text-align:center; color:#37058e;}
.next_lesson a:hover strong:after, .prev_lesson a:hover strong:before{color:#b82792;  transition:all .4s;}
.next_lesson a:hover strong, .prev_lesson a:hover strong{transform:scaleX(1.2); transition:all .1s;}

.next_lesson a strong:after{content: "\f345"; }
.prev_lesson a strong:before{content: "\f341";  }
.next_lesson a{ flex-direction:row-reverse;}


@media screen and (max-width: 782px){
	.lessons_nav ul a{min-width:40vw; }
	.lessons_nav ul a:after{content:"Suivant"; padding:.5rem 2rem; font-weignt:normal; font-size:.9em;}
	.lessons_nav ul .prev_lesson a:after{content:"Précédent"; }
	.lessons_nav ul a span{display:none;}
	.lessons_nav ul a strong{opacity:1;}
}