/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;font-family:sans-serif}body{margin:0}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;text-decoration:none;color:inherit}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;max-width:100%}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}*,*:before,*:after{box-sizing:inherit}html{box-sizing:border-box}.liste-item,#accueil .meilleurBiere .liste-meilleurBiere,#accueil .presentation div{display:grid;gap:clamp(10px,2vw,20px)}#detailsBiere .critique div{display:flex}#detailsBiere .details-commentaire .form_commentaire form,#detailsBiere .details-commentaire .form_commentaire,#detailsBiere .details-commentaire .commentaires,#detailsBiere .details-commentaire,#detailsBiere .critique,.carte div{display:flex;flex-direction:column}#detailsBiere .critique div .critique-texte,.carte .texte-description{display:-webkit-box;max-width:60ch;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}*{font-family:sans-serif}h1{font-size:clamp(20px,3vw,50px);text-transform:uppercase}h2{font-size:clamp(20px,3vw,60px);text-transform:uppercase;margin:0}h3{font-size:clamp(20px,2.5vw,50px);text-transform:uppercase;margin:0}.titre-section{margin-bottom:4vw;text-align:center}#entete,footer,#detailsBiere{padding:2vw 6vw}section:not(#accueil,#bieres,#detailsBiere){padding:8vw 6vw}:focus-visible{outline:#faba27 auto 1px}.invisible:not(:focus):not(:active){position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap;opacity:0}.logo{max-width:clamp(150px,20vw,200px)}.bouton{display:inline-block;padding:15px;font-weight:700;font-size:clamp(16px,2vw,20px);text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all .5s ease-out;margin-top:clamp(25px,3vw,35px)}.bouton-primary{background-color:#000;color:#faba27;border:2px solid #000000;font-family:Lato,sans-serif}.bouton-primary:hover{background-color:#faba27;border:2px solid #000000;color:#000}.bouton-secondary{background-color:#faba27;color:#000;border:2px solid #faba27;font-family:Lato,sans-serif}.bouton-secondary:hover{background-color:#000;border:2px solid #faba27;color:#faba27}.nav-icon,.nav-icon:before,.nav-icon:after{background-color:#faba27;display:block}.nav-icon:before,.nav-icon:after{content:"";height:100%;width:100%;position:absolute;transition:all .2s ease-out}.nav-icon{height:3px;width:20px;position:relative;transition:background .2S ease-out;cursor:pointer}.nav-icon:before{top:6px}.nav-icon:after{top:-6px}#entete .menu-btn{display:none}#entete .menu-btn:checked~.menu-icon .nav-icon{background-color:transparent}#entete .menu-btn:checked~.menu-icon .nav-icon:before{transform:rotate(-45deg);top:0}#entete .menu-btn:checked~.menu-icon .nav-icon:after{transform:rotate(45deg);top:0}.chargement{text-align:center}.chargement p{font-size:30px}.loader{height:100px;width:20%;text-align:center;padding:1em;margin:0 auto 1em;display:inline-block;vertical-align:top}.loader svg path,.loader svg rect{fill:#faba27}.erreur404{text-align:center;margin-top:-6vw}.erreur404 img{max-width:300px}.erreur404 h1{font-size:40px}main .entete{margin:0;padding:0}main .entete div{order:1;text-align:center;flex-direction:column;margin-top:-5px}main .entete-contenu{padding:20px}main section:first-of-type{margin-bottom:20px}@media only screen and (min-width: 769px){main .entete{position:relative;overflow:hidden;height:45vw}main .entete img{position:absolute;object-fit:cover;z-index:-1;margin:0}main .entete div{padding:6vw;width:100%;height:40vw;text-align:end}main section:first-of-type{margin-bottom:0}.bouton-primary{border:2px solid #faba27}.bouton-secondary{border:2px solid #000000}}#entete .connexion{display:flex;justify-content:center;margin:2vw auto}@media screen and (min-width: 769px){#entete .connexion{justify-content:end;margin-top:0}}#entete .connexion button{font-size:16px;padding:.5em;margin-top:0}#entete .connexion .input-connection{width:250px;padding:.5em}#entete .logo-nav div{display:flex;align-items:center;justify-content:space-around}#entete nav{display:none;margin:20px;clear:both}#entete nav ul{display:flex;flex-direction:column;gap:clamp(20px,2.5vw,40px);width:max-content;margin:0 auto}#entete nav ul li{list-style:none}#entete nav ul li a{position:relative;text-transform:uppercase;font-size:clamp(20px,2vw,22px);font-weight:700}#entete nav ul li a:before{content:"";position:absolute;border-radius:50%;width:50px;height:50px;top:50%;right:0;transform:translateY(-50%);z-index:-1;background-color:#faba27}#entete nav.ouvert{display:block}@media screen and (min-width: 769px){#entete .logo-nav{display:flex}#entete .logo-nav .nav-icon{display:none}#entete nav{display:block;margin:auto 0 auto auto}#entete nav ul{flex-direction:row;align-items:center}#entete nav ul li a:hover:before{background-color:#faba27}#entete nav ul li a:before{transition:background .5s ease-in-out;background-color:transparent}}.carte .carte-titre{font-size:30px;font-family:Lato,sans-serif;text-transform:uppercase;text-align:center;width:100%;height:max-content;padding:.3em}.carte div{background-color:#faba27}.carte div p{margin:.5em}.carte .note{text-align:center}.carte .note strong{font-size:50px}@media screen and (min-width: 769px){.carte{width:100%;height:450px;margin:auto;position:relative;overflow:hidden}.carte img{width:100%;height:90%;position:absolute;object-fit:cover}.carte div{display:flex;position:relative;height:100%;top:400px;transition:top 1.5s ease-out;padding:0 2vw}.carte:hover div{top:230px}}#accueil .entete-accueil div{background-color:#000}#accueil .entete-accueil div h2{color:#faba27;max-width:30ch;margin-left:auto}#accueil .entete-accueil div a{margin-left:0}@media screen and (min-width: 769px){#accueil .entete-accueil div{background-color:none;background:none}#accueil .entete-accueil div h2{color:#000}}#accueil .presentation div{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));padding-top:30px}#accueil .presentation div div{text-align:center;align-self:baseline;position:relative;margin-bottom:2vw}#accueil .presentation div div p{max-width:280px;margin:auto;font-size:clamp(18px,2vw,20px);font-weight:600}#accueil .presentation div div .presentation-lettre{font-size:200px;font-family:Secular One,sans-serif;color:#faba27;position:absolute;z-index:-1;top:-30px;left:90px}@media screen and (min-width: 769px){#accueil .presentation div div .presentation-lettre{top:-40px;font-size:250px}}@media screen and (min-width: 1000px){#accueil .presentation div div .presentation-lettre{font-size:300px;top:-80px;left:15px}}@media screen and (min-width: 1200px){#accueil .presentation div div .presentation-lettre{font-size:350px}}#accueil .meilleurBiere{background-color:#faba27;color:#000}#accueil .meilleurBiere .liste-meilleurBiere{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));overflow:hidden;position:relative}@media screen and (min-width: 769px){#accueil .meilleurBiere .carte{height:350px;position:relative;overflow:hidden}#accueil .meilleurBiere .carte img{position:absolute;object-fit:cover}#accueil .meilleurBiere .carte div{display:flex;position:relative;height:100%;top:310px;transition:top 1.5s ease-out;padding:0 2vw}#accueil .meilleurBiere .carte:hover div{top:120px}}@media screen and (min-width: 769px) and (min-width: 1000px){#accueil .meilleurBiere .carte:hover div{top:130px}}#accueil svg path,#accueil svg rect{fill:#000}#bieres header{padding:0}#bieres .entete-bieres{padding:0}#bieres .entete-bieres div{background-color:#faba27}#bieres .entete-bieres div h2{color:#000}#bieres .entete-bieres div a{margin-left:0}.liste-item{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));overflow:hidden;position:relative}@media screen and (min-width: 769px){#bieres .entete-bieres div{background:linear-gradient(213deg,#000000 0,rgba(0,0,0,0) 35%)}#bieres .entete-bieres div h2{color:#faba27}}#detailsBiere h3{text-align:center}#detailsBiere .details-biere,#detailsBiere .details-commentaire{padding:0}@media screen and (min-width: 769px){#detailsBiere .details-biere,#detailsBiere .details-commentaire{display:flex}#detailsBiere .details-biere picture,#detailsBiere .details-biere .details,#detailsBiere .details-commentaire picture,#detailsBiere .details-commentaire .details{display:flex;flex:1;margin:auto;justify-content:center}#detailsBiere .details-biere .details,#detailsBiere .details-commentaire .details{flex-direction:column}}#detailsBiere .details p{font-size:clamp(18px,2vw,20px)}#detailsBiere .details .note_moyenne{font-size:70px;padding:20px}#detailsBiere .critique{background-color:#faba27;align-items:center;padding:4vw 6vw;margin:2vw 0}#detailsBiere .critique div{gap:clamp(20px,2vw,40px);align-items:center}#detailsBiere .critique div .noteCritique{font-size:40px}#detailsBiere .critique .bouton{align-items:center;max-width:max-content;margin-top:0;text-align:center;font-size:18px}#detailsBiere .details-commentaire{margin-top:4vw;padding:0}@media screen and (min-width: 769px){#detailsBiere .details-commentaire{flex-direction:row}}#detailsBiere .details-commentaire h3{margin-bottom:2vw}#detailsBiere .details-commentaire .form_commentaire,#detailsBiere .details-commentaire .commentaires{flex:1}#detailsBiere .details-commentaire .form_commentaire{order:2}@media screen and (min-width: 769px){#detailsBiere .details-commentaire .form_commentaire{order:1}}#detailsBiere .details-commentaire .form_commentaire form{max-width:400px;margin:0 auto;padding:2vw;background-color:#faba27}#detailsBiere .details-commentaire .form_commentaire form *{padding:10px}#detailsBiere .details-commentaire .form_commentaire form .bouton{max-width:max-content;margin:1em auto}#detailsBiere .details-commentaire .form_commentaire .validation{display:none;color:red}#detailsBiere .details-commentaire .form_commentaire .note{text-align:center;margin-bottom:2vw}#detailsBiere .details-commentaire .form_commentaire .note div{position:relative}#detailsBiere .details-commentaire .form_commentaire .note .menu-btn{display:none}#detailsBiere .details-commentaire .form_commentaire .note .icone-note{width:80px}#detailsBiere .details-commentaire .form_commentaire .note .icone-noir{filter:brightness(0%)}#detailsBiere .details-commentaire .form_commentaire .text-connexion{text-align:center;font-size:18px;padding-bottom:1vw}#detailsBiere .details-commentaire .commentaires{order:1}@media screen and (min-width: 769px){#detailsBiere .details-commentaire .commentaires{order:2}}#detailsBiere .details-commentaire .commentaires p{text-align:center;font-size:clamp(18px,2vw,20px)}#detailsBiere .details-commentaire .commentaires .commentaire strong{font-size:clamp(18px,2vw,20px)}#detailsBiere .details-commentaire .commentaires .commentaire .date-commentaire{display:none}@media screen and (min-width: 1000px){#detailsBiere .details-commentaire .commentaires .commentaire .date-commentaire{display:block}}#detailsBiere .noBiere{font-size:clamp(20px,3vw,30px);text-align:center}#piedDePage{margin-top:40px;display:flex;flex-direction:column;gap:40px}#piedDePage .reseaux-sociaux{display:flex;gap:20px;justify-content:center}#piedDePage .reseaux-sociaux img{max-width:50px}#piedDePage .reseaux-sociaux img:hover{filter:brightness(0%)}#piedDePage p{text-align:center}#piedDePage p span{font-weight:700}
