/************************************/
/*             HEADER               */
/************************************/

header {
	width: 100%;
	top: 0;
    z-index: 2000;
}
header .line1 {
    background-color: #00213b;
    transition: all 0.3s ease-out;
    padding: 30px 0;
}
header .line1 .top_content {
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
header .logo {
    width: 230px;
}
header .logo img {
	height: auto;
    width: 100%;
}
header .centre {
    flex: 1;
    display: grid;
    place-items: center;
}
.header_search, .search_result {
	position: relative;
    width: 70%;
}
.searchResult{
    padding: 5px;
    background-color: #FFF;
    position: absolute;
    margin-left:-10%;
    border:1px solid silver;
    display: none;
    z-index: 1500;    
}
.header_search input {
	width: 100%;
	padding: 5px;
	padding-left: 20px;
	padding-right: 40px;
	border-radius: 40px !important;
	height: 40px;
	background-color: rgba(255,255,255,0.15);
	border: 0;
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
    color: #fff;
    font-weight: 300;
	outline: none;
	margin: 0 !important;
}
.header_search form {
	position: relative;
}
.header_search input::placeholder {
	color: #fff;
	font-family: 'Ubuntu', sans-serif;
	font-style: italic;
	font-size: 20px;
	font-weight: 300;
    opacity: .7;
}
.header_search .btn {
	position: absolute;
	right: 0;
	top: 0;
    width: 40px;
	height: 100%;
    background-color: rgba(0,0,0,0);
    border-radius: 100px;
	background-image: url("../icons/header/search.svg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 60%; 
}
.RechResult legend {
    font-size: 16px;
    font-weight: bold;
    color: #ee5622;
}
.RechResult ul{
    list-style-type: none;
    padding:0;
    padding-left: 5px;
}
.RechResult p {
    font-size: 10px;
    text-align: center;
    color: brown;
    margin: 0;
}
.RechResult ul li{
    font-size: 13px;
    margin: 2px;
    padding: 2px;
    border-bottom: 1px solid silver;
}
#quicksearch ul{
    list-style-type: none;
}
#quicksearch ul li{
    border-bottom: 1px solid silver;
    padding:5px;
}
#quicksearch ul li:hover{
    background-color: #000;
    color: #fff;
}
#quicksearch ul li *{
    display:inline-block;
    margin-left: 10px;
    max-width: 80%;
    vertical-align: top;
}
header .status {
    text-align: right;
}
header .status .login {
    position: relative;
}
header .status .login .text {
    position: absolute;
    color: #fff;
    font-size: 11px;
    font-weight: 300;
    width: auto;
    top: 120%;
	left: 50%;
    transform: translateX(-50%);
	text-align: center;
	display: block;
	white-space: nowrap;
}
header .status .panier {
    position: relative;
}
header .status .panier .compte {
    position: absolute;
    background-color: #ee5622;
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    width: 20px;
    height: 20px;
    line-height: 20px;
    right: -10px;
    top: -2px;
    text-align: center;
    border-radius: 100px;
}
header .status div {
    display: inline-block;
    padding: 0 3px;
}
header .status img {
    height: 30px;
    width: auto;
    cursor: pointer;
}





@media only screen and (max-width : 1200px) {

}

@media only screen and (max-width : 992px) {
    .header_search, .search_result {
        width: 80%;
    }
    header .logo {
        width: 150px;
		margin-top: 10px;
    }
    header .status img {
        height: 22px;
    }
    header .status div {
        
    }
    header .status .login .text {

    }
}

@media only screen and (max-width : 768px) {
    header .line1 {
        padding: 12px 0;
    }
    .centre .header_search, .centre .search_result {
        display: none;
    }
    header .mobile_search {
        display: block;
    }
    header .status .mobile_search_icon {
        display: inline-block;
    }
    header .mobile_search .header_search {
        width: 100%;
    }
    header .status .login .text {
        display: block;
    }
    header .mobile_search .searchResult{
        margin-left:3%;
        width:98%;
    }

}

@media only screen and (max-width : 576px) {

}





/************************************/
/*              Menu                */
/************************************/

header .line2 {
	height: 34px;
    background-color: #00213b;
	border-top: 1px solid rgba(238,86,34,0.7);
    position: relative;
}
nav {
    height: 100%;
    position: relative;
    z-index: 1000;
}
nav .menu {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    padding: 0;
    line-height: 100%;
    display: inline-block;
	color: #fff;
}
nav .menu_item {
    font-family: 'Ubuntu', sans-serif;
    color: #fff;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 16px;
    padding: 0;
    cursor: pointer;
    display: inline-block;
    user-select: none;
}
nav .tiret {
    font-family: 'Ubuntu', sans-serif;
    color: #fff;
    font-weight: 100;
    font-size: 16px;
    opacity: 0.7;
    padding: 0 15px;
}

nav .catalogue_btn_desktop {
    
}
nav .catalogue_btn_desktop::before {
    content: url("../icons/arrow_menu.svg");
	display: inline-block;
	width: 12px;
	height: auto;
	margin-right: 5px;
}
nav .rounded_tabs {
	position: absolute;
    right: 10px;
	bottom: 0px;
	display: flex;
	background-color: #00213b;
	padding: 0 2px;
	cursor: pointer;
}
nav .rounded_tabs .tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	font-size: 16px;
	font-weight: 500;
	text-transform: uppercase;
	min-height: 40px;
	padding: 8px;
    transition: all 0.2s ease-out;
	align-self: flex-end;
}
nav .rounded_tabs span {
	margin-right: 7px;
}
nav .rounded_tabs .newsletter_tab {
	background-color: #ffbc42;
	color: #000;
}
nav .rounded_tabs .newsletter_tab::after {
	content: url("../icons/header/newsletter.svg");
	display: inline-block;
	width: 20px;
	height: auto;
}
nav .rounded_tabs .agenda_tab {
	background-color: #8f2d56;
	color: #fff;
	margin-left: 5px;
}
nav .rounded_tabs .agenda_tab::after {
	content: url("../icons/header/agenda.svg");
	display: inline-block;
	width: 20px;
	height: auto;
}

nav .rounded_tabs .tab:hover {
	padding-bottom: 15px;
}





/*  Menu burger  */
.menu_burger {
    width: 30px;
    height: 20px;
    background-image: url("../icons/menu_burger.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain; 
    cursor: pointer;
    display: none;
	margin-right: 5px;
}
.close {
    background-image: url("../icons/arrow_back.svg");
}
header .mobile_search {
    display: none;
}




@media only screen and (max-width : 1200px) {
	header .line2 {
		
	}
	nav .rounded_tabs {
		right: 0px;
		bottom: 0px;
	}
   nav .rounded_tabs span {
		display: none;
	}
	nav .rounded_tabs .tab {
		min-height: 10px;
		align-content: center;
		justify-content: center;
		padding: 3px 10px;
		padding-top: 6px;
	}
	nav .rounded_tabs .tab:hover {
		padding-bottom: 8px;
	}
	nav .rounded_tabs .newsletter_tab::after {
		width: 24px;
	}
	nav .rounded_tabs .agenda_tab::after {
		width: 24px;
	}

}
@media only screen and (max-width : 992px) {
   nav .rounded_tabs .tab {
		min-height: 10px;
		align-content: center;
		justify-content: center;
	}
}
@media only screen and (max-width : 768px) {
	header .line2 {
		height: auto;
		padding: 0px;
		border-top: 0px;
	}
	header .line2 .container {
		padding: 0 5px;
	}
	.mobile_line {
		display: flex;
		width: 100%;
		align-items: center;
		justify-content: space-between;
		height: auto;
		padding: 0;
		padding-top: 0px;
		padding-bottom: 6px;
		margin: 0;
	}
	.menu_burger {
        display: block;
    }
	header .mobile_search {
		width: 100%;
		display: inline-block;
	}
	header .mobile_search .header_search input {
		height: 35px;
		font-size: 16px;
		padding: 5px;
		padding-left: 10px;
		border-radius: 35px !important;
	}
	.header_search input::placeholder {
		font-size: 18px;
	}
	nav .rounded_tabs {
		right: 0;
		bottom: 0;
		position: relative;
	}
	nav .rounded_tabs .tab {
		padding: 0;
		height: 30px;
		min-height: 30px;
		width: 34px;
		line-height: 0px;
		border-radius: 4px;
		align-content: center;
		justify-content: center;
		margin-left: 6px;
	}
	nav .rounded_tabs .newsletter_tab::after {
		width: 22px;
	}
	nav .rounded_tabs .agenda_tab::after {
		width: 22px;
	}
	nav .rounded_tabs .tab:hover {
		padding-bottom: 0px;
	}
}




nav .pictos {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
}
nav .pictos img {
    height: 22px;
    width: auto;
    display: inline-block;
    margin-left: 10px;
}
nav .roll {
    opacity: 1;
    transition: opacity 0.2s ease-out;
    cursor: pointer;
}
nav .roll:hover {
    opacity: 0.7;
}



@media only screen and (max-width : 992px) {
   nav .menu_item {
        font-size: 13px;
    }
    nav .tiret {
        font-size: 14px;
        padding: 0 7px;
    }
    nav .pictos img {
        height: 20px;
        margin-left: 7px;
    }
}
@media only screen and (max-width : 768px) {
    nav .tiret {
        display: none;
    }
    nav .menu {
        background-color: #00213b;
		border-top: 1px solid rgba(238,86,34,0.7);
		/*ici*/
        left: 0px;
        top: 30px;
        width: 100%;
        transform: translateY(0);
        padding: 15px;
        padding-top: 10px;
        padding-bottom: 20px;
        margin-left: -100%;
        margin-top: 10px;
        display: block;
        height: auto;
		z-index: -1000;
    }
    nav .menu_item {
        display: block;
        padding: 8px 0;
        font-size: 18px;
    }
}

@media only screen and (max-width : 576px) {

}


nav .catalogue_btn_desktop {
    display: inline-block;
    color: #fff;
}
nav .catalogue_mobile {
    display: none;
    color: #fff;
}
@media only screen and (max-width : 768px) {
    nav .catalogue_btn_desktop {
        display: none;
    }
    nav .catalogue_mobile {
        display: block;
    }  
}



/*********************************************/
/*             Catalogue Desktop             */
/*********************************************/

.catalogue_volet {
    background-color: #fff;
    height: auto;
    box-shadow: 0px 5px 10px rgba(0,0,0,.1);
    padding: 20px 0;
    position: absolute;
    width: 100%;
    display: none;
    z-index: 2000;
}
.catalogue_desktop {
    position: relative;
    width: 100%;
    background-color: #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.catalogue_desktop .block {
    flex: 1 25%;
    border-left: 1px solid #bfbfc1;
    padding-left: 20px;
}
.catalogue_desktop .block:first-child {
    border-left: 0;
    padding-left: 0;
}
.catalogue h1 {
    color: #ee5622;
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    padding: 0;
}
.catalogue ul, .catalogue li {
    list-style-type: none;
    margin: 0;
    padding-left: 0;
    font-size: 16px;
    line-height: 100%;
	font-weight: 400;
}
.catalogue ul {
    padding: 5px 0;
}
.catalogue li {
    padding: 5px 0;
}
.catalogue li li {
    padding-left: 20px;
}
.catalogue .caret {
    cursor: pointer;
    user-select: none;
}
.caret::before {
    font-family: "FontAwesome";
    content: "\f0da";
    color: #ee5622;
    display: inline-block;
    margin-right: 8px;
    font-size: 16px;
}
.caret-down::before {
    transform: rotate(90deg);  
}    
.catalogue .nested {
    display: none;
}
.catalogue .active {
    display: block;
} 
.catalogue_desktop a {
    color: #000;
} 
.catalogue li a:hover {
  color: #ee5622;
  text-decoration: underline;
} 
.catalogue li a::before {
    font-family: "FontAwesome";
    content: "\fas";
    color: #ee5622;
    display: inline-block;
    margin-right: 8px;
    font-size: 8px;
}
ul#sub_cat{
    list-style-type: none;
}
li.sub_cat{
    margin: 2px;
}
.sub_cat a::before{
    font-family: "FontAwesome";
    content: "\f0da";
    color: #ee5622;
    display: inline-block;
    margin-right: 8px;
    font-size: 16px;
}
.sub_cat a {
	
}
.sub_cat a:hover{
    text-decoration: underline;
    color: #ee5622;
}

#MenuFaq li a{
     text-decoration: underline;
}
#MenuFaq li a:hover{
     text-decoration: none;
 	 color: #ee5622;
}

/*********************************************/
/*             Catalogue Mobile              */
/*********************************************/

