@import"https://fonts.googleapis.com/css2?family=Barlow:wght@600&family=Fraunces:wght@700;900&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{min-height:100vh}h1,h2,h3{font-family:Fraunces,serif;font-weight:900}body,p,a,span{font-family:Barlow,sans-serif;font-weight:600}img{display:block}a{text-decoration:none;color:#fff}nav{display:flex;justify-content:space-between;align-items:center;padding:2rem 3rem;width:100%;width:100vw;position:fixed}li{list-style:none}li a{font-weight:600;color:#fff;font-size:18px}.menu-btn{display:none;cursor:pointer}ul{display:flex;gap:1.85rem;align-items:center}.contact-btn{background-color:#fff;padding:12px 24px;border-radius:27px;transition:all .2s ease-in}.contact-btn a{color:#23303e!important;font-family:Fraunces,serif!important}.contact-btn:hover{cursor:pointer;background-color:#fff6}.contact-btn:hover a{transition:all .2s ease-in;color:#fff!important}@media (max-width:665px){ul{position:absolute;top:-435%;background-color:#fff;flex-direction:column;justify-content:center;align-items:center;padding:2rem;gap:2rem;z-index:2000;width:80%;left:50%;transform:translate(-50%)}ul:before{content:"";position:absolute;top:-10px;right:20px;width:20px;height:20px;background-color:#fff;transform:rotate(45deg);z-index:-1}.active{top:135%}.menu-btn{display:block}li a{color:#5a636c;font-size:20px}.contact-btn{font-weight:500;background-color:#fad400}.contact-btn:hover{background-color:#23303e}}.hero-section{background-image:url(/react-projects/junior/sunny-side/assets/images/desktop/image-header.jpg);background-size:cover;background-position:bottom;background-repeat:no-repeat;height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2rem}.hero-section h1{font-size:3.33rem;line-height:1.5;text-transform:uppercase;letter-spacing:8px;color:#fff;text-align:center}.hero-section img{display:block;margin-bottom:5rem}@media (max-width:420px){.hero-section h1{font-size:28px}}.transfrom-section,.stand-out-section{display:flex;background-color:#fff;align-items:center}.content-side{padding:4rem;width:50%;display:flex;flex-direction:column;gap:2.44rem}.img-side{width:50%;height:500px}.img-side img,.graphic-img img,.photography-img img{width:100%;height:100%}.graphic-photography-div{display:flex}.graphic-section,.photography-section{width:50%;height:100%}.content-side a{font-size:18px;letter-spacing:1px;color:#23303e;font-weight:600;text-transform:uppercase;font-family:Fraunces,serif!important;position:relative;display:inline-block;align-self:flex-start}.content-side a:before{content:"";position:absolute;left:50%;bottom:-2px;transform:translate(-50%);background-color:#fad4004d;height:8px;width:100%;border-radius:8px;padding:0 4px;transition:all .2s ease-in}.stand-out-section a:before{background-color:#fe78674d}.content-side p{font-size:18px;line-height:1.5;color:#818498}.content-side h1{font-size:34px;color:#23303e}.photography-section,.graphic-section{position:relative}.graphic-content,.photography-content{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;gap:1rem;bottom:0;padding:3rem 4rem;line-height:1.6}.graphic-content h2,.graphic-content p{color:#25564b}.photography-content h2,.photography-content p{color:#23303e}.transfrom-section a:hover:before{background-color:#fad400}.stand-out-section a:hover:before{background-color:#fe7867}.client-testimonials{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;gap:2rem}.client-testimonials h1{margin:4rem 0 1rem;text-transform:uppercase;color:#a7abae;letter-spacing:4px;font-size:28px;text-align:center}.clients-section{display:flex;justify-content:space-evenly}.clients{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.55rem;padding:2rem}.clients h3{text-align:center;color:#23303e;margin-bottom:.45rem}.clients p{text-align:center;line-height:1.5;color:#5a636c}.clients span{color:#a7abae;font-size:14px}.clients img{border-radius:50%;height:70px;width:70px}.gallery-images{margin-top:2rem;display:grid;grid-template-columns:repeat(4,1fr);grid-template-areas:"milk-bottles orang  cone sugar-cubes"}.milk-bottles{grid-area:milk-bottles}.sugar-cubes{grid-area:sugar-cubes}.cone{grid-area:cone}.orange{grid-area:orang}.gallery-images picture img{width:100%;height:auto;display:block}.footer-links{padding:4rem;background-color:#7fffd4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;background-color:#96eedb}.footer-links h1{color:#25564b;font-weight:bolder;font-family:sans-serif}.links{display:flex;gap:4rem}.links a{color:#25564b}.social-links{margin-top:2rem;display:flex;gap:2rem;cursor:pointer}@media (max-width:773px){.graphic-photography-div,.transfrom-section,.stand-out-section{flex-direction:column}.content-side,.img-side,.photography-section,.graphic-section{width:100%}.content-side{text-align:center}.content-side a{align-self:center}.clients-section{flex-direction:column}.client-testimonials{padding:2% 3%}.gallery-images{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,auto);grid-template-areas:"milk-bottles orang" "cone sugar-cubes"}.links{gap:2rem}}
