/*
	Link, button etc colors and dynamic container widths are set in:
	Configuration/TypoScript/Setup/styles.ts and can be edited through TS constants
*/
	
/************************************************************************************************************************************/	

html {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	scroll-padding-top: 80px;
}

body {
	font-family: var(--fontprimary);
	font-weight:400;
	color: var(--lightblack);

}

body.color-0{
	background-color:var(--white);
}

.layoutcontainer{
	overflow:hidden;
}
/* paragraphes et liste à puce */
p,li{
	font-family:var(--fontprimary);
	color:var(--verydarkgrey);
	font-size:14px;
}

/**** chartage des liens ****/

/* suppression de l'icone lien externe sur les liens RTE */
.external-link::after{
	display:none;	
}

/* liens téléphone */
.homepage a[href^="tel:"], .one-col a[href^="tel:"],a.courriel {
    color: var(--secondary);
	font-weight:700;
    text-decoration: none;
}

/* liens par défaut */
a{
	text-decoration:underline;
	color:var(--verydarkgrey);
}

a:hover{
	text-decoration:none;
	color:var(--primary);
}

a.external-link{
	color:var(--secondary);
	font-weight:700;
	text-decoration:none;
}

a.internal-link{
	color:var(--darkblack);
	font-weight:700;
	text-decoration:underline;
	text-transform:uppercase;
}

a.internal-link:hover{
	text-decoration:none;
}

a.external-link:hover{
	color:var(--darksecondary);
	text-decoration:underline;
}

/**** titres ****/

h1,h2,h3,h4,h5{
	font-family: var(--fontprimary);
	color:var(--verydarkgrey);
}

h1{
	font-size: 1.8rem;
}

h2{
	font-size:1.5em;
}

h3, .one-col h2{
	font-size:1.17em;
}

h4, .one-col h3{
	font-size:1em;
	font-style: italic;
}  

h5, .one-col h4{
	font-size:0.83em;
}

h6, .one-col h5{
	font-size:0.67em;
}

.one-col h6{
	font-size:0.5em;
}

/**** zone titres pages ****/
h1,.zone-page h1 {
	padding-top: 2rem;
	}
	
.zone-page h1 {
	padding-top: 0;
	text-align: left;
}

/**** zone header ****/

header.header {
    padding: 0;
	height: 150px;
	position: relative;
	z-index:10;
}

header .zone-header{
	--bs-gutter-x: 0;
	height: 66px;
}

header .logo {
    position: relative;
    z-index: 100;
}

header img#logo {
    padding: 5px;
    min-width: 120px;
    max-height: 78px;
}

header .zone-logo {
    position: relative;
    left: 20px;
}

header .zone-logo a {
    position: relative;
    display: block;
}

header img#logosmall {
    height: 59px;
}

header .banner {
	position: absolute;
    width: 100%;
	top:2rem;

	&:focus {
		outline: -webkit-focus-ring-color auto 1px;
	}
	a:focus {
		img#banner {
			border: 2px solid #000;
		}
	}
}

header #banner{
	margin:0 auto;
	display:block;
	position:absolute;
	right:70px;
}

header #banner:focus {
    outline: -webkit-focus-ring-color auto 1px;
}

header #menuheader {
    position: absolute;
    display: block;
    right: 0;
    z-index: 100;
}

/**** background-colors ****/

.background-primary {
	background-color:var(--primary);
}

.background-secondary {
	background-color:var(--secondary);
}

.background-third {
	background-color:var(--third);
}

/**** HOME PAGE ****/

.homepage {
    top: -75px;
    position: relative;
}

/* mise en forme blocs home page */

.zone-home .frame-bloc-page-accueil .col-12:first-child {
    position: relative;
}

.zone-home .bloc-circuit img,.zone-home .bloc-preparer img{
	width:100%;
}

.zone-home .bloc-guide img{
	width:90%;
}

/* mise en forme titres blocs */

.frame-bloc-hp h2 {
    font-size: 7vw;
    color: var(--white);
	margin-top: 0;
    padding-top: 30px;
    text-align: center;
}

.zone-home .bloc-circuit h3,.zone-home .bloc-preparer h3,.zone-home .bloc-guide h3 {
	font-size: 4.5vw;
    padding: 0 1rem;
    font-weight: 500;
	text-align:center;
}

