@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600&display=swap);*{box-sizing:border-box;padding:0}*,body{margin:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Open Sans,sans-serif}h1,h2,h3,h4,h5,h6{font-family:Roboto,sans-serif;font-weight:500}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.app-body{background-color:#03081d;margin-left:100px;min-height:100vh;padding:2em}@media screen and (max-width:768px){.app-body{margin-left:70px}}.nav-bar{background-color:#f88a32;flex-direction:column;height:100vh;position:fixed;z-index:10}.nav-bar,.nav-item{align-items:center;display:flex;width:100px}.nav-item{color:#03081e;height:100px;justify-content:center}.nav-item-desc{align-items:center;background-color:#f5d291;border-radius:5px;color:#03081d;display:flex;font-size:14px;justify-content:center;left:80px;opacity:0;padding:.5em;position:fixed;transition:opacity .1s ease-in-out}.nav-item:hover .nav-item-desc{opacity:1}.nav-item:first-child{background-color:#ffb941}.nav-item:first-child svg{height:65px;width:65px}.nav-item svg{height:30px;width:30px}.nav-item:hover{color:#ffb941}@media screen and (max-width:768px){.nav-bar,.nav-item{width:70px}.nav-item{height:70px}.nav-item:first-child svg{height:45px;width:45px}.nav-item svg{height:20px;width:20px}.nav-item-desc{display:none}}.sign-in-sign-up{align-items:flex-start;display:flex;justify-content:space-evenly}@media screen and (max-width:768px){.sign-in-sign-up{align-items:center;flex-direction:column;justify-content:space-between}}.sign-in-shape{position:relative;top:10px;width:220px}.sign-in-icon{position:absolute;width:118px}.login-buttons-container{align-items:center;display:flex;justify-content:space-evenly}.send-button.google{background-color:#4d86db;border:1px solid #4d86db}.send-button.google:hover{background-color:#fff;color:#4d86db}input:-webkit-autofill,input:-webkit-autofill:focus,input:-webkit-autofill:hover,select:-webkit-autofill,select:-webkit-autofill:focus,select:-webkit-autofill:hover,textarea:-webkit-autofill,textarea:-webkit-autofill:focus,textarea:-webkit-autofill:hover{-webkit-text-fill-color:#f88933;-webkit-box-shadow:inset 0 0 0 1000px #fff}.form-input{display:flex;justify-content:center;position:relative}.form-input input{background:none;background-color:#fff;border:1px solid #03081e;border-radius:0;color:#f88933;display:block;font-size:18px;margin:20px 0;padding:12px 12px 8px;width:85%}.form-input input:focus{outline:none}.form-input label{background-color:#fff;color:#03081e;font-size:14px;font-weight:600;left:30px;padding:0 .8em;pointer-events:none;position:absolute;top:10px}.sign-up-shape{position:relative;right:-12px;top:10px;width:220px}.sign-up-icon{position:absolute;width:107px}.my-beers-grid{grid-gap:10px;display:grid;grid-template-columns:repeat(auto-fill,225px);justify-content:center}.beer-card{background-color:#03081d;background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:10px;display:flex;flex-direction:column;height:225px;overflow:hidden;width:225px}.beer-card-overlay{background:#000;border-radius:10px;opacity:.6}.beer-card-info,.beer-card-overlay{height:225px;position:absolute;transition:opacity .2s ease-in-out;width:225px}.beer-card-info{display:flex;flex-direction:column;justify-content:flex-end;padding:1em}.beer-card-info:hover{opacity:0}.beer-card h2{font-size:21px}.beer-card h2,.beer-card p{color:#fff;margin-bottom:.1em;text-align:left}.beer-card span{color:#f88a32;font-weight:700}.beer-card-rating{align-items:center;display:flex;margin-bottom:.1em}.display-stars-container{align-items:center;display:flex;justify-content:center}.display-stars{align-items:center;display:flex;justify-content:flex-start;position:relative}.mask-container,.stars-container{align-items:center;display:flex;justify-content:center;width:4.8em}.mask,.mask-container{height:.8em;position:absolute}.mask{overflow-x:hidden;transition:width .2s ease-in-out}.empty-stars,.mask-stars{height:.8em;margin-right:.2em;width:.8em}.form-wrapper{align-items:center;display:flex;justify-content:center}.form-container{background-color:#fff;border-radius:10px;overflow:hidden;padding:1em;width:300px}.form-container h2{color:#03081e;margin-bottom:1em;text-align:center}.form-image{align-items:center;display:flex;height:140px;justify-content:center;margin-bottom:1em;width:100%}.form-image .shape{position:relative;right:-5px;top:-30px;width:220px}.form-image .beer-icon{position:absolute;width:70px}.radio-buttons,.send-button-container{display:flex;justify-content:center}.send-button-container{align-items:center;height:80px;width:100%}.send-button{background-color:#28a828;border:1px solid #28a828;border-radius:5px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;height:50px;transition-duration:.5s;transition-property:border-radius,width;transition-timing-function:ease-in-out;width:100px}.send-button:hover{background-color:#fff;color:#28a828}.send-button:focus{outline:none}.send-button.submit-successful{border-radius:50%;color:#fff;width:50px}.send-button.submit-successful:hover{color:#28a828}@media screen and (max-width:768px){.form-container{margin-bottom:1em;width:250px}}.beer-popup-wrapper{-webkit-overflow-scrolling:touch;align-items:center;background:#a2848480;display:flex;height:100vh;justify-content:center;left:0;overflow-y:scroll;position:fixed;top:0;width:100vw;z-index:10}.beer-popup{background-color:#03081d;border-radius:10px;height:530px;overflow:hidden;position:absolute;width:300px}.beer-popup h2,p{color:#fff}.beer-popup h2{font-size:28px;margin-bottom:.15em}.beer-popup p{font-size:18px}.favorite-button{color:gray;height:20px;transition:color .5s ease-in-out;width:20px}.favorite-button.favorited{color:#e73c3c}.beer-popup span{color:#f88a32;font-weight:700}.beer-popup-image{background:blue;background-position:50%;background-size:cover;overflow:hidden;position:relative;width:100%}.beer-popup-image:before{content:"";float:left;padding-top:100%}.beer-popup-info{padding:1em}.beer-popup-icons{display:flex;margin-bottom:.5em;width:100%}.beer-popup-icons .stars-wrapper{margin-left:1em}.beer-popup-icons .stars svg{height:20px;width:20px}.beer-popup-info .beer-card-rating{margin-bottom:.4em;transform:scale(1.1);width:0}.beer-card-p{margin-bottom:1em}.extra-info{margin-left:.5em}.stars-wrapper{display:flex;justify-content:center}.stars input[type=radio]{display:none}.stars svg{transition:color .1s ease-in-out}.beers-grid{grid-gap:10px;display:grid;grid-template-columns:repeat(auto-fill,225px);justify-content:center}
/*# sourceMappingURL=main.de5f6ad8.css.map*/