.catalogue_mobile .catalogue {
    width: 100%;
    color: #fff;
    font-size: 16px;
    line-height: 150%;
    display: none;
    margin-bottom: 20px;
    padding: 0 15px;
}
.catalogue_mobile .block {
    display: block;
}
.catalogue h4 {
    color: #ee5622;
    font-size: 16px;
    font-weight: 600;
    margin: 0;
    padding: 0;
    line-height: 150%;
}
.catalogue h4 a {
    color: #ee5622;
}
.catalogue h4 a:hover {
    text-decoration: underline;
}
.catalogue_mobile ul, .catalogue_mobile li {
    list-style-type: none;
    margin: 0;
    padding-left: 0;
    font-size: 16px;
    line-height: 100%;
	font-weight: 400;
}
.catalogue_mobile ul {
    padding: 5px 0 !important
}
.catalogue_mobile li {
    padding: 5px 0 !important
}
.catalogue_mobile li li {
    padding-left: 20px !important
}
.catalogue .caret {
    cursor: pointer;
    user-select: none;
}
.catalogue_mobile .catalogue .caret::before {
    color: #ee5622;
}
.catalogue .caret::before {
    font-family: "FontAwesome";
    content: "\f0da";
    color: #000;
    display: inline-block;
    margin-right: 8px;
    font-size: 16px;
}
.catalogue .caret-down::before {
    transform: rotate(90deg);  
}    
.catalogue .nested {
    display: none;
}
.catalogue .active {
    display: block;
} 
.catalogue_mobile a {
    color: #fff;
} 
.catalogue_mobile li a:hover {
    color: #fff;
    text-decoration: none;
} 
.catalogue_mobile h4 a {
    color: #ee5622;
} 
.catalogue li a::before {
    font-family: "FontAwesome";
    content: "\f061";
    color: #ee5622;
    display: inline-block;
    margin-right: 8px;
    font-size: 12px;
}


/************************************/
/*            FOOTER                */
/************************************/

footer {
    width: 100%;
    height: auto;
    background-color: #00213b;
	padding: 30px 0;
	flex-wrap: wrap;
    margin-top: 50px;
}
footer .container {
    padding: 0 100px;
	padding-top: 20px;
	padding-bottom: 50px;
}
.footer_top {
	display: flex;
	border-bottom: 1px solid rgba(255,255,255,0.3);
	padding-bottom: 50px;
}
.footer_logo {
	width: 50%;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding-top: 20px;
}
.footer_logo .logo {
	display: inline-block;
}
.footer_logo img {
	max-width: 360px;
	height: auto;
}
.footer_social_links {
}
.footer_social_links .ligne {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin-bottom: 6px;
}
.footer_social_links .ligne .titre {
	color: #fff;
	font-size: 20px;
	font-weight: 400;
	white-space: nowrap;
	width: 250px;
	text-align: right;
	padding-right: 10px;
}
.footer_social_links .ligne .pictos {
	width: 50%;
	flex-wrap: nowrap;
}
.footer_social_links .ligne .footer_ico {
	width: 30px;
	height: 30px;
	display: inline-block;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center center;
	margin-right: 5px;
	transition: all 0.2s ease-out;
}
.footer_social_links .ligne .pictos .footer_ico:hover {
	transform: scale(1.4);
	box-shadow: 0px 0px 12px rgba(0,0,0,.5);
}
.footer_ico.instagram {
	background-image: url("../icons/footer/instagram.svg");
}
.footer_ico.facebook {
	background-image: url("../icons/footer/facebook.svg");
}
.footer_ico.tiktok {
	background-image: url("../icons/footer/tik-tok.svg");
}
.footer_ico.youtube {
	background-image: url("../icons/footer/youtube.svg");
}
.footer_ico.twitter {
	background-image: url("../icons/footer/twitter.svg");
}
.footer_ico.linkedin {
	background-image: url("../icons/footer/linkedin.svg");
}
.footer_ico.website {
	background-image: url("../icons/footer/dribbble.svg");
}
.footer_ico.pinterset {
	background-image: url("../icons/footer/pinterest.svg");
}


@media only screen and (max-width : 992px) {
	footer .container {
		padding: 20px;
		padding-top: 10px;
		padding-bottom: 20px;
		margin-top: auto;
	}
	.footer_top {
		flex-direction: column;
		padding-bottom: 20px;
	}
	.footer_logo {
		width: 100%;
		display: flex;
		align-items: flex-start;
		justify-content: center;
		padding-top: 0;
		padding-bottom: 40px;
	}
	.footer_logo img {
		max-width: 250px;
	}
	.footer_social_links {
		display: inline-block;
		margin: 0 auto;
	}
	.footer_social_links .ligne .titre {
		font-size: 16px;
	}
	.footer_social_links .ligne .footer_ico {
		width: 24px;
		height: 24px;
		margin-right: 3px;
	}
	
}


.footer_bottom {
	display: flex;
}

.footer_bottom .colonne {
	padding: 40px;
	width: 33%;
}

.footer_bottom .colonne .titre {
	color: #ee5622;
	font-size: 26px;
	font-weight: 600;
	padding-bottom: 5px;
}
.footer_bottom .colonne a {
	color: #fff;
	font-size: 18px;
	font-weight: 400;
	display: block;
	padding-bottom: 5px;
}
.footer_bottom .colonne a:hover {
	text-decoration: underline;
}



@media only screen and (max-width : 992px) {
	.footer_bottom {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding-top: 20px;
	}
	.footer_bottom .colonne {
		padding: 0;
		padding-bottom: 18px;
		width: 100%;
		text-align: center;
	}
	.footer_bottom .colonne .titre {
		font-size: 20px;
	}
	.footer_bottom .colonne a {
		font-size: 16px;
		display: block;
		padding-bottom: 3px;
	}
}




/************************************/
/*             GENERAL              */
/************************************/


/* ---FONTS--- */