/* mise en forme btn blocs */
.zone-home .btn-primary {
    font-size: 16px;
    font-family: var(--fontbtn-link);
    font-weight: 600;
    border-radius: 25px;
    padding: 15px 40px;
    margin-top: 12px;
    margin-bottom: 10px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

/* bloc circuit */
.zone-home .bloc-circuit {
    -moz-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    -o-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    -webkit-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    background-color: var(--secondary);
    box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=RGBA(0,0,0,0.28),Direction=180,Strength=10);
}

.zone-home .bloc-circuit h3 {
    color: #ffea00;
}

.zone-home .bloc-circuit .btn-primary {
	background-color: #ffea00;
    color: #34675c;
}

/* bloc preparer */
.zone-home .bloc-preparer{
    -moz-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    -o-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    -webkit-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    background-color: #4cb5f5;
    box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=RGBA(0,0,0,0.28),Direction=180,Strength=10);
}

.zone-home .bloc-preparer h3 {
    color: #1e699f;
}

.zone-home .bloc-preparer .btn-primary {
	background-color: #1e699f;
    color: var(--white);
}

/* bloc guide */
.zone-home .bloc-guide{
    -moz-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    -o-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    -webkit-box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    background-color: #fdb813;
    box-shadow: inset 0 6px 10px 0 RGBA(0,0,0,0.28);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=RGBA(0,0,0,0.28),Direction=180,Strength=10);
}

.zone-home .bloc-guide h3 {
    color: var(--darkblack);
}

.zone-home .bloc-guide .btn-primary {
	background-color: var(--secondary);
    color: var(--white);
}

/* oblique */
.zone-home .bloc-circuit .oblique,.zone-home .bloc-preparer .oblique{
    -moz-box-shadow: inset 6px 6px 7px 0 RGBA(0,0,0,0.28);
    -o-box-shadow: inset 6px 6px 7px 0 RGBA(0,0,0,0.28);
    -webkit-box-shadow: inset 6px 7px 6px 0 RGBA(0,0,0,0.28);
    background-color: var(--secondary);
    box-shadow: inset 6px 6px 7px 0 RGBA(0,0,0,0.28);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=RGBA(0,0,0,0.28),Direction=180,Strength=10);
    height: 100%;
    position: absolute;
    right: 0;
    transform: skewX(+7deg);
    transform-origin: 100% 0;
    width: 100px;
    z-index: 0;
}

.zone-home .bloc-preparer .oblique{
	-moz-box-shadow: inset -6px 6px 7px 0 RGBA(0,0,0,0.28);
    -o-box-shadow: inset -6px 6px 7px 0 RGBA(0,0,0,0.28);
    -webkit-box-shadow: inset -6px 7px 6px 0 RGBA(0,0,0,0.28);
    background-color: #4cb5f5;
    box-shadow: inset -6px 6px 7px 0 RGBA(0,0,0,0.28);
    filter: progid:DXImageTransform.Microsoft.Shadow(color=RGBA(0,0,0,0.28),Direction=180,Strength=10);
    left: 0;
    transform: skewX(-7deg);
    transform-origin: 100% 0;
}

.container{
	max-width:1600px!important;
}

/**** zone main content ****/

/* Page */

.page {
    top: -64px;
    position: relative;
    overflow: hidden;
}

.page h2 {
	font-size: 20px;
	margin: 2rem 0;
	text-transform: uppercase;
    font-weight: 600;
	color:var(--third);
}

.page h3 {
	color:var(--secondary);
	margin: 1rem 1rem 0.5rem;
}

.zone-left {
    padding: 5px;
}

.zone-page{
	background-color:var(--white);
}

/* mise en forme zone titre gabarit page */

.page .pagetitle hr{
	background-color:var(--primary);
	height:2px;
	margin-top: 0;
}

/* Carrousel */
.carrousel {
    position: relative;
	height: 345px;
    z-index: -1;
}

.carrousel img.visuelhome {
    width: 100%;
    position: relative;
    top: 35px;
}

/* legendes images */
figcaption.image-caption {
    text-align: right;
    font-size: 0.75rem;
    font-style: italic;
	padding-bottom: 1rem;
}

.pagetitle a{
	text-decoration:none;
}

/**** PAGE SECTEUR ****/


/* titres */
.secteur .zone-page h1 {
    font-weight: 600;
    padding-left: 2rem;
}

.secteur .zone-page h2,.frame-type-menu_subpages h2,.right-column .frame-type-uploads h2 {
    text-transform: initial;
    color: var(--primary);
    font-weight: 400;
    font-size: 23px;
    margin: 1rem 0 0.5rem;
}

