/* CSS Document */
.wide-container {height:50vh; width:100%; position:relative}
#slides {width:100%; height:100%; display:flex; overflow:hidden}
#slides > div {position:relative; width:100%; height:100%; flex-shrink: 0; animation: slider 20s infinite ease-in-out}
#slides > div img {object-fit:cover; object-position:center center; width:100%; height:100%}

.activite {bottom:0; z-index:1; color:#FFF; font-size:24px; width:250px; text-align:center}
.activite, .activite div {position:absolute; right:0; border-left:25px solid transparent; height:0}
.activite div {width:100%; top:0}
.activite {border-bottom:50px solid #f5bfb5}
.activite > div {border-bottom:50px solid #e69381}
.activite > div > div {border-bottom:50px solid #b52505}
.activite span {display:block;padding-top:7px}

.section .page {max-width:1200px; margin:0 auto; padding:50px 0}
.section.list-animateurs .page {padding:0}

.page-activite .col2 {column-gap:50px; grid-row-gap:50px}

.page-activite h1 {font-family:'RobotoCondensed-Light', Arial, Helvetica, sans-serif; font-size:48px; line-height:48px; color:#b52505; text-transform: uppercase}
.page-activite h1, .page-activite h1 ~ p {text-align:center}
.page-activite h1 ~ p {margin-top:0}
.page-activite .intro, .page-activite h1 ~ p {font-size:24px}
.page-activite > .col, .page-activite .description, .page-activite .description h3, .page-activite .note {margin-top:30px}
.page-activite .intro span {position:relative; width:24px; display:inline-block}
.page-activite p {margin-top:25px}

blockquote {quotes: "“" "”"; padding:0; margin:0}
blockquote:before, blockquote:after {color:#b52505}
blockquote:before {content:open-quote}
blockquote:after {content: close-quote}
.page-activite .note {padding:25px; background:#FCE9E0}
.page-activite .note h3 {color:#b52505; font-size:30px; line-height:30px}
.page-activite .note p {margin-top:5px}


.page-activite .galerie {display:grid; grid-row-gap:30px; min-height:300px}
.page-activite .ligne {grid-template-rows: calc(70% - 30px) 30%}
.page-activite .galerie .col2 {column-gap:30px}
.page-activite .col .image {width:100%; height:100%; position:relative; border-radius:0; overflow: hidden}
.page-activite .image img {object-fit:cover; object-position:center center; width:100%; height:100%; position:absolute}


.page-activite .image {background:#FFF; padding:5px; z-index:0}
.page-activite .image:before, .page-activite .image:after {content:""; display:block; width:25px; height:25px; background:#f5bfb5; position:absolute; z-index:-1; transition:all 0.25s ease-out}
.page-activite .image:before {left:0; top:0}
.page-activite .image:after {right:0; bottom:0}

.page-activite .image > div {width:100%; height:100%; overflow:hidden; position:relative; border:5px solid #FFF; background:#FFF}


.section:nth-of-type(2), .page-activite .animateurs {background:#FCE9E0}
.page-activite .animateurs {padding:25px}
.page-activite .animateurs h2 {font-size:30px; line-height:30px; color:#b52505; margin-bottom:15px; text-align:center}
.page-activite .equipe {display:flex; align-items:start; justify-content:center; column-gap:25px}
.page-activite .equipe > div {width:100px}
.page-activite .equipe > div > div {position:relative; display:block; width:100%; height:auto; background:#e69381; border-radius:50%; overflow:hidden}
.page-activite .equipe > div > div:after {content:""; display:block; padding-bottom:100%}
.page-activite .equipe > div > div img {object-fit:cover; object-position: center center; width:100%; height:100%; position:absolute}
.page-activite .equipe p {text-align:center; margin-top:5px; font-size:14px}
.page-activite .infos {margin-top:30px}
.page-activite .infos ul {margin:0 auto; padding:5px; background:#FCE9E0}
.page-activite .infos li {display:inline-block; padding-left:10px; position:relative; padding-right:15px}
.page-activite .infos li:before {content:""; position:absolute; height:6px; width:6px; border-radius:50%; background:#c75b43; top:12px; left:0}
.page-activite sup {font-size:12px}

.page-activite .inscription {margin-top:0}
.page-activite .inscription h2, .page-activite .inscription h3 {color:#b52505}
.page-activite .inscription h2 {font-size:36px; line-height:40px; text-align:center}
.page-activite .inscription p {margin-top:5px}
.page-activite .inscription > div, .page-activite .inscription ol {margin-top:30px}
.page-activite .inscription ol li {list-style-type:decimal; margin-left:15px; padding-left:0}
.page-activite .inscription ol a {color:#b52505}
.page-activite .inscription ol a:hover {text-decoration: underline}

.page-activite .bt-inscription {text-align:center}
.bt-upload a {display:block; width:220px; font-size:21px; background:#e69381; color:#FFF; padding:5px 10px 5px 25px; margin:0 auto; transition:all 0.25s ease-out; margin-top:15px; position:relative}

@media screen and (max-width:359px) {
.section {padding:0 20px}
.page-activite .infos li {font-size:18px}
.page-activite .infos li:before {top:10px}
.page-activite .inscription h2 {font-size:30px; line-height:34px}
}
@media screen and (max-width:479px) {
.texte-introduction h1 {font-size:30px; line-height:34px}
.texte-introduction p {font-size:20px; line-height:23px}
}
@media screen and (min-width:360px) and (max-width:639px) {
.section {padding:0 30px}
.page-activite .inscription h2 {font-size:30px; line-height:34px}
}
@media screen and (min-width:480px) and (max-width:639px) {
.texte-introduction h1 {font-size:36px; line-height:40px}
.texte-introduction p {font-size:21px}
}
@media screen and (max-width:639px) {
.page-activite h1 {font-size:32px; line-height:36px}
}
@media screen and (min-width:640px) and (max-width:799px) {
.texte-introduction h1 {font-size:40px; line-height:44px}
.texte-introduction p {font-size:21px}
}
@media screen and (min-width:640px) and (max-width:799px) {
.section {padding:0 40px}
}
@media screen and (min-width:640px) and (max-width:899px) {
.page-activite h1 {font-size:36px; line-height:36px}
}
@media screen and (max-width:899px) {
.page-activite > .col2 {display:inherit}
.page-activite .galerie {height:70vh; margin-top: 30px}
}
@media screen and (min-width:800px) {
.section {padding:0 50px}
.page-activite .infos {text-align:center}
}