@font-face {
    font-family: 'optimabold';
    src: url('../fonts/Optima/optima_bold-webfont.woff2') format('woff2'),
         url('../fonts/Optima/optima_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}



@media (min-width: 1700px) {
  .container {
    min-width: 1380px;
  }
}
@media only screen and (max-width : 768px) {
    .container {
        min-width: 100%;
    }
}
body {
    background-color: #fff;
    padding: 0;
    margin: 0 auto;
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
	justify-content: space-between;
	overflow-x: hidden;
}
html {
    min-height: 100%;
}

a, a:focus, a:active, a:visited {
	outline : none;
	color: inherit;
	text-decoration: none;
}
a:hover{
	text-decoration: none;
	color: inherit;
}

div {
}
strong {
}

* {
    box-sizing: border-box;
}

@media (min-width: 1500px) {
  .container {
    min-width: 1380px;
  }
}
@media only screen and (max-width : 768px) {
    .container {
        min-width: 100%;
    }
    .no_mob, .zoomContainer, .zoomLens{
        display:none;
    }
    .zoomContainer{
        display:none;
    }
    .zoomLens{
        display:none;
    }
}
.move {
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
h1 {
	font-family: 'optimabold', sans-serif;
    color: #000;
    font-size: 34px;
    font-weight: normal;
    margin: 0;
    padding: 0;
}
h2 {
	font-family: 'optimabold', sans-serif;
    color: #000;
    font-size: 34px;
    margin-bottom: 20px;
	font-weight: normal;
}
h3 {
	font-size: 18px;
	color: #000;
}
h2 .light {
    font-weight: 100;
}
h2 .text_norm {
    color: #000;
    font-size: 16px;
}
@media only screen and (max-width : 768px) {
    h2 {
        font-size: 26px;
        padding-left: 0px;
        margin-bottom: 0px;
		font-weight: normal;
		text-align: center;
    }
}
h3 {
    color: #000;
    font-size: 18px;
    font-weight: 600;
    padding: 2px 0;
    margin: 0;
    line-height: normal;
}
h3.orange {
    color: #ee5622;
    font-size: 20px;
    font-weight: 600;
    margin: 0;
    line-height: normal;
}
.torange {
    color: #ee5622;
}
.titre h2 {
    color: #000;
    font-size: 20px;
    margin: 0;
    padding: 0;
}
p.auteur {
    color: #000;
    font-size: 16px;
    font-weight: 100;
    padding: 2px 0;
    margin: 0;
    font-style: italic;
}
p.prix {
    color: #ee5622;
    font-size: 18px;
    font-weight: 600;
    padding: 2px 0;
    margin: 0;
}
.Bold{
    font-weight: bold;
    margin-right: 3px;
}
/*  Fil d'ariane  */
.fil_ariane {
    font-size: 16px;
    color: #000;
    padding: 30px 0;
}
.fil_ariane a {
    color: #ee5622; 
    text-decoration: underline;
}
@media only screen and (max-width : 768px) {
    .fil_ariane {
        font-size: 14px;
        padding: 20px 0;
    }
}

.filet {
    width: 100%;
    height: 1px;
    background-color: #afb2b9;
}


/*  Liens avec picto  */
.fas {
    color: #ee5622; 
    margin-right: 3px;
    display: inline-block;
    font-size: 1.2em;    
}
.lien_ico {
    color: #000;
	transition: color 0.1s ease-out;
    vertical-align: middle;
	font-weight: 500;
}
.lien_ico i {
    color: #ee5622; 
    margin-right: 3px;
    display: inline-block;
    font-size: 1.2em;
}
.lien_ico:hover {
    color: #ee5622;
}
.lien_orange {
    color: #ee5622;
    font-size: 16px;
    font-weight: 500;
}
.lien_orange:hover {
    color: #ee5622; 
    text-decoration: underline;
}
.lien_tiret {
    display: inline-block;
    width: 1px;
    height: 11px;
    background-color: #000;
    margin: 0 10px;
}

.font-weight-bold {
	font-weight: 600;
}

.fontsize14 {
    font-size: 14px;
}
.fontsize15 {
    font-size: 15px;
}
.fontsize16 {
   font-size: 16px; 
}
.fontsize17 {
    font-size: 17px;
}
.fontsize18 {
   font-size: 18px; 
}
.fontsize19 {
    font-size: 19px;
}
.fontsize20 {
   font-size: 20px; 
}


/************************************/
/*            Boutons               */
/************************************/

.btn_simple {
	font-size: 22px;
	font-weight: 600;
	position: relative;
	padding-left: 30px;
	height: auto;
	width: auto;
	display: inline-block;
	color: #000;
}
.btn_simple:before {
	content: "";
	position: absolute;
	background-image: url("../icons/arrow_btn.svg");
    background-repeat: no-repeat;
    background-position: right top;
    background-size: auto 100%;
    overflow: hidden;
	transition: all 0.2s ease-out;
	width: 24px;
	height: 20px;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.btn_simple:hover:before  {
    background-position: left top;
}


@media only screen and (max-width : 992px) {
    .btn_simple {
		font-size: 20px;
		padding-left: 24px;
	}
	.btn_simple:before {
		width: 20px;
		height: 16px;
	}
}


.round_btn {
	display: inline-block;
	background-color: #00213b;
	color: #fff;
	font-size: 22px;
	border-radius: 50px;
	padding: 10px 20px;
	padding-left: 50px;
	padding-right: 30px;
	font-weight: 400;
	position: relative;
	transition: all 0.3s ease-out;
    cursor: pointer;
    user-select: none;
}
.round_btn:before {
    content: "";
	position: absolute;
	background-image: url("../icons/arrow_btn.svg");
    background-repeat: no-repeat;
    background-position: right top;
    background-size: auto 100%;
    overflow: hidden;
	transition: all 0.2s ease-out;
	width: 24px;
	height: 20px;
	top: 50%;
	transform: translateY(-50%);
	left: 15px;
}
.round_btn:hover {
	box-shadow: 0px 0px 10px rgba(0,0,0,.4);
	color: #fff;
}
.round_btn:hover:before {
	background-position: left top;
}

.round_btn:visited {
	color: #fff;
}


.btn_alert_agenda {
	background-color: #8f2d56;
	color: #fff;
	font-size: 20px;
	border-radius: 50px;
	padding: 12px 22px;
	padding-left: 50px;
	padding-right: 20px;
	font-weight: 400;
	position: relative;
	transition: all 0.3s ease-out;
    cursor: pointer;
    user-select: none;
	display: inline-block;
    margin-bottom: 20px;
}


.btn_alert_agenda:after {
	position: absolute;
    content: "";
	background-image: url("../icons/ico_agenda_white.svg");
    background-repeat: no-repeat;
	background-position: right top;
    background-size: auto 100%;
	transition: all 0.2s ease-out;
	top: 50%;
	left: 12px;
	transform: translateY(-50%) rotate(-10deg);
	width: 28px;
	height: 28px;
	animation: alert_shake ease-in-out 2.5s infinite alternate;
	background-color: #8f2d56;
}

.btn_alert_agenda:before {
    content: "";
	position: absolute;
	background-image: url("../icons/arrow_white.svg");
    background-repeat: no-repeat;
    background-position: right top;
    background-size: auto 100%;
    overflow: hidden;
	transition: all 0.2s ease-out;
	width: 24px;
	height: 20px;
	top: 50%;
	transform: translateY(-50%) rotate(90deg);
	left: 17px;
}

.btn_alert_agenda:hover {
	box-shadow: 0px 0px 10px rgba(0,0,0,.2);
}

.btn_alert_agenda:hover:after {
	display: none;
}
.btn_alert_agenda:hover:before {
	background-position: left top;
}
.btn_alert_agenda:visited {
	color: #fff;
}


.btn_alert_agenda.active:after {
	display: none;
}
.btn_alert_agenda.active:before {
	transform: translateY(-50%) rotate(-90deg);
}
.btn_alert_agenda.active:hover:after {
	display: none;
}
.btn_alert_agenda.active:hover:before {
	background-position: left top;
}

@keyframes alert_shake {
    0% {
        background-size: auto 100%;
    }
    5% {
        background-size: 0px;
    }
    10% {
       background-size: auto 100%;
	}	
    15% {
        background-size: 0px;
	}	
    20% {
        background-size: auto 100%;
    }
}


.croix.round_btn::after {
    background-image: url(../icons/croix.png);
    background-repeat: no-repeat;
    background-size: auto 40%;
    background-position: center center;
    -webkit-transition: all 0.1s ease-out;
	-moz-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}
.croix.round_btn:hover:after {
	background-size: auto 30%;
}

.small_btn {
	display: inline-block;
	background-color: #00213b;
	border-radius: 100px;
	color: #fff;
	font-size: 16px;
    height: 40px;
    padding: 0 18px;
    padding-left: 40px;
    line-height: 40px;
	position: relative;
	transition: all 0.2s ease-out;
    cursor: pointer;
    user-select: none;
    font-weight: 400;
}
.small_btn i {
    height : 30px;
    width: 30px;
    border-radius: 50px;
    position: absolute;
    text-align: center;
    line-height: 30px;
    left: 5px;
    top: 5px;
    font-size: 18px;
    color: #ee5622;
}
.small_btn:hover {
	box-shadow: 0px 0px 10px rgba(0,0,0,.2);
	color: #fff;
}

.btn_panier {
	display: inline-block;
	background-color: #00213b;
	border-radius: 100px;
	color: #fff;
	font-size: 16px;
    height: 40px;
    padding: 0 20px;
    padding-left: 44px;
    line-height: 40px;
	position: relative;
	transition: all 0.2s ease-out;
    cursor: pointer;
    user-select: none;
    font-weight: 400;
	white-space: nowrap;
}
.btn_panier:before {
    content: "";
	position: absolute;
	background-image: url("../icons/panier.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 100%;
    overflow: hidden;
	transition: all 0.2s ease-out;
	width: 22px;
	height: 22px;
	top: 50%;
	transform: translateY(-50%);
	left: 16px;
}
.btn_panier:hover {
	box-shadow: 0px 0px 10px rgba(0,0,0,.2);
	color: #fff;
	transform: scale(1.05);
}
.btn_panier:hover:before {
	animation: panier_shake ease-in-out 3s infinite alternate;
}

@keyframes panier_shake {
    0% {
        transform: translateY(-50%) rotate(20deg);
    }
    5% {
        transform: translateY(-50%) rotate(-20deg);
    }
    10% {
       transform: translateY(-50%) rotate(15deg);
	}
	15% {
       transform: translateY(-50%) rotate(-10deg);
	}
	20% {
       transform: translateY(-50%) rotate(0deg);
	}
}
.btn_panier:visited {
	color: #fff;
}

.demande_par_email {
	padding: 40px;
	padding-top: 10px;
}
.AskMail {
	background-image: url("../icons/ico_email_orange.svg");
	background-repeat: no-repeat;
	padding-left: 30px;
}

.bientot_dispo {
    display: inline-block;
	border-radius: 100px;
	color: #00213b;
	font-size: 16px;
    height: 40px;
    padding: 0 20px;
    line-height: 40px;
	position: relative;
	transition: all 0.2s ease-out;
    font-weight: 500;
	border: 1px solid #00213b;
}
.big_btn_panier {
	display: inline-block;
	background-color: #00213b;
	color: #fff;
	font-size: 20px;
	border-radius: 100px;
	padding: 10px 20px;
	padding-left: 50px;
	padding-right: 30px;
	font-weight: 400;
	position: relative;
	transition: all 0.2s ease-out;
    cursor: pointer;
    user-select: none;
	transform: scale(0.9);
}
.big_btn_panier:before {
    content: "";
	position: absolute;
	background-image: url("../icons/panier.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 100%;
    overflow: hidden;
	transition: all 0.2s ease-out;
	width: 22px;
	height: 22px;
	top: 50%;
	transform: translateY(-50%);
	left: 16px;
}
.big_btn_panier:hover {
	box-shadow: 0px 0px 10px rgba(0,0,0,.2);
	color: #fff;
	transform: scale(1.03);
}
.big_btn_panier:hover:before {
	animation: panier_shake ease-in-out 3s infinite alternate;
}

.big_btn_panier:visited {
	color: #fff;
}


/************************************/
/*              MAIN                */
/************************************/

main {
	margin-bottom: 20px;
}
@media only screen and (max-width : 992px) {
	
}



/************************************/
/*            Homepage              */
/************************************/

.homepage {
	background-image: url("../img/textures/gradient_bckgrnd.jpg");
	background-repeat: repeat-x;
}

/*  Nouveautés  */

.nouveautes {
	margin-top: 60px;
}
.nouveautes .container {
	position: relative;
}
.nouveautes h2 {
    padding-left: 0px;
	margin-bottom: 10px;
}
@media only screen and (max-width : 768px) {
	.nouveautes h2 {
		padding-left: 0px;
	}
}
.bloc_3_cols a {
	margin : 0;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	padding: 0px;
	padding-top: 0px;
}
.bloc_3_cols .item {
	width: 31%;
	padding: 0;
	aspect-ratio: 6/4;
	margin: 1%;
	display: flex;
    transition: all 0.20s ease-out;
	cursor: pointer;
	overflow: hidden;
	position: relative
}
.bloc_3_cols .item:hover {
	transform: scale(1.04);
	box-shadow: 0px 0px 20px rgba(0,0,0,.3);
}
.nouveautes .item .visuel {
	height: 100%;
	width: 50%;
	display: inline-flex;
	padding: 20px;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1/1;
}
.nouveautes .item .visuel img {
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
}
.nouveautes .item .texte {
	height: 100%;
	width: 45%;
	display: inline-flex;
	padding: 0;
	align-items: flex-start;
	flex-direction: column;
	justify-content: center;
}
.fond_blanc_ombre {
	background-color: #fff;
	box-shadow: 0px 0px 20px rgba(0,0,0,.05);
	border: 1px solid #eaeaea;
}

.nouveautes .btn_nouveautes_all {
	position: absolute;
	top: 10px;
	right: 30px;
}
@media only screen and (max-width : 1200px) {
	.nouveautes .btn_nouveautes_all {
		position: relative;
		top: 0;
		right: 0;
		padding: 10px;
		padding-left: 0px;
	}
}
@media only screen and (max-width : 992px) {
	.nouveautes {
		margin-top: 40px;
	}
	.nouveautes h2 {
		padding-left: 10px;
	}
   .bloc_3_cols .item {
		width: 48%;
	}
	.nouveautes .btn_nouveautes_all {
		position: relative;
		top: 0;
		right: 0;
		padding: 10px;
		padding-left: 10px;
	}
}
@media only screen and (max-width : 768px) {
	.nouveautes {
		margin-top: 40px;
	}
	.bloc_3_cols {
		padding: 0 10px;
	}
	.bloc_3_cols .item {
		width: 48%;
		padding: 0;
		aspect-ratio: auto;
		display: flex;
		flex-direction: column;
		transition: all 0.20s ease-out;
		cursor: pointer;
	}
	.nouveautes .item .visuel {
		height: auto;
		width: 100%;
		display: flex;
		padding: 15px;
		padding-top: 15px;
		aspect-ratio: 1/1;
	}
	.nouveautes .item .visuel img {
		max-height: 100%;
		max-width: 100%;
		width: auto;
		height: auto;
		box-shadow: 0px 0px 8px rgba(0,0,0,.3);
	}
	.nouveautes .item .texte {
		height: 100%;
		width: 100%;
		display: block;
		padding: 15px;
		padding-top: 0px;
	}
	.nouveautes .btn_nouveautes_all {
		text-align: center;
	}
}


/*  Auteurs  */

.auteurs {
}
.auteurs .container {
}
.auteurs h2 {
	color: #fff;
	margin-bottom: 10px;
	padding: 10px;
}
@media only screen and (max-width : 768px) {
	.auteurs h2 {
		padding-left: 0px;
		margin: 0;
	}
}
.auteurs .container .texture {
	min-height: 600px;
	width: 100%;
	background-color: #8f2d56;
	margin-top: 60px;
	background-image: url("../img/textures/texture_prune.jpg");
	background-size: cover;
	padding: 30px 30px;
	overflow: hidden;
	position: relative;
}
.bloc_4_cols {
	display: grid;
	grid-template-columns: repeat(4, auto);
	gap: 20px;
	padding-bottom: 20px;
}
.bloc_4_cols .item {
	width: 100%;
	padding: 0;
	aspect-ratio: 6/5;
	display: flex;
    transition: all 0.20s ease-out;
	cursor: pointer;
	overflow: hidden;
	position: relative;
}
.bloc_6_cols {
	display: grid;
	grid-template-columns: repeat(6, auto);
	gap: 20px;
	padding-bottom: 10px;
}

.bloc_6_cols .item {
	width: 100%;
	padding: 0;
	aspect-ratio: 1/1;
	margin: 1% 0;
	display: flex;
    transition: all 0.20s ease-out;
	cursor: pointer;
	overflow: hidden;
	position: relative;
}
.auteurs .item .visuel {
	height: 100%;
	width: 100%;
	position: absolute;
}
.auteurs .item .visuel img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	top: 0;
	left: 0;
}
.auteurs .item .texte {
	position: absolute;
    background-color: rgba(0,0,0,0.5);
	bottom: 0;
	left: 0;
	width: 100%;
	color: #fff;
	font-weight: 400;
	font-size: 18px;
	padding: 10px;
	transition: all 0.2s ease-out;
}
.bloc_6_cols .item .texte {
	font-weight: 400;
	font-size: 15px;
	padding: 8px;
}
.auteurs .item:hover .texte {
	padding-bottom: 20px;
	padding-top: 15px;
}
.auteurs .item:hover {
	transform: scale(1.05);
	box-shadow: 0px 0px 20px rgba(0,0,0,.3);
}
.auteurs .btn_auteurs_all .btn_simple {
	position: absolute;
	top: 50px;
	right: 40px;
	color: #fff;
}
.auteurs .bloc_agenda {
	margin: 0 auto;
	position: absolute;
	right: 240px;
	bottom: 100px;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.auteurs .picto_agenda {
	width: 200px;
	height: 200px;
	background-image: url("../img/pictos3D/picto_Agenda.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100%;
	margin-bottom: 20px;
	display: none;
}
.auteurs .bloc_agenda p {
	font-family: 'optimabold', sans-serif;
	color: #fff;
	font-size: 28px;
	text-align: center;
	font-weight: normal;
	line-height: 30px;
}
.auteurs .texture::before {
	content: "";
	position: absolute;
	width: 330px;
	height: 330px;
	background-image: url("../img/pictos3D/picto_Agenda.png");
	background-repeat: no-repeat;
	background-size: 100%;
	right: -50px;
	bottom: -45px;
}
@media only screen and (max-width : 1200px) {
	.auteurs .btn_auteurs_all {
		top: 0;
		left: 0;
		padding: 10px;
		padding-left: 0px;
		margin-top: 0;
	}
	.bloc_4_cols {
		grid-template-columns: repeat(3, auto);
		gap: 20px;
	}
	.bloc_6_cols {
		grid-template-columns: repeat(3, auto);
		gap: 20px;
	}
	.auteurs .bloc_agenda {
		position: relative;
		right: auto;
		bottom: auto;
		left: 50%;
		transform: translateX(-50%);
		margin: 20px 0;
		margin-bottom: 30px;
	}
}
@media only screen and (max-width : 992px) {
	.auteurs .btn_auteurs_all .btn_simple {
		position: relative;
		top: 0px;
		right: 0px;
		color: #fff;
	}
   
}
@media only screen and (max-width : 768px) {
	.bloc_6_cols {
		grid-template-columns: repeat(2, auto);
		gap: 10px;
		padding-top: 20px;
	}
	.auteurs h2 {
		padding-left: 10px;
		margin: 5px 0;
	}
	.auteurs .container .texture {
		padding: 10px;
		margin-top: 20px;
	}
	.bloc_4_cols {
		grid-template-columns: repeat(2, auto);
		gap: 20px;
	}
	.auteurs .bloc_4_cols .item {
		aspect-ratio: 1/1.2;
	}
	.auteurs .item .texte {
		font-size: 14px;
	}
	.auteurs .btn_auteurs_all {
		padding-top: 20px;
		padding-left: 10px;
	}
	.auteurs .texture::before {
		display: none;
	}
	.auteurs .bloc_agenda p {
		font-size: 26px;
		line-height: 26px;
	}
	.auteurs .picto_agenda {
		display: block;
		width: 150px;
		height: 150px;
	}
	.auteurs .btn_auteurs_all {
		text-align: center;
		padding-top: 30px;
	}
}



/*  Nos succès en librairie - Slider  */

.slider_succes {
	margin-top: 40px;
	margin-bottom: 0px;
}
.slider_succes h2{
	margin-bottom: 10px;
}
@media only screen and (max-width : 992px) {
	.slider_succes {
		margin-top: 30px;
	}

}
@media only screen and (max-width : 768px) {
	.slider_succes {
		margin-top: 20px;
		padding-bottom: 20px;
	}

}



/*  Newsletter  */

.bloc_newsletter {
	margin-top: 40px;
}
.bloc_newsletter .container {
}
.bloc_newsletter h2 {
	margin-bottom: 10px;
	padding: 10px;
}
.bloc_newsletter .texture {
	width: 100%;
	background-color: #ffbc42;
	background-image: url("../img/textures/texture_jaune.jpg");
	background-size: cover;
	padding: 30px 30px;
	overflow: hidden;
	position: relative;
	min-height: 350px;
}
.bloc_newsletter .picto_newsletter {
	width: 200px;
	height: 200px;
	background-image: url("../img/pictos3D/picto_Newsletter.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100%;
	margin-bottom: 20px;
	display: none;
}
.bloc_newsletter .content {
	margin-bottom: 30px;
	margin-top: 50px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	position: relative;
}
.bloc_newsletter .content p {
	font-size: 20px;
	font-weight: 400;
	margin: 0;
}
.bloc_newsletter .btn_simple {
	display: inline-block;
}
.bloc_newsletter input {
	width: 100%;
	padding: 5px;
	padding-left: 20px;
	padding-right: 40px;
	border-radius: 40px !important;
	height: 40px;
	background-color: rgba(255,255,255,1);
	border: 0;
    font-family: 'Ubuntu', sans-serif;
    font-size: 18px;
    color: #000;
    font-weight: 400;
	outline: none;
	margin: 20px 0;
	display: inline-block;
	max-width: 450px;
}
.bloc_newsletter form {
	width: 100%;
}
.bloc_newsletter input::placeholder {
	color: #000;
	font-family: 'Ubuntu', sans-serif;
	font-style: italic;
	font-size: 18px;
	font-weight: 400;
}
.bloc_newsletter .texture::before {
	content: "";
	position: absolute;
	width: 300px;
	height: 300px;
	background-image: url("../img/pictos3D/picto_Newsletter.png");
	background-repeat: no-repeat;
	background-size: 100%;
	left: -50px;
	bottom: -50px;
}
@media only screen and (max-width : 992px) {
	.bloc_newsletter .container .texture {
		padding: 20px 20px;
	}
	.bloc_newsletter {
		margin-top: 0px;
	}
	.bloc_newsletter h2 {
		text-align: center;
		margin-bottom: 10px;
	}
	.bloc_newsletter .content {
		margin-top: 0px;
		margin-bottom: 20px;
	}
	.bloc_newsletter .texture::before {
		display: none;
	}
	.bloc_newsletter .picto_newsletter {
		display: block;
		width: 150px;
		height: 150px;
	}
}
@media only screen and (max-width : 768px) {

}

.popup_newsletter.popup_MC {
	width: 1300px;
}

.popup_newsletter .bloc_newsletter {
	border-radius: 6px;
	box-shadow: 0px 0px 20px rgba(0,0,0,.3);
	overflow: hidden;
	margin-top: 0;
}
.popup_newsletter .texture {
	padding: 40px;
}


/*  Instagram  */

.bloc_instagram {
	margin-top: 60px;
}
.bloc_instagram .container {
}
.bloc_instagram .content {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 40px;
	margin-bottom: 40px;
}
.bloc_instagram .rang {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-around;
	padding: 0 5px;
}
.bloc_instagram .bloc_logo {
	text-align: center;
	margin-bottom: 15px;
}
.bloc_instagram .bloc_logo .texte {
	font-size: 20px;
	font-weight: 500;
	padding-top: 10px;
}
.bloc_instagram .logo {
	width: auto;
	height: auto;
	border-radius: 200px;
	box-shadow: 0px 0px 12px rgba(0,0,0,.5);
	transition: all 0.2s ease-out;
}
.bloc_instagram .logo:hover {
	transform: scale(1.05);
}
.bloc_instagram .post {
	padding-bottom: 10px;
}
.bloc_instagram .post img {
	width: 100%;
	height: auto;
	max-width: 350px;
	transition: all 0.2s ease-out;
}
.bloc_instagram .post a:hover img {
	transform: scale(1.03);
	box-shadow: 0px 0px 10px rgba(0,0,0,.3);
}


@media only screen and (max-width : 768px) {
	.bloc_instagram {
		margin-top: 30px;
	}
	.bloc_instagram .content {
		display: block;
		text-align: center;
		margin-bottom: 20px;
	}
	.bloc_instagram .rang {
		margin-bottom: 40px;
	}
	.bloc_instagram h2 {
		text-align: center;
	}
	.bloc_instagram .posts {
	    display: flex;
	}
	.bloc_instagram .post {
	    padding-bottom: 10px;
		display: inline-block;
		width: 50%;
		padding: 0 2px;
	}
	.bloc_instagram .post img {
		width: 100%;
		height: auto;
		max-width: 350px;
	}
	.bloc_instagram .logo img {
		width: 150px;
		height: 150px;
	}
}

/************************************************/
/*             Page NewsLetter                 */
/************************************************/
.newsletter .bloc_gris {
    background-color: #ffbc42;
    background-image: url("../img/textures/texture_jaune.jpg");
}

/************************************************/
/*             Recherche Auteur                 */
/************************************************/

#ResultSearchAuth ul{
    vertical-align: top;
}
.page_auteurs .bloc_gris {
    background-color: #e7e7e9;
    position: relative;
    padding: 30px;
	border-radius: 10px;
    margin-bottom: 20px;
}
.page_auteurs .recherche_auteur.bloc_gris {
    background-color: #e7e7e9;
    position: relative;
    padding: 0;
	border-radius: 10px;
    margin-bottom: 20px;
}
.page_auteurs .recherche_auteur .recherche {
	padding: 30px;
	padding-bottom: 0;
}
.recherche_auteur {
	margin-top: 40px;
	margin-bottom: 40px;
}
.recherche_choix {
	display: flex;
}
@media only screen and (max-width : 768px) {
	.recherche_choix {
		display: none;
	}
}
.recherche_choix .btn {
	background-color: #fff;
	font-size: 18px;
	font-weight: 600;
	padding: 12px 22px;
	padding-left: 50px;
	border-radius: 100px;
	position: relative;
	margin-right: 5px;
	color: #000;
	transition: all 0.2s ease-out;
	border: 0;
}
.recherche_choix .btn::before {
	content: "";
	position: absolute;
	background-image: url("../icons/ico_abc_dark.svg");
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
	width: 30px;
	height: 30px;
	top: 50%;
	transform: translateY(-50%);
	left: 12px;
}
.recherche_choix .btn.moteur::before {
	background-image: url("../icons/ico_recherche_dark.svg");
}
.recherche_choix .btn.alpha::before {
	background-image: url("../icons/ico_abc_dark.svg");
}
.recherche_choix .btn.active {
	background-color: #00213b;
	color: #fff;
	pointer-events: none;
}
.recherche_choix .btn:hover {
	box-shadow: 0px 0px 10px rgba(0,0,0,.2);
}
.btn.moteur.active::before {
	background-image: url("../icons/ico_recherche_white.svg");
}
.btn.alpha.active::before {
	background-image: url("../icons/ico_abc_white.svg");
}

@media only screen and (max-width : 992px) {
	.page_auteurs .bloc_gris {
		padding: 15px;
		padding-top: 20px;
	}
	.page_auteurs .recherche_auteur .recherche {
		padding: 20px;
		padding-bottom: 0;
	}
	.recherche_choix {
		margin-top: 20px;
		align-items: center;
		justify-content: center;
	}
	.recherche_choix .btn {
		font-size: 12px;
		padding: 10px 14px;
		padding-left: 32px;
		margin-right: 5px;
		white-space: nowrap;
	}
	.recherche_choix .btn::before {
		width: 20px;
		height: 50%;
		left: 8px;
	}
	.recherche_auteur {
		margin-top: 20px;
		margin-bottom: 20px;
	}
}


/*  Moteur de recherche  */

.recherche_moteur {
	padding: 30px 0;
	display: block;
}
.recherche_moteur form {
	
}
.recherche_moteur input {
	font-size: 18px;
	padding: 10px 20px;
	outline: none;
	box-shadow: 0px 0px 7px rgba(0,0,0,.1);
	width: 100%;
}


/*  Recherche Alphabétique  */

.recherche_alpha {
	padding: 30px 0;
}
.alphabet {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}
.alphabet div {
	margin: 0;
	padding: 0;
	white-space: nowrap;
}
.alphabet .letter {
	background-color: #fff;
	width: 40px;
	aspect-ratio: 1/1;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
	border-radius: 6px;
	margin: 2px;
	font-size: 16px;
	font-weight: 600; 
	border: solid 1px rgba(0, 0, 0, 0.1);
	color: #000;
	transition: 0.1s ease-out;
	display: inline-flex;
	justify-content: center;
	align-items: center;
}
.alphabet .letter:hover {
	transform: scale(1.3);
}
.alphabet .letter a {
	color: #12294f;
	text-decoration: none;
}
.alphabet .letter.active {
	background-color: #00213b;
	color: #fff;
	pointer-events: none;
}

@media only screen and (max-width : 1200px) {
	.alphabet {
		
	}
}

/*  Résultat de recherche  */

.recherche_auteur .resultat {
	padding: 30px;
	padding-top: 20px;
	background-color: #f4f4f6;
	font-size: 16px;
}
.recherche_auteur .resultat ul {
	list-style-type: none;
	padding: 0;
	display: inline-block;
	width: 33%;
}
.recherche_auteur .resultat li {
	padding: 4px 0;
}
.recherche_auteur .resultat li a{
	text-decoration: none;
	color: #ee5622;
	font-weight: 500;
}
.recherche_auteur .resultat li a:hover{
	text-decoration: underline;
	color: #ee5622;
}
.Comment_Result {
	font-size: 20px;
	font-weight: 500;
	color: #000;
	padding-top: 10px;
	padding-bottom: 20px;
}
.Comment_Result .invisible {
	display: none;
}

.ico_publications {
	color: #000;
	display: inline-block;
}
.ico_publications::before {
	content : url("../icons/ico_publications_dark.svg");
	height: 15px;
	width: 15px;
	display: inline-block;
	margin: 0 5px;
}
.ico_agenda {
	color: #000;
	font-size: 16px;
	display: inline-block
}
.ico_agenda::before {
	content :url("../icons/ico_agenda_dark.svg");
	height: 15px;
	width: 15px;
	display: inline-block;
	margin: 0 5px;
}


@media only screen and (max-width : 992px) {
	.recherche_auteur .resultat {
		padding: 10px;
		font-size: 14px;
		padding-top: 0;
	}
	.recherche_auteur .resultat ul {
		width: 100%;
		display: block;
	}
	.ico_publications::before, .ico_agenda::before {
		height: 13px;
		width: 13px;
		margin: 0 5px;
	}
	.recherche_auteur .resultat .col2, .recherche_auteur .resultat .col3 {
		display: none;
	}
}


/*  Élements masqués  */

.recherche_moteur.invisible {
	display: none;
}
.recherche_alpha.invisible {
	display: none;
}
.resultat.invisible {
	display: none;
}



/*************************************************/
/*             Page Auteur Perso                 */
/*************************************************/


.page_auteur_perso {
	
}
.page_auteur_perso .bloc_gris {
	margin-bottom: 40px;
	margin-top: 0;
}
.page_auteur_perso .presentation {
	display: flex;
	justify-content: center;
	align-items: stretch;
}
.page_auteur_perso .photo {
	width: 25%;
}
.page_auteur_perso .photo img {
	width: 100%;
	height: auto;
	top: 0;
	left: 0;
}
.page_auteur_perso .photo.mobile {
	display: none;
	float: left;
	width: 50%;
	margin-right: 20px;
}
.page_auteur_perso .infos {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	padding-left: 40px;
	flex-grow: 1;
	width: 75%;
}

.page_auteur_perso .bio {
	font-size: 18px;
	font-weight: 400;
	flex: 1;
	margin-bottom: 20px;
}


@media only screen and (max-width : 992px) {
	.page_auteur_perso .bloc_gris {
		padding-top: 20px;
		margin-bottom: 20px;
	}
	.page_auteur_perso h2 {
		padding-bottom: 10px;
	}
	.page_auteur_perso .photo.mobile {
		display: block;
	}
	.page_auteur_perso .photo.desktop {
		display: none;
	}
	.page_auteur_perso .infos {
		padding-left: 0;
	}
	.page_auteur_perso .bio {
		font-size: 16px;
	}
	
}


.page_auteur_perso .icons {
	width: 100%;
	min-height: 50px;
	left: 0;
	bottom: 0;
}
.page_auteur_perso .icons div {
	background-image: url("../icons/ico_auteur_orange.svg");
    background-repeat: no-repeat;
    background-size: auto 20px;
    background-position: left center;
	padding: 3px 0;
	padding-left: 26px;
	vertical-align: middle;
	font-size: 16px;
	font-weight: 500;
}
.page_auteur_perso .icons .p_website {
	background-image: url("../icons/ico_website_orange.svg");
}
.page_auteur_perso .icons .p_instagram {
	background-image: url("../icons/ico_instagram_orange.svg");
}
.page_auteur_perso .icons .p_facebook {
	background-image: url("../icons/ico_facebook_orange.svg");
}
.page_auteur_perso .icons .p_youtube {
	background-image: url("../icons/ico_youtube_orange.svg");
}
.page_auteur_perso .icons .p_twitter {
	background-image: url("../icons/ico_twitter_orange.svg");
}
.page_auteur_perso .icons .p_linkedin {
	background-image: url("../icons/ico_linkedin_orange.svg");
}
.page_auteur_perso .icons .p_tiktok {
	background-image: url("../icons/ico_tiktok_orange.svg");
}
.page_auteur_perso .icons a {
	color: #000;
}
.page_auteur_perso .icons a:hover {
	color: #ee5622;
	text-decoration: underline;
}

.page_auteur_perso .banner {
	margin-top: 10px;
}
.page_auteur_perso .banner img {
	margin-top: 5px;
	max-width: 100%;
}

.page_auteur_perso .liens {
	padding: 20px;
	background-color: #fff;
	border-radius: 8px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
	width: 100%;
}
.agenda_box {
	text-align: center; 
	padding: 30px 0;
}
.agenda_box .agenda {
	padding: 30px 0;
}
.page_auteur_perso .agenda_box {
	padding: 0; 
	margin: 0; 
	padding-bottom: 40px;
}
@media only screen and (max-width : 992px) {
	.page_auteur_perso .agenda_box { 
		padding-bottom: 20px;
	}
	.page_auteur_perso .agenda_box .agenda {
		padding: 10px 0;
	}
}

/************************************************/
/*                  AGENDA                      */
/************************************************/


.agenda_bloc {
    background-color: #e7e7e9;
    position: relative;
    padding: 30px;
	border-radius: 10px;
	margin-bottom: 40px;
}
#AGDtext{
    max-height: 200px;
    overflow: auto;margin-bottom: 5px
}
.agenda_bloc .btn_agenda_all {
	position: absolute;
	top: 50px;
	right: 30px;
	padding: 10px;
	padding-left: 0px;
	margin-top: -20px;
}
.agenda {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	padding-bottom: 10px;
}
.agenda .item {
	width: 100%;
	aspect-ratio: 1/1;
	background-color: #00213b;
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	transition: 0.2s ease-out;
	cursor: pointer;
}
.agenda .titre_mois {
	width: 100%;
	aspect-ratio: 1/1;
	background-color: #00213b;
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-family: 'optimabold', sans-serif;
    color: #fff;
    font-size: 34px;
    margin-bottom: 20px;
	font-weight: normal;
	text-align: center;
	padding: 10%;
}
.agenda .item .rang {
	display: flex;
	justify-content: space-between;
}
.agenda .item .rang .visuel {
	aspect-ratio: 10/13;
	width: 60%;
}
.agenda .item .rang .visuel img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	top: 0;
	left: 0;
}
.agenda .item .titre {
	width: 100%;
	display: flex;
	align-items: center;
	flex: 1;
	position: relative;
	padding: 5%;
	background-color: rgba(0,33,59,0.8);
	color: #fff;
	transition: transform 0.2s ease-out;
}
.agenda .item .titre p {
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: 400;
	text-align: left;
}
.agenda .round_btn {
	background-color: #fff;
	color: #000;
	font-size: 16px;
	padding: 6px 14px;
	padding-left: 32px;
	padding-right: 15px;
	position: absolute;
	bottom: -30px;
	left: 5%;
	transform: scale(0);
}
.agenda .round_btn:before {
	width: 16px;
	height: 14px;
	left: 10px;
}
.agenda .item:hover {
	transform: scale(1.05);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
.agenda .item:hover .titre  {
	transform: translateY(-50px);
}
.agenda .item:hover .round_btn  {
	transform: scale(1);
}
.agenda .item .rang .infos {
	background-color: #8f2d56;
	padding: 5%;
	width: 40%;
}
.calendar {
	border: 1px solid rgba(255,255,255,0.5);
	padding: 5%;
	text-align: center;
}
.calendar .day {
	line-height: 90%;
	text-align: center;
	font-weight: 600;
	color: #fff;
	font-size: 9em;
}
.calendar .month {
	line-height: 90%;
	text-align: center;
	font-weight: 600;
	color: #fff;
	font-size: 5em;
}
.calendar .year {
	line-height: 110%;
	text-align: center;
	font-weight: 600;
	color: #fff;
	opacity: 0.5;
	font-size: 4em;
}
.agenda .lieu, .popup_agenda .lieu {
	line-height: 120%;
	text-align: left;
	font-weight: 300;
	color: #fff;
	font-size: 2.1em;
	padding-top: 10%;
	word-break: normal;
}
.agenda .ville, .popup_agenda .ville {
	text-align: left;
	font-weight: 600;
	color: #fff;
	display: block;
	padding-top: 0.2em;
	text-transform: uppercase;
}
@media only screen and (max-width : 1200px) {
	.agenda {
		grid-template-columns: repeat(3, 1fr);
	}
	.agenda .item:nth-child(7), .agenda .item:nth-child(8) {
	  display: none;
	}
}
	
@media only screen and (max-width : 768px) {
	.agenda_bloc {
		margin-top: 0;
	}
	.agenda_bloc .btn_agenda_all {
		position: relative;
		top: 0;
		right: 0;
		padding: 10px;
		padding-left: 10px;
		margin-top: 0;
	}
	.agenda {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
		padding: 0 5px;
		padding-bottom: 5px;
	}
	.agenda .item {
		aspect-ratio: 4/5.5;
	}
	.agenda .titre_mois {
		aspect-ratio: 4/5.5;
	}
	.agenda .lieu, .popup_agenda .lieu {
		font-size: 2.5em;
	}
	.agenda .item .titre {
		padding: 10px 15px;
	}
	.agenda .item .titre p {
		font-size: 1.4em;
	}
	.agenda .item .rang .infos {
		width: 50%;
		min-height: 20em;
	}
	.agenda .item .rang .visuel {
		width: 50%;
	}
	.agenda .item .rang .visuel {
		aspect-ratio: 10/18;
		width: 50%;
		display: block;
	}
	.agenda .item .rang .visuel img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		top: 0;
		left: 0;
	}
	.agenda_bloc {
		padding: 30px 10px;
	}
	.agenda {
		margin-top: 15px;
	}
	.agenda_bloc .btn_agenda_all {
		text-align: center;
	}
	.agenda .item:hover {
		transform: scale(1.05);
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
	}
	.agenda .item:hover .titre  {
		transform: none;
	}
	.agenda .item:hover .round_btn  {
		transform: none;
	}
	.agenda .round_btn  {
		display: none;
	}
}

/************************/
/*        Popup         */
/************************/

.popup_MC {
    min-height: 400px;
    min-width: 100px;
    position: fixed;
    display: block;
    left: 50%;
    top: 45%;
    transform: translate(-50%,-50%);
    padding: 40px;
    width: 1200px;
    max-width: 100%;
	z-index: 2001;
}
.popup_mask {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.7);
	z-index: 2000;
}
.popup_MC .x_close {
    width: 40px;
    height: 40px;
    border-radius: 100px;
    background-color: #fff;
    background-image: url(../icons/croix.png);
    background-repeat: no-repeat;
    background-size: auto 40%;
    background-position: center center;
	transition: all 0.2s ease-out;
    box-shadow: 0px 0px 5px rgba(0,0,0,.2);
    position: absolute;
    right: 30px;
    top: 30px;
    cursor: pointer;
}
.popup_MC .x_close:hover {
	transform: scale(1.3);
}
.popup_agenda .cadre {
	box-shadow: 0px 0px 20px rgba(0,0,0,.3);
	padding: 20px;
	border-radius: 6px;
}
@media only screen and (max-width : 768px) {
	.popup_MC {
		top: 50%;
	}
}
.popup_agenda .cadre {
    display: flex;
	align-items: stretch;
	justify-content: space-between;
	background-color: #8f2d56;
	padding: 20px;
}
.popup_agenda .contenu .col {
	
}
.popup_agenda .date {
	padding-right: 20px;
	width: 15%;
}
.popup_agenda .contenu {
	background-color: #fff;
	width: 50%;
	padding: 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between
}
.popup_agenda .contenu .titre {
	font-size: 28px;
	color: #000;
	font-weight: 600;
	margin-bottom: 30px;
}
.popup_agenda .contenu .texte {
	font-size: 18px;
	color: #000;
}
.popup_agenda .icons {
	width: 100%;
	/*min-height: 50px;*/
	left: 0;
	bottom: 0;
}
.popup_MC .icons div {
	background-image: url("../icons/ico_auteur_dark.svg");
    background-repeat: no-repeat;
    background-size: auto 20px;
    background-position: left center;
	padding: 3px 0;
	padding-left: 26px;
	vertical-align: middle;
	font-size: 16px;
	font-weight: 500;
}
.popup_MC .icons .p_names {
	background-image: url("../icons/ico_auteur_orange.svg");
}
.popup_MC .icons .p_adress {
	background-image: url("../icons/ico_localisation_orange.svg");
}
.popup_MC .icons .p_website {
	background-image: url("../icons/ico_website_orange.svg");
}
.popup_MC .icons .p_publications {
	background-image: url("../icons/ico_publications_orange.svg");
}
.popup_MC .icons a {
	color: #000;
}
.popup_MC .icons a:hover {
	color: #ee5622;
	text-decoration: underline;
}
.popup_agenda .visuel {
	aspect-ratio: 10/13;
	width: 35%;
}
.popup_agenda .visuel img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	top: 0;
	left: 0;
}

@media only screen and (max-width : 768px) {
	.popup_agenda .cadre {
		flex-wrap: wrap;
	}
	.popup_agenda .date {
		order: 1;
		width: 40%;
	}
	.popup_agenda .contenu {
		width: 100%;
		order: 3;
	}
	.popup_agenda .visuel {
		order: 2;
		width: 60%;
	}
	.popup_agenda .contenu .titre {
		font-size: 20px;
		margin-bottom: 10px;
	}
	.popup_agenda .contenu .texte {
		font-size: 16px;
	}
	.popup_MC .icons div {
		background-size: auto 16px;
		padding: 2px 0;
		padding-left: 26px;
		font-size: 14px;
	}
}

.popup_groupe .cadre {
    display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: space-between;
	background-color: #fff;
	padding: 30px;
}
.popup_groupe .logo {
    aspect-ratio: 100/50;
	width: 270px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	padding: 0px;
	margin-bottom: 20px
}
.popup_groupe .logo img {
	height: auto;
	max-height: 100%;
	max-width: 100%;
}
.popup_groupe .texte {
    font-size: 16px;
	background-color: #fff;
	padding: 30px 0;
	font-weight: 400;
	border-top: 1px solid #ee5622;
}
.popup_groupe .icons {
	width: 100%;
	min-height: 50px;
	padding: 20px;
	background-color: #f4f4f6;
	border-radius: 6px;
	margin: 0;
}
.popup_groupe .icons div {
	margin: 5px 0;
}

@media only screen and (max-width : 768px) {
	.popup_groupe .logo {
		aspect-ratio: 5/2;
		width: 100%;
		height: 100px;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #fff;
		padding: 0px 40px;
		margin-bottom: 10px;
	}
	.popup_groupe .logo img {
		height: auto;
		max-height: 100%;
		max-width: 100%;
	}
	.popup_groupe .texte {
		font-size: 16px;
		padding: 10px 0;
	}
}

/************************************************/
/*               NOTRE GROUPE                   */
/************************************************/

.page_groupe {
	
}
.page_groupe .bloc_gris {
	background-color: #8f2d56;
	color: #fff;
	font-weight: 400;
	padding: 30px;
	margin-bottom: 20px;
	font-size: 16px;
}
.page_groupe .bloc_gris p {
	margin: 0;
}
.infos_groupe {
	display: none;
}
.logos_groupe {
	
}
.logos_groupe .grille {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 30px;
}
.logos_groupe .item {
	width: 100%;
	aspect-ratio: 100/80;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5em;
	cursor: pointer;
	transition: all 0.2s ease-out;
}
.logos_groupe .ligne {
	background-color: #ee5622;
	height: 1px;
	grid-column-start: 1;
    grid-column-end: 6;
	width: 85%;
	margin: 0 auto;
}
.logos_groupe .ligne_mob {
	background-color: #ee5622;
	height: 1px;
	grid-column-start: 1;
    grid-column-end: 4;
	display: none;
	width: 85%;
	margin: 0 auto;
}
.logos_groupe .item img {
	height: auto;
	max-height: 100%;
	max-width: 100%;
	/*transition: all 0.2s ease-out;*/
}
.logos_groupe .item:hover {
	transform: scale(1.1);
	background-color: #ee5622;
}
.logos_groupe .item:hover img {
	filter: brightness(0) invert(1);
}
.logos_groupe .color1 {
	
}
.logos_groupe .color1 img {
	filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(324deg) brightness(96%) contrast(104%);
}


@media only screen and (max-width : 992px) {
	.logos_groupe {
		margin-top: 20px;
	}
	.logos_groupe .grille {
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}
	.logos_groupe .item {
		padding: 1.2em;
	}
	.logos_groupe .ligne {
		display: none;
	}
	.logos_groupe .ligne_mob {
		display: block;
	}
}
@media only screen and (max-width : 768px) {
	.logos_groupe {
		margin-top: 20px;
	}
	.logos_groupe .grille {
		grid-template-columns: repeat(3, 1fr);
		gap: 10px;
	}
	.logos_groupe .item {
		padding: 0.5em;
	}
}

/************************************************/
/*                FORMULAIRES                   */
/************************************************/



textarea:focus, 
textarea.form-control:focus, 
input.form-control:focus, 
input[type=text]:focus, 
input[type=password]:focus, 
input[type=email]:focus, 
input[type=number]:focus, 
[type=text].form-control:focus, 
[type=password].form-control:focus, 
[type=email].form-control:focus, 
[type=tel].form-control:focus, 
[contenteditable].form-control:focus {
  box-shadow: 0px 0px 5px rgba(0,0,0,.1);
}

input, textarea   {
	font-size: 16px;
	padding: 5px;
	box-shadow: 0px 0px 5px rgba(0,0,0,.1);
    border: 0 !important;
    border-radius: 5px !important;
	color: #000;
	outline: none !important;
	border-color: inherit;
}
input::placeholder, textarea::placeholder {
	font-size: 16px;
	font-weight: 400;
	color: #000;
    opacity: 0.7;
    font-style: italic;
}
label {
	font-size: 16px;
	color: #000;
	font-weight: 500;
	margin: 5px 0;
    font-family: 'Ubuntu', sans-serif;
}
.form-group {
    margin: 0;
    padding: 0;
    margin-bottom: 10px;
}
.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-color: red;
}
#InfosComp{
    color:#AA0000;
    margin-top:5px
}
select:not(.simple_select) {
    font-size: 16px;
    padding: 5px;
    padding-right: 30px;
    box-shadow: 0px 0px 5px rgba(0,0,0,.1);
    border: 1px solid #fff;
    border-radius: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: #000;
    height: 38px;
    background-image: url(../icons/chevron_select.svg);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: auto 100%;
    cursor: pointer;
    display: block;
}
select.simple_select {
    font-size: 14px;
    padding: 2px;
    padding-right: 20px;
    box-shadow: 0px 0px 5px rgba(0,0,0,.1);
    border: 1px solid #fff;
    border-radius: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: #000;
    height: 30px;
    background-image: url(../icons/chevron_select.svg);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: auto 100%;
    cursor: pointer;
}
.ErrorTxt{
    background-color: orange;
    color:#FFFFFF;
    font-weight: bold;
    padding: 5px;
    border-radius: 5px;
}
.ErrorTxt span{
    color:#000;
    font-weight: bold;
    padding: 0 2px;
    margin-right: 5px;
    text-decoration: underline;
}
.messageStackError{
    background-color: #FF6500;
    color:#FFFFFF;
    padding: 5px;
    border-radius: 5px;
    border:1px solid white;
}
.messageStackError span{
    color:#000;
    font-weight: bold;
    padding: 0 2px;
    margin-right: 5px;
    text-decoration: underline;
}
.messageStackSuccess{
    background-color: #28b945;
    color:#FFFFFF;
    font-weight: bold;
    padding: 5px;
    border-radius: 5px;

}
.messageStackSuccess span{
    color:#000;
    font-weight: bold;
    padding: 0 2px;
    margin-right: 5px;
    text-decoration: underline;
}




/************************************************/
/*                Page Produit                  */
/************************************************/



@media only screen and (max-width : 768px) {
    .page_produit h2 {
		text-align: left;
    }
}

.entete_produit i {
    font-size: 24px;
	vertical-align: middle;
}

.entete_produit_mobile {
    display: none;
    margin-top: -10px;
    margin-bottom: 10px;
}
.min_img{
    width:42px;
    height:58px;
    object-fit: contain;
}
@media only screen and (max-width : 768px) {
   .entete_produit_mobile {
        display: block;
    }
    .entete_produit {
        display: none;
    }
}
.visuel_produit {
    width: 100%;
}
.visuel_produit img {
    width: 100%;
    height: auto;
    border: 1px solid #000;
    cursor: zoom-in;
    object-fit: contain;
}
@media only screen and (max-width : 768px) {
   .visuel_produit {
        max-width: 300px;
        width: 70%;
        margin: 0 auto;
    }
}
.bloc_panier {
    background-color: #f3f4f6;
    width: 100%;
    min-height: 250px;
    border-radius: 20px;
    text-align: center;
}
.ajouter_panier {
    width: 100%;
    text-align: center;
    padding: 0 20px;
    margin-top: 20px;
}
.ajouter_panier .round_btn {
    font-size: 1.3em;
}
.bloc_panier .facebook_like {
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
}
.bloc_panier .partage {
    text-align: center;
    margin: 10px 0;
    padding-top: 30px;
}
.bloc_panier .partage .logos {
    text-align: center;
    display: inline-block;
}
.bloc_panier .partage .social_share {
    color: #fff;
    width: 24px;
    height: 24px;
    display: inline-block;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    margin: 2px;
}
.bloc_panier .partage .facebook {
    background-color: #285e9b;
}
.bloc_panier .partage .twitter {
    background-color: #00b3ef;
}
.bloc_panier .partage .pinterest {
    background-color: #d1001f;
}
.bloc_panier .partage .email {
    background-color: #acacac;
}
.bloc_panier .prix {
    font-size: 40px;
    color: #ee5622;
    text-align: center;
    margin-bottom: 10px;
}
.bloc_panier .quantite {
    text-align: center;
    font-size: 16px;
}
.bloc_panier .format_electronique {
    text-align: center;
    padding: 30px 20px;
}
.bloc_panier .format_electronique div {
    padding: 5px 0;
}
.onglets {
    width:100%;
    text-align: center;
    font-size: 20px;
    margin-bottom: 20px;
    margin-top: 20px;
}
.onglets a {
    margin: 0 5px;
}
.aParaitreWarn{
  position:absolute;
  top:0px;
  left:0px;
  width:167px;
  height:167px;
  background:url(../img/aparaitre_orange.png) no-repeat;
  z-index:500;
  pointer-events: none;
  
}

@media only screen and (max-width : 768px) {
   .onglets {
        font-size: 16px;
        margin-bottom: 20px;
        margin-top: 20px;
    }
   .onglets a {
        margin: 0;
        white-space: nowrap;
    }
}
.bloc_anchor {
    margin-top: 30px;
    font-size: 16px;
    line-height: 26px;
    border-bottom: 1px solid #afb2b9;
    padding-bottom: 0px;
    position: relative;
    height: auto;
}
.bloc_anchor h2 {
    padding: 0;
}

/*  Boutons voir plus / moins  */
.bloc_anchor .btn_voir_plus, .bloc_anchor .btn_voir_moins {
    position: absolute;
    bottom: -25px;
    z-index: 5000;
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
}
.bloc_anchor .btn_voir_moins {
    display: block;
}
.bloc_anchor .btn_voir_plus {
    display: none;
}
.btn_voir_plus .round_btn::before {
    transform: translateY(-50%) rotate(90deg);
}
.btn_voir_moins .round_btn::before {
    transform: translateY(-50%) rotate(-90deg);
}
.btn_voir_moins .round_btn {
    /*background-color: #fff;
	color: #00213b;*/
}
.bloc_anchor.reduced .contenu_visible {
    max-height: 230px;
    overflow: hidden;
    padding-bottom: 40px;
}
.bloc_anchor.reduced .btn_voir_plus {
    display: block;
}
.bloc_anchor.reduced .btn_voir_moins {
    display: none;
}

/*  DÃƒÂ©tails  */
.bloc_anchor#details {
}