.secteur .zone-page .frame-type-list h3, .secteur .zone-page .frame-type-news_pi1 h3 {
    border-bottom: solid 1px;
	margin:0;
    margin-right: 3rem;
    font-size: 18px;
    margin-top: 2rem;
    color: var(--primary);
	
	
}

.frame-type-menu_subpages ul li a:hover{
	color:var(--secondary);
	text-decoration:underline;
}


.right-column .frame-type-uploads h2 {
    padding-left: 1rem;
	margin: 2rem 0 1rem;
	font-size:20px;
}

.right-column .frame-type-uploads h3 {
    font-size: 16px;
    margin: 0 0 1rem 1rem;
}

/* boucle locales */
.bloc-dl-boucle {
    background-color: #f2f3e0;
    border-radius: 10px;
    padding: 1rem;
    margin: 5px 0;
}

.bloc-dl-boucle a span {
    margin-bottom: 1rem;
    padding-top: 7px;
}

.bloc-dl-boucle i {
    padding-right: 1rem;
    color: var(--secondary);
}

.bloc-dl-boucle i.fas.fa-download {
    color: var(--primary);
    font-size: 28px;
    padding-right: 8px;
    float: left;
}

.bloc-dl-boucle a {
    text-decoration: none;
	font-size: 13px;
}

.bloc-dl-boucle a:hover {
    color: grey;
    text-decoration: underline;
}

.infoboucle {
    padding-left: 2rem;
}

.infoboucle span {
    display: inline;
    font-weight: 400;
    font-family: var(--fontprimary);
	font-size:12px;
	padding-left: 5px;
}

/* changer de secteur */

.frame-type-menu_subpages{
	background-color:var(--primary);
    padding: 5px 0 1rem;
}

.frame-type-menu_subpages h2::before{
	content:"\f105";
	font-family:var(--fontAwesome);
    font-weight: 600;
    font-size: 35px;
	line-height: 40px;
    vertical-align: middle;
    padding-left: 1rem;
    padding-right: 5px;
}

.frame.frame-type-menu_subpages h2 {
    color: var(--white);
    margin: 0;
    font-weight: 400;
    font-size: 23px;
    text-transform: initial;
}

.frame-type-menu_subpages ul{
    padding-left: 1rem;
    list-style: none;	
}

.frame-type-menu_subpages li{
	padding-bottom: 1rem;
    border-bottom: solid 1px var(--white);
    margin-right: 1rem;
}

.frame-type-menu_subpages li a{
	color: var(--white);
    text-decoration: none;
	padding:0;

}

.frame-type-menu_subpages li a:hover{
	text-decoration: underline;
}

/* Les pistes du secteur */
.secteur .zone-page .frame-type-list, .secteur .zone-page .frame-type-news_pi1 {
    margin-bottom: 2rem;
}

.secteur .zone-page .frame-type-list ul, .secteur .zone-page .frame-type-news_pi1 ul{
	-moz-columns: 1;
	list-style-type:none;
	-webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    -webkit-column-gap: 20px;
    column-gap: 20px;
    height: auto;
    -webkit-column-width: 78px;
    column-width: 78px;
    -webkit-column-rule-width: 0;
    column-rule-width: 0;
	padding:0;
}

.frame-type-list .news-list-view li, .frame-type-news_pi1 .news-list-view li {
    display: inline-block;
    margin: 5px 0;
    width: 100%;
}

/**** boutons couleur  ****/

/* btn primary */
.btn-check:active+.btn-primary, .btn-check:checked+.btn-primary, .btn-primary.active, .btn-primary:active, .show>.btn-primary.dropdown-toggle,.btn-primary{
	color:var(--white);
	background-color:var(--primary);
	border-color: var(--darkprimary);
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.btn-check:active+.btn-primary:focus, .btn-check:checked+.btn-primary:focus, .btn-primary.active:focus, .btn-primary:active:focus, .show>.btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.25rem var(--rgbprimary50);
}

.btn-check:focus+.btn-primary, .btn-primary:focus {
    color: var(--white);
    background-color: var(--darkprimary);
    border-color: var(--primary);
    box-shadow: 0 0 0 0.25rem var(--rgbprimary50);
}

/* btn secondary */
.btn-check:active+.btn-secondary, .btn-check:checked+.btn-secondary, .btn-secondary.active, .btn-secondary:active, .show>.btn-secondary.dropdown-toggle,.btn-secondary{
	color:var(--white);
	background-color:var(--secondary);
	border-color: var(--darksecondary);
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.btn-check:active+.btn-secondary:focus, .btn-check:checked+.btn-secondary:focus, .btn-secondary.active:focus, .btn-secondary:active:focus, .show>.btn-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.25rem var(--rgbsecondary50);
}

