*{margin:0;padding:0}*,:before,:after{box-sizing:inherit}html{box-sizing:border-box;font-size:62.5%}@media only screen and (width<=68.75em){html{font-size:50%}}body{color:#655a56;background-image:linear-gradient(to bottom right,#fbdb89,#f48982);background-repeat:no-repeat;background-size:cover;min-height:calc(100vh - 8vw);font-family:Nunito Sans,sans-serif;font-weight:400;line-height:1.6}.container{background-color:#fff;border-radius:6px;grid-template:"head head head"10rem"list recipe shopping"minmax(100rem,auto)/1.1fr 2fr 1.1fr;max-width:120rem;margin:4vw auto;display:grid;overflow:hidden;box-shadow:0 2rem 6rem .5rem #655a5633}@media only screen and (width<=68.75em){.container{border-radius:0;width:100%;margin:0}}.btn,.btn-small,.btn-small:link,.btn-small:visited{text-transform:uppercase;color:#fff;cursor:pointer;background-image:linear-gradient(to bottom right,#fbdb89,#f48982);border:none;border-radius:10rem;align-items:center;transition:all .2s;display:flex}.btn:hover,.btn-small:hover{transform:scale(1.05)}.btn:focus,.btn-small:focus{outline:none}.btn>:first-child,.btn-small>:first-child{margin-right:1rem}.btn{padding:1.3rem 3rem;font-size:1.4rem}.btn svg{fill:currentColor;width:2.25rem;height:2.25rem}.btn-small,.btn-small:link,.btn-small:visited{padding:1rem 1.75rem;font-size:1.3rem;text-decoration:none}.btn-small svg,.btn-small:link svg,.btn-small:visited svg{fill:currentColor;width:1.5rem;height:1.5rem}.btn-inline{color:#f59a83;cursor:pointer;background-color:#f9f5f3;border:none;border-radius:10rem;align-items:center;padding:.8rem 1.2rem;font-size:1.2rem;transition:all .2s;display:flex}.btn-inline svg{fill:currentColor;width:1.5rem;height:1.5rem;margin:0 .2rem}.btn-inline span{margin:0 .4rem}.btn-inline:hover{color:#f48982;background-color:#f2efee}.btn-inline:focus{outline:none}.btn-tiny{cursor:pointer;background:0 0;border:none;width:1.75rem;height:1.75rem}.btn-tiny svg{fill:#f59a83;width:100%;height:100%;transition:all .3s}.btn-tiny:focus{outline:none}.btn-tiny:hover svg{fill:#f48982;transform:translateY(-1px)}.btn-tiny:active svg{fill:#f48982;transform:translateY(0)}.btn-tiny:not(:last-child){margin-right:.3rem}.heading-2{color:#f59a83;text-transform:uppercase;text-align:center;margin-bottom:2.5rem;font-size:1.8rem;font-weight:600;transform:skewY(-3deg)}.copyright{color:#968b87;margin-top:auto;font-size:1.2rem}.link:link,.link:visited{color:#968b87}.loader{text-align:center;margin:5rem auto}.loader svg{fill:#f59a83;transform-origin:44%;width:5.5rem;height:5.5rem;animation:1.5s linear infinite rotate}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.header{background-color:#f9f5f3;grid-area:head;justify-content:space-between;align-items:center;display:flex}.header__logo{height:4.5rem;margin-left:4rem;display:block}.search{background-color:#fff;border-radius:10rem;align-items:center;padding-left:3rem;transition:all .3s;display:flex}.search:focus-within{transform:translateY(-2px);box-shadow:0 .7rem 3rem #655a5614}.search__field{color:inherit;background:0 0;border:none;width:30rem;font-family:inherit;font-size:1.7rem}.search__field:focus{outline:none}.search__field::placeholder{color:#dad0cc}.likes{align-self:stretch;position:relative;padding:0!important}.likes__field{cursor:pointer;align-items:center;height:100%;padding:0 4rem;transition:all .3s;display:flex}.likes__field:hover{background-color:#f2efee}.likes__panel:hover,.likes__field:hover+.likes__panel{visibility:visible;opacity:1}.likes__icon{fill:#f59a83;width:3.75rem;height:3.75rem}.likes__panel{z-index:10;visibility:hidden;opacity:0;background-color:#fff;width:34rem;padding:2rem 0;transition:all .5s .2s;position:absolute;top:10rem;right:0;box-shadow:0 .8rem 5rem 2rem #655a561a}.results,.likes{padding:3rem 0}.results__list,.likes__list{list-style:none}.results__link:link,.results__link:visited,.likes__link:link,.likes__link:visited{border-right:1px solid #fff;align-items:center;padding:1.5rem 3rem;text-decoration:none;transition:all .3s;display:flex}.results__link:hover,.likes__link:hover{background-color:#f9f5f3;transform:translateY(-2px)}.results__link--active,.likes__link--active{background-color:#f9f5f3}.results__fig,.likes__fig{backface-visibility:hidden;border-radius:50%;flex:0 0 5.5rem;height:5.5rem;margin-right:2rem;position:relative;overflow:hidden}.results__fig:before,.likes__fig:before{content:"";opacity:.4;background-image:linear-gradient(to bottom right,#fbdb89,#f48982);width:100%;height:100%;display:block;position:absolute;top:0;left:0}.results__fig img,.likes__fig img{object-fit:cover;width:100%;height:100%;transition:all .3s;display:block}.results__name,.likes__name{color:#f59a83;text-transform:uppercase;margin-bottom:.3rem;font-size:1.3rem;font-weight:600}.results__author,.likes__author{color:#968b87;text-transform:uppercase;font-size:1.1rem;font-weight:600}.results__pages,.likes__pages{margin-top:3rem;padding:0 3rem}.results__pages:after,.likes__pages:after{content:"";clear:both;display:table}.results__btn--prev,.likes__btn--prev{float:left;flex-direction:row-reverse}.results__btn--next,.likes__btn--next{float:right}.recipe{background-color:#f9f5f3;border-top:1px solid #fff}.recipe__fig{transform-origin:top;height:30rem;position:relative;transform:scale(1.04)translateY(-1px)}.recipe__fig:before{content:"";opacity:.6;background-image:linear-gradient(to bottom right,#fbdb89,#f48982);width:100%;height:100%;display:block;position:absolute;top:0;left:0}.recipe__img{object-fit:cover;width:100%;height:100%;display:block}.recipe__title{color:#fff;text-transform:uppercase;text-align:center;width:70%;font-size:2.75rem;font-weight:700;line-height:1.95;position:absolute;bottom:0;left:50%;transform:translate(-50%,20%)skewY(-6deg)}.recipe__title span{box-decoration-break:clone;background-image:linear-gradient(to bottom right,#fbdb89,#f48982);padding:1.3rem 2rem}.recipe__details{align-items:center;padding:8rem 3rem 3rem;display:flex}.recipe__info{text-transform:uppercase;align-items:center;font-size:1.5rem;display:flex}.recipe__info:not(:last-child){margin-right:4rem}.recipe__info-icon{fill:#f59a83;width:2rem;height:2rem;margin-right:1rem}.recipe__info-data{margin-right:.4rem;font-weight:600}.recipe__info-buttons{visibility:hidden;opacity:0;margin-left:1.5rem;transition:all .4s;display:flex;transform:translateY(5px)}.recipe:hover .recipe__info-buttons{visibility:visible;opacity:1;transform:translateY(0)}.recipe__love{cursor:pointer;background-image:linear-gradient(to bottom right,#fbdb89,#f48982);border:none;border-radius:50%;justify-content:center;align-items:center;width:4.5rem;height:4.5rem;margin-left:auto;transition:all .2s;display:flex}.recipe__love:hover{transform:scale(1.07)}.recipe__love:focus{outline:none}.recipe__love svg{fill:#fff;width:2.75rem;height:2.75rem}.recipe__ingredients{background-color:#f2efee;flex-direction:column;align-items:center;padding:4rem 5rem;font-size:1.5rem;line-height:1.4;display:flex}.recipe__ingredient-list{grid-column-gap:1.5rem;grid-row-gap:2.5rem;grid-template-columns:1fr 1fr;margin-bottom:3rem;list-style:none;display:grid}.recipe__item{display:flex}.recipe__icon{fill:#f59a83;border:1px solid #f59a83;border-radius:50%;flex:none;width:1.8rem;height:1.8rem;margin-top:.1rem;margin-right:1rem;padding:2px}.recipe__count{flex:none;margin-right:.5rem}.recipe__directions{flex-direction:column;align-items:center;padding:4rem 4rem 5rem;display:flex}.recipe__directions-text{text-align:center;color:#968b87;width:90%;margin-bottom:3rem;font-size:1.5rem}.recipe__by{font-weight:700}.shopping{flex-direction:column;padding:3rem 4rem;display:flex}.shopping__list{max-height:77rem;list-style:none;overflow:scroll}.shopping__item{border-bottom:1px solid #f2efee;align-items:flex-start;padding:1.3rem 0;display:flex;position:relative}.shopping__count{cursor:pointer;border:1px solid #f2efee;border-radius:3px;flex:0 0 7.5rem;justify-content:space-between;margin-right:2rem;padding:.4rem .5rem;display:flex}.shopping__count input{color:inherit;text-align:center;border:none;border-radius:3px;width:3.7rem;font-family:inherit;font-size:1.2rem}.shopping__count input:focus{background-color:#f2efee;outline:none}.shopping__count p{font-size:1.2rem}.shopping__description{flex:1;margin-top:.4rem;margin-right:1.5rem;font-size:1.3rem}.shopping__delete{visibility:hidden;opacity:0;background-image:linear-gradient(90deg,#0000 0%,#fff 40% 100%);width:3.75rem;margin-top:.5rem;padding-left:2rem;transition:all .5s;position:absolute;right:0}.shopping__item:hover .shopping__delete{opacity:1;visibility:visible}
/*# sourceMappingURL=index.256ed220.css.map */
