html{scroll-behavior:smooth}html,body{width:100%}.page{max-width:1240px;margin:0 auto;padding:10px}*{cursor:default;margin:0;padding:0}*,:before,:after{box-sizing:border-box}ul{margin:0;padding:0;list-style:none}img{max-width:100%;height:auto;display:block}button{font:inherit}a{color:inherit;text-decoration:none}:root{--background-color:white;--primary-color:#ff7000;--secondary-color:#ffa640;--accent-color:black;--card-color:#f9c87c;--heading-color:black;--body-text-color:#252525;--muted-text-color:#fcf0de;--border-color:#f97432;--main-font:"DynaPuff";--heading-font:"Luckiest Guy";--small-text:14px;--body-text:16px;--large-text:20px;--h1:48px;--h2:36px;--h3:28px;--small-spacing:.5rem;--medium-spacing:1rem;--large-spacing:2rem;--extra-large-spacing:4rem;--small-radius:8px;--medium-radius:16px;--large-radius:24px;--circle-radius:999px;--light-shadow:0px 2px 8px #00000014;--medium-shadow:0px 8px 20px #0000001f;--large-shadow:0px 16px 32px #00000029;--fast-transition:.2s ease;--normal-transition:.3s ease;--slow-transition:.5s ease;--max-width:1240px}h1,h2,h3{letter-spacing:.1rem}header{padding:var(--medium-spacing);background-color:var(--muted-text-color);z-index:1;border:1px solid var(--muted-text-color);border-top-left-radius:var(--medium-radius);border-top-right-radius:var(--medium-radius);flex-direction:row;justify-content:space-between;align-items:center;width:100%;margin-bottom:0;display:flex}#logo-title{justify-content:space-between;align-items:center;gap:var(--small-spacing);display:flex}#title{color:var(--primary-color);font-family:var(--heading-font)}ul{justify-content:space-between;gap:1.5rem;display:flex}.nav-link{color:var(--primary-color);font-family:var(--heading-font);cursor:pointer;transition:transform var(--normal-transition), color var(--normal-transition), letter-spacing var(--normal-transition);font-size:18px}.nav-link:hover{color:#b44c01;letter-spacing:.1rem;display:inline-block;transform:scale(1.05)}.nav-link:active{color:#000;letter-spacing:.1rem;font-weight:900}#logo{width:50px;height:50px}#hero-section{padding:var(--medium-spacing);background-color:var(--muted-text-color);z-index:1;border:1px solid var(--muted-text-color);border-bottom-left-radius:var(--medium-radius);border-bottom-right-radius:var(--medium-radius);width:100%;margin-top:0}#hero-text{justify-content:space-between;align-items:center;gap:var(--large-spacing);z-index:2;flex-direction:column;margin-top:6rem;display:flex}#hero-heading{font-family:var(--heading-font);letter-spacing:.3rem;color:var(--primary-color);z-index:3;flex-direction:column;justify-content:center;align-items:center;font-size:60px;display:flex}#hero-desc{letter-spacing:.1rem;font-family:var(--main-font);color:var(--secondary-color);z-index:3;flex-direction:column;justify-content:center;align-items:center;display:flex}#hero-btn{background-color:var(--body-text-color);color:var(--background-color);font-family:var(--main-font);font-size:var(--small-text);letter-spacing:.1rem;border:1px solid var(--body-text-color);border-radius:var(--large-radius);z-index:3;transition:background-color var(--normal-transition), transform var(--normal-transition), box-shadow var(--normal-transition);cursor:pointer;margin-bottom:25px;padding:15px 25px}#hero-btn:hover{box-shadow:var(--large-shadow);background-color:#0e0e0e;transform:scale(1.03)}#hero-btn:active{background-color:#000;transform:scale(.98)translateY(2px)}#features{flex-direction:column;width:100%;display:flex}#first-row,#second-row,#third-row{flex-direction:row;justify-content:space-between;gap:10px;display:flex}.feature-heading{font-family:var(--heading-font);color:var(--primary-color);font-size:var(--h1)}.img-text{justify-content:center;align-items:center;gap:10px;display:flex}.feature-desc{font-family:var(--main-font);color:var(--secondary-color);font-size:var(--large-text)}.feature-img{width:70px;height:70px}article{transition:transform var(--fast-transition)}article:hover{transform:scale(1.01)}#color{padding:var(--medium-spacing);background-color:var(--muted-text-color);border:5px solid var(--border-color);border-radius:var(--medium-radius);flex-direction:column;align-items:center;gap:15px;width:50%;margin-top:10px;margin-bottom:10px;padding-bottom:25px;display:flex}#price-div{flex-direction:row;justify-content:space-between;display:flex}#color-controls{flex-direction:row;gap:50px;margin-top:20px;display:flex}.color-img{width:100px;height:100px;transition:transform var(--normal-transition);cursor:pointer}.color-img:hover{transform:scale(1.05)}.color-btn{border-radius:var(--circle-radius);cursor:pointer;transition:transform var(--slow-transition);border:none;margin-top:10px}.color-btn:active{transform:scale(.98)translateY(2px)}#blossom-btn{background-color:pink}#color-preview{border-radius:var(--medium-radius);transition:transform var(--slow-transition);background-color:#fff;border:none;flex-direction:row;margin-top:20px;display:flex}#color-preview:hover{transform:scale(1.01)}#product-img{border-radius:var(--medium-radius);border:none;width:250px;height:250px;margin:10px}#product-name{letter-spacing:.1px;color:#000;margin-top:5px;font-family:sans-serif;font-size:28px;font-weight:700}#preview-horizontal{flex-direction:column;gap:10px;margin:20px;display:flex}#price{letter-spacing:.1px;color:#000;font-family:sans-serif;font-size:36px;font-weight:700}#product-desc{letter-spacing:.1px;color:#252525;margin-top:20px;font-family:sans-serif;font-size:16px}#product-btn{background-color:var(--body-text-color);color:var(--background-color);font-family:var(--main-font);font-size:var(--small-text);letter-spacing:.1rem;border:1px solid var(--body-text-color);border-radius:var(--large-radius);transition:background-color var(--normal-transition), transform var(--normal-transition), box-shadow var(--normal-transition);cursor:pointer;margin-top:20px;padding:10px 20px}#product-btn:hover{box-shadow:var(--large-shadow);background-color:#0e0e0e;transform:scale(1.03)}#product-btn:active{background-color:#000;transform:scale(.98)translateY(2px)}#color-preview.ocean-theme{background-color:#dcdcff}#color-preview.ocean-theme #product-name,#color-preview.ocean-theme #price{color:#01018a}#color-preview.ocean-theme #product-desc{color:#0606d9}#color-preview.ocean-theme #product-btn{background-color:#01018a;border:none}#color-preview.ocean-theme #product-btn:hover{background-color:#1f1fa8}#color-preview.ocean-theme #product-btn:active{background-color:#000072}#color-preview.forest-theme{background-color:#d0ffd0}#color-preview.forest-theme #product-name,#color-preview.forest-theme #price{color:#017501}#color-preview.forest-theme #product-desc{color:#009f00}#color-preview.forest-theme #product-btn{background-color:#017501;border:none}#color-preview.forest-theme #product-btn:hover{background-color:#01b701}#color-preview.forest-theme #product-btn:active{background-color:#005d00}#color-preview.blossom-theme{background-color:#ffe6ea}#color-preview.blossom-theme #product-name,#color-preview.blossom-theme #price{color:#ff758c}#color-preview.blossom-theme #product-desc{color:#fe8599}#color-preview.blossom-theme #product-btn{background-color:#ff758c;border:none}#color-preview.blossom-theme #product-btn:hover{background-color:#f58e9f}#color-preview.blossom-theme #product-btn:active{background-color:#fa5672}#typography{padding:var(--medium-spacing);background-color:var(--muted-text-color);border:5px solid var(--border-color);border-radius:var(--medium-radius);flex-direction:column;align-items:center;gap:15px;width:50%;margin-top:10px;margin-bottom:10px;display:flex}#typo-controls{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(2,1fr);gap:20px;margin-top:40px;display:grid}#control1,#control2,#control3,#control4{flex-direction:row;justify-content:space-between;display:flex}#font-label,#size-label,#weight-label,#spacing-label{font-family:var(--main-font);color:var(--border-color);margin-right:10px;font-size:24px}select{border-radius:var(--small-radius);text-align:center;width:140px;transition:background-color var(--normal-transition);border:none;padding-left:10px;padding-right:10px;font-family:sans-serif}select:hover{background-color:#f0efef}select:focus{outline:none;box-shadow:0 0 0 4px #342b191b}#typo-preview{border-radius:var(--medium-radius);background-color:#fff;border:none;flex-direction:column;justify-content:center;align-items:center;margin-top:32px;display:flex}#typo-preview-heading{font-family:var(--main-font);font-size:var(--h3);margin:64px}#typo-preview-desc{font-family:var(--main-font);font-size:var(--large-text);text-align:center;margin:0 40px 40px}#grid{padding:var(--medium-spacing);background-color:var(--muted-text-color);border:5px solid var(--border-color);border-radius:var(--medium-radius);flex-direction:column;align-items:center;gap:15px;width:50%;margin-top:10px;margin-bottom:10px;display:flex}#plus-rows-btn,#minus-rows-btn,#plus-column-btn,#minus-column-btn,#plus-gap-btn,#minus-gap-btn{background-color:var(--primary-color);color:var(--background-color);font-family:var(--main-font);font-size:var(--small-text);border:1px solid var(--primary-color);border-radius:var(--circle-radius);font-size:var(--extra-large-text);cursor:pointer;transition:transform var(--normal-transition), background-color var(--slow-transition);padding:10px 16px}#plus-rows-btn:hover,#minus-rows-btn:hover,#plus-column-btn:hover,#minus-column-btn:hover,#plus-gap-btn:hover,#minus-gap-btn:hover{background-color:#fe7c19;transform:scale(1.05)}#plus-rows-btn:active,#minus-rows-btn:active,#plus-column-btn:active,#minus-column-btn:active,#plus-gap-btn:active,#minus-gap-btn:active{background-color:#d25c02;transform:scale(.98)}#rows,#columns,#gap{font-size:var(--large-text);font-family:var(--main-font);color:var(--border-color)}#gap{margin-left:110px;margin-right:110px}#rows{margin-left:120px;margin-right:120px}#columns{margin-top:100px;margin-bottom:100px;margin-left:10px}#grid-minus{flex-direction:row;gap:15px;display:flex}#horizontal-flex{flex-direction:column;justify-content:center;align-items:center;gap:15px;display:flex}#grid-minus-btn{flex-direction:column;display:flex}#grid-preview{aspect-ratio:1;border-radius:var(--large-radius);background-color:#fdfcee;border:5px solid #fdfcee;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:1px;width:min(50vw,350px);padding:2px;display:grid}.section{border-radius:var(--large-radius);border:none;width:100%;height:105px;overflow:hidden}.section img{border-radius:var(--small-radius);object-fit:cover;border:none;width:100%;height:100%}#grid-gap-btn{justify-content:center}#grid-plus{margin-left:20px}#flex{padding:var(--medium-spacing);background-color:var(--muted-text-color);border:5px solid var(--border-color);border-radius:var(--medium-radius);flex-direction:column;align-items:center;gap:15px;width:50%;margin-top:10px;margin-bottom:10px;display:flex}#flex-row-btn,#flex-column-btn{background-color:var(--primary-color);color:var(--background-color);font-family:var(--main-font);border:1px solid var(--primary-color);border-radius:var(--circle-radius);font-size:var(--extra-large-text);cursor:pointer;transition:transform var(--normal-transition), background-color var(--slow-transition)}#flex-row-btn:hover,#flex-column-btn:hover{background-color:#fe7c19;transform:scale(1.05)}#flex-row-btn:active,#flex-column-btn:active{background-color:#d25c02;transform:scale(.98)}#flex-controls{flex-direction:row;gap:40px;display:flex}#flex-column-btn{padding:10px 16px}#flex-row-btn{padding:10px 30px}#playlist{flex-direction:row;gap:10px;display:flex}.song{border-radius:var(--large-radius);text-align:left;transition:transform var(--normal-transition);background-color:#fffff7;border:none;flex-direction:column;align-items:center;gap:20px;padding:10px;font-family:Lucida Sans Regular,Lucida Grande,Lucida Sans Unicode,Geneva,Verdana,sans-serif;display:flex}.song:hover{transform:scale(1.02)}.song-container{border-radius:var(--large-radius);border:none;width:100%;height:160px;overflow:hidden}.song-container img{border-radius:var(--small-radius);object-fit:cover;border:none;width:100%;height:100%}.title-heart{flex-direction:row;justify-content:space-between;gap:30px;display:flex}.title-artist{flex-direction:column;gap:10px;display:flex}.title{font-weight:900;font-size:var(--large-text)}.artist{color:#3c3b3b;font-size:var(--small-text)}.duration-line{background-color:#807e7e;border-radius:999px;width:90%;height:5px}.duration{border-radius:inherit;background-color:#000;width:20%;height:100%;position:relative}#duration2{width:60%}#duration3{width:40%}.circle{background-color:#000;border-radius:50%;width:12px;height:12px;position:absolute;top:50%;right:-6px;transform:translateY(-50%)}.time-stamp{color:#747373;flex-direction:row;gap:110px;margin-top:-10px;font-size:10px;display:flex}.prev,.play,.next{width:100%;height:30px;overflow:hidden}.prev{width:90%;height:32px}.play{background-color:#e3e2e2;border-radius:50%;height:40px;padding:5px}.song-btns{flex-direction:row;align-items:center;gap:10px;display:flex}.prev-img,.next-img,.pause-img{object-fit:cover;width:100%;height:100%}#buttons{padding:var(--medium-spacing);background-color:var(--muted-text-color);border:5px solid var(--border-color);border-radius:var(--medium-radius);flex-direction:column;align-items:center;gap:15px;width:50%;margin-top:10px;margin-bottom:10px;display:flex}#button-preview{border-radius:var(--large-radius);background-color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:100px;width:80%;height:60%;margin-top:20px;padding:10px;display:flex}#magic-btn{color:var(--background-color);font-family:var(--main-font);font-size:var(--large-text);letter-spacing:.1rem;border-radius:var(--large-radius);cursor:pointer;text-align:center;transition:background-color var(--normal-transition), border var(--normal-transition), transform var(--normal-transition);background-color:#3535ff;border:1px solid #3535ff;padding:15px 25px}#magic-btn:hover{background-color:#5151fa;border:1px solid #5151fa;transform:scale(1.1)}#magic-btn:active{background-color:#1414f4;border:1px solid #1414f4;transform:scale(.98)translateY(-2px)}#styles-text{font-family:var(--main-font);font-size:var(--body-text);text-align:center;margin-bottom:-100px}#magic-btn.purple-btn{color:var(--background-color);font-family:var(--main-font);font-size:var(--large-text);letter-spacing:.1rem;border-radius:var(--large-radius);cursor:pointer;text-align:center;transition:background-color var(--normal-transition), border var(--normal-transition), transform var(--normal-transition);background-color:#c100c4;border:1px solid #c100c4;padding:15px 25px}#magic-btn.purple-btn:hover{background-color:#d874ff;border:1px solid #d874ff;transform:scale(1.1)}#magic-btn.purple-btn:active{background-color:#6d0083;border:1px solid #6d0083;transform:scale(.98)translateY(-2px)}#magic-btn.yellow-btn{color:var(--background-color);font-family:var(--main-font);font-size:var(--large-text);letter-spacing:.1rem;border-radius:var(--large-radius);cursor:pointer;text-align:center;transition:background-color var(--normal-transition), border var(--normal-transition), transform var(--normal-transition);background-color:#fbff10;border:1px solid #fbff10;padding:15px 25px}#magic-btn.yellow-btn:hover{background-color:#fffb78;border:1px solid #fffb78;transform:scale(1.1)}#magic-btn.yellow-btn:active{background-color:#a6b100;border:1px solid #a6b100;transform:scale(.98)translateY(-2px)}#magic-btn.red-btn{color:var(--background-color);font-family:var(--main-font);font-size:var(--large-text);letter-spacing:.1rem;border-radius:var(--large-radius);cursor:pointer;text-align:center;transition:background-color var(--normal-transition), border var(--normal-transition), transform var(--normal-transition);background-color:#ff2b2b;border:1px solid #ff2b2b;padding:15px 25px}#magic-btn.red-btn:hover{background-color:#ff4343;border:1px solid #ff4343;transform:scale(1.1)}#magic-btn.red-btn:active{background-color:#950000;border:1px solid #950000;transform:scale(.98)translateY(-2px)}#magic-btn.pink-btn{color:var(--background-color);font-family:var(--main-font);font-size:var(--large-text);letter-spacing:.1rem;border-radius:var(--large-radius);cursor:pointer;text-align:center;transition:background-color var(--normal-transition), border var(--normal-transition), transform var(--normal-transition);background-color:#ff44e3;border:1px solid #ff44e3;padding:15px 25px}#magic-btn.pink-btn:hover{background-color:#fa73ff;border:1px solid #fa73ff;transform:scale(1.1)}#magic-btn.pink-btn:active{background-color:#a7009c;border:1px solid #a7009c;transform:scale(.98)translateY(-2px)}#animation{padding:var(--medium-spacing);background-color:var(--muted-text-color);border:5px solid var(--border-color);border-radius:var(--medium-radius);flex-direction:column;align-items:center;gap:15px;width:50%;margin-top:10px;margin-bottom:10px;display:flex}#animation-preview{border-radius:var(--large-radius);background-color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:80%;height:60%;margin-top:20px;padding:10px 10px 60px;display:flex}#space{border-radius:var(--large-radius);width:90%;height:90%;margin-top:20px;margin-bottom:35px;position:relative}#space-img{border-radius:var(--large-radius);z-index:4;width:100%;height:300px;position:relative;overflow:hidden}#rocket-div{z-index:10;position:absolute;bottom:10px;left:50%;transform:translate(-50%)}#rocket{z-index:10;width:80px;height:auto;display:block}#launch-btn{background-color:var(--primary-color);color:var(--background-color);font-family:var(--main-font);border:1px solid var(--primary-color);border-radius:var(--circle-radius);font-size:var(--large-text);cursor:pointer;transition:transform var(--normal-transition), background-color var(--slow-transition);margin-bottom:-70px;padding:10px 16px}#launch-btn:hover{background-color:#fe7c19;transform:scale(1.05)}#launch-btn:active{background-color:#d25c02;transform:scale(.98)}#rocket-div.rocket-launching{animation:2s ease-in-out forwards rocket-launch}@keyframes rocket-launch{0%{opacity:1;transform:translate(-50%)translateY(0)}85%{opacity:1;transform:translate(-50%)translateY(-160px)}to{opacity:0;transform:translate(-50%)translateY(-170px)}}footer{background-color:var(--muted-text-color);padding:var(--extra-large-spacing);border:1px solid var(--muted-text-color);border-top-left-radius:var(--medium-radius);border-top-right-radius:var(--medium-radius);flex-direction:column;gap:10px;width:100%;display:flex}#footer-title,#footer-text,#github-link,#end-text{color:var(--primary-color);font-family:var(--heading-font);font-size:var(--large-text)}#footer-text,#github-link,#end-text{font-size:var(--small-text)}@media (width<=1205px){.color-img{width:50px;height:50px}#grid-gap-btn{justify-content:center;margin-left:0}.feature-heading{font-family:var(--heading-font);color:var(--primary-color);font-size:var(--large-text)}.feature-desc{font-family:var(--main-font);color:var(--secondary-color);font-size:var(--body-text)}.feature-img{width:35px;height:35px}#product-img{width:125px;height:125px}#product-name{font-size:var(--body-text)}#price{font-size:var(--large-text)}#product-desc{font-size:var(--small-text)}#product-btn{padding:5px 10px}#font-label,#size-label,#weight-label,#spacing-label{font-size:var(--small-text)}select{border-radius:var(--small-radius);text-align:center;width:140px;transition:background-color var(--normal-transition);border:none;padding-left:10px;padding-right:10px;font-family:sans-serif}#typo-preview-heading{font-size:var(--body-text);margin:32px}#typo-preview-desc{font-size:var(--small-text)}#space{width:90%;height:90%;margin-bottom:5px}#space-img{height:200px}#rocket-div{bottom:-20px}#rocket{width:50px}#launch-btn{font-size:var(--small-text);margin-bottom:-30px}#button-preview{gap:50px}#plus-rows-btn,#minus-rows-btn,#plus-column-btn,#minus-column-btn,#plus-gap-btn,#minus-gap-btn{font-size:var(--small-text);border:1px solid var(--primary-color);border-radius:var(--circle-radius);padding:6px 10px}#rows,#columns,#gap{font-size:var(--small-text)}#gap{margin-left:55px;margin-right:55px}#rows{margin-left:60px;margin-right:60px}#columns{margin-top:50px;margin-bottom:50px;margin-left:5px}.section{width:100%;height:60px}.section img{object-fit:cover;width:100%;height:100%}#flex-row-btn,#flex-column-btn{font-size:10px}#flex-column-btn{padding:5px 8px}#flex-row-btn{padding:5px 15px}.song-container{width:80%;height:80px}.song{gap:10px;padding:5px}.title{font-size:var(--body-text)}.artist{font-size:var(--small-text)}.duration-line{width:70%;height:3px}.title-heart{gap:15px}.title-artist{gap:5px}.circle{width:10px;height:10px}.time-stamp{gap:90px;margin-top:-8px;font-size:6px}.prev,.play,.next{width:40%;height:14px;overflow:hidden}.prev{width:30%;height:14px}.play{background-color:#e3e2e2;border-radius:50%;height:20px;padding:5px}}@media (width<=970px){#features{flex-direction:column;display:flex}#first-row{flex-direction:column;justify-content:space-between;gap:10px;display:flex}#second-row,#third-row{flex-direction:column;justify-content:space-between;display:flex}#logo{width:25px;height:25px}#title{font-size:var(--large-text)}.nav-link{font-size:var(--small-text)}ul{gap:1rem}#hero-heading{letter-spacing:.3rem;font-size:40px}#hero-desc{font-size:var(--small-text)}#hero-btn{font-size:var(--small-text);margin-bottom:25px;padding:7px 13px}#color,#typography,#grid,#flex,#buttons,#animation{width:99%;margin-left:5px}.feature-heading{font-size:var(--h1)}.feature-desc{font-size:var(--h3)}.feature-img{width:50px;height:50px}.color-img{width:125px;height:125px}#product-img{width:200px;height:200px}#product-name{font-size:28px}#price{font-size:36px}#product-desc{font-size:16px}#product-btn{font-size:var(--small-text)}#font-label,#size-label,#weight-label,#spacing-label{margin-right:10px;font-size:24px}#typo-preview-heading{font-size:var(--h3);margin:64px}#typo-preview-desc{font-size:var(--large-text);margin:0 40px 40px}#plus-rows-btn,#minus-rows-btn,#plus-column-btn,#minus-column-btn,#plus-gap-btn,#minus-gap-btn{font-size:var(--extra-large-text);padding:10px 16px}#rows,#columns,#gap{font-size:var(--large-text)}#gap{margin-left:110px;margin-right:110px}#rows{margin-left:120px;margin-right:120px}#columns{margin-top:100px;margin-bottom:100px;margin-left:10px}.section{width:100%;height:105px}#grid-gap-btn{justify-content:center;margin-left:0}#grid-plus{margin-left:20px}#flex-row-btn,#flex-column-btn{font-size:var(--extra-large-text)}#flex-column-btn{padding:10px 16px}#flex-row-btn{padding:10px 30px}.song{gap:20px;padding:10px}.song-container{width:100%;height:160px}.title-heart{gap:30px}.title-artist{gap:10px}.duration-line{width:90%;height:5px}.circle{width:16px;height:16px}.time-stamp{gap:110px;font-size:10px}.title{font-size:var(--large-text)}.artist{font-size:var(--small-text)}.prev,.play,.next{width:100%;height:30px}.prev{width:90%;height:32px}.play{height:40px;padding:5px}#button-preview{gap:70px;width:80%;height:60%;margin-top:20px;margin-bottom:20px;padding:130px}#magic-btn{font-size:var(--large-text);padding:15px 25px}#styles-text{font-size:var(--body-text);margin-bottom:10px}#animation-preview{border-radius:var(--large-radius);background-color:#fff;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:80%;height:60%;margin-top:20px;padding:10px 10px 20px;display:flex}#space{border-radius:var(--large-radius);width:90%;height:70%;margin-top:20px;margin-bottom:35px;position:relative}#space-img{border-radius:var(--large-radius);z-index:4;width:100%;height:200px;position:relative;overflow:hidden}#rocket-div{z-index:10;position:absolute;bottom:10px;left:50%;transform:translate(-50%)}#rocket{z-index:10;width:80px;height:auto;display:block}#launch-btn{background-color:var(--primary-color);color:var(--background-color);font-family:var(--main-font);border:1px solid var(--primary-color);border-radius:var(--circle-radius);font-size:var(--large-text);cursor:pointer;transition:transform var(--normal-transition), background-color var(--slow-transition);margin-top:40px;margin-bottom:30px;padding:10px 16px}}@media (width<=755px){#title{font-size:10px}#logo{width:20px;height:20px}.nav-link{font-size:8px}ul{gap:.5rem}#hero-heading{font-size:20px}#hero-desc{text-align:center}#hero-text{gap:80px}#hero-btn{margin-bottom:60px;padding:10px 20px;font-size:16px}.feature-heading{font-family:var(--heading-font);color:var(--primary-color);font-size:var(--large-text)}.feature-desc{font-family:var(--main-font);color:var(--secondary-color);font-size:var(--body-text)}.feature-img{width:35px;height:35px}.color-img{width:80px;height:80px}#product-img{width:125px;height:125px}#product-name{font-size:var(--body-text)}#price{font-size:var(--large-text)}#product-desc{font-size:var(--small-text)}#product-btn{padding:5px 10px}#preview-horizontal{gap:0}#font-label,#size-label,#weight-label,#spacing-label{font-size:var(--small-text)}select{border-radius:var(--small-radius);text-align:center;width:140px;transition:background-color var(--normal-transition);border:none;padding-left:10px;padding-right:10px;font-family:sans-serif}#typo-preview-heading{font-size:var(--large-text);margin:32px}#typo-preview-desc{font-size:var(--small-text)}#grid-gap-btn{justify-content:center;margin-left:0}#flex-row-btn,#flex-column-btn{font-size:10px}#flex-column-btn{padding:5px 8px}#flex-row-btn{padding:5px 15px}.song-container{width:100%;height:120px}.song{gap:20px;padding:10px}.title{font-size:var(--body-text)}.artist{font-size:12px}.duration-line{width:90%;height:5px}.title-heart,.title-artist{gap:10px}.circle{width:12px;height:12px}.time-stamp{gap:80px;margin-top:-12px;font-size:8px}.prev,.play,.next{width:50%;height:16px;overflow:hidden}.prev{width:40%;height:16px}.play{background-color:#e3e2e2;border-radius:50%;height:30px;padding:5px}#magic-btn,#styles-text{white-space:nowrap}#button-preview{gap:100px}#styles-text{margin-bottom:100px}}@media (width<=474px){article:hover{transform:none}#nav-links{display:none}header{justify-content:center}#logo{width:50px;height:50px}#title{font-size:var(--large-text)}#hero-heading{text-align:center;font-size:30px}#hero-desc{font-size:var(--small-text)}#hero-btn{font-size:var(--body-text);margin-bottom:25px;padding:10px 20px}#hero-text{gap:40px}a,button{-webkit-tap-highlight-color:transparent}#font-label,#size-label,#weight-label,#spacing-label{font-family:var(--main-font);color:var(--border-color);margin-right:10px;font-size:24px}select{border-radius:var(--small-radius);text-align:center;width:70px;transition:background-color var(--normal-transition);border:none;padding-left:10px;padding-right:10px;font-family:sans-serif}.feature-desc{font-size:var(--small-text)}#typo-preview-heading{font-size:var(--body-text)}#typo-preview-desc{font-size:var(--small-text)}#plus-rows-btn,#minus-rows-btn,#plus-column-btn,#minus-column-btn,#plus-gap-btn,#minus-gap-btn{font-size:var(--small-text);padding:5px 10px}#rows,#columns,#gap{font-size:var(--small-text)}.section{width:90%;height:85px}#grid-gap-btn{justify-content:center;margin-left:-20px}#button-preview{padding-top:100px;padding-bottom:50px}.song-container{width:95%;height:90px}.song{gap:20px;padding:10px}.title{font-size:10px}.artist{font-size:8px}.duration-line{width:90%;height:5px}.title-heart,.title-artist{gap:7px}.circle{width:8px;height:8px}.time-stamp{gap:60px;font-size:6px}.prev,.play,.next{width:50%;height:16px;overflow:hidden}.prev{width:40%;height:16px}.play{background-color:#e3e2e2;border-radius:50%;height:30px;padding:5px}}