.btn-secondary:hover{
	color:var(--white);
	background-color:var(--darksecondary);
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.btn-check:focus+.btn-secondary, .btn-secondary:focus {
    color: #fff;
    background-color: var(--darksecondary);
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.25rem var(--rgbsecondary50);
}

/* btn third */
.btn-check:active+.btn-third, .btn-check:checked+.btn-third, .btn-third.active, .btn-third:active, .show>.btn-third.dropdown-toggle,.btn-third{
	color:var(--white);
	background-color:var(--third);
	border-color: var(--darkthird);
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.btn-check:active+.btn-third:focus, .btn-check:checked+.btn-third:focus, .btn-third.active:focus, .btn-third:active:focus, .show>.btn-third.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.25rem var(--rgbthird50);
}

.btn-third:hover{
	color:var(--white);
	background-color:var(--darkthird);
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

.btn-check:focus+.btn-third, .btn-third:focus {
    color: var(--white);
    background-color: var(--darkthird);
    border-color: var(--third);
    box-shadow: 0 0 0 0.25rem var(--rgbthird50);
}

.btn-info {
    color: var(--white);
    background-color: var(--primary);
    border-color: var(--lightprimary);
}

.btn-info:hover {
    color: var(--white);
    background-color: var(--primary);
    border-color: var(--primary);
}

.btn-readmore {
    background-color: transparent;
    border: none;
    border-radius: 0;
    font-size: 16px;
    font-weight: 400;
    position: relative;
    text-decoration: none;
    margin-bottom: 0;
    margin-right: 0;
    color: var(--darkblack);
    right: 0;
    text-align: end;
    display: block;
    padding: 0;
}

.zone-home .bloc-circuit .btn-primary:hover,.zone-home .bloc-preparer .btn-primary:hover,.zone-home .bloc-guide .btn-primary:hover{
	background-color:var(--white);
}

.zone-home .bloc-circuit .btn-primary:hover{
	color:var(--secondary);
	border: solid 1px var(--secondary);
}

.zone-home .bloc-preparer .btn-primary:hover{
	color:#1e699f;
}

.zone-home .bloc-guide .btn-primary:hover{
	color:var(--darkblack);
	border: solid 1px var(--darkblack);
}



.btn-readmore:hover {
	color:var(--third);
}

.btn-readmore:after{
	color: var(--white);
	height: 40px;
    display: inline-block;
    margin: -1px -14px -10px 19px;
    padding: 5px 10px 0 0;
    width: 40px;
	background:var(--third);
	content:"\f067";
	font-family:var(--fontAwesome);
	font-weight:700;
	font-size: 20px;
}

/******************** listes  ***********************/

/* suppression puce listes navbar et footer */
 ul.navbar-nav, .footer ul {
	list-style-type: none;
}

li::marker {
    font-size: 1.3rem;
}

/* liste ordonnées */
ol {
  counter-reset: listcompteur;
  list-style: none;
}
ol li {
	margin: 0 0 0.5rem 0;
	counter-increment: listcompteur;
	position: relative;
	min-height: 50px;
}
ol li::before {
	content: counter(listcompteur);
	color: var(--white);
	font-size: 1.3rem;
	font-weight: bold;
	position: absolute;
	--size: 28px;
	left: calc(-1 * var(--size) - 10px);
	line-height: 23px;
	width: var(--size);
	height: var(--size);
	top: 0;
	background: var(--primary);
	border-radius: 50%;
	text-align: center;
}

.ce-intext.ce-left ol, .ce-intext.ce-left ul{
	overflow:hidden;
}

/* surcharge frame-space-before et after */
.frame-space-before-extra-small{
	margin-top: 0;
	padding-top: 1em;
}

.frame-space-before-small{
	margin-top: 0;
	padding-top: 2em;
}

.frame-space-before-medium{
	margin-top: 0;
	padding-top: 3em;
}

.frame-space-before-large{
	margin-top: 0;
	padding-top: 4em;
}

.frame-space-before-extra-large{
	margin-top: 0;
	padding-top: 5em;
}

.frame-space-after-extra-small{
	margin-bottom: 0;
	padding-bottom: 1em;
}

.frame-space-after-small{
	margin-bottom: 0;
	padding-bottom: 2em;
}

.frame-space-after-medium{
	margin-bottom: 0;
	padding-bottom: 3em;
}

.frame-space-after-large{
	margin-bottom: 0;
	padding-bottom: 4em;
}

.frame-space-after-extra-large{
	margin-bottom: 0;
	padding-bottom: 5em;
}


.row {
    align-items: flex-start;
}

/**** page detail piste ****/

.space{
	justify-content: center;
	margin:0;
}

.zone-page .frame-type-ce_columns2{
    background-color: var(--white);
}

/* accordeon page piste*/

#accordionFlushExample img {
    border-top-left-radius: 60px;
}

#accordionFlushExample .zone-txt {
    padding: 1rem 1rem;
}

