/***********************************************************/
/*****************     Small only       ********************/
/***********************************************************/
@media screen and (max-width: 39.9375em) {
h1 {
font-size:3rem;
}
h2 {
font-size:1.75rem;
}
h3 {
font-size:1.5rem;
}
h4 {
font-size:1.375rem;
}
h5 {
font-size:1.25rem;
}
h6 {
font-size:1.125rem;
}
label {
font-size:1.125rem;
}
div#main-content div.large-8 {
margin-bottom:2rem;
}
div#inscriptionLoisirs a.boutonSecondaire {
margin-top:1rem;
}
div#inscriptionLoisirs img {
margin-top:2rem;
}
body.body-accueil div#main-content {
margin-top:2rem;
}
body.body-accueil div#inscriptionLoisirs {
background-size:contain;
}
body.body-accueil div#inscriptionLoisirs div.row {
padding:3rem 0;
}
div#blocEvenements {
margin:2rem 0 0 0;
}
div#blocEvenements div.conteneurInfo {
height:inherit;
padding-bottom:2rem;
}
div#inscriptionLoisirs div.row {
padding:7rem 0 3rem 0;
}
div.entetePage div.demiCercle {
display:none;
}
div.titrePage h1 {
font-size:1.25rem
}
div.entetePage {
margin:0 !important;
}
div#blocRechercheGlobale {
width:70%;
padding:0.5rem;
bottom:-15px;
}
h2#toggleTitreRecherche {
font-size:1.25rem;
}
button.boutonSecondaire {
margin-top:0.5rem;
}
div#blocMediasSociaux {
top:auto;
right:auto;
left:0;
bottom:0;
width:100%;
border-radius:10px 10px 0 0;
flex-direction:row;
justify-content:center;
align-items:center;
gap:0.75rem;
padding:0.75rem
         calc(0.75rem + env(safe-area-inset-right))
         max(0.5rem, env(safe-area-inset-bottom))
         calc(0.75rem + env(safe-area-inset-left)); /* safe areas iOS */
}
div#blocMediasSociaux .sidebar-title {
writing-mode:horizontal-tb;
transform:none;
margin:0;
font-size:0.9rem;
}
div#blocMediasSociaux hr {
width:40px;
height:1px;
margin:0 0.75rem;
background-color:#3F5464;
border:none;
}
div#blocMediasSociaux .icon {
width:44px;
height:44px;
font-size:1.25rem;
}
div#calendrier table.calendrier {
border:inherit;
border-radius:0;
}
div#calendrier table.calendrier thead {
display:none;
}
div#calendrier table.calendrier tr td {
display:block;
width:inherit;
height:inherit;
padding:0.25rem;
}
div#calendrier table.calendrier tr td.vide {
display:none;
}
div#calendrier div.CalendrierTextePerso {
font-size:2.5rem;
line-height:1;
}
div#calendrier table.calendrier tr:last-child td:first-child {
border-bottom-left-radius:0;
}
div#blocEvenements div.modeListe div.conteneurImage,
body.body-repertoires div#blocEvenements div.modeListe div.conteneurImage {
width:100%;
margin-bottom:2rem;
}
div#blocEvenements div.modeListe div.conteneurDescription {
width:100%;
padding:1rem 0 0 0;
}
div#blocEvenements div.modeListe div.conteneurInfo,
body.body-repertoires div#blocEvenements div.modeListe div.conteneurInfo {
width:100%;
padding:1rem 0 0 0;
}
div#blocEvenements div.modeListe div.icoInfo {
width:100%;
padding:1rem 0 0 0;
}
div#calendrier table.calendrier tr:first-child th:first-child {
border-top-left-radius:0;
}
div#calendrier table.calendrier tr:first-child th:last-child {
border-top-right-radius:0;
}
div#calendrier table.calendrier tr:last-child td:first-child {
border-bottom-left-radius:0;
}
div#calendrier table.calendrier tr:last-child td:last-child {
border-bottom-right-radius:0;
}
div.publiciteFiche {
margin:0 0 4rem 0;
}
footer {
font-size:1rem;
}
footer div.conteneurFooter {
padding:5rem 2rem 0 2rem;
}
footer div.conteneurFooter img {
max-width:80%;
margin-bottom:2rem;
}
}


/***********************************************************/
/****************     Medium and up       ******************/
/***********************************************************/
@media screen and (min-width: 40em) {

}


