diff --git a/Bakerlab_light.f35f4a07.svg b/Bakerlab_light.f35f4a07.svg new file mode 100644 index 0000000..d5d389a --- /dev/null +++ b/Bakerlab_light.f35f4a07.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Bakerlab_logo.dc1c7caf.svg b/Bakerlab_logo.dc1c7caf.svg new file mode 100644 index 0000000..f1b7aad --- /dev/null +++ b/Bakerlab_logo.dc1c7caf.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Cookie.e6b80530.png b/Cookie.e6b80530.png new file mode 100644 index 0000000..b8d888d Binary files /dev/null and b/Cookie.e6b80530.png differ diff --git a/Crumbs.b58aa405.png b/Crumbs.b58aa405.png new file mode 100644 index 0000000..3b579e8 Binary files /dev/null and b/Crumbs.b58aa405.png differ diff --git a/Roboto-Regular-webfont.55e67705.woff b/Roboto-Regular-webfont.55e67705.woff new file mode 100644 index 0000000..8aa07d7 Binary files /dev/null and b/Roboto-Regular-webfont.55e67705.woff differ diff --git a/arrow-hover.f0f468f5.svg b/arrow-hover.f0f468f5.svg new file mode 100644 index 0000000..0d78972 --- /dev/null +++ b/arrow-hover.f0f468f5.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/close-hover.427efc51.svg b/close-hover.427efc51.svg new file mode 100644 index 0000000..43c927a --- /dev/null +++ b/close-hover.427efc51.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/close.192e35db.svg b/close.192e35db.svg new file mode 100644 index 0000000..8a05b21 --- /dev/null +++ b/close.192e35db.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/cookie-hover.efbe59ca.svg b/cookie-hover.efbe59ca.svg new file mode 100644 index 0000000..6c2effd --- /dev/null +++ b/cookie-hover.efbe59ca.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/cookie.1579234c.svg b/cookie.1579234c.svg new file mode 100644 index 0000000..6510499 --- /dev/null +++ b/cookie.1579234c.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/facebook-hover.3e9c8d2f.png b/facebook-hover.3e9c8d2f.png new file mode 100644 index 0000000..1fc2cde Binary files /dev/null and b/facebook-hover.3e9c8d2f.png differ diff --git a/facebook.db0f7c4b.png b/facebook.db0f7c4b.png new file mode 100644 index 0000000..0f752e6 Binary files /dev/null and b/facebook.db0f7c4b.png differ diff --git a/index.b2b60ee4.css b/index.b2b60ee4.css new file mode 100644 index 0000000..d170002 --- /dev/null +++ b/index.b2b60ee4.css @@ -0,0 +1,2 @@ +@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap";h1{font-family:Roboto,sans-serif;font-weight:400}body{margin:0}h1,h2,h3,a,img,span,p,ul,li{margin:0;padding:0}a{cursor:pointer;text-decoration:none}li{list-style:none}@font-face{font-family:Roboto;src:url(Roboto-Regular-webfont.55e67705.woff)format("woff");font-weight:400;font-style:normal}.header{box-sizing:border-box}.header__bottom{-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;padding:0 16px;display:-ms-flexbox;display:flex}@media (min-width:640px){.header__bottom{-ms-flex-align:start;align-items:start;max-width:680px;margin:0 auto;padding:0 44px}}@media (min-width:1024px){.header__bottom{max-width:1112px}}.header__subtitle{text-align:center;letter-spacing:-1%;max-width:283px;padding-top:32px;font-family:inherit;font-size:16px;font-weight:400;line-height:24px}@media (min-width:640px){.header__subtitle{margin-bottom:146px;padding-top:88px}.header__subtitle:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){text-align:left}.header__subtitle:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){text-align:right}}@media (min-width:1024px){.header__subtitle{max-width:260px;margin-bottom:8px;padding-top:135px}}.header__title{text-transform:uppercase;letter-spacing:-5%;text-align:center;padding-top:32px;font-family:inherit;font-size:64px;font-weight:400;line-height:54px}@media (min-width:640px){.header__title{margin-bottom:210px;padding:0;font-size:76px;line-height:68px}}@media (min-width:1024px){.header__title{box-sizing:border-box;margin-bottom:64px;padding-top:20px;font-size:125px;line-height:115px}}.header__image{background-image:url(Cookie.e6b80530.png);background-position:50%;background-size:contain;width:288px;height:290px;margin:0 auto}@media (min-width:640px){.header__image{z-index:-1;width:326px;height:328px;position:absolute;top:232px;left:calc(50% - 163px)}}@media (min-width:1024px){.header__image{width:544px;height:546px;top:88px;left:calc(50% - 272px)}}.header__link{box-sizing:border-box;text-transform:uppercase;letter-spacing:2%;color:#f9512e;border:2px solid #f9512e;border-radius:32px;padding:20px 70px;font-family:inherit;font-size:16px;font-weight:500;line-height:16px;transition:color .3s;display:block}.header__link:hover{color:#fff;background-color:#f9512e}@media (min-width:640px){.header__link{max-width:288px;margin:0 auto;padding:20px 60px}}@media (min-width:1024px){.header__link{max-width:326px;margin:0}}.header__link:before{content:"";background-image:url(cookie.1579234c.svg);background-repeat:no-repeat;background-size:contain;width:20px;height:20px;padding-right:26px}.header__link:hover:before{background-image:url(cookie-hover.efbe59ca.svg);transition:all .3s}.nav{-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;margin:0 auto;padding:16px;display:-ms-flexbox;display:flex}@media (min-width:1024px){.nav{max-width:1112px;padding:28px 32px}}.icon{background-position:50%;background-repeat:no-repeat;background-size:contain;width:29px;height:29px;transition:all .3s;display:block}.icon--logo{width:136px;height:32px}.icon--menu{background-image:url(menu.8a963822.svg);width:20px;height:8px;transition:background-image .3s}.icon--menu:hover{background-image:url(menu-hover.2ba27ac1.svg)}@media (min-width:1024px){.icon--menu{opacity:0}}.icon--close{background-image:url(close.192e35db.svg);transition:background-image .3s}.icon--close:hover{background-image:url(close-hover.427efc51.svg)}.icon--facebook{background-image:url(facebook.db0f7c4b.png);transition:background-image .3s}.icon--facebook:hover{background-image:url(facebook-hover.3e9c8d2f.png)}.icon--instagram{background-image:url(instagram.8e749253.png);transition:background-image .3s}.icon--instagram:hover{background-image:url(instagram-hover.be565f6d.png)}.icon--twitter{background-image:url(twitter.69746f91.svg);transition:background-image .3s}.icon--twitter:hover{background-image:url(twitter_hover.13f711d5.svg)}.icon__logo--light{grid-area:logo;width:157px;height:30px;padding-bottom:40px}@media (min-width:640px){.icon__logo--light{padding-bottom:108px}}@media (min-width:1024px){.icon__logo--light{padding-bottom:71px}}.menu{-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;display:none}@media (min-width:1024px){.menu{display:-ms-flexbox;display:flex}.menu :nth-child(-n+3):not(:last-child){padding-right:64px}}.menu__link{color:inherit;font-family:inherit;font-size:16px;line-height:16px;transition:color .3s}.menu__link:hover{color:#f9512e}.menu__link--contact{text-transform:uppercase;letter-spacing:2%;color:#f9512e;font-family:inherit;font-size:16px;font-weight:500;line-height:16px}.menu__link--contact:before{content:"";background-image:url(phone-hover.eb9e5fff.svg);background-repeat:no-repeat;background-size:contain;width:24px;height:24px;padding-right:26px}.aside{box-sizing:border-box;opacity:0;pointer-events:none;background-color:#fff;height:100vh;margin:0 auto;padding:16px;transition:all .3s;position:fixed;top:0;left:0;right:0;overflow:auto;transform:translate(-100%)}.aside:target{opacity:1;pointer-events:all;transform:translate(0)}.aside__header{-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}.aside__menu{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;gap:24px;padding-top:132px;display:-ms-flexbox;display:flex}.aside__link{letter-spacing:-1%;color:inherit;font-family:inherit;font-size:16px;font-weight:400;line-height:24px;transition:color .3s}.aside__link:hover,.aside__link:last-child{color:#f9512e}@media (min-width:640px){.product:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){text-align:left}.product:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){text-align:right}}.product__header{max-width:288px;margin:0 auto}@media (min-width:640px){.product__header{max-width:680px;padding:0 44px}}@media (min-width:1024px){.product__header{max-width:1112px}}.product__cards{-ms-flex-wrap:wrap;flex-wrap:wrap;gap:24px;max-width:288px;margin:0 auto;padding:0 16px;display:-ms-flexbox;display:flex}@media (min-width:768px){.product__cards{gap:80px 24px;max-width:680px;padding:0 44px}}@media (min-width:1024px){.product__cards{max-width:1112px}.product__cards :nth-child(3){margin-left:auto}}.product__title{text-transform:uppercase;padding-top:64px;padding-bottom:24px;font-size:48px;font-weight:400;line-height:41px}@media (min-width:640px){.product__title{padding-top:180px;font-size:56px;line-height:47px}}.product__description{letter-spacing:-1%;padding-bottom:56px;font-family:inherit;font-size:16px;font-weight:400;line-height:24px}.card{box-sizing:border-box}@media (min-width:640px){.card{width:328px}}@media (min-width:1024px){.card{width:402px}}.card :nth-child(odd){padding-bottom:16px}.card__image{border-radius:8px;width:100%;transition:transform .3s}.card__image:hover{transform:scale(.95)}.card__title{text-transform:uppercase;letter-spacing:2%;color:#7f8096;padding-bottom:8px;font-family:inherit;font-size:16px;font-weight:500;line-height:16px}.card__description{letter-spacing:-1%;font-family:inherit;font-size:16px;font-weight:400;line-height:24px}.card__link{text-transform:uppercase;letter-spacing:2%;color:#f9512e;font-family:inherit;font-size:16px;font-weight:400;line-height:16px;transition:all .3s ease-in}.card__link:hover{width:-moz-fit-content;border-bottom:1px solid #f9512e;width:fit-content;padding-bottom:5px}.card__link:before{content:"";background-image:url(arrow-hover.f0f468f5.svg);background-repeat:no-repeat;background-size:contain;width:24px;height:24px;padding-right:26px}.about-us__container{margin:72px auto}@media (min-width:640px){.about-us__container{background-image:url(Crumbs.b58aa405.png);background-position:50%;background-repeat:no-repeat;background-size:contain;margin:152px auto;overflow:hidden}}@media (min-width:1200px){.about-us__container{margin-top:178px;margin-bottom:56px}}.about-us__top{max-width:288px;margin:auto;display:grid}@media (min-width:640px){.about-us__top{grid-template-columns:50%;grid-template-areas:"title description";gap:24px;max-width:680px;padding:0 44px}}@media (min-width:1024px){.about-us__top{max-width:1112px}}.about-us__title{text-transform:uppercase;padding-bottom:32px;font-size:48px;font-weight:400;line-height:41px}@media (min-width:640px){.about-us__title{max-width:328px;padding-bottom:0;font-size:56px;line-height:47px}}@media (min-width:1024px){.about-us__title{max-width:544px;font-size:72px;line-height:61px}}.about-us__description{font-size:16px;font-weight:400;line-height:24px}@media (min-width:640px){.about-us__description{max-width:328px}}@media (min-width:1024px){.about-us__description{max-width:544px}}.about-us__list{background-image:url(Crumbs.b58aa405.png);background-position:50%;background-repeat:no-repeat;background-size:contain;max-width:288px;margin:0 auto 72px}@media (min-width:640px){.about-us__list{columns:2;background-image:none;gap:24px;max-width:680px;padding:0 44px}}@media (min-width:1024px){.about-us__list{columns:4;max-width:1112px;margin:0 auto}}.about-us__list__item{padding-top:48px;font-size:96px;font-weight:400;line-height:82px}.about-us__item__desc{letter-spacing:-1%;color:#7f8096;padding-top:8px;font-family:inherit;font-size:16px;font-weight:400;line-height:24px}@media (min-width:1200px){.about-us__item__desc{margin-bottom:293px}}.footer{color:#fff;background-color:#1c1a26}.footer__container{grid-template-areas:"logo""menu""title""contacts""socials_info""rights_info";margin:0 auto;padding:56px 16px;display:grid}@media (min-width:640px){.footer__container{grid-template-columns:50%;grid-template-areas:"logo title""menu contacts"".contacts""socials_info rights_info";padding:88px 44px}}@media (min-width:1024px){.footer__container{max-width:1112px}}@media (min-width:1200px){.footer__container{grid-template-areas:"logo title""menu contacts"".contacts""socials_info rights_info"}}.footer__nav{grid-area:menu}.footer__nav :nth-child(-n+4):not(:last-child){margin-bottom:16px}.footer__title{text-transform:uppercase;letter-spacing:2%;color:#7f8096;font-family:inherit;font-size:16px;font-weight:500;line-height:16px}.footer__link{letter-spacing:-1%;color:inherit;font-family:inherit;font-size:16px;font-weight:400;line-height:24px;transition:color .3s}.footer__link:hover{color:#f9512e}.footer__call__container{grid-area:contacts}@media (min-width:1200px){.footer__contacts__wrapper{gap:190px;display:-ms-flexbox;display:flex}}.footer__contacts__title{text-transform:uppercase;grid-area:title;margin-top:64px;padding-bottom:40px;font-size:48px;font-weight:400;line-height:41px}@media (min-width:640px){.footer__contacts__title{max-width:328px;margin:0;font-size:56px;line-height:48px}}@media (min-width:1024px){.footer__contacts__title{max-width:544px;padding-bottom:40px;font-size:72px;line-height:61px}}.footer__call{grid-area:call_info}.footer__call :nth-child(-n+4):not(:last-child){margin-bottom:16px}.footer__mail{grid-area:email_info;padding-top:40px}.footer__mail :nth-child(-n+4):not(:last-child){margin-bottom:16px}@media (min-width:1200px){.footer__mail{padding:0}}.footer__socials{grid-area:socials_info;-ms-flex-pack:start;justify-content:start;-ms-flex-align:start;align-items:start;gap:32px;margin-top:48px;display:-ms-flexbox;display:flex}.footer__rights{color:#7f8096;letter-spacing:-1%;grid-area:rights_info;margin-top:48px;font-family:inherit;font-size:16px;font-weight:400;line-height:24px}html{scroll-behavior:smooth;color:#1c1a26;font-family:Inter,sans-serif}body{background:#eef7ff}body:has(.aside:target){overflow:hidden} +/*# sourceMappingURL=index.b2b60ee4.css.map */ diff --git a/index.b2b60ee4.css.map b/index.b2b60ee4.css.map new file mode 100644 index 0000000..4e6a550 --- /dev/null +++ b/index.b2b60ee4.css.map @@ -0,0 +1 @@ +{"mappings":"A,mFGAA,iDCAA,cAIA,+CAaA,sCAKA,mBFtBA,6IGAA,8BAGE,qMCKA,yBDLA,qGCWA,0BDXA,kCAmBA,4JCdA,yBDcA,uDAAA,kPAAA,8OCRA,0BDQA,uEAmBA,kKCjCA,yBDiCA,8EC3BA,0BD2BA,4GAqBA,iKCtDA,yBDsDA,uGChDA,0BDgDA,yEAyBA,kQCrFA,wDAMA,yBD+EA,+DCzEA,0BDyEA,wCAwBA,yLAUA,+GGzHF,8JFcE,0BEdF,yCCAA,0IAUE,oCAMA,2HHdA,iFAYA,0BGEA,uBAWA,uGHzBA,mFG8BA,6GH9BA,yFGmCA,+GHnCA,2FGwCA,2GHxCA,uFG6CA,8EHvCA,yBGuCA,yCHjCA,0BGiCA,wCC/CF,gHJcE,0BIdF,uCAQI,4DAKF,mGJXA,gCImBA,kJAIE,qMCzBJ,yNAkBE,kEAMA,6IAMA,kKAQA,uILpCA,yDAMA,yBMRF,yOAAA,qOAKE,+CNGA,yBMHA,iDNSA,0BMTA,mCAcA,yIASE,yBATF,8DNLA,0BMKA,iCAmBI,gDAMJ,8HNpCA,yBMoCA,mEAYA,iICxDF,4BPQE,yBORF,mBPcE,0BOdF,mBAWE,0CAIA,mEPbA,wCOmBA,6JAKA,0GAIA,oKAME,8GAOF,4LC1CA,sCROA,yBQPA,+LRmBA,0BQnBA,0DAkBA,wDRXA,yBQWA,0HRLA,0BQKA,iCAmBA,8GR9BA,yBQ8BA,mFRxBA,0BQwBA,kEAkBA,uERhDA,yBQgDA,wCR1CA,0BQ0CA,wCAcA,0LR9DA,yBQ8DA,yFRxDA,0BQwDA,0DAwBA,uFAOA,2IRjFA,0BQiFA,2CCrGF,4CAIE,6ITIA,yBSJA,qJTUA,0BSVA,qCTgBA,0BShBA,yGAgCA,4BAGE,kEAKF,4IAIA,wIT9CA,kCSoDA,4CTlCA,0BSsCA,uEAOA,sJTzDA,yBSyDA,mFTnDA,0BSmDA,8FAqBA,kCAGE,mEAKF,oDAIE,mET9EF,0BS0EA,yBAaA,mLASA,2JdvGF,uEAMA,wBAGE","sources":["index.b2b60ee4.css","src/styles/main.scss","src/styles/_fonts.scss","src/styles/utils/_extends.scss","src/styles/utils/_reset.scss","src/styles/header.scss","src/styles/utils/_mixins.scss","src/styles/utils/_vars.scss","src/styles/nav.scss","src/styles/icons.scss","src/styles/menu.scss","src/styles/aside.scss","src/styles/products.scss","src/styles/card.scss","src/styles/about-us.scss","src/styles/footer.scss"],"sourcesContent":["@import \"https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap\";\nh1 {\n font-family: Roboto, sans-serif;\n font-weight: 400;\n}\n\nbody {\n margin: 0;\n}\n\nh1, h2, h3, a, img, span, p, ul, li {\n margin: 0;\n padding: 0;\n}\n\na {\n cursor: pointer;\n text-decoration: none;\n}\n\nli {\n list-style: none;\n}\n\n@font-face {\n font-family: Roboto;\n src: url(\"Roboto-Regular-webfont.55e67705.woff\") format(\"woff\");\n font-weight: normal;\n font-style: normal;\n}\n\n.header {\n box-sizing: border-box;\n}\n\n.header__bottom {\n -ms-flex-direction: column;\n flex-direction: column;\n -ms-flex-pack: center;\n justify-content: center;\n -ms-flex-align: center;\n align-items: center;\n padding: 0 16px;\n display: -ms-flexbox;\n display: flex;\n}\n\n@media (min-width: 640px) {\n .header__bottom {\n -ms-flex-align: start;\n align-items: start;\n max-width: 680px;\n margin: 0 auto;\n padding: 0 44px;\n }\n}\n\n@media (min-width: 1024px) {\n .header__bottom {\n max-width: 1112px;\n }\n}\n\n.header__subtitle {\n text-align: center;\n letter-spacing: -1%;\n max-width: 283px;\n padding-top: 32px;\n font-family: inherit;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n}\n\n@media (min-width: 640px) {\n .header__subtitle {\n margin-bottom: 146px;\n padding-top: 88px;\n }\n\n .header__subtitle:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {\n text-align: left;\n }\n\n .header__subtitle:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {\n text-align: right;\n }\n}\n\n@media (min-width: 1024px) {\n .header__subtitle {\n max-width: 260px;\n margin-bottom: 8px;\n padding-top: 135px;\n }\n}\n\n.header__title {\n text-transform: uppercase;\n letter-spacing: -5%;\n text-align: center;\n padding-top: 32px;\n font-family: inherit;\n font-size: 64px;\n font-weight: 400;\n line-height: 54px;\n}\n\n@media (min-width: 640px) {\n .header__title {\n margin-bottom: 210px;\n padding: 0;\n font-size: 76px;\n line-height: 68px;\n }\n}\n\n@media (min-width: 1024px) {\n .header__title {\n box-sizing: border-box;\n margin-bottom: 64px;\n padding-top: 20px;\n font-size: 125px;\n line-height: 115px;\n }\n}\n\n.header__image {\n background-image: url(\"Cookie.e6b80530.png\");\n background-position: center;\n background-size: contain;\n width: 288px;\n height: 290px;\n margin: 0 auto;\n}\n\n@media (min-width: 640px) {\n .header__image {\n z-index: -1;\n width: 326px;\n height: 328px;\n position: absolute;\n top: 232px;\n left: calc(50% - 163px);\n }\n}\n\n@media (min-width: 1024px) {\n .header__image {\n width: 544px;\n height: 546px;\n top: 88px;\n left: calc(50% - 272px);\n }\n}\n\n.header__link {\n box-sizing: border-box;\n text-transform: uppercase;\n letter-spacing: 2%;\n color: #f9512e;\n border: 2px solid #f9512e;\n border-radius: 32px;\n padding: 20px 70px;\n font-family: inherit;\n font-size: 16px;\n font-weight: 500;\n line-height: 16px;\n transition: color .3s;\n display: block;\n}\n\n.header__link:hover {\n color: #fff;\n background-color: #f9512e;\n}\n\n@media (min-width: 640px) {\n .header__link {\n max-width: 288px;\n margin: 0 auto;\n padding: 20px 60px;\n }\n}\n\n@media (min-width: 1024px) {\n .header__link {\n max-width: 326px;\n margin: 0;\n }\n}\n\n.header__link:before {\n content: \"\";\n background-image: url(\"cookie.1579234c.svg\");\n background-repeat: no-repeat;\n background-size: contain;\n width: 20px;\n height: 20px;\n padding-right: 26px;\n}\n\n.header__link:hover:before {\n background-image: url(\"cookie-hover.efbe59ca.svg\");\n transition: all .3s;\n}\n\n.nav {\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n margin: 0 auto;\n padding: 16px;\n display: -ms-flexbox;\n display: flex;\n}\n\n@media (min-width: 1024px) {\n .nav {\n max-width: 1112px;\n padding: 28px 32px;\n }\n}\n\n.icon {\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n width: 29px;\n height: 29px;\n transition: all .3s;\n display: block;\n}\n\n.icon--logo {\n width: 136px;\n height: 32px;\n}\n\n.icon--menu {\n background-image: url(\"menu.8a963822.svg\");\n width: 20px;\n height: 8px;\n transition: background-image .3s;\n}\n\n.icon--menu:hover {\n background-image: url(\"menu-hover.2ba27ac1.svg\");\n}\n\n@media (min-width: 1024px) {\n .icon--menu {\n opacity: 0;\n }\n}\n\n.icon--close {\n background-image: url(\"close.192e35db.svg\");\n transition: background-image .3s;\n}\n\n.icon--close:hover {\n background-image: url(\"close-hover.427efc51.svg\");\n}\n\n.icon--facebook {\n background-image: url(\"facebook.db0f7c4b.png\");\n transition: background-image .3s;\n}\n\n.icon--facebook:hover {\n background-image: url(\"facebook-hover.3e9c8d2f.png\");\n}\n\n.icon--instagram {\n background-image: url(\"instagram.8e749253.png\");\n transition: background-image .3s;\n}\n\n.icon--instagram:hover {\n background-image: url(\"instagram-hover.be565f6d.png\");\n}\n\n.icon--twitter {\n background-image: url(\"twitter.69746f91.svg\");\n transition: background-image .3s;\n}\n\n.icon--twitter:hover {\n background-image: url(\"twitter_hover.13f711d5.svg\");\n}\n\n.icon__logo--light {\n grid-area: logo;\n width: 157px;\n height: 30px;\n padding-bottom: 40px;\n}\n\n@media (min-width: 640px) {\n .icon__logo--light {\n padding-bottom: 108px;\n }\n}\n\n@media (min-width: 1024px) {\n .icon__logo--light {\n padding-bottom: 71px;\n }\n}\n\n.menu {\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n display: none;\n}\n\n@media (min-width: 1024px) {\n .menu {\n display: -ms-flexbox;\n display: flex;\n }\n\n .menu :nth-child(-n+3):not(:last-child) {\n padding-right: 64px;\n }\n}\n\n.menu__link {\n color: inherit;\n font-family: inherit;\n font-size: 16px;\n line-height: 16px;\n transition: color .3s;\n}\n\n.menu__link:hover {\n color: #f9512e;\n}\n\n.menu__link--contact {\n text-transform: uppercase;\n letter-spacing: 2%;\n color: #f9512e;\n font-family: inherit;\n font-size: 16px;\n font-weight: 500;\n line-height: 16px;\n}\n\n.menu__link--contact:before {\n content: \"\";\n background-image: url(\"phone-hover.eb9e5fff.svg\");\n background-repeat: no-repeat;\n background-size: contain;\n width: 24px;\n height: 24px;\n padding-right: 26px;\n}\n\n.aside {\n box-sizing: border-box;\n opacity: 0;\n pointer-events: none;\n background-color: #fff;\n height: 100vh;\n margin: 0 auto;\n padding: 16px;\n transition: all .3s;\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n overflow: auto;\n transform: translateX(-100%);\n}\n\n.aside:target {\n opacity: 1;\n pointer-events: all;\n transform: translateX(0);\n}\n\n.aside__header {\n -ms-flex-pack: justify;\n justify-content: space-between;\n -ms-flex-align: center;\n align-items: center;\n display: -ms-flexbox;\n display: flex;\n}\n\n.aside__menu {\n -ms-flex-direction: column;\n flex-direction: column;\n -ms-flex-align: center;\n align-items: center;\n gap: 24px;\n padding-top: 132px;\n display: -ms-flexbox;\n display: flex;\n}\n\n.aside__link {\n letter-spacing: -1%;\n color: inherit;\n font-family: inherit;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n transition: color .3s;\n}\n\n.aside__link:hover, .aside__link:last-child {\n color: #f9512e;\n}\n\n@media (min-width: 640px) {\n .product:not(:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi))) {\n text-align: left;\n }\n\n .product:is(:lang(ae), :lang(ar), :lang(arc), :lang(bcc), :lang(bqi), :lang(ckb), :lang(dv), :lang(fa), :lang(glk), :lang(he), :lang(ku), :lang(mzn), :lang(nqo), :lang(pnb), :lang(ps), :lang(sd), :lang(ug), :lang(ur), :lang(yi)) {\n text-align: right;\n }\n}\n\n.product__header {\n max-width: 288px;\n margin: 0 auto;\n}\n\n@media (min-width: 640px) {\n .product__header {\n max-width: 680px;\n padding: 0 44px;\n }\n}\n\n@media (min-width: 1024px) {\n .product__header {\n max-width: 1112px;\n }\n}\n\n.product__cards {\n -ms-flex-wrap: wrap;\n flex-wrap: wrap;\n gap: 24px;\n max-width: 288px;\n margin: 0 auto;\n padding: 0 16px;\n display: -ms-flexbox;\n display: flex;\n}\n\n@media (min-width: 768px) {\n .product__cards {\n gap: 80px 24px;\n max-width: 680px;\n padding: 0 44px;\n }\n}\n\n@media (min-width: 1024px) {\n .product__cards {\n max-width: 1112px;\n }\n\n .product__cards :nth-child(3) {\n margin-left: auto;\n }\n}\n\n.product__title {\n text-transform: uppercase;\n padding-top: 64px;\n padding-bottom: 24px;\n font-size: 48px;\n font-weight: 400;\n line-height: 41px;\n}\n\n@media (min-width: 640px) {\n .product__title {\n padding-top: 180px;\n font-size: 56px;\n line-height: 47px;\n }\n}\n\n.product__description {\n letter-spacing: -1%;\n padding-bottom: 56px;\n font-family: inherit;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n}\n\n.card {\n box-sizing: border-box;\n}\n\n@media (min-width: 640px) {\n .card {\n width: 328px;\n }\n}\n\n@media (min-width: 1024px) {\n .card {\n width: 402px;\n }\n}\n\n.card :nth-child(odd) {\n padding-bottom: 16px;\n}\n\n.card__image {\n border-radius: 8px;\n width: 100%;\n transition: transform .3s;\n}\n\n.card__image:hover {\n transform: scale(.95);\n}\n\n.card__title {\n text-transform: uppercase;\n letter-spacing: 2%;\n color: #7f8096;\n padding-bottom: 8px;\n font-family: inherit;\n font-size: 16px;\n font-weight: 500;\n line-height: 16px;\n}\n\n.card__description {\n letter-spacing: -1%;\n font-family: inherit;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n}\n\n.card__link {\n text-transform: uppercase;\n letter-spacing: 2%;\n color: #f9512e;\n font-family: inherit;\n font-size: 16px;\n font-weight: 400;\n line-height: 16px;\n transition: all .3s ease-in;\n}\n\n.card__link:hover {\n border-bottom: 1px solid #f9512e;\n width: -moz-fit-content;\n width: fit-content;\n padding-bottom: 5px;\n}\n\n.card__link:before {\n content: \"\";\n background-image: url(\"arrow-hover.f0f468f5.svg\");\n background-repeat: no-repeat;\n background-size: contain;\n width: 24px;\n height: 24px;\n padding-right: 26px;\n}\n\n.about-us__container {\n margin: 72px auto;\n}\n\n@media (min-width: 640px) {\n .about-us__container {\n background-image: url(\"Crumbs.b58aa405.png\");\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n margin: 152px auto;\n overflow: hidden;\n }\n}\n\n@media (min-width: 1200px) {\n .about-us__container {\n margin-top: 178px;\n margin-bottom: 56px;\n }\n}\n\n.about-us__top {\n max-width: 288px;\n margin: auto;\n display: grid;\n}\n\n@media (min-width: 640px) {\n .about-us__top {\n grid-template-columns: 50%;\n grid-template-areas: \"title description\";\n gap: 24px;\n max-width: 680px;\n padding: 0 44px;\n }\n}\n\n@media (min-width: 1024px) {\n .about-us__top {\n max-width: 1112px;\n }\n}\n\n.about-us__title {\n text-transform: uppercase;\n padding-bottom: 32px;\n font-size: 48px;\n font-weight: 400;\n line-height: 41px;\n}\n\n@media (min-width: 640px) {\n .about-us__title {\n max-width: 328px;\n padding-bottom: 0;\n font-size: 56px;\n line-height: 47px;\n }\n}\n\n@media (min-width: 1024px) {\n .about-us__title {\n max-width: 544px;\n font-size: 72px;\n line-height: 61px;\n }\n}\n\n.about-us__description {\n font-size: 16px;\n font-weight: normal;\n line-height: 24px;\n}\n\n@media (min-width: 640px) {\n .about-us__description {\n max-width: 328px;\n }\n}\n\n@media (min-width: 1024px) {\n .about-us__description {\n max-width: 544px;\n }\n}\n\n.about-us__list {\n background-image: url(\"Crumbs.b58aa405.png\");\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n max-width: 288px;\n margin: 0 auto 72px;\n}\n\n@media (min-width: 640px) {\n .about-us__list {\n columns: 2;\n background-image: none;\n gap: 24px;\n max-width: 680px;\n padding: 0 44px;\n }\n}\n\n@media (min-width: 1024px) {\n .about-us__list {\n columns: 4;\n max-width: 1112px;\n margin: 0 auto;\n }\n}\n\n.about-us__list__item {\n padding-top: 48px;\n font-size: 96px;\n font-weight: 400;\n line-height: 82px;\n}\n\n.about-us__item__desc {\n letter-spacing: -1%;\n color: #7f8096;\n padding-top: 8px;\n font-family: inherit;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n}\n\n@media (min-width: 1200px) {\n .about-us__item__desc {\n margin-bottom: 293px;\n }\n}\n\n.footer {\n color: #fff;\n background-color: #1c1a26;\n}\n\n.footer__container {\n grid-template-areas: \"logo\"\n \"menu\"\n \"title\"\n \"contacts\"\n \"socials_info\"\n \"rights_info\";\n margin: 0 auto;\n padding: 56px 16px;\n display: grid;\n}\n\n@media (min-width: 640px) {\n .footer__container {\n grid-template-columns: 50%;\n grid-template-areas: \"logo title\"\n \"menu contacts\"\n \". contacts\"\n \"socials_info rights_info\";\n padding: 88px 44px;\n }\n}\n\n@media (min-width: 1024px) {\n .footer__container {\n max-width: 1112px;\n }\n}\n\n@media (min-width: 1200px) {\n .footer__container {\n grid-template-areas: \"logo title\"\n \"menu contacts\"\n \". contacts\"\n \"socials_info rights_info\";\n }\n}\n\n.footer__nav {\n grid-area: menu;\n}\n\n.footer__nav :nth-child(-n+4):not(:last-child) {\n margin-bottom: 16px;\n}\n\n.footer__title {\n text-transform: uppercase;\n letter-spacing: 2%;\n color: #7f8096;\n font-family: inherit;\n font-size: 16px;\n font-weight: 500;\n line-height: 16px;\n}\n\n.footer__link {\n letter-spacing: -1%;\n color: inherit;\n font-family: inherit;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n transition: color .3s;\n}\n\n.footer__link:hover {\n color: #f9512e;\n}\n\n.footer__call__container {\n grid-area: contacts;\n}\n\n@media (min-width: 1200px) {\n .footer__contacts__wrapper {\n gap: 190px;\n display: -ms-flexbox;\n display: flex;\n }\n}\n\n.footer__contacts__title {\n text-transform: uppercase;\n grid-area: title;\n margin-top: 64px;\n padding-bottom: 40px;\n font-size: 48px;\n font-weight: 400;\n line-height: 41px;\n}\n\n@media (min-width: 640px) {\n .footer__contacts__title {\n max-width: 328px;\n margin: 0;\n font-size: 56px;\n line-height: 48px;\n }\n}\n\n@media (min-width: 1024px) {\n .footer__contacts__title {\n max-width: 544px;\n padding-bottom: 40px;\n font-size: 72px;\n line-height: 61px;\n }\n}\n\n.footer__call {\n grid-area: call_info;\n}\n\n.footer__call :nth-child(-n+4):not(:last-child) {\n margin-bottom: 16px;\n}\n\n.footer__mail {\n grid-area: email_info;\n padding-top: 40px;\n}\n\n.footer__mail :nth-child(-n+4):not(:last-child) {\n margin-bottom: 16px;\n}\n\n@media (min-width: 1200px) {\n .footer__mail {\n padding: 0;\n }\n}\n\n.footer__socials {\n grid-area: socials_info;\n -ms-flex-pack: start;\n justify-content: start;\n -ms-flex-align: start;\n align-items: start;\n gap: 32px;\n margin-top: 48px;\n display: -ms-flexbox;\n display: flex;\n}\n\n.footer__rights {\n color: #7f8096;\n letter-spacing: -1%;\n grid-area: rights_info;\n margin-top: 48px;\n font-family: inherit;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n}\n\nhtml {\n scroll-behavior: smooth;\n color: #1c1a26;\n font-family: Inter, sans-serif;\n}\n\nbody {\n background: #eef7ff;\n}\n\nbody:has(.aside:target) {\n overflow: hidden;\n}\n\n/*# sourceMappingURL=index.b2b60ee4.css.map */\n","@import \"utils\";\n@import \"fonts\";\n@import \"typography\";\n@import \"./header.scss\";\n@import \"./nav.scss\";\n@import \"./icons.scss\";\n@import \"./menu.scss\";\n@import \"./aside.scss\";\n@import \"./products.scss\";\n@import \"./card.scss\";\n@import \"./about-us.scss\";\n@import \"./footer.scss\";\n\nhtml {\n scroll-behavior: smooth;\n font-family: \"Inter\", sans-serif;\n color: $text-c-black;\n}\n\nbody {\n background: $b-c-light-blue;\n\n &:has(.aside:target) {\n overflow: hidden;\n }\n}\n","@font-face {\n font-family: \"Roboto\";\n src: url(\"../fonts/Roboto-Regular-webfont.woff\") format(\"woff\");\n font-weight: normal;\n font-style: normal;\n}\n\n@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap\");\n","%h1 {\n font-family: \"Roboto\", sans-serif;\n font-weight: 400;\n}\n","body {\n margin: 0;\n}\n\nh1,\nh2,\nh3,\na,\nimg,\nspan,\np,\nul,\nli {\n margin: 0;\n padding: 0;\n}\n\na {\n text-decoration: none;\n cursor: pointer;\n}\n\nli {\n list-style: none;\n}\n",".header {\n box-sizing: border-box;\n\n &__bottom {\n padding: 0 16px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n\n @include onSM {\n align-items: start;\n padding: 0 44px;\n margin: 0 auto;\n max-width: 680px;\n }\n\n @include onMD {\n max-width: 1112px;\n }\n }\n\n &__subtitle {\n text-align: center;\n @include forTexts;\n padding-top: 32px;\n max-width: 283px;\n\n @include onSM {\n text-align: start;\n padding-top: 88px;\n margin-bottom: 146px;\n }\n\n @include onMD {\n max-width: 260px;\n padding-top: 135px;\n margin-bottom: 8px;\n }\n }\n\n &__title {\n @include forHeaders;\n padding-top: 32px;\n text-align: center;\n\n @include onSM {\n font-size: 76px;\n line-height: 68px;\n padding: 0;\n margin-bottom: 210px;\n }\n\n @include onMD {\n box-sizing: border-box;\n padding-top: 20px;\n margin-bottom: 64px;\n font-size: 125px;\n line-height: 115px;\n }\n }\n\n &__image {\n margin: 0 auto;\n width: 288px;\n height: 290px;\n background-image: url(../images/Cookie.png);\n background-size: contain;\n background-position: center;\n\n @include onSM {\n width: 326px;\n height: 328px;\n position: absolute;\n top: 232px;\n left: calc(50% - 163px);\n z-index: -1;\n }\n\n @include onMD {\n width: 544px;\n height: 546px;\n top: 88px;\n left: calc(50% - 272px);\n }\n }\n\n &__link {\n display: block;\n box-sizing: border-box;\n padding: 20px 70px;\n\n border: 2px solid $c-accent-orange-hover;\n border-radius: 32px;\n @include forSubheaders;\n color: $c-accent-orange-hover;\n @include hover(background-color, $c-accent-orange-hover);\n @include hover(color, $text-c-white);\n\n @include onSM {\n max-width: 288px;\n padding: 20px 60px;\n margin: 0 auto;\n }\n\n @include onMD {\n max-width: 326px;\n margin: 0;\n }\n }\n\n &__link::before {\n content: \"\";\n background-image: url(../images/icons/cookie.svg);\n background-size: contain;\n background-repeat: no-repeat;\n width: 20px;\n height: 20px;\n padding-right: 26px;\n }\n\n &__link:hover::before {\n background-image: url(../images/icons/cookie-hover.svg);\n transition: all 0.3s;\n }\n}\n","@mixin hover($_property, $_toValue) {\n transition: #{$_property} 0.3s;\n &:hover {\n #{$_property}: $_toValue;\n }\n}\n\n@mixin onSM {\n @media (min-width: 640px) {\n @content;\n }\n}\n\n@mixin onMD {\n @media (min-width: 1024px) {\n @content;\n }\n}\n\n@mixin onXL {\n @media (min-width: 1200px) {\n @content;\n }\n}\n\n@mixin forTexts {\n font-family: inherit;\n font-size: 16px;\n line-height: 24px;\n font-weight: 400;\n letter-spacing: -1%;\n}\n\n@mixin forHeaders {\n font-family: inherit;\n font-size: 64px;\n line-height: 54px;\n font-weight: 400;\n text-transform: uppercase;\n letter-spacing: -5%;\n}\n\n@mixin forSubheaders {\n font-family: inherit;\n font-size: 16px;\n line-height: 16px;\n font-weight: 500;\n text-transform: uppercase;\n letter-spacing: 2%;\n color: $text-c-gray;\n}\n\n@mixin forTitles {\n font-weight: 400;\n font-size: 48px;\n line-height: 41px;\n text-transform: uppercase;\n}\n","$c-gray: #eee;\n$b-c-light-blue: #eef7ff;\n$b-c-light-pink: #ffeefc;\n\n$c-light-orange-default: #fba28f;\n$c-accent-orange-hover: #f9512e;\n$c-dark-orange-focused: #b2341a;\n\n$text-c-black: #1c1a26;\n$text-c-gray: #7f8096;\n$text-c-white: #fff;\n",".nav {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 16px;\n margin: 0 auto;\n\n @include onMD {\n max-width: 1112px;\n padding: 28px 32px;\n }\n}\n",".icon {\n display: block;\n width: 29px;\n height: 29px;\n\n background-size: contain;\n background-repeat: no-repeat;\n background-position: center;\n transition: all 0.3s;\n\n &--logo {\n width: 136px;\n height: 32px;\n // background-image: url(..//images/icons/Bakerlab_logo.svg);\n }\n\n &--menu {\n background-image: url(../images/icons/menu.svg);\n width: 20px;\n height: 8px;\n @include hover(background-image, url(../images/icons/menu-hover.svg));\n\n @include onMD {\n opacity: 0;\n }\n }\n\n &--close {\n background-image: url(../images/icons/close.svg);\n @include hover(background-image, url(../images/icons/close-hover.svg));\n }\n\n &--facebook {\n background-image: url(../images/socials_logo/facebook.png);\n @include hover(background-image, url(../images/socials_logo/facebook-hover.png));\n }\n\n &--instagram {\n background-image: url(../images/socials_logo/instagram.png);\n @include hover(background-image, url(../images/socials_logo/instagram-hover.png));\n }\n\n &--twitter {\n background-image: url(../images/socials_logo/twitter.svg);\n @include hover(background-image, url(../images/socials_logo/twitter_hover.svg));\n }\n\n &__logo--light {\n width: 157px;\n height: 30px;\n padding-bottom: 40px;\n grid-area: logo;\n\n @include onSM {\n padding-bottom: 108px;\n }\n\n @include onMD {\n padding-bottom: 71px;\n }\n }\n}\n",".menu {\n justify-content: space-between;\n align-items: center;\n display: none;\n\n @include onMD {\n display: flex;\n\n & :nth-child(-n + 3):not(:last-child) {\n padding-right: 64px;\n }\n }\n\n &__link {\n color: inherit;\n font-family: inherit;\n font-size: 16px;\n line-height: 16px;\n @include hover(color, $c-accent-orange-hover);\n }\n\n &__link--contact {\n @include forSubheaders;\n color: $c-accent-orange-hover;\n\n &::before {\n content: \"\";\n background-image: url(../images/icons/phone-hover.svg);\n background-size: contain;\n background-repeat: no-repeat;\n width: 24px;\n height: 24px;\n padding-right: 26px;\n }\n }\n}\n",".aside {\n position: fixed;\n top: 0;\n right: 0;\n left: 0;\n overflow: auto;\n\n box-sizing: border-box;\n padding: 16px;\n transition: all 0.3s;\n transform: translateX(-100%);\n height: 100vh;\n margin: 0 auto;\n\n opacity: 0;\n pointer-events: none;\n background-color: #fff;\n\n &:target {\n opacity: 1;\n transform: translateX(0);\n pointer-events: all;\n }\n\n &__header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n &__menu {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 24px;\n padding-top: 132px;\n }\n\n &__link {\n @include forTexts;\n color: inherit;\n @include hover(color, $c-accent-orange-hover);\n }\n\n &__link:last-child {\n color: $c-accent-orange-hover;\n }\n}\n",".product {\n @include onSM {\n text-align: start;\n }\n\n &__header {\n max-width: 288px;\n margin: 0 auto;\n\n @include onSM {\n max-width: 680px;\n padding: 0 44px;\n }\n\n @include onMD {\n max-width: 1112px;\n }\n }\n\n &__cards {\n max-width: 288px;\n padding: 0 16px;\n\n margin: 0 auto;\n display: flex;\n flex-wrap: wrap;\n gap: 24px;\n\n @media (min-width: 768px) {\n padding: 0 44px;\n max-width: 680px;\n row-gap: 80px;\n column-gap: 24px;\n }\n\n @include onMD {\n max-width: 1112px;\n\n & :nth-child(3) {\n margin-left: auto;\n }\n }\n }\n\n &__title {\n @include forTitles;\n padding-top: 64px;\n padding-bottom: 24px;\n\n @include onSM {\n font-size: 56px;\n line-height: 47px;\n padding-top: 180px;\n }\n }\n\n &__description {\n @include forTexts;\n padding-bottom: 56px;\n }\n}\n",".card {\n box-sizing: border-box;\n\n @include onSM {\n width: 328px;\n }\n\n @include onMD {\n width: 402px;\n }\n\n & :nth-child(odd) {\n padding-bottom: 16px;\n }\n\n &__image {\n width: 100%;\n border-radius: 8px;\n @include hover(transform, scale(95%));\n }\n\n &__title {\n @include forSubheaders;\n padding-bottom: 8px;\n }\n\n &__description {\n @include forTexts;\n }\n\n &__link {\n @include forSubheaders;\n font-weight: 400;\n color: $c-accent-orange-hover;\n transition: all 0.3s ease-in;\n\n &:hover {\n padding-bottom: 5px;\n border-bottom: 1px solid $c-accent-orange-hover;\n width: fit-content;\n }\n }\n\n &__link::before {\n content: \"\";\n background-image: url(../images/icons/arrow-hover.svg);\n background-size: contain;\n background-repeat: no-repeat;\n width: 24px;\n height: 24px;\n padding-right: 26px;\n }\n}\n",".about-us {\n &__container {\n margin: 72px auto;\n\n @include onSM {\n background-image: url(../images/Crumbs.png);\n background-size: contain;\n background-repeat: no-repeat;\n background-position: center;\n overflow: hidden;\n margin: 152px auto;\n }\n\n @include onXL {\n margin-top: 178px;\n margin-bottom: 56px;\n }\n }\n\n &__top {\n display: grid;\n max-width: 288px;\n margin: auto;\n\n @include onSM {\n grid-template-areas: \"title description\";\n grid-template-columns: 50%;\n\n max-width: 680px;\n padding: 0 44px;\n gap: 24px;\n }\n\n @include onMD {\n max-width: 1112px;\n }\n }\n\n &__title {\n @include forTitles;\n padding-bottom: 32px;\n\n @include onSM {\n max-width: 328px;\n font-size: 56px;\n line-height: 47px;\n padding-bottom: 0;\n }\n\n @include onMD {\n max-width: 544px;\n font-size: 72px;\n line-height: 61px;\n }\n }\n\n &__description {\n font-size: 16px;\n font-weight: normal;\n line-height: 24px;\n\n @include onSM {\n max-width: 328px;\n }\n\n @include onMD {\n max-width: 544px;\n }\n }\n\n &__list {\n background-image: url(../images/Crumbs.png);\n background-size: contain;\n background-repeat: no-repeat;\n background-position: center;\n max-width: 288px;\n margin: 0 auto;\n margin-bottom: 72px;\n\n @include onSM {\n max-width: 680px;\n padding: 0 44px;\n background-image: none;\n columns: 2;\n gap: 24px;\n }\n\n @include onMD {\n columns: 4;\n margin: 0 auto;\n max-width: 1112px;\n }\n }\n\n &__list__item {\n font-size: 96px;\n font-weight: 400;\n line-height: 82px;\n padding-top: 48px;\n }\n\n &__item__desc {\n @include forTexts;\n color: $text-c-gray;\n padding-top: 8px;\n\n @include onXL {\n margin-bottom: 293px;\n }\n }\n}\n",".footer {\n background-color: $text-c-black;\n color: $text-c-white;\n\n &__container {\n padding: 56px 16px;\n margin: 0 auto;\n display: grid;\n grid-template-areas: \"logo\"\n \"menu\"\n \"title\"\n \"contacts\"\n \"socials_info\"\n \"rights_info\";\n\n @include onSM {\n padding: 88px 44px;\n grid-template-columns: 50%;\n grid-template-areas: \"logo title\"\n \"menu contacts\"\n \". contacts\"\n \"socials_info rights_info\";\n }\n\n @include onMD {\n max-width: 1112px;\n }\n\n @include onXL {\n grid-template-areas: \"logo title\"\n \"menu contacts\"\n \". contacts\"\n \"socials_info rights_info\";\n }\n }\n\n &__nav {\n grid-area: menu;\n\n & :nth-child(-n + 4):not(:last-child) {\n margin-bottom: 16px;\n }\n }\n\n &__title {\n @include forSubheaders;\n }\n\n &__link {\n @include forTexts;\n color: inherit;\n @include hover(color, $c-accent-orange-hover);\n }\n\n &__call__container {\n grid-area: contacts;\n }\n\n &__contacts__wrapper {\n @include onXL {\n display: flex;\n gap: 190px;\n }\n }\n\n &__contacts__title {\n @include forTitles;\n margin-top: 64px;\n padding-bottom: 40px;\n grid-area: title;\n\n @include onSM {\n font-size: 56px;\n line-height: 48px;\n max-width: 328px;\n margin: 0;\n }\n\n @include onMD {\n font-size: 72px;\n line-height: 61px;\n padding-bottom: 40px;\n max-width: 544px;\n }\n }\n\n &__call {\n grid-area: call_info;\n\n & :nth-child(-n + 4):not(:last-child) {\n margin-bottom: 16px;\n }\n }\n\n &__mail {\n padding-top: 40px;\n grid-area: email_info;\n\n & :nth-child(-n + 4):not(:last-child) {\n margin-bottom: 16px;\n }\n\n @include onXL {\n padding: 0;\n }\n }\n\n &__socials {\n display: flex;\n justify-content: start;\n align-items: start;\n gap: 32px;\n margin-top: 48px;\n grid-area: socials_info;\n }\n\n &__rights {\n color: $text-c-gray;\n @include forTexts;\n margin-top: 48px;\n grid-area: rights_info;\n }\n}\n"],"names":[],"version":3,"file":"index.b2b60ee4.css.map"} \ No newline at end of file diff --git a/index.cabb280d.js b/index.cabb280d.js new file mode 100644 index 0000000..e43077f --- /dev/null +++ b/index.cabb280d.js @@ -0,0 +1,2 @@ + +//# sourceMappingURL=index.cabb280d.js.map diff --git a/index.cabb280d.js.map b/index.cabb280d.js.map new file mode 100644 index 0000000..9d54ef7 --- /dev/null +++ b/index.cabb280d.js.map @@ -0,0 +1 @@ +{"mappings":"","sources":["src/scripts/main.js"],"sourcesContent":["'use strict';\n"],"names":[],"version":3,"file":"index.cabb280d.js.map"} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..a9dea52 --- /dev/null +++ b/index.html @@ -0,0 +1 @@ +Creative Bakery
Products About Us Blog Contact us