#accordionFlushExample .center-txt {
    padding-top: 2rem;
}

#accordionFlushExample {
	position: relative;
    background-color: #edf0c3;
    padding: 0;
}

.zone-droite {
    padding-left: 0;
}

.zone-gauche .zone-droite {
    padding-left: inherit;
}

#accordionFlushExample .collapsing {
    height: 0;
    overflow: hidden;
    transition: opacity .35s ease;
}

#accordionFlushExample .zone-txt i.picto{
	font-size: 18px;
    color: var(--secondary);
    padding-right: 10px;
}

#accordionFlushExample .zone-txt h4 {
    font-style: normal;
    font-size: 18px;
}

#accordionFlushExample .zone-txt h3 {
    font-size: 24px;
    font-weight: 600;
	color:var(--secondary);
    margin: 10px;
    padding: 0;
}

#accordionFlushExample .distance ul {
    list-style-type: none;
    display: flex;
    flex-direction: row;
	align-items: flex-start;
    justify-content: space-between;
    align-content: center;
    flex-wrap: wrap;
	background-color: #f2f5d1;
	padding: 0 20px;
}

#accordionFlushExample .distance li.separe{
	border-left: solid 1px var(--darkblack);
    height: 34px;
    margin-top: 8px;
}

#accordionFlushExample .distance-title,#accordionFlushExample .chiffre {
    display: block;
    text-align: center;
}

#accordionFlushExample #total{
	font-size:20px;
	font-weight:700;
}

#accordionFlushExample .nav-pills .nav-link.active {
    color: var(--white);
    background-color: var(--primary);
    box-shadow: inset 0px -4px 5px 0px rgba(0,0,0,.125);
	border-radius: 0;
    margin: 0;
}

#accordionFlushExample .nav-pills .nav-link{
	font-weight: 700;
    color: #6d7415;
    text-align: center;
    display: block;
	background-color:#edf0c3;
    box-shadow: inset 0px -4px 5px 0px rgba(0,0,0,.125);
	height: 80px;
	border-radius: 0;
    margin: 0;
}

#accordionFlushExample .absolute {
	position: absolute;
	width: 100%;
	right: 0;
	top: -80px;
}

#accordionFlushExample .absolute .nav{
	flex-direction:row;
    justify-content: space-between;
    flex-wrap: nowrap;
}

#accordionFlushExample .absolute button i{
	display: block;
    font-size: 23px;
}

#accordionFlushExample .nav-pills .nav-link{
	width:100%;
}

	
	
/* tags accordion */

.facile, .moyen, .difficile, .inf30min, .inf1h, .sup1h {
    background-position-y: 3px;
    background-position-x: 7px;
    background-repeat: no-repeat;
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 0.25rem;
}

.facile, .facile a:hover, .facile a:active, .facile a:focus {
	background-image:url("/fileadmin/template/assets/tags/tag-facile.png");
}

.moyen,.moyen a:hover,.moyen a:active,.moyen a:focus 
{
	background-image:url("/fileadmin/template/assets/tags/tag-moyen.png");
}

.difficile,.difficile a:hover,.difficile a:active,.difficile a:focus 
{
	background-image:url("/fileadmin/template/assets/tags/tag-difficile.png");
}

.inf30min,.inf30min a:hover,.inf30min a:active,.inf30min a:focus 
{
	background-image:url("/fileadmin/template/assets/tags/tag-temps-facile.png");
}

.inf1h,.inf1h a:hover,.inf1h a:active,.inf1h a:focus 
{
	background-image:url("/fileadmin/template/assets/tags/tag-temps-moyen.png");
}

.sup1h,.sup1h a:hover,.sup1h a:focus,.sup1h a:focus 
{
	background-image:url("/fileadmin/template/assets/tags/tag-temps-difficile.png");
}

.tag, a.pdf-gps {
    background-color: var(--darkwhite);
    border: solid 1px var(--primary);
    border-radius: 25px;
    color: var(--secondary);
    font-size: 14px;
    font-weight: 700;
    padding: 10px 15px;
	text-decoration:none;
}