/***********************************************************/
/*****************     Medium only       *******************/
/***********************************************************/
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
h1 {
font-size:3.25rem;
}
h2 {
font-size:2.25rem;
}
h3 {
font-size:2rem;
}
h4 {
font-size:1.75rem;
}
h5 {
font-size:1.5rem;
}
h6 {
font-size:1.25rem;
}
div#main-content div.large-8 {
margin-bottom:2rem;
}
h2#toggleTitreRecherche {
font-size:1.5rem;
}
div.entetePage div.demiCercle {
display:none;
}
div.titrePage h1 {
font-size:1.75rem
}
div#blocRechercheGlobale {
width:70%;
padding:0.5rem;
bottom:-15px;
}
div#blocEvenements div.conteneurInfo {
height:inherit;
padding-bottom:2rem;
}
div#inscriptionLoisirs a.boutonSecondaire {
margin-top:1rem;
}
div#inscriptionLoisirs img {
margin-top:2rem;
}
body.body-accueil div#main-content {
margin-top:2rem;
}
body.body-accueil div#inscriptionLoisirs {
background-size:contain;
}
body.body-accueil div#inscriptionLoisirs div.row {
padding:6rem 0;
}
div#inscriptionLoisirs div.row {
padding:12rem 0 6rem 0;
}
div#blocMediasSociaux {
top:auto;
right:auto;
left:0;
bottom:0;
width:100%;
border-radius:10px 10px 0 0;
flex-direction:row;
justify-content:center;
align-items:center;
gap:0.75rem;
padding:0.75rem
         calc(0.75rem + env(safe-area-inset-right))
         max(0.5rem, env(safe-area-inset-bottom))
         calc(0.75rem + env(safe-area-inset-left)); /* safe areas iOS */
}
div#blocMediasSociaux .sidebar-title {
writing-mode:horizontal-tb;
transform:none;
margin:0;
font-size:0.9rem;
}
div#blocMediasSociaux hr {
width:40px;
height:1px;
margin:0 0.75rem;
background-color:#3F5464;
border:none;
}
div#blocMediasSociaux .icon {
width:44px;
height:44px;
font-size:1.25rem;
}
div#calendrier div.CalendrierTextePerso {
font-size:2.5rem;
line-height:1;
}
div#blocEvenements div.modeListe div.conteneurImage,
body.body-repertoires div#blocEvenements div.modeListe div.conteneurImage {
width:100%;
margin-bottom:2rem;
}
div#blocEvenements div.modeListe div.conteneurDescription {
width:100%;
padding:1rem 0 0 0;
}
div#blocEvenements div.modeListe div.conteneurInfo,
body.body-repertoires div#blocEvenements div.modeListe div.conteneurInfo {
width:100%;
padding:1rem 0 0 0;
}
div#blocEvenements div.modeListe div.icoInfo {
width:100%;
padding:1rem 0 0 0;
}
div.publiciteFiche {
margin:0 0 4rem 0;
}
}


/***********************************************************/
/******************     Large and up     *******************/
/***********************************************************/
@media screen and (min-width: 64em) {
}


/***********************************************************/
/*******************     Large only     ********************/
/***********************************************************/
@media screen and (min-width: 64em) and (max-width: 74.9375em) {
h1 {
font-size:3.25rem;
}
h2 {
font-size:2.25rem;
}
h3 {
font-size:2rem;
}
h4 {
font-size:1.75rem;
}
h5 {
font-size:1.5rem;
}
h6 {
font-size:1.25rem;
}
div#menu div#main-menu ul li {
padding:1rem 1.5rem;
}
div#menu div#main-menu ul li a {
font-size:1.125rem;
}
div#blocEvenements div.large-4 {
width:50%;
}
div.titrePage h1 {
font-size:3rem
}
div#inscriptionLoisirs a.boutonSecondaire {
margin-top:1rem;
}
div#inscriptionLoisirs div.row {
padding:18rem 0 9rem 0;
}
div.detailsEvenements div.large-4 {
font-size:1rem;
}
}


/***********************************************************/
/*******************     xLarge only     *******************/
/***********************************************************/
@media screen and (min-width: 75em) and (max-width: 96.875em) {	
div#menu div#main-menu ul li {
padding:1rem 1.75rem;
}
div#blocEvenements div.conteneurInfo h3 {
font-size:1.5rem;
}
div.titrePage h1 {
font-size:4rem;
}
div.entetePage div.demiCercle img {
width:195px;
}
}


/***********************************************************/
/*****************     xxLarge only         ****************/
/***********************************************************/
@media screen and (min-width: 97em) and (max-width: 109.875em) {	

}


/***********************************************************/
/***************     xxxLarge and up         ***************/
/***********************************************************/
@media screen and (min-width: 110em) {	

}