@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');
:root {
    --padding-v: 30px;
	--padding-h: 20px;

    --color-ffffff: #ffffff;
    --color-f7f7f8: #f7f7f8;
    --color-f2f2f3: #f2f2f3;
    --color-eeeeee: #eeeeee;
    --color-e6e7e8: #e6e7e8;
    --color-c9c9c9: #c9c9c9;
    --color-999999: #999999;
	--color-666666: #666666;
    --color-333333: #333333;
    --color-0a0a0a: #0a0a0a;	
    
	--color-0054a6: #0054a6;
    --color-222d65: #222d65;
    --color-8db7e1: #8db7e1;

	--color-f8d9dd: #f8d9dd;
	--color-e12324: #e12324;
	--color-009c4c: #009c4c;
	--color-ffb91e: #ffb91e;
    
    --color-rgba1010100-3: var(--color-rgba1010100-3);
}

/* Clearfix */
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { display: inline-block; } /* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; } /* close commented backslash hack */

/* Alignments */
.align-left { text-align: left; }
.align-center { text-align: center; }
.align-right { text-align: right; }
._valign-parent { height:100%;  z-index:2; font-size:0; text-align:center }
._valign-parent:before { content:''; display:inline-block; height:100%; vertical-align:middle }
._valign-child { display:inline-block; vertical-align:middle }
/**/

/* Margin and padding */
.no-margin { margin: 0 !important; }
.no-border { border: 0 !important; }
.no-padding { padding: 0 !important; }
/**/

.show-on-desktop-only { display: none; }
@media screen and (min-width: 768px) {
    .show-on-mobile-only { display: none; }
    .show-on-desktop-only { display: block; }
}

html, body { margin: 0; padding: 0; font-family: "Roboto", Arial, Helvetica, sans-serif; font-weight: 400; font-size: 16px; line-height: 25px; }

/* CONTENT */
.lvl-content { padding: 50px 0; }
.lvl-content .container { box-sizing: border-box; }
.breadcrumb { padding: 5px 20px; background: var(--color-0054a6); font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 13px; font-weight: 400; color: var(--color-ffffff); }
.breadcrumb a,
.breadcrumb a:link, .breadcrumb a:visited { text-decoration: none; color: var(--color-8db7e1); }
.breadcrumb a:hover, .breadcrumb a:active { text-decoration: underline; }
.breadcrumb a:first-of-type { color: var(--color-ffffff);}
.breadcrumb a:not(:last-child):after { content: ""; margin: 0 6px 0 10px; display: inline-block; width: 6px; height: 8px; background-image: url(../images/icons/theme/chevron-white.svg); background-repeat: no-repeat; background-position: center; background-size: 16px; opacity: 0.5; }


.JSfilterDiv { display: none; }        
.JSfiltershow { display: block; }


.lvl-main { }
main section { margin-bottom: 120px; }
.lvl-aside { padding-right: 0; }
.sidebox {  }
aside .sidebox { display: block; margin: 0 0 20px 0; padding: 0; }
aside .sidebox > h3 { display: block; margin: 0; padding: 15px;
    font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 16px; line-height: 25px; font-weight: 700; line-height: 25px; color: var(--color-ffffff); -webkit-font-smoothing: antialiased !important;
    background: var(--color-0054a6); text-align: left;
}
aside .sidebox nav { margin: 0; padding: 15px; width: 100%; box-sizing: border-box;
    border-left: 1px solid var(--color-c9c9c9); border-right: 1px solid var(--color-c9c9c9); border-bottom: 1px solid var(--color-c9c9c9);
}
aside .sidebox nav ul { margin: 0; padding: 0; }
aside .sidebox nav ul li { margin: 0; padding: 0; }
aside .sidebox nav ul li::before { display: none; }
aside .sidebox nav ul li a { display: block; font-size: 14px; line-height: 1.5em; font-weight: 700; color: var(--color-0a0a0a); }
aside .sidebox nav ul li a:link, aside .sidebox nav ul li a:visited { text-decoration: none; color: var(--color-0a0a0a); }
aside .sidebox nav ul li a:hover, aside .sidebox nav ul li a:active { text-decoration: none; color: var(--color-0054a6); }

aside .content-container { margin: 0; padding: 15px; width: 100%; box-sizing: border-box; background-color: var(--color-f7f7f8); }
aside .sidebox > h2 { display: block; margin: 0; padding: 15px;
    font-family: "Roboto", Arial, Helvetica, sans-serif; font-size: 16px; line-height: 25px; font-weight: 700; line-height: 25px; color: var(--color-ffffff); -webkit-font-smoothing: antialiased !important;
    background: var(--color-0054a6); text-align: left;
}

.bottom-btn .columns { position: relative; padding-bottom: 50px; }
.bottom-btn .columns p:last-of-type { position: absolute; bottom: 0; text-align: center; }
.bottom-btn .columns p:last-of-type a {  }

#iconographie .text-smaller { line-height: 25px; }
.logoR { margin-left: 30px; padding: 15px; background: var(--color-0a0a0a); }

@media screen and (min-width: 768px) {
    #lvl-content aside { padding-left: 0; }
    #lvl-content main { padding-left: 50px; padding-right: 0; }
}

/* Haut de page */
/* .haut-de-page { clear: both; text-align: right; }*/
a[title="Haut de page"]:before { content: ""; display: inline-block; margin: 0; width: 24px; height: 24px;
    background-image: url(../images/icons/theme/chevron.svg); background-size: 24px; background-repeat: no-repeat; background-position: center;
    vertical-align: top; -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -o-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg);
}

/* FOOTER */
footer { padding: var(--padding-v) 0; color: var(--color-ffffff); background-color: var(--color-0a0a0a); }
footer .container { box-sizing: border-box; }
footer a { color: var(--color-ffffff); }
footer a:link, footer a:visited { text-decoration: none; color: var(--color-ffffff); }
footer a:hover, footer a:active { text-decoration: none; color: var(--color-8db7e1); }
footer nav ul { margin: 0 0 40px 0; padding: 0; list-style-type: none; }
footer nav ul li { margin: 0 0 0.5em 0; padding: 0; list-style-type: none; font-size: 14px; }
footer nav ul li:before { display: none; }

footer .copyright { font-size: 13px; }

footer.footer-desktop { display: none; }
@media screen and (min-width: 768px) {
    footer.footer-mobile { display: none; }
    footer.footer-desktop { display: block; }
}
