css/styles.css
@import"https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,700&display=swap";@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap";@keyframes slide-in-elliptic-top-fwd{0%{transform:translateY(-600px) rotateX(-30deg) scale(0);transform-origin:50% 100%;opacity:0}100%{transform:translateY(0) rotateX(0) scale(1);transform-origin:50% 1400px;opacity:1}}@keyframes roll-in-blurred-left{0%{transform:translateX(-1000px) rotate(-720deg);filter:blur(50px);opacity:0}100%{transform:translateX(0) rotate(0deg);filter:blur(0);opacity:1}}@keyframes scale-up-center{0%{transform:scale(0.5)}100%{transform:scale(1)}}html{font-size:62.5%}*{margin:0;padding:0;box-sizing:border-box;font-family:"Montserrat",sans-serif}body{height:100vh;display:flex;justify-content:center;align-items:center;flex-direction:row;background-color:#f2ebe3}body main{border-radius:1rem;display:flex;background-color:#fff;border-radius:1rem}body main .image_area{animation:roll-in-blurred-left .65s cubic-bezier(0.23, 1, 0.32, 1) both;animation-delay:.5s;width:30rem;height:44.6rem}body main .image_area img{border-radius:10px 0 0 10px;width:inherit;height:inherit}body main .image_area #mobile_image{display:none}body main .text_area{display:flex;justify-content:space-around;align-items:flex-start;flex-direction:column;font-size:1.4rem;padding:2rem;height:44.6rem;width:30rem}body main .text_area .perfume{animation:tracking-in-expand .7s cubic-bezier(0.215, 0.61, 0.355, 1) both;animation-delay:.7s;color:#6c7289;text-transform:uppercase;letter-spacing:.4rem}body main .text_area .title_container{display:flex;align-items:center;height:12rem;width:20rem}body main .text_area .title_container h1{font-family:"Fraunces",sans-serif;color:#1c232b;font-weight:700;font-size:3rem}body main .text_area .description_container{color:#6c7289;display:flex;align-items:center;height:8rem;width:24rem}body main .text_area .price_container{animation:tracking-in-expand 2s cubic-bezier(0.215, 0.61, 0.355, 1) both;height:4rem;width:20rem;display:flex;justify-content:space-between;align-items:center;flex-direction:row}body main .text_area .price_container .main_price{font-family:"Fraunces",sans-serif;color:#3c8067;font-size:3rem}body main .text_area .price_container .discount_price{position:relative;color:#6c7289}body main .text_area .price_container .discount_price::after{content:"";position:absolute;height:.1rem;width:0%;background-color:#6c7289;left:0;top:50%;animation:cut-price 6s ease forwards}body main .text_area .button{cursor:pointer;margin-top:1.5rem;background-color:#3c8067;height:5rem;width:100%;display:flex;justify-content:center;align-items:center;flex-direction:row;gap:1rem;color:#fff;border-radius:1rem;animation:scale-up-center 1s cubic-bezier(0.39, 0.575, 0.565, 1) both;font-size:1.4rem}body main .text_area .button:hover{background-color:#1d3e32}.slide-in-elliptic-top-fwd{animation:slide-in-elliptic-top-fwd .7s cubic-bezier(0.25, 0.46, 0.45, 0.94) both}.tracking-in-expand{animation:tracking-in-expand .7s cubic-bezier(0.215, 0.61, 0.355, 1) both}@keyframes cut-price{to{width:100%}}/*# sourceMappingURL=styles.css.map */