a.pdf-gps{
	border:none;
	background-color: var(--white);
    display: block;
    margin: 0 auto;
    width: 60%;
}

a.pdf-gps:hover {
    background-color: var(--secondary);
    color: var(--white);
	text-decoration:none;
}

a.pdf-gps i{
	color: var(--primary);
	padding-right:20px;
}

.tag {
    border-radius: 10px;
    padding-left: 50px;
    font-style: normal;
    margin-left: 2rem;
}

.tag.temps{
	margin-left:5rem;
}

/**** zone observer en chemin ****/
.zone-droite .observer {
    background-color: #edf0c3;
    padding: 0;
	margin: 0;
}

.zone-droite .observer h3{
    color: var(--darkgrey);
    padding: 11px;
	margin: 0;
	font-size:24px;
}

.zone-droite .observer h4{
    color: var(--secondary);
	font-size:18px;
	font-style:normal;
    font-weight: 600;
}

.zone-droite .observer h4 i{
	padding-right:14px;
}

.zone-droite .observer img {
    padding-bottom: 12px;
}

.frame-type-list .news ul, .frame-type-news_pi1 .news ul {
    -moz-columns: 1;
    list-style-type: none;
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    -webkit-column-gap: 20px;
    column-gap: 20px;
    height: auto;
    -webkit-column-width: 78px;
    column-width: 78px;
    -webkit-column-rule-width: 0;
    column-rule-width: 0;
	padding-left:0;
}

/**** menu col droite page-menu-col ****/

.page-menu-col h2 {
    margin: 0 0 2rem;
}

.page-menu-col .frame-type-menu_subpages {
    background-color: var(--white);
}

.page-menu-col .frame-type-menu_subpages li {
    margin: 0;
    margin-bottom: 1rem;
    padding: 0;
}

.page-menu-col .frame-type-menu_subpages li a {
    background-color: var(--white);
	border:solid 2px var(--primary);
	color:var(--primary);
    padding: 10px 0;
    width: 100%;
    display: block;
    text-align: center;
    border-radius: 26px;
}

.page-menu-col .frame-type-menu_subpages li a.active,.page-menu-col .frame-type-menu_subpages li a:hover,.page-menu-col .frame-type-menu_subpages li a:focus {
    background-color: var(--primary);
	border:solid 2px var(--white);
	color:var(--white);
	text-decoration:none;
}


/****  surcharge container cards ****/

.card{
	border:none;
}

.card-body {
    padding: 1rem 3rem;
	margin-top: 1rem;
}

.ce-card.cec-top.card img {
    border-radius: 16px;
}

/****  fiches pédagogiques junior ****/
.junior img {
	padding: 2rem 2rem 1rem;
    width: 100%;
    height: auto;
}

.carte-fiche-junior {
    padding: 0 10px 40px;
}

.junior .cadre {
	border: solid 1px var(--lightgrey);
	position: relative;
}

.junior .cadre::before{
	    border-color: var(--white) var(--white) #eaeaea var(--white);
    border-color: var(--white) var(--white) #ffd7b3 var(--white);
    border-style: solid;
    border-width: 0 40px 40px 0;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    right: -1px;
    top: -1px;
    width: 0;
}

.junior .cadre h3 {
	background-color: #f8f8f8;
    background-color: #fff3e8;
    color: #2c2c2c;
    margin: 0;
    padding: 10px 14px 8px;
    text-align: left;
}

.junior .cadre a{
	text-decoration:none;
}

.junior .btn-download {
    background-color: transparent;
    border: none;
    border-radius: 0;
    font-size: 16px;
    font-weight: 400;
    position: relative;
    text-decoration: none;
    margin-bottom: 0;
    margin-right: 0;
    color: var(--darkblack);
    text-align: end;
    display: block;
    padding: 0;
	right: 13px;
    bottom: 6px;
}

.junior .cadre a:hover .btn-download {
	color:var(--third);
}

.junior .btn-download:after{
	color: var(--white);
	height: 40px;
    display: inline-block;
    margin: -1px -14px -10px 19px;
    padding: 5px 10px 0 0;
    width: 40px;
	background:#f6851f;
	content:"\f019";
	font-family:var(--fontAwesome);
	font-weight:700;
	font-size: 20px;
}

.junior .cadre a:hover .description {
    color: var(--darkblack);
}

.junior .cadre .description {
    padding-left: 2rem;
    padding-bottom: 1rem;
}

