form{margin:2em}html,body{font-size:14pt;font-family:Arial,Helvetica,sans-serif;color:#111;background-color:#fff;margin:0;padding:0}body{box-sizing:border-box}body *{box-sizing:inherit}body * :after,body * :before{box-sizing:inherit}body{--color-white: #eee;--color-white-1: #ddd;--color-white-3: #ccc;--color-white-4: #bbb;--color-white-5: #aaa;--color-black: #111;--color-black-2: #222;--color-black-3: #333;--color-black-4: #444;--color-black-5: #555;--color-primary: #14435b;--color-primary-90: #14435bf8;--color-primary-75: #14435bcc;--color-primary-50: #14435b88;--color-primary-25: #14435b44;--color-primary-10: #14435b08;--color-secondary: #14435b;--color-danger: brown;--color-contrast: #ffb000;--color-disable: rgba(128, 128, 128, 1);--color-disable-10: rgba(128, 128, 128, .1)}.body2{font-size:.85em;color:var(--color-white-3)}.body3{font-size:.65em;color:var(--color-white-2)}.title{font-size:1.5em;color:var(--color-secondary)}input{font-size:14pt;border:none;padding:.25em 1em}.input-field{display:flex;flex-direction:column;justify-content:center;width:100%;min-height:3.5em;padding:.25em}.input-field>label{font-size:.8em;width:100%;opacity:0;color:var(--color-black-3);transition:opacity 333ms}.input-field>label.show{opacity:.75}.input-field>input{width:100%;margin-top:-.8em;transition:margin-top 333ms}.input-field>input.with-label{margin-top:0}.input-field>p.error{width:100%;color:var(--color-danger)}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:flex;align-items:center;justify-content:space-around;border:2px solid var(--color-primary);background-color:var(--color-primary-10);color:var(--color-black);--btn-height: 2em;min-height:var(--btn-height);padding:.5em 2em;border-radius:calc(var(--btn-height) / 2);transition:background-color 333ms;cursor:pointer}button:hover{background-color:var(--color-primary-25)}button.disable{border:2px solid var(--color-disable);background-color:var(--color-disable-10);color:var(--color-black-2)}button.disable:hover{background-color:var(--color-disable-10)}button.primary{background-color:var(--color-primary-90);color:var(--color-white)}button.primary:hover{background-color:var(--color-primary-75)}.layout-page{position:relative;margin:0;padding:0;width:100%;height:100svh;overflow:hidden;overflow-y:auto}.layout-page header{display:grid;grid-template-areas:"logo nav" "welcome welcome";grid-template-columns:300px auto;grid-template-rows:350px auto}.layout-page header .logo{grid-area:logo;margin:1em auto 0 2em}.layout-page header .logo img{width:150px}.layout-page header .nav-content{background-image:conic-gradient(from 270deg at 100% 100%,#fff 2deg,transparent 2.1deg),url(/assets/cerise-jap-BzplDDXW.jpg);background-size:cover;grid-area:nav}.layout-page header .nav-content nav{display:flex;justify-content:flex-end}.layout-page header .nav-content nav ul{padding:1em 4em;display:flex;flex-wrap:wrap;gap:4em;background-color:var(--color-primary)}.layout-page header .nav-content nav ul li{list-style:none;color:var(--color-white);box-sizing:content-box}.layout-page header .nav-content nav ul li.select{border-bottom:2px solid currentcolor}.layout-page header .nav-content nav ul li.contact{color:var(--color-contrast)}.layout-page header .welcome{grid-area:welcome;padding:0 1em 1em}.layout-page header .welcome .bienvenue{font-size:2em;color:var(--color-secondary)}.layout-page header .welcome .city{color:var(--color-contrast);font-size:2.5em;font-weight:800}.layout-page main{padding:0 4em 1em}.box{display:grid;width:100%;grid-template-columns:repeat(4,1fr);gap:1em}.box>.item{--marge: .75em;--margeX2: calc(2 * var(--marge));--color-bg: #f8f8f8;background-color:var(--color-bg);border:1px solid #111;box-shadow:2px 2px 4px #1118;border-radius:1em;overflow:hidden;padding:var(--marge)}.box>.item>img{width:calc(100% + var(--margeX2));margin:calc(-1 * var(--marge));margin-bottom:var(--marge);height:150px;object-fit:cover}.box>.item h3{margin-top:0}.box>.item .content{position:relative;display:block;max-height:100px;overflow:hidden}.box>.item .content:after{content:" ";position:absolute;bottom:0;left:0;right:0;height:1em;background-image:linear-gradient(180deg,transparent 0%,var(--color-bg) 100%)}.box>.item .tag{color:var(--color-secondary)}.box>.item .tag+.tag{margin-left:1em}.box>.item .attachments{display:grid;grid-template-columns:repeat(2,1fr);gap:.5em}.box>.item .attachments .attachment{margin:0 auto;max-width:100%;height:150px;object-fit:cover}.card{--etalon: 60px;--sideLength: calc(4 * var(--etalon));font-family:sans-serif;position:relative;width:calc(var(--etalon) + var(--sideLength));background-color:var(--color-white);color:var(--color-black)}.card .top{height:var(--sideLength);position:relative}.card .date{position:absolute;color:var(--color-contrast);width:var(--sideLength);height:var(--etalon);display:grid;justify-content:start;align-items:center;transform:translateY(var(--sideLength)) rotate(-90deg);transform-origin:0 0}.card .date .date-content{padding:0 10px;display:grid;grid-template-columns:var(--etalon) 1fr;grid-template-rows:repeat(2,calc(var(--etalon) / 2));grid-column-gap:0px;grid-row-gap:0px}.card .date .date-content .jour{grid-area:1 / 1 / 3 / 2;font-size:3em;font-weight:700;justify-self:center;align-self:center}.card .date .date-content .mois{align-self:end;font-weight:lighter}.card .date .date-content .annee{font-weight:lighter}.card .illustration{margin-left:var(--etalon);width:var(--sideLength);height:var(--sideLength)}.card .illustration img{width:100%;height:100%;object-fit:cover}.card article{padding:0 1em}.card article .title{font-weight:700;color:color(--color-primary)}.card article .content{position:relative;min-height:3em;max-height:var(--etalon);overflow-y:hidden;font-size:.8em}.card article .content:after{content:" ";position:absolute;bottom:0;left:0;right:0;height:1em;background-image:linear-gradient(180deg,transparent 0%,var(--color-white) 100%)}.card article .tags{display:flex;flex-wrap:wrap;column-gap:.5em}.card article .tags .tag{color:var(--color-primary);font-size:small}.card .footer{padding:1em}