/*  MÃƒÂ©dias  */
.bloc_anchor#medias {
    line-height: normal;
}
.bloc_anchor#medias .lien_ico {
    display: block;
    padding: 12px 0;
    border-bottom: 1px solid #eaeaea;
}
.bloc_anchor#medias .lien_ico:last-child {
    padding: 12px 0;
    padding-bottom: 0;
    border-bottom: 0px;
}
.bloc_anchor#medias .videos {
    margin-top: 40px;
}
.youtube_container {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    margin-bottom: 20px;
}
.video_youtube {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*  Agenda  */
.bloc_anchor#agenda {
    line-height: normal;
}
.bloc_anchor#agenda .contenu_visible {
    padding: 0 15px;
}
.bloc_anchor#agenda p {
    padding-left: 25px;
}
.bloc_anchor#agenda .details {
    font-size: 14px;
}
.bloc_anchor#agenda .date {
    /*color: #ee5622;*/
    color: #000;
    margin-bottom: 10px;
    font-weight: 600;
    font-size: 18px;
}
.bloc_anchor#agenda .auteur {
    margin-bottom: 10px;
    font-size: 16px;
}
.bloc_anchor#agenda .colonne {
    border-left: 1px solid #eaeaea;
    padding: 0 20px;
    margin-bottom: 40px;
    box-sizing: border-box;
}
@media only screen and (max-width : 992px) {
   .bloc_anchor#agenda .colonne {
       border: 0;
       border-bottom: 1px solid #eaeaea;
       margin-bottom: 30px;
       padding-bottom: 20px;
    } 
    .bloc_anchor#agenda .colonne:last-child {
        border-bottom: 0;
    }
}