/* menu top junior */
.menu-top .frame.frame-type-menu_subpages h2 {
	color:var(--verydarkgrey);
    padding-left: 1rem;
    font-size: 14px;
    padding-bottom: 10px;
}

.menu-top .frame.frame-type-menu_subpages h2::before {
    display: none;
}

.menu-top .frame-type-menu_subpages {
    background-color: var(--darkwhite);
}

.menu-top .frame-type-menu_subpages ul {
    text-align: center;
    display: inline-flex;
    width: 100%;
    justify-content: center;
	flex-direction: column;
}

.menu-top .frame-type-menu_subpages li {
    margin: 10px 0;
    border-radius: 15px;
	border-bottom: none;
	width: 100%;
}

.menu-top .frame-type-menu_subpages li a {
    background-color: var(--white);
    border: solid 2px #f6851f;
    border-radius: 30px;
    color: #f6851f;
    font-weight: 600;
    padding: 10px 6px;
    width: 92%;
    white-space: normal;
}

.menu-top .frame-type-menu_subpages li a.active, .menu-top .frame-type-menu_subpages li a:hover, .menu .frame-type-menu_subpages li a:focus {
    background-color: #f6851f;
    border: solid 2px var(--darkwhite);
    color: var(--white);
}

#accordionFlushExample .zone-txt{
	width:100%;
	padding:1rem 5px;
}

.observer .zone-txt p {
    padding: 0 1rem;
}

.observer .zone-txt {
    padding-bottom: 1rem;
}


.ce-intext.ce-left .ce-gallery {
    float: none;
}

.calameo-canvas iframe {
    width: 100%;
    height: 250px;
    border: 0;
}

.youtube_playlist_player iframe {
    width: 100%;
    height: 315px;
    border: 0;
}






/*************************************RESPONSIVE**************************************/
/*************************************RESPONSIVE**************************************/
/*************************************RESPONSIVE**************************************/














/*breackpoint bootstrap sm */
@media (min-width:576px) {
	
	header .zone-header{
		background-color: transparent;
		height: 105px;
	}

	header .linkbillet {
    font-size: 1.4rem;
	padding: 0 37px;
	height:63px;
	}
	
	#visuelzonebillet {
		top: 4px;
		left: -28px;
		position: absolute;
		width: 62px;
	}
	
	/* mise en forme titres blocs */
	.frame-bloc-hp h2 {
		font-size: 5vw;
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.zone-home .bloc-circuit h3,.zone-home .bloc-preparer h3,.zone-home .bloc-guide h3 {
		font-size: 2.7vw;
		padding: 0 1rem;
	}
	
	.secteur .zone-page .frame-type-list ul, .secteur .zone-page .frame-type-news_pi1 ul {
		-moz-columns: 2;
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
	}
	
	.frame-type-menu_subpages ul{
    padding-left: 3rem;	
	}
	
	.frame-type-menu_subpages li{
		margin-right: 8rem;
	}
	
	.menu-top .frame-type-menu_subpages ul {
		flex-direction: row;
	}
	
	.ce-intext.ce-left .ce-gallery {
    float: left;
}
}

/*breackpoint bootstrap md */
@media (min-width:768px) {
	
	/* mise en forme titres blocs */
	.frame-bloc-hp h2 {
		font-size: 3vw;
	}

	.zone-home .bloc-circuit h3, .zone-home .bloc-preparer h3, .zone-home .bloc-guide h3 {
		font-size: 2vw;
		padding: 0 1rem;
	}

	.zone-home .btn-primary {
		padding: 5px 25px;
		margin-top: 0;
		margin-bottom: 0;
	}
	
	header.header {
		height: 200px;
		background-size: cover;
		background-image:url("/fileadmin/template/assets/biseau_blanc.png");
		background-position-y: bottom;
		background-repeat: no-repeat;
	}
	
	header .logo {
		position: absolute;
		left: 3rem;
		width: 37%;
	}

	header img#logo{
		padding: 5px 10px;
		min-width:120px;
		max-height:150px;
	}
	
	.secteur .zone-page .frame-type-list ul, .secteur .zone-page .frame-type-news_pi1 ul{
		-moz-columns: 1;
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}
	
	header #banner{
		max-height:80px;
	}
	
	.zone-page .frame-type-ce_columns2{
		background-color: #fafbeb;
	}

	.frame-type-list .news ul, .frame-type-news_pi1 .news ul {
		-moz-columns: 2;
		list-style-type: none;
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
		-webkit-column-gap: 20px;
		column-gap: 20px;
		height: auto;
		-webkit-column-width: 78px;
		column-width: 78px;
		-webkit-column-rule-width: 0;
		column-rule-width: 0;
		padding-left:2rem;
	}
	
	#accordionFlushExample {
		margin-top: 100px;
	}

}

