html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, button {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    background: none;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block }
body { line-height: 1 }
ol, ul { list-style: none }
blockquote, q { quotes: none }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none }
table { border-collapse: collapse; border-spacing: 0 }



/* PAM */

input, textarea { outline: 0 }
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    box-sizing: border-box;
    /* appearance: none; -moz-appearance: none; -webkit-appearance:none; */
    outline: 0;
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    position: relative;
}

::selection { color: #fff; background: #000 }

html, body { min-height: 100vh; }
html { background: #000 }
body { background: #fff }
body { font-family: Helvetica Neue, sans-serif; font-size: 18px; line-height: 1.5; font-weight: 500; margin: 0; border-radius: 0; }
b,strong { font-weight: 700 }
a { cursor: pointer; color: #000; text-decoration: none }
h1,h2,h3,h4,h5,h6 { font-weight: 700 }
p { margin-block-start: 0; margin-block-end: 0 }
p { margin-block-start: 0 }
img { display: block; /* max-width: 100% */ }
.clear { position: relative; display: block; clear: both }
input, textarea, select, button { all: unset; font-family: inherit; font-size: inherit; position: relative; box-sizing: border-box }





/* pam dev */
.dev * { box-shadow: inset 0 0 1px #000; }
.grid { display: none; pointer-events: none }
.dev .grid { display: block; z-index: 999; position: fixed; top: 0; left: var(--leftMargin); width: var(--wrapper); height: 100vh; }
.dev .grid ul { display: flex; flex-direction: row; justify-content: space-between; width: 100%; height: 100%; }
.dev .grid li { width: calc((100% - 9*var(--gutter))/10); height: 100%; background: rgba(255,0,0,0.2); border: 0!important }
.dev .grid li + li { margin: 0 0 0 var(--gutter) }






:root {
    --wrapper: 1420px;
    --gutter: 40px;
    --leftMargin: 100px
}
@media (max-width: 1420px) {
    :root {
        --wrapper: calc(100vw - 200px);
        --gutter: 40px;
        --leftMargin: 100px
    }
}


.wrapper { width: var(--wrapper); margin: 0 auto }


.none { opacity: 0; pointer-events: none }

::-webkit-input-placeholder { color: #607C86 }
::-moz-placeholder { color: #607C86 }
:-ms-input-placeholder { color: #607C86 }
:-moz-placeholder { color: #607C86 }

.mobileOnly { display: none }
.desktopOnly { display: block }

@media (max-width: 540px) {
    .mobileOnly { display: block }
    .desktopOnly { display: none }
}

/* touch device */
@media (pointer: coarse) {} /* touch */
@media (pointer: fine) {} /* mouse */

/* IE */
@media all and (-ms-high-contrast:none) {}

/* Edge */
@supports (-ms-ime-align:auto) {}


html.pc { width: calc(100vw - 0px); overflow-x: hidden }
html.old_osx { width: calc(100vw - 0px); overflow-x: hidden }

/* Header toutes pages */
body header figure { position: relative; padding: 50px 85px 120px; }
body header figure img { position: absolute; left: 0; top: 0; height: 100%; width: 100%; object-fit: cover; }
body header figure figcaption {
    justify-content: start;
    padding-top: 70px;
    font-weight: 300;
    font-size: 19px;
    height: 250px;
    width: 250px;
    background: #89CEDD;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 10;
}
body header figure figcaption::before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ''; height: 200px; width: 200px; background: white; border-radius: 50%; z-index: -10; }
body header figure figcaption::after { content: ''; position: absolute; bottom: 35px; left: calc(50% - 50px); width: 100px; height: 100px; background: url(../img/ecusson-bareges.png); background-size: cover;}
body main { display: flex; }

/* Nav toutes les pages*/
body main nav { width: 20%; height: 100%; }
body main nav ul { display: flex; flex-wrap: wrap; flex-direction: column; }
body main nav li { border-bottom: 1px solid #E0E0E0; }
body main nav li.menu--current { border-right: 7px solid #87CCDB; }
body main nav li a, body main nav li span { font-size: 18px; cursor: pointer; display: block; padding: 11px 20px; }

/*Page proprio*/
body main section { position: relative; width: 80%; margin-top: -70px; background: white; }
body main section::before { content: ''; height: 100%; width: 42px; position: absolute; top: 0; left: 0; background: linear-gradient(to right, rgba(0,0,0,.1), white); }
body main section article { display: none; }
body main section article.current { display: block; }
body main section article { padding: 80px 80px; }
body main section article.accueil { padding: 0; }
body main section article .infos { padding: 20px 0 50px 0; border-top: 1px solid #666;}
body main section article div.accueil__mesInfos, body main section article div.accueil__contactSyndic { padding: 80px 80px; }
body main section article div.accueil__mesInfos { border-bottom: #979797 solid 1px; }
body main section article div h2, body main section article h2 { font-size: 40px; font-weight: 500; padding-bottom: 20px; }
body main section article div .rond, body main section article .rond { height: 15px; width: 15px; border-radius: 50%; background: #87CCDB; margin-bottom: 20px; }
body main section article div p, body main section article p { display: flex; font-size: 18px; margin-bottom: 20px; }
body main section article div p span, body main section article p span { width: 25%; color: #CCCCCC; }
body main section article div.categories { display: flex; flex-wrap: wrap; margin-bottom: 80px; }
body main section article div.categories span { font-size: 15px; padding: 0; width: calc(100% / 3 - 60px); height: 50px; line-height: 50px; border-top: #D8D8D8 1px solid; margin-right: 60px; cursor: pointer; }
body main section article div.categories span.categorie--current { background: #89CEDD; color: white; padding-left: 20px; }
body main section article div.documents ul li.titres { color: #89CEDD; display: flex; height: unset;}
body main section article div.documents ul li.hidden { display: none; }
body main section article div.documents ul li { display: block; border-bottom: 1px solid #D8D8D8; }
body main section article div.documents ul li:not(:first-child) { /* min-height: 130px; */ }
body main section article div.documents ul li:not(:first-child):hover::after { pointer-events: none; content: ''; height: 100%; width: calc(100% + 160px); top: 0; left: -80px; position: absolute; background: rgba(216, 216, 216, 0.16); }
body main section article div.documents ul li:not(:first-child):hover::before { content: url('../icons/icon-download.svg'); top: 50%; left: -80px; transform: translate(-50%, -50%); position: absolute; }
body main section article div.documents ul li a { text-decoration: none; display: flex; height: 100%; padding: 20px 0; }
body main section article div.documents ul li p { display: inline-block; width: calc(100% / 3); margin: 0; }
body main section article div.documents ul li time { width: calc(100% / 3); }

/* Surcharge page syndic*/
body main section article a { text-decoration: underline; padding-top: 20px; display: inline-block; }
body main section article div.success { margin-top: 20px; background: green; color: white; }
body main section article div.fail { margin-top: 20px; background: red; color: white; }
body main section article div.success p, body main section article div.fail p { margin: 0; padding: 10px 0; text-align: center; display: block; }
body main section article div.documents.syndic::before { content: ''; position: absolute; top: 60px; left: -80px; height: 1px; width: calc(100% + 160px); background: #979797; }
body main section article div.documents.syndic { padding-top: 100px; }
body main section article div.documents.syndic ul li { min-height: unset; display: flex; flex-wrap: wrap; justify-content: space-between; }
body main section article div.documents.syndic ul li p { padding: 10px 0; }
body main section article div.documents.syndic ul li a { padding: 0; color: rgba(0,0,0,.4); display: none; margin: auto 0 auto 0; }
body main section article div.documents.syndic ul li:hover a { display: block }
body main section article div.documents.syndic ul li:not(:first-child):hover::before, body main section article div.documents ul li:not(:first-child):hover::after { content: none }
body main section article div.copro ul li.titres { color: #89CEDD; display: flex; height: unset;}
body main section article div.copro ul li { border-bottom: 1px solid #D8D8D8; min-height: unset; display: flex; flex-wrap: wrap; }
body main section article div.copro ul li a { padding: 0; color: rgba(0,0,0,.4); display: none; margin: auto 0 auto 0; width: calc(100%/3); text-align: end; }
body main section article div.copro ul li:hover a { display: block }
body main section article div.copro ul li p { display: inline-block; width: calc(100% / 3); margin: 0; padding: 10px 0; }

/* Page connexion */
body main section.connexion { padding-top: 50px; width: 100%; }
body main section.connexion::before { content: none; }
body main section h1 { font-size: 40px; padding-bottom: 40px; text-align: center; }
body main section.connexion form { padding: 0 20%; }
body main section form label, body section form input, body section form button  { font-size: 18px; }
body main section form div.input { padding-bottom: 11px; display: flex; justify-content: space-between; }
body main section form div.submit {display: flex; justify-content: flex-end;}
body main section form div.submit button { width: 50%; background: #85CAD9; color: white; padding: 10px 5px; }
body main section form div label { color: #CCCCCC; width: 25%; display: inline-block; }
body main section form div input, body main section form div select, body main section form div textarea { background: #EFEFEF; width: 50%; height: 43px; }

/* Surcharge forms pages internes */
body main section article form { margin: 0; width: 100%; }
body main section article form div label { width: 15%; }
body main section article form div input, body main section article form div select, body main section article form div textarea { width: 80%; }
body main section article form div textarea { height: 90px; }
body main section article form div.submit button { width: 80%; }

/* Tablette */
@media screen and (max-width: 1023px){
    /* Header */
    body header figure figcaption { height: 200px; width: 200px; font-size: 15px; }
    body header figure figcaption::before { height: 150px; width: 150px; }

    /* Nav */
    body main nav { width: 30%; }
    body main nav li a, body main nav li span { font-size: 15px; }

    /* Page proprio */
    body main section { width: 70%; }
    body main section article div.accueil__mesInfos, body main section article div.accueil__contactSyndic { padding: 70px 70px; }
    body main section article div h2, body main section article h2 { font-size: 30px; }
    body main section article div p, body main section article p { font-size: 15px; }
    body main section article div p span, body main section article p span { width: 20%; }

    /* Documents */
    body main section article div.categories span { font-size: 15px; width: calc(50% - 10px); margin-right: 10px; }
    body main section article div.documents ul li:not(:first-child) { min-height: 100px; }
    body main section article div.documents ul li time { font-size: 15px; }

    /* Page syndic */
    body main section article a { font-size: 15px; padding-top: 50px; }
    body main section form label, body section form input, body section form button { font-size: 15px; }
    body main section article form div label { width: 25%; }
    body main section article form div input, body main section article form div select, body main section article form div textarea { width: 75%; font-size: 15px; }
    body main section article form div.submit button { width: 75%; }
    body main section article div.documents.syndic ul li { min-height: unset; }
    /*body main section article div.documents ul li p { width: auto; }*/
    body main section article div.documents.syndic ul li a { display: block; }
    body main section article div.copro ul li a { display: block; }
    body main section article div.copro ul li p { margin-right: 15px; width: calc(100% / 3 + 20px); }
    body main section article div.copro ul li a { width: calc(100%/6); }
}

/* Portable */
@media screen and (max-width: 767px){
    /* Header */
    body header figure figcaption { font-size: 12px; height: 150px; width: 150px; }
    body header figure figcaption::before { height: 100px; width: 100px; }

    /* Page connexion */
    body main section form div.input { flex-direction: column; }
    body main section form div label { width: 100%; padding-bottom: 10px; }
    body main section form div input, select, textarea { width: 100%; }
    body main section form div.submit button { width: 100%; }

    /* Nav */
    body main nav li a, body main nav li span { font-size: 12px; }

    /* Page syndic */
    body main section article { padding: 70px 70px; }
    body main section article div h2, body main section article h2 { font-size: 25px; padding-bottom: 15px; }
    body main section article div .rond, body main section article .rond { height: 10px; width: 10px; margin-bottom: 15px; }
    body main section article div p, body main section article p { flex-direction: column; margin-bottom: 10px; font-size: 12px; }
    body main section article div p span, body main section article p span { margin-bottom: 5px; font-size: 12px; }
    body main section article a { padding-top: 40px; font-size: 12px; }
    body main section article form div label, body main section article form div input, body main section article form div select, body main section article form div textarea, body main section article form div.submit button { width: 100%; font-size: 12px; }
    body main section article div.documents.syndic::before { left: -70px; }
    body main section article div.documents.syndic ul li p { width: auto; }
    body main section article div.documents.syndic ul li a, body main section article div.copro ul li a { font-size: 12px; text-decoration: underline; }
    body main section article div.copro ul li p { margin: 0; }
    body main section article div.copro ul li p { width: calc(100% / 3); }
    body main section article div.copro ul li a { width: calc(100% / 3); }

    /* Page proprio */
    body main section article div.categories span { width: 100%; margin-right: 0; font-size: 12px; }
    body main section article div.documents ul li time { font-size: 12px; }

}










#cont_febcca2f31f262c7902632ed4133d89b { position: fixed; top: 200px; right: 0; z-index: 88; }