.bloc_related_products {
    padding-top: 40px;
    font-size: 16px;
    line-height: 26px;
    padding-bottom: 0px;
    position: relative;
    height: auto;
	border-top: 1px solid #999;
}
.related_products {
	display: flex;
	grid-template-columns: repeat(6, auto);
	gap: 20px;
	padding: 20px 0;
	justify-content: center;
	align-content: center;
}
.related_products .item {
	max-width: 16%;
	text-align: center;
	line-height: normal;
	padding-bottom: 10px;
}
.related_products .visuel {
    height: auto;
	width: 100%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1/1;
	transition: all 0.2s ease-out;
	padding-bottom: 20px;
}
.related_products .visuel img {
    max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	box-shadow: 0px 0px 8px rgba(0,0,0,.3);
}
.related_products .item:hover .visuel {
    transform: scale(1.1);
}
@media only screen and (max-width : 992px) {
   .related_products {
		display: grid;
		grid-template-columns: repeat(3, auto);
	}
	.related_products .item {
		max-width: 100%;
	}
}
@media only screen and (max-width : 992px) {
   .related_products {
		display: grid;
		grid-template-columns: repeat(2, auto);
	}
	.related_products .item {
		max-width: 100%;
	}
}

.product_tabs {
	
}
.tabs_container {
	border-bottom: 1px solid #999;
	margin-bottom: -10px;
	text-align: center;
}
.tabs_container .tab_prod {
	display: inline-block;
	padding: 14px 20px;
	transform: translateY(1px);
	border-left: 1px solid transparent;
	border-top: 1px solid transparent;
	border-right: 1px solid transparent;
	background-color: transparent;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	text-transform: uppercase;
	color: #000;
	transition: color 0.2s ease-out;
	user-select: none;
}
.tabs_container .tab_prod:hover {
	color: #ee5622;
}
.product_tabs .tab_prod.active {
	border-left: 1px solid #999;
	border-top: 1px solid #999;
	border-right: 1px solid #999;
	background-color: #fff;
	color: #000;
	pointer-events: none;
}
.product_tabs .tab_content {
	padding: 50px 0px;
	padding-top: 60px;
	font-size: 16px;
    line-height: 130%;
	display: none;
	border-bottom: 1px solid #afb2b9;
}
.product_tabs .tab_content.open {
	display: block;
}
.product_tabs .tab_content#details {
    line-height: 150%;
}
.product_tabs .tab_content#videos {
    line-height: 150%;
}