/*breackpoint bootstrap lg */
@media (min-width:992px) {
	
	/* surcharge position menu burger top*/
	.offcanvas-end {
		top: 0px!important;
	}

	.navbar-light .navbar-nav .nav-link.active{
		color:var(--darkprimary);
	}

	.navbar-light .navbar-nav .nav-link:focus,.navbar-light .navbar-nav .nav-link:hover {
		color: var(--darkprimary);
	}
	
	/* mise en forme titres blocs */
	.frame-bloc-hp h2 {
		font-size: 3vw;
	}

	.zone-home .bloc-circuit h3, .zone-home .bloc-preparer h3, .zone-home .bloc-guide h3 {
		font-size: 2vw;
		padding: 0 1rem;
	}

	.zone-home .btn-primary {
		padding: 5px 25px;
		margin-top: 0;
		margin-bottom: 0;
	}

	#bandeverte {
		position: absolute;
		width: 30px;
		background-color: var(--primary);
		z-index: 1000;
		height: 249px;
		left: 0;
		top: 0;
	}
	
	/* Breadcrumb */
	#breadcrumb {
		padding: 2rem 0 0 14rem;
	}

	ul.breadcrumb, li.breadcrumb {
		margin: 1rem 7px;
		font-size: 14px;
		font-family: var(--fontprimary);
		color: var(--secondary);
	}

	.breadcrumb {
		align-items: center;
		font-size: 14px;
		font-family: var(--fontprimary);
	}

	.breadcrumb-item+.breadcrumb-item::before{
		content: '\f0da';
		font-family:var(--fontAwesome);
		display: inline;
		font-weight:700;
	}
	
	li.breadcrumb-item.last {
		color: var(--primary);
	}

	.breadcrumb-item a{
		text-decoration:none;
	}
	
	.breadcrumb-item a:hover{
		text-decoration:underline;
	}

	.breadcrumb span {
		margin-right: 1rem;
	}

	header.header {
		height: 261px;
	}
	
	header .zone-header{
		height: 150px;
	}
	
	header #banner{
		max-height:unset;
	}
	
	.zone-droite {
		padding-left: 5rem;
	}
	
	#accordionFlushExample .zone-txt {
		min-height: 301px;
		max-width: 480px;
	}
	
	/* Carrousel */
	.carrousel {
		position: relative;
		height: 480px;
		z-index: -1;
	}
	
	.menu-top .frame-type-menu_subpages li {
	width: 220px;
}
}

/*breackpoint bootstrap xl */
@media (min-width:1200px) {

	/* mise en forme titres blocs */
	.frame-bloc-hp h2 {
		padding-top:20px
	}
	
	.secteur .zone-page .frame-type-list ul, .secteur .zone-page .frame-type-news_pi1 ul {
		-moz-columns: 2;
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
	}
	
	header .zone-header {
		height: 155px;
	}
	
	.carrousel img.visuelhome {
		top: 10px;
	}
}

/*breackpoint bootstrap xxl */
@media (min-width:1400px) {
	
	#visuelzonebillet {
		left: 6%;
		width: 71px;
	}
	
	/* mise en forme titres blocs */
	.frame-bloc-hp h2 {
		font-size: 50px;
		margin-top: 30px;
		padding: 5% 2rem 0 0;
	}

	.zone-home .bloc-circuit h3, .zone-home .bloc-preparer h3, .zone-home .bloc-guide h3 {
		font-size: 20px;
		padding: 0 1rem;
	}

	.zone-home .btn-primary {
		padding: 15px 40px;
		margin-top: 12px;
		margin-bottom: 10px;
	}
}

@media (min-width:1500px) {
	
	#accordionFlushExample{
		margin-top: 0;
	}
	
	#accordionFlushExample .absolute{
		top:0;
		width: auto;
	}
	
	#accordionFlushExample .absolute .nav{
		flex-direction:column;
	    width: 150px;
	}
}

#menuheader li {
    display: inline;
    padding-right: 3rem;
}

#menuheader li a {
    color: var(--secondary);
}

#menuheader li a:hover {
    color: var(--primary);
	text-decoration:underline;
}


#menuheader li a i{
    color: var(--primary);
	padding-right: 10px;
}