We bake your fantasies — croissants, cakes, cookies, and cupcakes.

Creative bakery

Learn more

What we bake

We can customize our cookies right for your needs. Just imagine it

product image

Cakes

Oatmeal cookies with golden raisins, orange zest and chocolate chips

Order
product image

Cakes

Chocolate biscuit coffee cake topped with a buttercream and powder

Order
product image

Donuts

Light multi-layered croissant strewn with cinammon and almond “petals”

Order
product image

Donuts

Light multi-layered croissant strewn with coconut and nuts

Order
product image

Cakes

Chocolate salted caramel, Vanilla frutti pebbles

Order
product image

Cookies

Oatmeal cookies with golden raisins, orange zest and chocolate chips

Order

Few words About us

Like many design teams, Onfido made the transition from Abstract + Sketch, to Figma in the last couple of years. One of the common resistance points internally before making that switch, was Figma’s lack of Git-style branching that Abstract enabled. The design team had come to rely on branching and had built a lot of our processes around it.

  • 2015

    Foundation year

  • 23

    Stores

  • 155

    Companies

  • 10k+

    Clients

\ No newline at end of file diff --git a/instagram-hover.be565f6d.png b/instagram-hover.be565f6d.png new file mode 100644 index 0000000..c5a4112 Binary files /dev/null and b/instagram-hover.be565f6d.png differ diff --git a/instagram.8e749253.png b/instagram.8e749253.png new file mode 100644 index 0000000..ef8ab67 Binary files /dev/null and b/instagram.8e749253.png differ diff --git a/menu-hover.2ba27ac1.svg b/menu-hover.2ba27ac1.svg new file mode 100644 index 0000000..8bddb31 --- /dev/null +++ b/menu-hover.2ba27ac1.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/menu.8a963822.svg b/menu.8a963822.svg new file mode 100644 index 0000000..b63f789 --- /dev/null +++ b/menu.8a963822.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/phone-hover.eb9e5fff.svg b/phone-hover.eb9e5fff.svg new file mode 100644 index 0000000..7e345b5 --- /dev/null +++ b/phone-hover.eb9e5fff.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/photo-product-01.572702c0.png b/photo-product-01.572702c0.png new file mode 100644 index 0000000..fb9315a Binary files /dev/null and b/photo-product-01.572702c0.png differ diff --git a/photo-product-2.e1f8882d.png b/photo-product-2.e1f8882d.png new file mode 100644 index 0000000..12585a8 Binary files /dev/null and b/photo-product-2.e1f8882d.png differ diff --git a/photo-product-3.6d95b648.png b/photo-product-3.6d95b648.png new file mode 100644 index 0000000..fb7bcfd Binary files /dev/null and b/photo-product-3.6d95b648.png differ diff --git a/photo-product-4.1b3dc300.png b/photo-product-4.1b3dc300.png new file mode 100644 index 0000000..69e847a Binary files /dev/null and b/photo-product-4.1b3dc300.png differ diff --git a/photo-product-5.dfbecade.png b/photo-product-5.dfbecade.png new file mode 100644 index 0000000..e47865b Binary files /dev/null and b/photo-product-5.dfbecade.png differ diff --git a/photo-product-6.8b22bfa4.png b/photo-product-6.8b22bfa4.png new file mode 100644 index 0000000..2e2271e Binary files /dev/null and b/photo-product-6.8b22bfa4.png differ diff --git a/twitter.69746f91.svg b/twitter.69746f91.svg new file mode 100644 index 0000000..2ba77d0 --- /dev/null +++ b/twitter.69746f91.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/twitter_hover.13f711d5.svg b/twitter_hover.13f711d5.svg new file mode 100644 index 0000000..dff92ac --- /dev/null +++ b/twitter_hover.13f711d5.svg @@ -0,0 +1 @@ + \ No newline at end of file