@media only screen and (max-width : 768px) {
   .tabs_container .tab_prod {
		padding: 14px 14px;
		font-size: 14px;

	}
}


/************************************************/
/*                Pages Compte                  */
/************************************************/

/*  GÃƒÂ©nÃƒÂ©ral  */
.compte h2 {
    color: #000;
    font-size: 26px;
    margin: 0;
    margin-bottom: 10px;
}
.bloc_gris {
    background-color: #f4f4f6;
    position: relative;
    padding: 30px;
	border-radius: 10px;
}
@media only screen and (max-width : 768px) {
   .bloc_gris {
        padding: 25px 15px;
    }
    .compte .round_btn {
        margin-top: 20px;
    }
}
.compte .fil_ariane {
    padding: 20px 0;
}
.grey_tab {
    width: 100%;
}

/*  Login  */
.compte_login h1 {
    margin-top: 30px;
    margin-bottom: 30px;
}
.compte_login .bloc_gris {
    margin-bottom: 20px;
}
.compte_login .login_formulaire {
    max-width: 450px;
}
.compte_login .login_formulaire .lien_orange {
    margin-top: 10px;
    display: block;
}
.compte_login p {
    font-size: 18px;
    line-height: 120%;
    display: block;
    margin-bottom: 30px;
}

/*  Creation  */
.compte_creation p {
    line-height: 140%;
    padding: 10px 0;
}
.compte_creation .radios {
    margin-top: 50px;
}
.compte_creation label {
    margin-left: 5px;
}

/*  mon compte  */
.mon_compte h1 {
    margin-bottom: 20px;
}
.mon_compte .bloc_gris {
    margin-bottom: 20px;
}
.grey_tab .flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
}
.grey_tab .prix {
    font-weight: 600;
}
.grey_tab .titre {
    font-weight: 600;
    text-align: left;
    flex: 1;
}
.grey_tab .visuel {
    text-align: right;
}
.grey_tab {
    margin-top: 30px;
}
.grey_tab .row_grey {
    background-color: rgba(255,255,255,0.5);
}
.grey_tab .flex div {
    padding: 10px;
}
.grey_tab .row {
    cursor: pointer;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
.grey_tab .row:last-child {
    border-bottom: 0;
}
.grey_tab .row:hover {
    background-color: rgba(255,255,255,0.8);
}
.grey_tab img {
    height: 80px;
    width: auto;
}



/************************************************/
/*               Pages Commande                 */
/************************************************/

/*  GÃƒÂ©nÃƒÂ©ral  */
.commande  {

}
.tunnel {
    display: flex;
    justify-content: center;
    align-items: top;
    flex-wrap: nowrap;
    margin: 40px 0;
    margin-bottom: 60px;
}
.tunnel .rond {
    text-align: center;
    position: relative;
}
.tunnel .rond:hover .picto {
    transform: scale(1.2);
}
.tunnel .rond .picto {
    width: 80px;
    height: 80px;
    background-color: #00213b;
    border-radius: 100px;
    background-image: url(../icons/commande/commande_panier.svg);
    background-position: center center;
    background-size: 50% auto;
    background-repeat: no-repeat;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.tunnel .panier .picto {
    background-image: url(../icons/commande/commande_panier.svg);
    background-size: 50% auto;
}
.tunnel .adresse .picto {
    background-image: url(../icons/commande/commande_adresse.svg);
    background-size: 50% auto;
}
.tunnel .paiement .picto {
    background-image: url("../icons/commande/commande_paiement.svg");
    background-size: 50% auto;
}
.tunnel .validation .picto {
    background-image: url("../icons/commande/commande_validation.svg");
    background-size: 50% auto;
}
.tunnel .rond .texte {
    margin-top: 10px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.tunnel .active {
    pointer-events: none;
    transform: scale(1.1);
}
.tunnel .active .picto {
    background-color: #ee5622;
}
.tunnel .disable {
    pointer-events: none;
}
.tunnel .disable .picto {
    background-color: #e0e1e3;
}
.tunnel .disable .texte {
    opacity: 0.4;
}
.tunnel .ligne {
    width: 90px;
    height: 4px;
    background-color: #e0e1e3;
    margin-top: 40px;
}
@media only screen and (max-width : 768px) {
    .tunnel {
        margin: 40px 0;
        margin-bottom: 60px;
    }
   .tunnel .rond .picto {
        width: 60px;
        height: 60px;
    }
    .tunnel .ligne {
        margin-top: 30px;
        width: 40px;
        height: 2px;
    }
}




.commande .bloc_gris {
    margin-bottom: 10px;
}



/*  Panier  */
.commande_panier .flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.commande_panier img {
    height: 170px;
    border: 1px solid #000;
}
.commande_panier .infos {
    flex: 1;
    padding: 0 20px;
}
.commande_panier .prix_unit {
    text-align: center;
    width: 50%;
    padding: 20px 0;
}
.commande_panier .prix {
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    width: 50%;
    padding: 20px 0;
}
.commande_panier .quantite {
    padding-right: 10px;
    display: inline-block;
}
.commande_panier .lien_orange {
    display: inline-block;
}
.commande_panier .lien_orange {
    display: inline-block;
}
.commande_panier .total {
    font-size: 20px;
    font-weight: 400;
    text-align: center;
    width: 100%;
}
.commande_panier .total b {
    font-size: 26px;
    margin-left: 10px;
}
.commande_panier .liens_infos {
    
}
@media only screen and (max-width : 768px) {
   .commande_panier .liens_infos {
        text-align: center;
        padding: 20px 0;
    }
}


/*  Commande Adresse  */
.radio_bloc {
    margin-top: 10px;
}
.radio_bloc .rang {
    display: flex;
    padding: 10px;
}
.radio_bloc .rang .radio {
    display: inline-block;
}
.radio_bloc .rang .texte {
    display: inline-block;
    margin-left: 10px;
}
.highlight {
    background-color: #fff;
    box-shadow: 0px 0px 5px rgba(0,0,0,.2);
}
.carnet_titre {
    color: #ee5622;
    font-size: 20px;
    font-weight: 600;
    margin: 10px 0;
}
.methode_expedition {
    background-color: #fff;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    font-size: 20px;
    font-weight: 200;
}

.contenu_commande {
    
}
.contenu_commande .entete {
    padding-bottom: 10px;
}
.contenu_commande .col_produits {
    
}
.contenu_commande .col_prix, .contenu_commande .col_tva {
    text-align: right;
    width: 50%;
}
.contenu_commande .filet {
    margin: 10px 0;
}
.contenu_commande .total {
    font-size: 20px;
    padding-top: 10px;
}

.radio_paiements .rang {
    border: 1px solid #d3d4d7;
    margin-bottom: 20px;
}
.radio_paiements .rang:last-child {
    margin-bottom: 0;
}
.radio_paiements img, .valid_paiements img {
    display: block;
    margin: 10px 0;
    height: 50px;
    width: auto;
}
.radio_adresses .rang {
    border: 1px solid #d3d4d7;
    margin-bottom: 20px;
}
.radio_adresses .rang:last-child {
    margin-bottom: 0;
}
h3.WarnCanada{
  color: #ee5622;
  background-color: #FFF;
  padding:5px;
}
.Warning{
  color: #ee5622;
  background-color: #FFF;
  font-weight: bold;    
}

@media only screen and (max-width : 768px) {
   .contenu_commande .col_produits {
        margin-bottom: 10px;
    }
    .contenu_commande .col_prix, .contenu_commande .col_tva {
        text-align: center;
    }
}



/************************************/
/*        Liste Produits            */
/************************************/

.liste_produits {
    
}
.LinksPN {
	
}
.LinksPN td {
	padding-bottom: 10px;
}
.LinksPN i {
	padding: 0 5px;
	padding-top: 5px;
}
.filtres {
   text-align: right; 
}
.pull_filtres {
   margin-top: 15px;
}
.pull_filtres label{
	display: inline-block; 
 	margin: 0 10px;
}
.pull_filtres select{
	display: inline-block;
}
.filtres select {
	margin-left: 10px;
 	margin-bottom: 10px;
	background-color: #fff;
}
.liste_produits .ligne {
    display: flex;
    justify-content: space-between;
    align-items: top;
    flex-wrap: nowrap;
}
.liste_produits .ligne .visuel {
    width: 150px;
    text-align: center;
	
}
.liste_produits .ligne .visuel img {
    height: 150px;
    width: auto;
	box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
}
@media only screen and (max-width : 768px) {
	.liste_produits .ligne .visuel {
        width: 30%;
        text-align: center;
    }
    .liste_produits .ligne .visuel img {
        height: auto;
        width: 100%;
    }
}
.liste_produits .ligne .texte {
    flex: 1;
    padding-left: 20px;
    text-align: left;
}
.liste_produits .ligne {
    padding: 20px;
}
.liste_produits .ligne.color {
    background-color: rgba(255,255,255,0.8);
}
.liste_produits .ligne h3 {
    font-size: 20px;
}
.liste_produits .ligne p.auteur {
    font-weight: 200;
    margin: 3px 0;
}
.liste_produits .ligne p.resume {
    font-weight: 100;
}
.liste_produits .ligne p.prix {
    margin: 0;
    padding: 0;
    font-size: 18px;
    margin-top: 10px;
}

/* Pagination */
.pages_count {
	text-align: center;
	width: 100%;
	padding: 20px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}
.pages_count .number {
	color: #000;
	border-radius: 100px;
	display: inline-block;
	width: 34px;
	height: 34px;
	line-height: 30px;
	text-align: center;
	margin: 0 3px;
	font-size: 16px;
	transition: all 0.2s ease-out;
    background-color: #fff;
    border: 1px solid #d3d4d7;
}

.pages_count a.number:hover {
	transform: scale(1.2);
}
.pages_count .active {
	color: #fff;
	background-color: #ee5622;
    border: 1px solid #ee5622;
    pointer-events: none;
}
.pages_count .arrow {
    font-size: 18px;
    line-height: 34px;
	height: 34px;
    display: inline-block;
    margin: 0 10px;
    color: #000;
}

@media only screen and (max-width : 768px) {
	.pages_count a {
		width: 24px;
		height: 24px;
		line-height: 20px;
		margin: 0;
		font-size: 14px;
	}
    a.small_btn{
        white-space: nowrap;
    }
}




/************************************/
/*             Popup                */
/************************************/
.popup {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.5);
	z-index: 1000;
    overflow-y: auto;
	display: none;
}
.popup .cadre {
    min-height: 100px;
    min-width: 100px;
    background-color: #f3f4f6;
    position: absolute;
    display: block;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    box-shadow: 0px 0px 5px rgba(0,0,0,.2);
    padding: 40px;
    width: 100%;
    max-width: 800px;
}
.popup .x_close {
    width: 35px;
    height: 35px;
    border-radius: 100px;
    background-color: #fff;
    background-image: url(../icons/croix.png);
    background-repeat: no-repeat;
    background-size: auto 40%;
    background-position: center center;
    -webkit-transition: all 0.1s ease-out;
	-moz-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
    box-shadow: 0px 0px 5px rgba(0,0,0,.2);
    position: absolute;
    right: 10px;
    top: 10px;
    cursor: pointer;
}
.popup .x_close:hover {
	background-size: auto 30%;
}

.popup .formulaire_nouvelle_adresse {
    padding-bottom: 40px;
}
.popup .formulaire_nouvelle_adresse form {
    max-width: 600px;
    position: relative;
    margin: auto;
}
.popup .formulaire_nouvelle_adresse .round_btn {
    position: absolute;
    right: 20px;
    bottom: 20px;
}
.popup .formulaire_nouvelle_adresse .mention {
    position: absolute;
    left: 20px;
    bottom: 20px;
}

/*****************************************/
/********      pseudo popup      *********/
/*****************************************/

.supLayer{
    position:absolute;
    top:0;
    left:0;
    background-color: #DDDDDD80;
    width:100%;
    height: 300%;
    z-index: 5001;
    display:none;
}
.supLayer .modale{
    min-width: 300px;
    width:40%;
    margin:auto;
    margin-top: 50vh; /* poussÃƒÂ© de la moitiÃƒÂ© de hauteur de viewport */
/*    margin-top: 150%; /* poussÃƒÂ© de la moitiÃƒÂ© de hauteur de viewport */
    transform: translateY(-50%); /* tirÃƒÂ© de la moitiÃƒÂ© de sa propre hauteur */    
    background-color: #FFF;
    text-align: center;
    border-radius: 10px;
    border: 10px solid #DDDDDD;
    border-radius: 10px;
    box-shadow: 5px 5px 20px #000000;
}
.modale h3{
    margin:20px;
    color:#ee5622;
}
.modale .modaleClose{
    background-color: silver;
    display: inline-block;
    height:20px;
    width:20px;
    float:right;
    color:#FFF;font-weight: bold;
    cursor:pointer;
 }
.modaleClose:before{
    content:'X';
}
.modaleClose:hover{
    background-color: grey;
}


a.ePubLink{
  width:50px;
  height: 30px;
  background-image:url(../img/ePubSprite30.jpg);
  margin: 5px;
  display: inline-block;
  border-radius: 5px;
  -moz-box-shadow: 2px 2px 5px 0px #cfcfcf;
  -webkit-box-shadow: 2px 2px 5px 0px #cfcfcf;
  -o-box-shadow: 2px 2px 5px 0px #cfcfcf;
  box-shadow: 2px 2px 5px 0px #cfcfcf;
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=134, Strength=5);
}
.ePubLink:hover{
  -moz-box-shadow: 2px 2px 5px 0px #656565;
  -webkit-box-shadow: 2px 2px 5px 0px #656565;
  -o-box-shadow: 2px 2px 5px 0px #656565;
  box-shadow: 2px 2px 5px 0px #656565;
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=5);  
  }

a.ePubLink40{
  width:67px;
  height: 40px;
  background-image:url(../img/ePubSprite.jpg);
  margin: 5px;
  display: inline-block;
  border-radius: 5px;
  -moz-box-shadow: 2px 2px 5px 0px #cfcfcf;
  -webkit-box-shadow: 2px 2px 5px 0px #cfcfcf;
  -o-box-shadow: 2px 2px 5px 0px #cfcfcf;
  box-shadow: 2px 2px 5px 0px #cfcfcf;
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#cfcfcf, Direction=134, Strength=5);
}
.ePubLink40:hover{
  -moz-box-shadow: 2px 2px 5px 0px #656565;
  -webkit-box-shadow: 2px 2px 5px 0px #656565;
  -o-box-shadow: 2px 2px 5px 0px #656565;
  box-shadow: 2px 2px 5px 0px #656565;
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=5);  
  }

#scroll_to_top {
  position: fixed;
  width: 35px;
  height: 35px;
  bottom: 50px;
  right: 50px;
  display: none;
  opacity: 0.4;
  cursor:pointer;
  z-index: 10000;
}
#scroll_to_top:hover {
  opacity: .9;
}
.required{
    display: inline-block;
    margin-left: 5px;
    color:#000;
}
a.default_link, a.smallLink, .smallLink a, .default_link a{
    text-decoration: underline;
}
a.default_link:hover, .smallLink a:hover, .default_link a:hover{
    text-decoration: none;
    color:#ee5622;
}
a.smallLink{
    font-size: .8em;
    margin:0 10px;
}
a.smallLink:hover{
    color:#ee5622;   
}
.imgAuteur{    
    float:left;
    margin-right: 10px;
}
.bioAuteur{
    min-height: 200px;
}

#ville_list{
    Position:absolute;
    left:130px;
    margin-top:50px;
    background-color: #FFF;
    padding:5px;
    border: 1px solid silver;
    border-radius:5px;
    box-shadow: 5px 5px 15px rgba(0,0,0,1);
    display:none;
}
#FSVille legend{
    font-size:1.2em;
}
#ulVille{
    list-style-type: none;
}
.listeVille{
    cursor:pointer;
    margin:1px;
    padding:3px;
}
.listeVille:hover{
    background-color: #FCC70F;
}
.sub_cats{
    list-style-type: none;
    padding-left: 0;
    margin: 0 20%;
} 
.sub_cats li{
    margin:2px;
    padding:2px;
    padding-left: 10px;
    background-color: #FFF;
    font-size: 1.2em;
} 
.sub_cats li a{
    font-size: 1.1em;

}
.sub_cats li:hover{

}

.lien_video{
    color:#000;
    padding-left: 24px;
    background-image: url("../icons/ico_video_orange.svg");    
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: left center;
	font-weight: 500;
}
.lien_video:hover {
    color:#ee5622;
    text-decoration: underline;
}
#header_diateino{
    padding:10px;
    margin:10px auto;
    text-align: center;
}
.bloc_blanc{
    background-color: #FFF;
    padding:5px;
    border-radius: 5px;
}
.black{
    color:#000;
}
.all_col{
    list-style-type: none;
}
.all_col li{
    margin:5px 0;
}
.all_col li a{
    font-weight: bold;
    display:block;
}
.all_col li a:hover{
    color:#ee5622;
}



/************************************/
/*        Reseaux Sociaux           */
/************************************/


.reseaux_sociaux {
	
}
.reseaux_sociaux .bloc {
	display: flex;
	margin-bottom: 80px;
}
.reseaux_sociaux .bloc div{
}
.reseaux_sociaux .bloc .tampon {
	width: 10%;
	position: relative;
}
.reseaux_sociaux .bloc .visuel {
	width: 35%;
	position: relative;
	padding: 20px;
	padding-top: 0;
	z-index: 200;
}
.reseaux_sociaux .bloc .visuel .images {
	width: 100%;
	position: relative;
	aspect-ratio: 1/1;
}
.reseaux_sociaux .bloc .visuel .deco{
	width: 50%;
	position: absolute;
}
.reseaux_sociaux .bloc .visuel img {
	width: 100%;
	height: auto;
}
.reseaux_sociaux h3 {
	font-family: 'optimabold', sans-serif;
    color: #000;
	font-size: 30px;
	margin: 0;
	padding: 0;
	font-weight: normal;
}
.reseaux_sociaux .bloc .infos {
	width: 65%;
}
.reseaux_sociaux .bloc .rang {
	width: 100%;
	display: flex;
}
.reseaux_sociaux .bloc .rang1 {
	height: 30%;
	justify-content: space-between;
	align-items: flex-end;
	padding-bottom: 20px
}
.reseaux_sociaux .bloc .rang2 {
	height: 30%;
	background-color: #00213b;
	color: #fff;
	display: flex;
	align-items: center;
}
.reseaux_sociaux .bloc .rang2 p {
	font-size: 22px;
	padding: 10px 30px;
	margin: 0;
}
.reseaux_sociaux .bloc .rang3 {
    margin-top: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.reseaux_sociaux .bloc .icons {
	text-align: right;
	white-space: nowrap;
}
.reseaux_sociaux .bloc .icons img {
	height: 50px;
	width: auto;
	margin-left: 10px;
	transition: all 0.2s ease-out;
}
.reseaux_sociaux .bloc .icons img:hover {
	transform: scale(1.2);
}
.reseaux_sociaux .bloc .post {
	width: 150px;
	height: auto;
	margin-right: 20px;
	margin-top: 20px;
	transition: all 0.2s ease-out;
}
.reseaux_sociaux .bloc .post:hover {
	transform: scale(1.1);
}
.reseaux_sociaux .bloc .post img { 
	width: 100%;
	height: auto;
}

@media only screen and (max-width : 1200px) {
	.reseaux_sociaux .rang1 h3 {
		font-size: 26px;
	}
	.reseaux_sociaux .bloc .icons img {
		height: 36px;
		margin-left: 7px;
	}
	.reseaux_sociaux .bloc .post {
		width: 120px;
		margin-right: 12px;
		margin-top: 12px;
	}
	.reseaux_sociaux .bloc .rang2 p {
		font-size: 18px;
	}
}
@media only screen and (max-width : 992px) {
   .reseaux_sociaux .bloc .tampon {
		display: none;
	}
	.reseaux_sociaux .bloc .rang2 p {
		font-size: 16px;
	}
}
@media only screen and (max-width : 768px) {
	.reseaux_sociaux .rang1 h3 {
		font-size: 22px;
	}
	.reseaux_sociaux .bloc {
		display: block;
	}
	.reseaux_sociaux .bloc .visuel {
		width: 100%;
		text-align: center;
		padding: 20px 15%;
		padding-bottom: 40px;
	}
	.reseaux_sociaux .bloc .infos {
		width: 100%;
	}
	.reseaux_sociaux .bloc .rang2 p {
		font-size: 18px;
		padding: 20px 30px;
		margin: 0;
		text-align: center;
	}
	.reseaux_sociaux .bloc .post {
		width: 120px;
		margin: 20px 10px;
		transition: all 0.2s ease-out;
	}
	.reseaux_sociaux .bloc {
		margin-bottom: 20px;
	}
	
}



/*   Tredaniel ESO   */
.reseaux_sociaux .bloc1 .rang2  {
	background-color: #00213b;
	color: #fff;
}
.reseaux_sociaux .bloc1 .visuel .deco{
	width: 50%;
	position: absolute;
	bottom: -10%;
	left: -18%;
}



/*   Tredaniel Bienvivre   */
.reseaux_sociaux .bloc2 .rang2 {
	background-color: #ffb35a;
	color: #000;
}
.reseaux_sociaux .bloc2 .visuel .deco{
	width: 50%;
	position: absolute;
	bottom: -10%;
	right: -30%;
}
@media only screen and (max-width : 768px) {
	.reseaux_sociaux .bloc2 {
		display: flex;
		flex-direction: column;
	}
	.reseaux_sociaux .bloc2 .visuel{
		order: 1;
	}
	.reseaux_sociaux .bloc2 .infos{
		order: 2;
	}
}



/*   Tredaniel Reflexion   */
.reseaux_sociaux .bloc3 .rang2  {
	background-color: #ee5622;
	color: #fff;
}
.reseaux_sociaux .bloc3 .visuel .deco{
	width: 30%;
	position: absolute;
	bottom: -10%;
	left: -5%;
}


/*   Exergue Formation   */
.Exergue_Formation {
	margin-top: 60px;
}
.bloc_exergue {
	display: flex;
	width: 100%;
}
.bloc_exergue .visuel {
	width: 45%;
	padding: 20px;
	padding-left: 5%;
}
.bloc_exergue .visuel .deco{
	width: 30%;
	position: absolute;
	top: -5%;
	left: -20%;
}
.bloc_exergue .visuel .images {
	width: 100%;
	position: relative;
}
.bloc_exergue .visuel img {
	width: 100%;
	height: auto;
}
.bloc_exergue .texte {
	width: 55%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.bloc_exergue .texte p {
	display: block;
	font-size: 22px;
	padding-bottom: 30px;
	margin: 0;
}

@media only screen and (max-width : 992px) {
   .bloc_exergue .texte {
		align-items: flex-start;
	}
	.bloc_exergue .texte p {
		font-size: 18px;
	}
}
@media only screen and (max-width : 768px) {
	.bloc_exergue {
		flex-direction: column;
	}
	.bloc_exergue .visuel {
		width: 100%;
		padding: 20px;
	}
	.bloc_exergue .texte {
		width: 100%;
		align-items: center;
	}
	.bloc_exergue .texte p {
		display: block;
		font-size: 18px;
		padding: 20px;
		padding-bottom: 30px;
		text-align: center;
	}
}




/*  Animation des Blocs  */

.reseaux_anim_bloc {
    transform: none;
}
.reseaux_anim_bloc .tampon {
	transition: all 0.5s ease;
}
.reseaux_anim_bloc {
    transition: opacity 0.5s ease;
  }
.reseaux_anim_bloc .visuel {
    transition: all 0.5s ease;
	transition-delay: 0.2s;
  }
.reseaux_anim_bloc .infos {
    transition: all 0.5s ease;
	transition-delay: 0.4s;
}
.reseaux_anim_bloc .infos .post1 img {
    transition: all 0.2s ease;
	transition-delay: 0.5s;
}
.reseaux_anim_bloc .infos .post2 img {
    transition: all 0.2s ease;
	transition-delay: 0.6s;
}
.reseaux_anim_bloc .infos .post3 img {
    transition: all 0.2s ease;
	transition-delay: 0.7s;
}

/*  position initiale  */

.reseaux_anim {
    opacity: 0;
    transform: translateY(40vh);
}
.reseaux_anim .tampon {
    opacity: 0;
	transform: translateX(100px);
}
.reseaux_anim .visuel {
	opacity: 0;
    transform: scale(0);
}
.reseaux_anim .infos {
    opacity: 0;
    transform: translateX(-100px);
}
.reseaux_anim .infos .post1 img, .reseaux_anim .infos .post2  img, .reseaux_anim .infos .post3  img {
    opacity: 0;
    transform: scale(0);
}
















